Skip to content
SiteOne Crawler Logo SiteOne Crawler

Best Practices Analysis

The Best Practices analysis evaluates a website’s adherence to web standards and guidelines, focusing on areas like performance, security, and maintainability.

Key Findings

Section titled “Key Findings”
  • Large Inline SVGs: Flags SVG files larger than 5120 bytes, which can negatively impact loading times. Especially when they are on several pages, it is better to move these SVGs to an extra file and thus make better use of the browsing cache.
  • Invalid Inline SVGs: Detects and reports improperly formatted SVGs that may not render correctly. In some cases (e.g. unclosed tags) they can cause various hidden problems - although the browser can solve many of these problems by itself, it can, for example, cause part of the content that follows the inline SVG to be hidden.
  • Duplicate Inline SVGs: Identifies instances where identical SVGs are used multiple times, recommending consolidation to reduce file size. And of course, ideally move SVG to a dedicated file.
  • DOM Depth: Alerts when the DOM tree exceeds 30 levels, which can slow down rendering.
  • Heading Structure: Analyzes the logical structure of HTML headings, ensuring proper hierarchical order.
  • Non-clickable Phone Numbers: Ensures that phone numbers are clickable, improving user experience on mobile devices. Forcing the visitor to copy a number from the website and thus call it up is not nice ;)
  • Title & Description Uniqueness: Evaluates the uniqueness of title and description tags to prevent SEO issues. Each page should ideally have a unique title and description - for example, on paginated pages the page number should also be included in the title and description.
  • Brotli Support: Checks if the server supports Brotli compression, which can significantly reduce file sizes for HTML, JS, CSS.
  • WebP & AVIF Support: Verifies the presence of modern image formats like WebP and AVIF, which offer better compression than JPEG or PNG.

Sample Results

Section titled “Sample Results”

The analyzer provides a comprehensive table showing the status of various best practices on your website:

Best practices
--------------


Analysis name                            | OK    | Notice | Warning | Critical
--------------------------------------------------------------------------------
Large inline SVGs (> 5120 B)             | 148   | 0      | 108     | 0
Invalid inline SVGs                      | 63    | 0      | 193     | 0
Duplicate inline SVGs (> 5 and > 1024 B) | 254   | 0      | 2       | 0
DOM depth (> 30)                         | 47    | 0      | 0       | 0
Heading structure                        | 0     | 47     | 0       | 0
Title uniqueness (> 10%)                 | 47    | 0      | 0       | 0
Description uniqueness (> 10%)           | 26    | 0      | 1       | 0
Brotli support                           | 3     | 0      | 45      | 0
WebP support                             | 3     | 0      | 0       | 0
AVIF support                             | 2     | 0      | 0       | 0

The table shows the count of occurrences in each category:

  • OK: Elements that follow best practices
  • Notice: Minor issues worth noting but not problematic
  • Warning: Issues that should be addressed but aren’t critical
  • Critical: Serious issues that need immediate attention

For example, the results above show:

  • 108 warnings for large inline SVGs that should be moved to external files
  • 193 warnings for invalid inline SVGs that might cause rendering issues
  • All 47 pages have heading structure notices that could be improved
  • 45 pages don’t support Brotli compression, which could improve performance

💡 Further development ideas

Section titled “💡 Further development ideas”

In the future, we would like to implement further analyses in the area of best practices. A few of our ideas:

  • Resource Minification: Implement checks for minified CSS and JS files to enhance loading speed.
  • Media Type Optimization: Incorporate analysis for modern formats (e.g., AVIF) across content types like images and videos.
  • Lazy Loading: Analyze the usage of lazy loading for images and videos to optimize page rendering.
  • Font Optimization: Evaluate the performance and usage of web fonts, recommending improvements like font-display strategies or subset fonts.
  • Preload and Prefetch: Analyze the usage of resource hints (e.g., preload, prefetch) to enhance performance.
  • HTTP/2 or HTTP/3 Adoption: Check for the use of modern protocols to reduce latency and improve resource loading efficiency.