Skip to main content

Page Speed Metrics

page_speed_metrics

lighthouse_page_speed

metric_idsection_nameaudit_descriptionmetric_weightaudit_titlemetric_acronymaudit_metric_unit

first-contentful-paint

performanceFirst Contentful Paint marks the time at which the first text or image is painted. Learn more.10First Contentful PaintFCPmillisecond

speed-index

performanceSpeed Index shows how quickly the contents of a page are visibly populated. Learn more.10Speed IndexSImillisecond

largest-contentful-paint

performanceLargest Contentful Paint marks the time at which the largest text or image is painted. Learn more25Largest Contentful PaintLCPmillisecond

interactive

performanceTime to interactive is the amount of time it takes for the page to become fully interactive. Learn more.10Time to InteractiveTTImillisecond

total-blocking-time

performanceSum of all time periods between FCP and Time to Interactive, when task length exceeded 50ms, expressed in milliseconds. Learn more.30Total Blocking TimeTBTmillisecond

cumulative-layout-shift

performanceCumulative Layout Shift measures the movement of visible elements within the viewport. Learn more.15Cumulative Layout ShiftCLSunitless

aria-allowed-attr

accessibilityEach ARIA role supports a specific subset of aria-* attributes. Mismatching these invalidates the aria-* attributes. Learn more.10[aria-*] attributes match their roles

aria-hidden-body

accessibilityAssistive technologies, like screen readers, work inconsistently when aria-hidden="true" is set on the document <body>. Learn more.10[aria-hidden="true"] is not present on the document <body>

aria-hidden-focus

accessibilityFocusable descendents within an [aria-hidden="true"] element prevent those interactive elements from being available to users of assistive technologies like screen readers. Learn more.3[aria-hidden="true"] elements do not contain focusable descendents

aria-valid-attr-value

accessibilityAssistive technologies, like screen readers, can't interpret ARIA attributes with invalid values. Learn more.10[aria-*] attributes have valid values

aria-valid-attr

accessibilityAssistive technologies, like screen readers, can't interpret ARIA attributes with invalid names. Learn more.10[aria-*] attributes are valid and not misspelled

button-name

accessibilityWhen a button doesn't have an accessible name, screen readers announce it as "button", making it unusable for users who rely on screen readers. Learn more.10Buttons do not have an accessible name

bypass

accessibilityAdding ways to bypass repetitive content lets keyboard users navigate the page more efficiently. Learn more.3The page contains a heading, skip link, or landmark region

color-contrast

accessibilityLow-contrast text is difficult or impossible for many users to read. Learn more.3Background and foreground colors do not have a sufficient contrast ratio.

document-title

accessibilityThe title gives screen reader users an overview of the page, and search engine users rely on it heavily to determine if a page is relevant to their search. Learn more.3Document has a <title> element

duplicate-id-active

accessibilityAll focusable elements must have a unique id to ensure that they're visible to assistive technologies. Learn more.3[id] attributes on active, focusable elements are unique

duplicate-id-aria

accessibilityThe value of an ARIA ID must be unique to prevent other instances from being overlooked by assistive technologies. Learn more.10ARIA IDs are not unique

heading-order

accessibilityProperly ordered headings that do not skip levels convey the semantic structure of the page, making it easier to navigate and understand when using assistive technologies. Learn more.2Heading elements are not in a sequentially-descending order

html-has-lang

accessibilityIf a page doesn't specify a lang attribute, a screen reader assumes that the page is in the default language that the user chose when setting up the screen reader. If the page isn't actually in the default language, then the screen reader might not announce the page's text correctly. Learn more.3<html> element does not have a [lang] attribute

image-alt

accessibilityInformative elements should aim for short, descriptive alternate text. Decorative elements can be ignored with an empty alt attribute. Learn more.10Image elements have [alt] attributes

label

accessibilityLabels ensure that form controls are announced properly by assistive technologies, like screen readers. Learn more.10Form elements have associated labels
accessibilityLink text (and alternate text for images, when used as links) that is discernible, unique, and focusable improves the navigation experience for screen reader users. Learn more.3Links do not have a discernible name

list

accessibilityScreen readers have a specific way of announcing lists. Ensuring proper list structure aids screen reader output. Learn more.3Lists do not contain only <li> elements and script supporting elements (<script> and <template>).

listitem

accessibilityScreen readers require list items (<li>) to be contained within a parent <ul> or <ol> to be announced properly. Learn more.3List items (<li>) are contained within <ul> or <ol> parent elements

meta-viewport

accessibilityDisabling zooming is problematic for users with low vision who rely on screen magnification to properly see the contents of a web page. Learn more.10[user-scalable="no"] is used in the <meta name="viewport"> element or the [maximum-scale] attribute is less than 5.

tabindex

accessibilityA value greater than 0 implies an explicit navigation ordering. Although technically valid, this often creates frustrating experiences for users who rely on assistive technologies. Learn more.3No element has a [tabindex] value greater than 0

is-on-https

best-practicesAll sites should be protected with HTTPS, even ones that don't handle sensitive data. This includes avoiding mixed content, where some resources are loaded over HTTP despite the initial request being served over HTTPS. HTTPS prevents intruders from tampering with or passively listening in on the communications between your app and your users, and is a prerequisite for HTTP/2 and many new web platform APIs. Learn more.1Uses HTTPS

external-anchors-use-rel-noopener

best-practicesAdd rel="noopener" or rel="noreferrer" to any external links to improve performance and prevent security vulnerabilities. Learn more.1Links to cross-origin destinations are unsafe

geolocation-on-start

best-practicesUsers are mistrustful of or confused by sites that request their location without context. Consider tying the request to a user action instead. Learn more.1Avoids requesting the geolocation permission on page load

notification-on-start

best-practicesUsers are mistrustful of or confused by sites that request to send notifications without context. Consider tying the request to user gestures instead. Learn more.1Avoids requesting the notification permission on page load

no-vulnerable-libraries

best-practicesSome third-party scripts may contain known security vulnerabilities that are easily identified and exploited by attackers. Learn more.1Includes front-end JavaScript libraries with known security vulnerabilities

password-inputs-can-be-pasted-into

best-practicesPreventing password pasting undermines good security policy. Learn more.1Allows users to paste into password fields

image-aspect-ratio

best-practicesImage display dimensions should match natural aspect ratio. Learn more.1Displays images with correct aspect ratio

image-size-responsive

best-practicesImage natural dimensions should be proportional to the display size and the pixel ratio to maximize image clarity. Learn more.1Serves images with appropriate resolution

doctype

best-practicesSpecifying a doctype prevents the browser from switching to quirks-mode. Learn more.1Page has the HTML doctype

charset

best-practicesA character encoding declaration is required. It can be done with a <meta> tag in the first 1024 bytes of the HTML or in the Content-Type HTTP response header. Learn more.1Properly defines charset

no-unload-listeners

best-practicesThe unload event does not fire reliably and listening for it can prevent browser optimizations like the Back-Forward Cache. Consider using the pagehide or visibilitychange events instead. Learn more1Avoids unload event listeners

appcache-manifest

best-practicesApplication Cache is deprecated. Learn more.1Avoids Application Cache

deprecations

best-practicesDeprecated APIs will eventually be removed from the browser. Learn more.1Avoids deprecated APIs

errors-in-console

best-practicesErrors logged to the console indicate unresolved problems. They can come from network request failures and other browser concerns. Learn more1No browser errors logged to the console

inspector-issues

best-practicesIssues logged to the Issues panel in Chrome Devtools indicate unresolved problems. They can come from network request failures, insufficient security controls, and other browser concerns. Open up the Issues panel in Chrome DevTools for more details on each issue.1No issues in the Issues panel in Chrome Devtools

viewport

seoAdd a <meta name="viewport"> tag to optimize your app for mobile screens. Learn more.1Has a <meta name="viewport"> tag with width or initial-scale

document-title

seoThe title gives screen reader users an overview of the page, and search engine users rely on it heavily to determine if a page is relevant to their search. Learn more.1Document has a <title> element

meta-description

seoMeta descriptions may be included in search results to concisely summarize page content. Learn more.1Document has a meta description

http-status-code

seoPages with unsuccessful HTTP status codes may not be indexed properly. Learn more.1Page has successful HTTP status code
seoDescriptive link text helps search engines understand your content. Learn more.1Links have descriptive text

crawlable-anchors

seoSearch engines may use href attributes on links to crawl websites. Ensure that the href attribute of anchor elements links to an appropriate destination, so more pages of the site can be discovered. Learn More1Links are crawlable

is-crawlable

seoSearch engines are unable to include your pages in search results if they don't have permission to crawl them. Learn more.1Page isn’t blocked from indexing

robots-txt

seoIf your robots.txt file is malformed, crawlers may not be able to understand how you want your website to be crawled or indexed. Learn more.1robots.txt is valid

image-alt

seoInformative elements should aim for short, descriptive alternate text. Decorative elements can be ignored with an empty alt attribute. Learn more.1Image elements have [alt] attributes

hreflang

seohreflang links tell search engines what version of a page they should list in search results for a given language or region. Learn more.1Document has a valid hreflang

plugins

seoSearch engines can't index plugin content, and many devices restrict plugins or don't support them. Learn more.1Document avoids plugins

first_contentful_paint_ms

performance_googleFirst Contentful Paint (FCP) is an important, user-centric metric for measuring perceived load speed because it marks the first point in the page load timeline where the user can see anything on the screen—a fast FCP helps reassure the user that something is happening. Learn more.First Contentfull Paint (FCP)millisecond

first_input_delay_ms

performance_googleFirst Input Delay (FID) is an important, user-centric metric for measuring load responsiveness because it quantifies the experience users feel when trying to interact with unresponsive pages—a low FID helps ensure that the page is usable. Learn more.First Input Delay (FID)millisecond

largest_contentful_paint_ms

performance_googleLargest Contentful Paint (LCP) is an important, user-centric metric for measuring perceived load speed because it marks the point in the page load timeline when the page's main content has likely loaded—a fast LCP helps reassure the user that the page is useful. Learn more.Largest Contentful Paint (LCP)millisecond

cumulative_layout_shift_score

performance_googleCumulative Layout Shift (CLS) is an important, user-centric metric for measuring visual stability because it helps quantify how often users experience unexpected layout shifts—a low CLS helps ensure that the page is delightful. Learn more.Cumulative Layout Shift (CLS)score

experimental_time_to_first_byte

performance_googleTime to First Byte (TTFB) is a foundational metric for measuring connection setup time and web server responsiveness in both the lab and the field. It helps identify when a web server is too slow to respond to requests. In the case of navigation requests—that is, requests for an HTML document—it precedes every other meaningful loading performance metric. Learn more.Time to First Byte (TTFB)score

experimental_interaction_to_next_paint

performance_googleInteraction to Next Paint (INP) is an experimental metric that assesses responsiveness. INP observes the latency of all interactions a user has made with the page, and reports a single value which all (or nearly all) interactions were below. A low INP means the page was consistently able to respond quickly to all—or the vast majority—of user interactions. Learn more.Interaction to Next Paint (INP)score