Was hier zu sehen ist
Das ist die vollständige Ausgabe eines echten PageSpeed-Insights/Lighthouse-Laufs, wie er bei jedem KIT-Würfel-Audit für die Dimension „Ladezeit" (Seite 5 der 48-Bausteine-Prüfspezifikation) verwendet wird. Als Beispiel dient die eigene Kandlen-IT-Website. Keine Zusammenfassung, keine Ampel — alle Rohwerte.
Gemessen über die offizielle Google-PageSpeed-API, je einmal für Mobil- und Desktop-Auslieferung. Ein Lauf ist eine Momentaufnahme — Werte schwanken je nach Tageszeit/Serverlast leicht, das ist bei Lighthouse-Messungen normal.
Komplette Rohdaten als JSON herunterladen (2 MB)Titel und Beschreibung je Audit kommen direkt von Google (offizielle Lokalisierung, per Umschalter oben Deutsch/English) — die „Warum + Lösung"-Kästen bei auffälligen Prüfungen sind unsere eigene Analyse zu kandlen-it.de, immer auf Deutsch.
Wie die Werte einzuordnen sind
Jede Zahl unten hat eine eigene Erklärung, was sie misst — bei den Metriken direkt darunter, bei den Opportunities in der Karte davor. Die Farbe folgt überall derselben Regel, wie Lighthouse selbst bewertet:
gut — Score ≥ 90 (bzw. ≥ 0,9)
verbesserungswürdig — 50–89 (0,5–0,89)
schlecht — unter 50 (0,5)
Scores — Mobil
86
Performance
Gewichteter Gesamtwert aus den sieben Metriken unten — LCP und Total Blocking Time zählen am stärksten.
100
Accessibility
Automatisch prüfbare Barrierefreiheit: Kontraste, Alt-Texte, ARIA-Attribute. Ersetzt keine manuelle Prüfung, deckt aber die technische Basis ab.
100
Best Practices
Allgemeine Web-Standards: HTTPS, keine Konsolen-Fehler, aktuelle/sichere Bibliotheken.
100
SEO
Technische Grundlagen für Suchmaschinen: Meta-Tags vorhanden, Seite crawlbar, mobilfreundlich.
Alle Metriken (komplett, ungekürzt) — mit Erklärung
|
First Contentful Paint
Wie lange es dauert, bis der erste Inhalt (Text oder Bild) überhaupt sichtbar wird — der erste Eindruck, dass „sich etwas tut".
|
2.0 s | |
|
Largest Contentful Paint
Wann das größte sichtbare Element (meist Hauptbild oder Überschrift) fertig geladen ist. Offizieller Google-Web-Vital, fließt ins Suchmaschinen-Ranking ein. Richtwert: unter 2,5 s.
|
3.0 s | |
|
Total Blocking Time
Wie lange JavaScript den Hauptthread blockiert, sodass Klicks/Eingaben nicht sofort reagieren. Je höher, desto „hakeliger" fühlt sich die Seite an. Richtwert: unter 200 ms.
|
0 ms | |
|
Cumulative Layout Shift
Wie stark sich Elemente während des Ladens ungewollt verschieben (z. B. Text springt, weil ein Bild nachträglich Platz beansprucht). Ebenfalls ein Google-Web-Vital. Richtwert: unter 0,1.
|
0.001 | |
|
Speed Index
Wie schnell sich der sichtbare Seiteninhalt über die Zeit füllt — visuelle Analyse des gesamten Ladeverlaufs, keine einzelne Marke. Richtwert: unter 3,4 s.
|
6.7 s | |
|
Time to Interactive
Ab wann die Seite zuverlässig auf Eingaben reagiert, also keine langen blockierenden Skripte mehr laufen. Richtwert: unter 3,8 s.
|
3.0 s | |
|
Initial server response time was short
Wie schnell der Server auf die allererste Anfrage antwortet, bevor der Browser überhaupt mit dem Rendern anfängt (Time to First Byte). Richtwert: unter 600 ms.
|
Root document took 20 ms |
Verbesserungsvorschläge (Opportunities)
Konkrete, von Lighthouse gefundene Stellschrauben — mit der geschätzten Zeit, die eine Behebung an Ladezeit einsparen würde. Sortiert nach Wirkung, größter Hebel zuerst.
- Avoid multiple page redirects 780 ms
- Reduce unused CSS 0 ms
- Minify CSS 0 ms
- Minify JavaScript 0 ms
Alle Audits — komplett, alle 153 aus allen 4 Kategorien (Mobil)
Das ist die vollständige Rohantwort der PageSpeed-API, ungekürzt — jede einzelne Prüfung, die Lighthouse durchführt, mit Original-Beschreibung, was sie genau prüft.
Performance — 47 Audits
|
First Contentful Paint
First Contentful Paint marks the time at which the first text or image is painted. Learn more about the First Contentful Paint metric.
Warum bei kandlen-it.de: 2,0 s bis zum ersten sichtbaren Inhalt, knapp über dem Richtwert von 1,8 s. Ursache: der Browser muss erst mehrere render-blockierende CSS-Dateien laden, bevor er überhaupt zu zeichnen beginnt (siehe „Ressourcen, die das Rendering blockieren" unten).
Wie lösen: Kritisches CSS für den sichtbaren Bereich inline in den Seitenkopf setzen, den Rest asynchron nachladen.
|
2.0 s teilweise
|
|
|
Largest Contentful Paint
Largest Contentful Paint marks the time at which the largest text or image is painted. Learn more about the Largest Contentful Paint metric
Warum bei kandlen-it.de: Die Serverantwort ist mit 21 ms sehr schnell — der eigentliche Verzug (4,2 s) entsteht danach: das größte Element (der Hero-Text) wartet auf das Rendering, weil vorher blockierendes CSS geladen werden muss.
Wie lösen: Render-blockierendes CSS reduzieren (siehe unten), damit der Hero-Bereich früher gezeichnet werden kann.
|
3.0 s teilweise
|
|
|
Total Blocking Time
Sum of all time periods between FCP and Time to Interactive, when task length exceeded 50ms, expressed in milliseconds. Learn more about the Total Blocking Time metric.
|
0 ms bestanden
|
|
|
Cumulative Layout Shift
Cumulative Layout Shift measures the movement of visible elements within the viewport. Learn more about the Cumulative Layout Shift metric.
|
0.001 bestanden
|
|
|
Speed Index
Speed Index shows how quickly the contents of a page are visibly populated. Learn more about the Speed Index metric.
Warum bei kandlen-it.de: Mit 6,7 s deutlich über dem Richtwert von 3,4 s. Hängt direkt an denselben Ursachen wie FCP/LCP — die Seite füllt sich sichtbar langsam, weil zentrale Styles blockierend nachgeladen werden.
Wie lösen: Gleiche Lösung wie First/Largest Contentful Paint: render-blockierendes CSS auflösen.
|
6.7 s nicht bestanden
|
|
|
Use efficient cache lifetimes
A long cache lifetime can speed up repeat visits to your page. Learn more about caching.
Warum bei kandlen-it.de: 16 statische Dateien (CSS, Web-Fonts, JS) sind nur 7 Tage cachebar, obwohl sie über „?ver="-Parameter versioniert sind und sich zwischen Deployments nicht ändern — z. B. style.css, TitilliumWeb-400/600/700.woff2, wuerfel.js.
Wie lösen: Cache-Control max-age für versionierte, statische Assets auf ein Jahr hochsetzen (das Cache-Busting über „?ver=" macht das gefahrlos — neue Version = neue URL).
|
Est savings of 10 KiB nicht bestanden
|
|
|
Layout shift culprits
Layout shifts occur when elements move absent any user interaction. Investigate the causes of layout shifts, such as elements being added, removed, or their fonts changing as the page loads.
|
informativ
|
|
|
Document request latency
Your first network request is the most important. Reduce its latency by avoiding redirects, ensuring a fast server response, and enabling text compression.
Warum bei kandlen-it.de: Server antwortet schnell (21 ms) und liefert komprimiert aus — aber 1 Weiterleitung kostet zusätzlich 3,6 s, bevor überhaupt geladen wird (siehe „Mehrere Weiterleitungen" unten).
Wie lösen: Identisch mit dem Redirects-Punkt: die Weiterleitung kandlen-it.de → www.kandlen-it.de vermeiden bzw. verkürzen.
|
Est savings of 3,630 ms nicht bestanden
|
|
|
Optimize DOM size
A large DOM can increase the duration of style calculations and layout reflows, impacting page responsiveness. A large DOM will also increase memory usage. Learn how to avoid an excessive DOM size.
|
bestanden
|
|
|
Duplicated JavaScript
Remove large, duplicate JavaScript modules from bundles to reduce unnecessary bytes consumed by network activity.
|
bestanden
|
|
|
Font display
Consider setting
font-display to swap or optional to ensure text is consistently visible. swap can be further optimized to mitigate layout shifts with font metric overrides. |
bestanden
|
|
|
Forced reflow
A forced reflow occurs when JavaScript queries geometric properties (such as
offsetWidth) after styles have been invalidated by a change to the DOM state. This can result in poor performance. Learn more about forced reflows and possible mitigations. |
bestanden
|
|
|
Improve image delivery
Reducing the download time of images can improve the perceived load time of the page and LCP. Learn more about optimizing image size
Warum bei kandlen-it.de: Das Hero-Bild „kandlen-system.webp" wird mit 900×900 px ausgeliefert, im Layout aber nur mit 450×450 bzw. effektiv 679×679 px dargestellt — 72 KB werden durch die falsche Auflösung verschenkt, weitere 32 KB durch zu geringe Kompression.
Wie lösen: Bild in der tatsächlich benötigten Größe exportieren bzw. srcset mit passenden Zwischengrößen anbieten, Kompressionsfaktor erhöhen.
|
Est savings of 88 KiB nicht bestanden
|
|
|
INP breakdown
Start investigating how to improve INP by looking at the longest subpart.
|
nicht anwendbar
|
|
|
LCP breakdown
Each subpart has specific improvement strategies. Ideally, most of the LCP time should be spent on loading the resources, not within delays.
Warum bei kandlen-it.de: Bestätigt die LCP-Ursache im Detail: „Time to first byte" nur 21 ms, aber „Element render delay" 4.165 ms — fast die komplette Zeit geht durchs Warten auf render-blockierendes CSS drauf, nicht durch den Server.
Wie lösen: Siehe Largest Contentful Paint oben — render-blockierendes CSS auflösen.
|
nicht bestanden
|
|
|
LCP request discovery
Optimize LCP by making the LCP image discoverable from the HTML immediately, and avoiding lazy-loading
|
nicht anwendbar
|
|
|
Legacy JavaScript
Polyfills and transforms enable older browsers to use new JavaScript features. However, many aren't necessary for modern browsers. Consider modifying your JavaScript build process to not transpile Baseline features, unless you know you must support older browsers. Learn why most sites can deploy ES6+ code without transpiling
|
bestanden
|
|
|
Network dependency tree
Avoid chaining critical requests by reducing the length of chains, reducing the download size of resources, or deferring the download of unnecessary resources to improve page load.
Warum bei kandlen-it.de: Die Ladekette zeigt: die Startseite lädt style.css nach, das wiederum eine Web-Font-Datei nachlädt — eine verschachtelte Kette von 4,2 s für die längste Abhängigkeit. Kein Preconnect nötig, da alles von der eigenen Domain kommt.
Wie lösen: Verschachtelung verkürzen: Fonts nicht über einen Umweg durchs CSS, sondern direkt im HTML-Kopf per <link rel="preload"> ankündigen.
|
nicht bestanden
|
|
|
Render-blocking requests
Requests are blocking the page's initial render, which may delay LCP. Deferring or inlining can move these network requests out of the critical path.
Warum bei kandlen-it.de: Vier CSS-Dateien blockieren das Rendering: style.css (751 ms), kit-a11y/frontend.css (151 ms), wuerfel-neu.css (451 ms) und wuerfel.css (451 ms). Auffällig: wuerfel.css und wuerfel-neu.css werden beide geladen — möglicherweise eine Altlast.
Wie lösen: Kritisches CSS inline setzen, Rest per media="print" onload-Trick oder defer nachladen. Zusätzlich prüfen, ob wuerfel.css neben wuerfel-neu.css noch gebraucht wird.
|
Est savings of 860 ms nicht bestanden
|
|
|
3rd parties
3rd party code can significantly impact load performance. Reduce and defer loading of 3rd party code to prioritize your page's content.
|
bestanden
|
|
|
Optimize viewport for mobile
Tap interactions may be delayed by up to 300 ms if the viewport is not optimized for mobile.
|
bestanden
|
|
|
Time to Interactive
Time to Interactive is the amount of time it takes for the page to become fully interactive. Learn more about the Time to Interactive metric.
|
3.0 s bestanden
|
|
|
Max Potential First Input Delay
The maximum potential First Input Delay that your users could experience is the duration of the longest task. Learn more about the Maximum Potential First Input Delay metric.
|
20 ms bestanden
|
|
|
Minify CSS
Minifying CSS files can reduce network payload sizes. Learn how to minify CSS.
Warum bei kandlen-it.de: style.css: 43,5 % Einsparung möglich (8,2 von 18,9 KB), wuerfel-neu.css: 45,5 % (2,8 von 6,1 KB) — beides unkomprimierter Whitespace/Kommentare aus der Theme-Entwicklung.
Wie lösen: CSS-Minifizierung in den Build-Prozess des WordPress-Themes „kit-kandlen-theme" einbauen (z. B. beim Speichern automatisch minifizierte Version ausliefern).
|
Est savings of 11 KiB teilweise
|
|
|
Minify JavaScript
Minifying JavaScript files can reduce payload sizes and script parse time. Learn how to minify JavaScript.
Warum bei kandlen-it.de: wuerfel-neu.js: 44 % Einsparung möglich (2,3 von 5,3 KB) durch fehlende Minifizierung.
Wie lösen: Gleiche Build-Pipeline wie bei CSS für JavaScript-Dateien einrichten.
|
Est savings of 2 KiB teilweise
|
|
|
Reduce unused CSS
Reduce unused rules from stylesheets and defer CSS not used for above-the-fold content to decrease bytes consumed by network activity. Learn how to reduce unused CSS.
Warum bei kandlen-it.de: style.css: 58,8 % der geladenen Regeln (10,7 von 18,3 KB) werden auf der Startseite gar nicht angewendet — Regeln für andere Seiten/Komponenten werden immer mitgeladen.
Wie lösen: CSS pro Seitentyp aufteilen oder mit einem Tool wie PurgeCSS im Theme-Build nur die tatsächlich genutzten Regeln ausliefern.
|
Est savings of 10 KiB teilweise
|
|
|
Reduce unused JavaScript
Reduce unused JavaScript and defer loading scripts until they are required to decrease bytes consumed by network activity. Learn how to reduce unused JavaScript.
|
bestanden
|
|
|
Avoids enormous network payloads
Large network payloads cost users real money and are highly correlated with long load times. Learn how to reduce payload sizes.
|
Total size was 303 KiB bestanden
|
|
|
User Timing marks and measures
Consider instrumenting your app with the User Timing API to measure your app's real-world performance during key user experiences. Learn more about User Timing marks.
|
nicht anwendbar
|
|
|
JavaScript execution time
Consider reducing the time spent parsing, compiling, and executing JS. You may find delivering smaller JS payloads helps with this. Learn how to reduce Javascript execution time.
|
0.0 s bestanden
|
|
|
Minimizes main-thread work
Consider reducing the time spent parsing, compiling and executing JS. You may find delivering smaller JS payloads helps with this. Learn how to minimize main-thread work
|
0.2 s bestanden
|
|
|
Avoid long main-thread tasks
Lists the longest tasks on the main thread, useful for identifying worst contributors to input delay. Learn how to avoid long main-thread tasks
|
nicht anwendbar
|
|
|
Avoid non-composited animations
Animations which are not composited can be janky and increase CLS. Learn how to avoid non-composited animations
|
nicht anwendbar
|
|
|
Image elements have explicit `width` and `height`
Set an explicit width and height on image elements to reduce layout shifts and improve CLS. Learn how to set image dimensions
|
bestanden
|
|
|
Network Requests
Lists the network requests that were made during page load.
|
informativ
|
|
|
Network Round Trip Times
Network round trip times (RTT) have a large impact on performance. If the RTT to an origin is high, it's an indication that servers closer to the user could improve performance. Learn more about the Round Trip Time.
|
0 ms informativ
|
|
|
Server Backend Latencies
Server latencies can impact web performance. If the server latency of an origin is high, it's an indication the server is overloaded or has poor backend performance. Learn more about server response time.
|
0 ms informativ
|
|
|
Tasks
Lists the toplevel main thread tasks that executed during page load.
|
informativ
|
|
|
Diagnostics
Collection of useful page vitals.
|
informativ
|
|
|
Metrics
Collects all available metrics.
|
informativ
|
|
|
Screenshot Thumbnails
This is what the load of your site looked like.
|
informativ
|
|
|
Final Screenshot
The last screenshot captured of the pageload.
|
informativ
|
|
|
Script Treemap Data
Used for treemap app
|
informativ
|
|
|
Resources Summary
Aggregates all network requests and groups them by type
|
informativ
|
|
|
Avoid multiple page redirects
Redirects introduce additional delays before the page can be loaded. Learn how to avoid page redirects.
Warum bei kandlen-it.de: https://kandlen-it.de/ (ohne www) leitet auf https://www.kandlen-it.de/ weiter — kostet 780 ms, bevor überhaupt mit dem Laden begonnen wird.
Wie lösen: Intern und in Marketing-Links immer direkt auf www.kandlen-it.de verweisen; die Weiterleitung serverseitig so kurz wie möglich halten (301, keine Zwischenstationen).
|
Est savings of 780 ms nicht bestanden
|
|
|
Initial server response time was short
Keep the server response time for the main document short because all other requests depend on it. Learn more about the Time to First Byte metric.
|
Root document took 20 ms bestanden
|
|
|
Avoid large layout shifts
These are the largest layout shifts observed on the page. Each table item represents a single layout shift, and shows the element that shifted the most. Below each item are possible root causes that led to the layout shift. Some of these layout shifts may not be included in the CLS metric value due to windowing. Learn how to improve CLS
|
1 layout shift found informativ
|
Accessibility — 76 Audits
|
`[accesskey]` values are unique
Access keys let users quickly focus a part of the page. For proper navigation, each access key must be unique. Learn more about access keys.
|
nicht anwendbar
|
|
|
`[aria-*]` attributes match their roles
Each ARIA
role supports a specific subset of aria-* attributes. Mismatching these invalidates the aria-* attributes. Learn how to match ARIA attributes to their roles. |
bestanden
|
|
|
`button`, `link`, and `menuitem` elements have accessible names
When an element doesn't have an accessible name, screen readers announce it with a generic name, making it unusable for users who rely on screen readers. Learn how to make command elements more accessible.
|
nicht anwendbar
|
|
|
ARIA attributes are used as specified for the element's role
Some ARIA attributes are only allowed on an element under certain conditions. Learn more about conditional ARIA attributes.
|
bestanden
|
|
|
Deprecated ARIA roles were not used
Deprecated ARIA roles may not be processed correctly by assistive technology. Learn more about deprecated ARIA roles.
|
bestanden
|
|
|
Elements with `role="dialog"` or `role="alertdialog"` have accessible names.
ARIA dialog elements without accessible names may prevent screen readers users from discerning the purpose of these elements. Learn how to make ARIA dialog elements more accessible.
|
nicht anwendbar
|
|
|
`[aria-hidden="true"]` is not present on the document `<body>`
Assistive technologies, like screen readers, work inconsistently when
aria-hidden="true" is set on the document <body>. Learn how aria-hidden affects the document body. |
bestanden
|
|
|
`[aria-hidden="true"]` elements do not contain focusable descendents
Focusable descendents within an
[aria-hidden="true"] element prevent those interactive elements from being available to users of assistive technologies like screen readers. Learn how aria-hidden affects focusable elements. |
bestanden
|
|
|
ARIA input fields have accessible names
When an input field doesn't have an accessible name, screen readers announce it with a generic name, making it unusable for users who rely on screen readers. Learn more about input field labels.
|
nicht anwendbar
|
|
|
ARIA `meter` elements have accessible names
When a meter element doesn't have an accessible name, screen readers announce it with a generic name, making it unusable for users who rely on screen readers. Learn how to name
meter elements. |
nicht anwendbar
|
|
|
ARIA `progressbar` elements have accessible names
When a
progressbar element doesn't have an accessible name, screen readers announce it with a generic name, making it unusable for users who rely on screen readers. Learn how to label progressbar elements. |
nicht anwendbar
|
|
|
Elements use only permitted ARIA attributes
Using ARIA attributes in roles where they are prohibited can mean that important information is not communicated to users of assistive technologies. Learn more about prohibited ARIA roles.
|
bestanden
|
|
|
`[role]`s have all required `[aria-*]` attributes
Some ARIA roles have required attributes that describe the state of the element to screen readers. Learn more about roles and required attributes.
|
bestanden
|
|
|
Elements with an ARIA `[role]` that require children to contain a specific `[role]` have all required children.
Some ARIA parent roles must contain specific child roles to perform their intended accessibility functions. Learn more about roles and required children elements.
|
nicht anwendbar
|
|
|
`[role]`s are contained by their required parent element
Some ARIA child roles must be contained by specific parent roles to properly perform their intended accessibility functions. Learn more about ARIA roles and required parent element.
|
nicht anwendbar
|
|
|
`[role]` values are valid
ARIA roles must have valid values in order to perform their intended accessibility functions. Learn more about valid ARIA roles.
|
bestanden
|
|
|
Elements with the `role=text` attribute do not have focusable descendents.
Adding
role=text around a text node split by markup enables VoiceOver to treat it as one phrase, but the element's focusable descendents will not be announced. Learn more about the role=text attribute. |
nicht anwendbar
|
|
|
ARIA toggle fields have accessible names
When a toggle field doesn't have an accessible name, screen readers announce it with a generic name, making it unusable for users who rely on screen readers. Learn more about toggle fields.
|
nicht anwendbar
|
|
|
ARIA `tooltip` elements have accessible names
When a tooltip element doesn't have an accessible name, screen readers announce it with a generic name, making it unusable for users who rely on screen readers. Learn how to name
tooltip elements. |
nicht anwendbar
|
|
|
ARIA `treeitem` elements have accessible names
When a
treeitem element doesn't have an accessible name, screen readers announce it with a generic name, making it unusable for users who rely on screen readers. Learn more about labeling treeitem elements. |
nicht anwendbar
|
|
|
`[aria-*]` attributes have valid values
Assistive technologies, like screen readers, can't interpret ARIA attributes with invalid values. Learn more about valid values for ARIA attributes.
|
bestanden
|
|
|
`[aria-*]` attributes are valid and not misspelled
Assistive technologies, like screen readers, can't interpret ARIA attributes with invalid names. Learn more about valid ARIA attributes.
|
bestanden
|
|
|
Buttons have an accessible name
When 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 how to make buttons more accessible.
|
bestanden
|
|
|
The page contains a heading, skip link, or landmark region
Adding ways to bypass repetitive content lets keyboard users navigate the page more efficiently. Learn more about bypass blocks.
|
nicht anwendbar
|
|
|
Background and foreground colors have a sufficient contrast ratio
Low-contrast text is difficult or impossible for many users to read. Learn how to provide sufficient color contrast.
|
bestanden
|
|
|
`<dl>`'s contain only properly-ordered `<dt>` and `<dd>` groups, `<script>`, `<template>` or `<div>` elements.
When definition lists are not properly marked up, screen readers may produce confusing or inaccurate output. Learn how to structure definition lists correctly.
|
nicht anwendbar
|
|
|
Definition list items are wrapped in `<dl>` elements
Definition list items (
<dt> and <dd>) must be wrapped in a parent <dl> element to ensure that screen readers can properly announce them. Learn how to structure definition lists correctly. |
nicht anwendbar
|
|
|
Document has a `<title>` element
The 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 about document titles.
|
bestanden
|
|
|
ARIA IDs are unique
The value of an ARIA ID must be unique to prevent other instances from being overlooked by assistive technologies. Learn how to fix duplicate ARIA IDs.
|
nicht anwendbar
|
|
|
No form fields have multiple labels
Form fields with multiple labels can be confusingly announced by assistive technologies like screen readers which use either the first, the last, or all of the labels. Learn how to use form labels.
|
nicht anwendbar
|
|
|
`<frame>` or `<iframe>` elements have a title
Screen reader users rely on frame titles to describe the contents of frames. Learn more about frame titles.
|
nicht anwendbar
|
|
|
Heading elements appear in a sequentially-descending order
Properly 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 about heading order.
|
bestanden
|
|
|
`<html>` element has a `[lang]` attribute
If 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 about the lang attribute. |
bestanden
|
|
|
`<html>` element has a valid value for its `[lang]` attribute
Specifying a valid BCP 47 language helps screen readers announce text properly. Learn how to use the
lang attribute. |
bestanden
|
|
|
`<html>` element has an `[xml:lang]` attribute with the same base language as the `[lang]` attribute.
If the webpage does not specify a consistent language, then the screen reader might not announce the page's text correctly. Learn more about the
lang attribute. |
nicht anwendbar
|
|
|
Image elements have `[alt]` attributes
Informative elements should aim for short, descriptive alternate text. Decorative elements can be ignored with an empty alt attribute. Learn more about the
alt attribute. |
bestanden
|
|
|
Input buttons have discernible text.
Adding discernable and accessible text to input buttons may help screen reader users understand the purpose of the input button. Learn more about input buttons.
|
nicht anwendbar
|
|
|
`<input type="image">` elements have `[alt]` text
When an image is being used as an
<input> button, providing alternative text can help screen reader users understand the purpose of the button. Learn about input image alt text. |
nicht anwendbar
|
|
|
Form elements have associated labels
Labels ensure that form controls are announced properly by assistive technologies, like screen readers. Learn more about form element labels.
|
bestanden
|
|
|
Links are distinguishable without relying on color.
Low-contrast text is difficult or impossible for many users to read. Link text that is discernible improves the experience for users with low vision. Learn how to make links distinguishable.
|
bestanden
|
|
|
Links have a discernible name
Link 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 how to make links accessible.
|
bestanden
|
|
|
Lists contain only `<li>` elements and script supporting elements (`<script>` and `<template>`).
Screen readers have a specific way of announcing lists. Ensuring proper list structure aids screen reader output. Learn more about proper list structure.
|
bestanden
|
|
|
List items (`<li>`) are contained within `<ul>`, `<ol>` or `<menu>` parent elements
Screen readers require list items (
<li>) to be contained within a parent <ul>, <ol> or <menu> to be announced properly. Learn more about proper list structure. |
bestanden
|
|
|
The document does not use `<meta http-equiv="refresh">`
Users do not expect a page to refresh automatically, and doing so will move focus back to the top of the page. This may create a frustrating or confusing experience. Learn more about the refresh meta tag.
|
nicht anwendbar
|
|
|
`[user-scalable="no"]` is not used in the `<meta name="viewport">` element and the `[maximum-scale]` attribute is not less than 5.
Disabling zooming is problematic for users with low vision who rely on screen magnification to properly see the contents of a web page. Learn more about the viewport meta tag.
|
bestanden
|
|
|
`<object>` elements have alternate text
Screen readers cannot translate non-text content. Adding alternate text to
<object> elements helps screen readers convey meaning to users. Learn more about alt text for object elements. |
nicht anwendbar
|
|
|
Select elements have associated label elements.
Form elements without effective labels can create frustrating experiences for screen reader users. Learn more about the
select element. |
nicht anwendbar
|
|
|
Skip links are focusable.
Including a skip link can help users skip to the main content to save time. Learn more about skip links.
|
bestanden
|
|
|
No element has a `[tabindex]` value greater than 0
A 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 about the
tabindex attribute. |
nicht anwendbar
|
|
|
Touch targets have sufficient size and spacing.
Touch targets with sufficient size and spacing help users who may have difficulty targeting small controls to activate the targets. Learn more about touch targets.
|
bestanden
|
|
|
Cells in a `<table>` element that use the `[headers]` attribute refer to table cells within the same table.
Screen readers have features to make navigating tables easier. Ensuring
<td> cells using the [headers] attribute only refer to other cells in the same table may improve the experience for screen reader users. Learn more about the headers attribute. |
nicht anwendbar
|
|
|
`<th>` elements and elements with `[role="columnheader"/"rowheader"]` have data cells they describe.
Screen readers have features to make navigating tables easier. Ensuring table headers always refer to some set of cells may improve the experience for screen reader users. Learn more about table headers.
|
nicht anwendbar
|
|
|
`[lang]` attributes have a valid value
Specifying a valid BCP 47 language on elements helps ensure that text is pronounced correctly by a screen reader. Learn how to use the
lang attribute. |
nicht anwendbar
|
|
|
`<video>` elements contain a `<track>` element with `[kind="captions"]`
When a video provides a caption it is easier for deaf and hearing impaired users to access its information. Learn more about video captions.
|
nicht anwendbar
|
|
|
Document has a main landmark.
One main landmark helps screen reader users navigate a web page. Learn more about landmarks.
|
bestanden
|
|
|
`autocomplete` attributes are used correctly
The
autocomplete attribute values must be valid and correctly applied for screen readers to function correctly. Learn more about valid autocomplete values. |
bestanden
|
|
|
Elements with `role="none"` or `role="presentation"` do not have conflicts
There are certain cases where the semantic role of an element with
role="none" or role="presentation" does not resolve to none or presentation. To ensure the element remains removed from the accessibility tree, you should not add any global ARIA attributes to the element or make it focusable. Learn more about presentation role conflict. |
nicht anwendbar
|
|
|
SVG elements with an `img` role have an accessible text alternative
Ensures SVG elements with an
img, graphics-document or graphics-symbol role have an accessible text alternative. Learn more about SVG alt text. |
nicht anwendbar
|
|
|
Interactive controls are keyboard focusable
Custom interactive controls are keyboard focusable and display a focus indicator. Learn how to make custom controls focusable.
|
manuelle Prüfung nötig
|
|
|
Interactive elements indicate their purpose and state
Interactive elements, such as links and buttons, should indicate their state and be distinguishable from non-interactive elements. Learn how to decorate interactive elements with affordance hints.
|
manuelle Prüfung nötig
|
|
|
The page has a logical tab order
Tabbing through the page follows the visual layout. Users cannot focus elements that are offscreen. Learn more about logical tab ordering.
|
manuelle Prüfung nötig
|
|
|
Visual order on the page follows DOM order
DOM order matches the visual order, improving navigation for assistive technology. Learn more about DOM and visual ordering.
|
manuelle Prüfung nötig
|
|
|
User focus is not accidentally trapped in a region
A user can tab into and out of any control or region without accidentally trapping their focus. Learn how to avoid focus traps.
|
manuelle Prüfung nötig
|
|
|
The user's focus is directed to new content added to the page
If new content, such as a dialog, is added to the page, the user's focus is directed to it. Learn how to direct focus to new content.
|
manuelle Prüfung nötig
|
|
|
HTML5 landmark elements are used to improve navigation
Landmark elements (
<main>, <nav>, etc.) are used to improve the keyboard navigation of the page for assistive technology. Learn more about landmark elements. |
manuelle Prüfung nötig
|
|
|
Offscreen content is hidden from assistive technology
Offscreen content is hidden with display: none or aria-hidden=true. Learn how to properly hide offscreen content.
|
manuelle Prüfung nötig
|
|
|
Custom controls have associated labels
Custom interactive controls have associated labels, provided by aria-label or aria-labelledby. Learn more about custom controls and labels.
|
manuelle Prüfung nötig
|
|
|
Custom controls have ARIA roles
Custom interactive controls have appropriate ARIA roles. Learn how to add roles to custom controls.
|
manuelle Prüfung nötig
|
|
|
Tables have different content in the summary attribute and `<caption>`.
The summary attribute should describe the table structure, while
<caption> should have the onscreen title. Accurate table mark-up helps users of screen readers. Learn more about summary and caption. |
nicht anwendbar
|
|
|
All heading elements contain content.
A heading with no content or inaccessible text prevent screen reader users from accessing information on the page's structure. Learn more about headings.
|
nicht anwendbar
|
|
|
Uses ARIA roles only on compatible elements
Many HTML elements can only be assigned certain ARIA roles. Using ARIA roles where they are not allowed can interfere with the accessibility of the web page. Learn more about ARIA roles.
|
nicht anwendbar
|
|
|
Image elements do not have `[alt]` attributes that are redundant text.
Informative elements should aim for short, descriptive alternative text. Alternative text that is exactly the same as the text adjacent to the link or image is potentially confusing for screen reader users, because the text will be read twice. Learn more about the
alt attribute. |
nicht anwendbar
|
|
|
Identical links have the same purpose.
Links with the same destination should have the same description, to help users understand the link's purpose and decide whether to follow it. Learn more about identical links.
|
nicht anwendbar
|
|
|
Elements with visible text labels do not have matching accessible names.
Visible text labels that do not match the accessible name can result in a confusing experience for screen reader users. Learn more about accessible names.
Warum bei kandlen-it.de: Die Würfel-Bausteine-Buttons (Design, Inhalt, SEO, Recht, Ladezeit, …) haben aria-label wie „1 · Design (Sichtbar)", der sichtbare Buttontext lautet aber nur „1 Design" — der sichtbare Text ist kein Teilstring des aria-label. Screenreader- und Spracheingabe-Nutzer können den Button dadurch nicht zuverlässig referenzieren.
Wie lösen: aria-label so umbauen, dass der sichtbare Text darin vorkommt (z. B. „Design – Sichtbar" statt „1 · Design (Sichtbar)"), oder ganz auf aria-label verzichten und den sichtbaren Text allein sprechen lassen.
|
nicht bestanden
|
|
|
Tables use `<caption>` instead of cells with the `[colspan]` attribute to indicate a caption.
Screen readers have features to make navigating tables easier. Ensuring that tables use the actual caption element instead of cells with the
[colspan] attribute may improve the experience for screen reader users. Learn more about captions. |
nicht anwendbar
|
|
|
`<td>` elements in a large `<table>` have one or more table headers.
Screen readers have features to make navigating tables easier. Ensuring that
<td> elements in a large table (3 or more cells in width and height) have an associated table header may improve the experience for screen reader users. Learn more about table headers. |
nicht anwendbar
|
Best Practices — 21 Audits
|
Uses HTTPS
All 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 about HTTPS.
|
bestanden
|
|
|
Redirects HTTP traffic to HTTPS
Make sure that you redirect all HTTP traffic to HTTPS in order to enable secure web features for all your users. Learn more.
|
nicht anwendbar
|
|
|
Avoids requesting the geolocation permission on page load
Users are mistrustful of or confused by sites that request their location without context. Consider tying the request to a user action instead. Learn more about the geolocation permission. Also consider using the
<geolocation> element. |
bestanden
|
|
|
Avoids requesting the notification permission on page load
Users are mistrustful of or confused by sites that request to send notifications without context. Consider tying the request to user gestures instead. Learn more about responsibly getting permission for notifications.
|
bestanden
|
|
|
Ensure CSP is effective against XSS attacks
A strong Content Security Policy (CSP) significantly reduces the risk of cross-site scripting (XSS) attacks. Learn how to use a CSP to prevent XSS
|
informativ
|
|
|
Use a strong HSTS policy
Deployment of the HSTS header significantly reduces the risk of downgrading HTTP connections and eavesdropping attacks. A rollout in stages, starting with a low max-age is recommended. Learn more about using a strong HSTS policy.
|
informativ
|
|
|
Ensure proper origin isolation with COOP
The Cross-Origin-Opener-Policy (COOP) can be used to isolate the top-level window from other documents such as pop-ups. Learn more about deploying the COOP header.
|
informativ
|
|
|
Mitigate clickjacking with XFO or CSP
The
X-Frame-Options (XFO) header or the frame-ancestors directive in the Content-Security-Policy (CSP) header control where a page can be embedded. These can mitigate clickjacking attacks by blocking some or all sites from embedding the page. Learn more about mitigating clickjacking. |
nicht anwendbar
|
|
|
Mitigate DOM-based XSS with Trusted Types
The
require-trusted-types-for directive in the Content-Security-Policy (CSP) header instructs user agents to control the data passed to DOM XSS sink functions. Learn more about mitigating DOM-based XSS with Trusted Types. |
informativ
|
|
|
Allows users to paste into input fields
Preventing input pasting is a bad practice for the UX, and weakens security by blocking password managers.Learn more about user-friendly input fields.
|
bestanden
|
|
|
Displays images with correct aspect ratio
Image display dimensions should match natural aspect ratio. Learn more about image aspect ratio.
|
bestanden
|
|
|
Serves images with appropriate resolution
Image natural dimensions should be proportional to the display size and the pixel ratio to maximize image clarity. Learn how to provide responsive images.
|
bestanden
|
|
|
Page has the HTML doctype
Specifying a doctype prevents the browser from switching to quirks-mode. Learn more about the doctype declaration.
|
bestanden
|
|
|
Properly defines charset
A 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 about declaring the character encoding. |
bestanden
|
|
|
Baseline Features
Lists web features used on the page and their Baseline status as of 2026-07-15. Learn more about Baseline.
|
informativ
|
|
|
Detected JavaScript libraries
All front-end JavaScript libraries detected on the page. Learn more about this JavaScript library detection diagnostic audit.
|
informativ
|
|
|
Avoids deprecated APIs
Deprecated APIs will eventually be removed from the browser. Learn more about deprecated APIs.
|
bestanden
|
|
|
Avoids third-party cookies
Third-party cookies may be blocked in some contexts. Learn more about preparing for third-party cookie restrictions.
|
bestanden
|
|
|
No browser errors logged to the console
Errors logged to the console indicate unresolved problems. They can come from network request failures and other browser concerns. Learn more about this errors in console diagnostic audit
|
bestanden
|
|
|
Page has valid source maps
Source maps translate minified code to the original source code. This helps developers debug in production. In addition, Lighthouse is able to provide further insights. Consider deploying source maps to take advantage of these benefits. Learn more about source maps.
|
bestanden
|
|
|
No issues in the `Issues` panel in Chrome Devtools
Issues 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. |
bestanden
|
SEO — 11 Audits
|
Page isn’t blocked from indexing
Search engines are unable to include your pages in search results if they don't have permission to crawl them. Learn more about crawler directives.
|
bestanden
|
|
|
Document has a `<title>` element
The 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 about document titles.
|
bestanden
|
|
|
Document has a meta description
Meta descriptions may be included in search results to concisely summarize page content. Learn more about the meta description.
|
bestanden
|
|
|
Page has successful HTTP status code
Pages with unsuccessful HTTP status codes may not be indexed properly. Learn more about HTTP status codes.
|
bestanden
|
|
|
Links have descriptive text
Descriptive link text helps search engines understand your content. Learn how to make links more accessible.
|
bestanden
|
|
|
Links are crawlable
Search 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 how to make links crawlable |
bestanden
|
|
|
robots.txt is valid
If 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 about robots.txt.
|
bestanden
|
|
|
Image elements have `[alt]` attributes
Informative elements should aim for short, descriptive alternate text. Decorative elements can be ignored with an empty alt attribute. Learn more about the
alt attribute. |
bestanden
|
|
|
Document has a valid `hreflang`
hreflang links tell search engines what version of a page they should list in search results for a given language or region. Learn more about
hreflang. |
bestanden
|
|
|
Document has a valid `rel=canonical`
Canonical links suggest which URL to show in search results. Learn more about canonical links.
|
bestanden
|
|
|
Structured data is valid
Run the Structured Data Testing Tool to validate structured data. Learn more about Structured Data.
|
manuelle Prüfung nötig
|
Scores — Desktop
99
Performance
Gewichteter Gesamtwert aus den sieben Metriken unten — LCP und Total Blocking Time zählen am stärksten.
100
Accessibility
Automatisch prüfbare Barrierefreiheit: Kontraste, Alt-Texte, ARIA-Attribute. Ersetzt keine manuelle Prüfung, deckt aber die technische Basis ab.
100
Best Practices
Allgemeine Web-Standards: HTTPS, keine Konsolen-Fehler, aktuelle/sichere Bibliotheken.
100
SEO
Technische Grundlagen für Suchmaschinen: Meta-Tags vorhanden, Seite crawlbar, mobilfreundlich.
Alle Metriken (komplett, ungekürzt) — mit Erklärung
|
First Contentful Paint
Wie lange es dauert, bis der erste Inhalt (Text oder Bild) überhaupt sichtbar wird — der erste Eindruck, dass „sich etwas tut".
|
0.5 s | |
|
Largest Contentful Paint
Wann das größte sichtbare Element (meist Hauptbild oder Überschrift) fertig geladen ist. Offizieller Google-Web-Vital, fließt ins Suchmaschinen-Ranking ein. Richtwert: unter 2,5 s.
|
0.6 s | |
|
Total Blocking Time
Wie lange JavaScript den Hauptthread blockiert, sodass Klicks/Eingaben nicht sofort reagieren. Je höher, desto „hakeliger" fühlt sich die Seite an. Richtwert: unter 200 ms.
|
0 ms | |
|
Cumulative Layout Shift
Wie stark sich Elemente während des Ladens ungewollt verschieben (z. B. Text springt, weil ein Bild nachträglich Platz beansprucht). Ebenfalls ein Google-Web-Vital. Richtwert: unter 0,1.
|
0 | |
|
Speed Index
Wie schnell sich der sichtbare Seiteninhalt über die Zeit füllt — visuelle Analyse des gesamten Ladeverlaufs, keine einzelne Marke. Richtwert: unter 3,4 s.
|
1.0 s | |
|
Time to Interactive
Ab wann die Seite zuverlässig auf Eingaben reagiert, also keine langen blockierenden Skripte mehr laufen. Richtwert: unter 3,8 s.
|
0.6 s | |
|
Initial server response time was short
Wie schnell der Server auf die allererste Anfrage antwortet, bevor der Browser überhaupt mit dem Rendern anfängt (Time to First Byte). Richtwert: unter 600 ms.
|
Root document took 50 ms |
Verbesserungsvorschläge (Opportunities)
Konkrete, von Lighthouse gefundene Stellschrauben — mit der geschätzten Zeit, die eine Behebung an Ladezeit einsparen würde. Sortiert nach Wirkung, größter Hebel zuerst.
- Avoid multiple page redirects 230 ms
- Reduce unused CSS 0 ms
- Minify JavaScript 0 ms
- Minify CSS 0 ms
Alle Audits — komplett, alle 153 aus allen 4 Kategorien (Desktop)
Das ist die vollständige Rohantwort der PageSpeed-API, ungekürzt — jede einzelne Prüfung, die Lighthouse durchführt, mit Original-Beschreibung, was sie genau prüft.
Performance — 47 Audits
|
First Contentful Paint
First Contentful Paint marks the time at which the first text or image is painted. Learn more about the First Contentful Paint metric.
Warum bei kandlen-it.de: 2,0 s bis zum ersten sichtbaren Inhalt, knapp über dem Richtwert von 1,8 s. Ursache: der Browser muss erst mehrere render-blockierende CSS-Dateien laden, bevor er überhaupt zu zeichnen beginnt (siehe „Ressourcen, die das Rendering blockieren" unten).
Wie lösen: Kritisches CSS für den sichtbaren Bereich inline in den Seitenkopf setzen, den Rest asynchron nachladen.
|
0.5 s bestanden
|
|
|
Largest Contentful Paint
Largest Contentful Paint marks the time at which the largest text or image is painted. Learn more about the Largest Contentful Paint metric
Warum bei kandlen-it.de: Die Serverantwort ist mit 21 ms sehr schnell — der eigentliche Verzug (4,2 s) entsteht danach: das größte Element (der Hero-Text) wartet auf das Rendering, weil vorher blockierendes CSS geladen werden muss.
Wie lösen: Render-blockierendes CSS reduzieren (siehe unten), damit der Hero-Bereich früher gezeichnet werden kann.
|
0.6 s bestanden
|
|
|
Total Blocking Time
Sum of all time periods between FCP and Time to Interactive, when task length exceeded 50ms, expressed in milliseconds. Learn more about the Total Blocking Time metric.
|
0 ms bestanden
|
|
|
Cumulative Layout Shift
Cumulative Layout Shift measures the movement of visible elements within the viewport. Learn more about the Cumulative Layout Shift metric.
|
0 bestanden
|
|
|
Speed Index
Speed Index shows how quickly the contents of a page are visibly populated. Learn more about the Speed Index metric.
Warum bei kandlen-it.de: Mit 6,7 s deutlich über dem Richtwert von 3,4 s. Hängt direkt an denselben Ursachen wie FCP/LCP — die Seite füllt sich sichtbar langsam, weil zentrale Styles blockierend nachgeladen werden.
Wie lösen: Gleiche Lösung wie First/Largest Contentful Paint: render-blockierendes CSS auflösen.
|
1.0 s bestanden
|
|
|
Use efficient cache lifetimes
A long cache lifetime can speed up repeat visits to your page. Learn more about caching.
Warum bei kandlen-it.de: 16 statische Dateien (CSS, Web-Fonts, JS) sind nur 7 Tage cachebar, obwohl sie über „?ver="-Parameter versioniert sind und sich zwischen Deployments nicht ändern — z. B. style.css, TitilliumWeb-400/600/700.woff2, wuerfel.js.
Wie lösen: Cache-Control max-age für versionierte, statische Assets auf ein Jahr hochsetzen (das Cache-Busting über „?ver=" macht das gefahrlos — neue Version = neue URL).
|
Est savings of 10 KiB teilweise
|
|
|
Layout shift culprits
Layout shifts occur when elements move absent any user interaction. Investigate the causes of layout shifts, such as elements being added, removed, or their fonts changing as the page loads.
|
informativ
|
|
|
Document request latency
Your first network request is the most important. Reduce its latency by avoiding redirects, ensuring a fast server response, and enabling text compression.
Warum bei kandlen-it.de: Server antwortet schnell (21 ms) und liefert komprimiert aus — aber 1 Weiterleitung kostet zusätzlich 3,6 s, bevor überhaupt geladen wird (siehe „Mehrere Weiterleitungen" unten).
Wie lösen: Identisch mit dem Redirects-Punkt: die Weiterleitung kandlen-it.de → www.kandlen-it.de vermeiden bzw. verkürzen.
|
Est savings of 390 ms nicht bestanden
|
|
|
Optimize DOM size
A large DOM can increase the duration of style calculations and layout reflows, impacting page responsiveness. A large DOM will also increase memory usage. Learn how to avoid an excessive DOM size.
|
informativ
|
|
|
Duplicated JavaScript
Remove large, duplicate JavaScript modules from bundles to reduce unnecessary bytes consumed by network activity.
|
bestanden
|
|
|
Font display
Consider setting
font-display to swap or optional to ensure text is consistently visible. swap can be further optimized to mitigate layout shifts with font metric overrides. |
bestanden
|
|
|
Forced reflow
A forced reflow occurs when JavaScript queries geometric properties (such as
offsetWidth) after styles have been invalidated by a change to the DOM state. This can result in poor performance. Learn more about forced reflows and possible mitigations. |
bestanden
|
|
|
Improve image delivery
Reducing the download time of images can improve the perceived load time of the page and LCP. Learn more about optimizing image size
Warum bei kandlen-it.de: Das Hero-Bild „kandlen-system.webp" wird mit 900×900 px ausgeliefert, im Layout aber nur mit 450×450 bzw. effektiv 679×679 px dargestellt — 72 KB werden durch die falsche Auflösung verschenkt, weitere 32 KB durch zu geringe Kompression.
Wie lösen: Bild in der tatsächlich benötigten Größe exportieren bzw. srcset mit passenden Zwischengrößen anbieten, Kompressionsfaktor erhöhen.
|
Est savings of 32 KiB nicht bestanden
|
|
|
INP breakdown
Start investigating how to improve INP by looking at the longest subpart.
|
nicht anwendbar
|
|
|
LCP breakdown
Each subpart has specific improvement strategies. Ideally, most of the LCP time should be spent on loading the resources, not within delays.
Warum bei kandlen-it.de: Bestätigt die LCP-Ursache im Detail: „Time to first byte" nur 21 ms, aber „Element render delay" 4.165 ms — fast die komplette Zeit geht durchs Warten auf render-blockierendes CSS drauf, nicht durch den Server.
Wie lösen: Siehe Largest Contentful Paint oben — render-blockierendes CSS auflösen.
|
informativ
|
|
|
LCP request discovery
Optimize LCP by making the LCP image discoverable from the HTML immediately, and avoiding lazy-loading
|
bestanden
|
|
|
Legacy JavaScript
Polyfills and transforms enable older browsers to use new JavaScript features. However, many aren't necessary for modern browsers. Consider modifying your JavaScript build process to not transpile Baseline features, unless you know you must support older browsers. Learn why most sites can deploy ES6+ code without transpiling
|
bestanden
|
|
|
Network dependency tree
Avoid chaining critical requests by reducing the length of chains, reducing the download size of resources, or deferring the download of unnecessary resources to improve page load.
Warum bei kandlen-it.de: Die Ladekette zeigt: die Startseite lädt style.css nach, das wiederum eine Web-Font-Datei nachlädt — eine verschachtelte Kette von 4,2 s für die längste Abhängigkeit. Kein Preconnect nötig, da alles von der eigenen Domain kommt.
Wie lösen: Verschachtelung verkürzen: Fonts nicht über einen Umweg durchs CSS, sondern direkt im HTML-Kopf per <link rel="preload"> ankündigen.
|
nicht bestanden
|
|
|
Render-blocking requests
Requests are blocking the page's initial render, which may delay LCP. Deferring or inlining can move these network requests out of the critical path.
Warum bei kandlen-it.de: Vier CSS-Dateien blockieren das Rendering: style.css (751 ms), kit-a11y/frontend.css (151 ms), wuerfel-neu.css (451 ms) und wuerfel.css (451 ms). Auffällig: wuerfel.css und wuerfel-neu.css werden beide geladen — möglicherweise eine Altlast.
Wie lösen: Kritisches CSS inline setzen, Rest per media="print" onload-Trick oder defer nachladen. Zusätzlich prüfen, ob wuerfel.css neben wuerfel-neu.css noch gebraucht wird.
|
Est savings of 120 ms nicht bestanden
|
|
|
3rd parties
3rd party code can significantly impact load performance. Reduce and defer loading of 3rd party code to prioritize your page's content.
|
bestanden
|
|
|
Optimize viewport for mobile
Tap interactions may be delayed by up to 300 ms if the viewport is not optimized for mobile.
|
bestanden
|
|
|
Time to Interactive
Time to Interactive is the amount of time it takes for the page to become fully interactive. Learn more about the Time to Interactive metric.
|
0.6 s bestanden
|
|
|
Max Potential First Input Delay
The maximum potential First Input Delay that your users could experience is the duration of the longest task. Learn more about the Maximum Potential First Input Delay metric.
|
40 ms bestanden
|
|
|
Minify CSS
Minifying CSS files can reduce network payload sizes. Learn how to minify CSS.
Warum bei kandlen-it.de: style.css: 43,5 % Einsparung möglich (8,2 von 18,9 KB), wuerfel-neu.css: 45,5 % (2,8 von 6,1 KB) — beides unkomprimierter Whitespace/Kommentare aus der Theme-Entwicklung.
Wie lösen: CSS-Minifizierung in den Build-Prozess des WordPress-Themes „kit-kandlen-theme" einbauen (z. B. beim Speichern automatisch minifizierte Version ausliefern).
|
Est savings of 11 KiB teilweise
|
|
|
Minify JavaScript
Minifying JavaScript files can reduce payload sizes and script parse time. Learn how to minify JavaScript.
Warum bei kandlen-it.de: wuerfel-neu.js: 44 % Einsparung möglich (2,3 von 5,3 KB) durch fehlende Minifizierung.
Wie lösen: Gleiche Build-Pipeline wie bei CSS für JavaScript-Dateien einrichten.
|
Est savings of 2 KiB teilweise
|
|
|
Reduce unused CSS
Reduce unused rules from stylesheets and defer CSS not used for above-the-fold content to decrease bytes consumed by network activity. Learn how to reduce unused CSS.
Warum bei kandlen-it.de: style.css: 58,8 % der geladenen Regeln (10,7 von 18,3 KB) werden auf der Startseite gar nicht angewendet — Regeln für andere Seiten/Komponenten werden immer mitgeladen.
Wie lösen: CSS pro Seitentyp aufteilen oder mit einem Tool wie PurgeCSS im Theme-Build nur die tatsächlich genutzten Regeln ausliefern.
|
Est savings of 10 KiB teilweise
|
|
|
Reduce unused JavaScript
Reduce unused JavaScript and defer loading scripts until they are required to decrease bytes consumed by network activity. Learn how to reduce unused JavaScript.
|
bestanden
|
|
|
Avoids enormous network payloads
Large network payloads cost users real money and are highly correlated with long load times. Learn how to reduce payload sizes.
|
Total size was 204 KiB bestanden
|
|
|
User Timing marks and measures
Consider instrumenting your app with the User Timing API to measure your app's real-world performance during key user experiences. Learn more about User Timing marks.
|
nicht anwendbar
|
|
|
JavaScript execution time
Consider reducing the time spent parsing, compiling, and executing JS. You may find delivering smaller JS payloads helps with this. Learn how to reduce Javascript execution time.
|
0.0 s bestanden
|
|
|
Minimizes main-thread work
Consider reducing the time spent parsing, compiling and executing JS. You may find delivering smaller JS payloads helps with this. Learn how to minimize main-thread work
|
0.2 s bestanden
|
|
|
Avoid long main-thread tasks
Lists the longest tasks on the main thread, useful for identifying worst contributors to input delay. Learn how to avoid long main-thread tasks
|
nicht anwendbar
|
|
|
Avoid non-composited animations
Animations which are not composited can be janky and increase CLS. Learn how to avoid non-composited animations
|
nicht anwendbar
|
|
|
Image elements have explicit `width` and `height`
Set an explicit width and height on image elements to reduce layout shifts and improve CLS. Learn how to set image dimensions
|
bestanden
|
|
|
Network Requests
Lists the network requests that were made during page load.
|
informativ
|
|
|
Network Round Trip Times
Network round trip times (RTT) have a large impact on performance. If the RTT to an origin is high, it's an indication that servers closer to the user could improve performance. Learn more about the Round Trip Time.
|
0 ms informativ
|
|
|
Server Backend Latencies
Server latencies can impact web performance. If the server latency of an origin is high, it's an indication the server is overloaded or has poor backend performance. Learn more about server response time.
|
0 ms informativ
|
|
|
Tasks
Lists the toplevel main thread tasks that executed during page load.
|
informativ
|
|
|
Diagnostics
Collection of useful page vitals.
|
informativ
|
|
|
Metrics
Collects all available metrics.
|
informativ
|
|
|
Screenshot Thumbnails
This is what the load of your site looked like.
|
informativ
|
|
|
Final Screenshot
The last screenshot captured of the pageload.
|
informativ
|
|
|
Script Treemap Data
Used for treemap app
|
informativ
|
|
|
Resources Summary
Aggregates all network requests and groups them by type
|
informativ
|
|
|
Avoid multiple page redirects
Redirects introduce additional delays before the page can be loaded. Learn how to avoid page redirects.
Warum bei kandlen-it.de: https://kandlen-it.de/ (ohne www) leitet auf https://www.kandlen-it.de/ weiter — kostet 780 ms, bevor überhaupt mit dem Laden begonnen wird.
Wie lösen: Intern und in Marketing-Links immer direkt auf www.kandlen-it.de verweisen; die Weiterleitung serverseitig so kurz wie möglich halten (301, keine Zwischenstationen).
|
Est savings of 230 ms nicht bestanden
|
|
|
Initial server response time was short
Keep the server response time for the main document short because all other requests depend on it. Learn more about the Time to First Byte metric.
|
Root document took 50 ms bestanden
|
|
|
Avoid large layout shifts
These are the largest layout shifts observed on the page. Each table item represents a single layout shift, and shows the element that shifted the most. Below each item are possible root causes that led to the layout shift. Some of these layout shifts may not be included in the CLS metric value due to windowing. Learn how to improve CLS
|
1 layout shift found informativ
|
Accessibility — 76 Audits
|
`[accesskey]` values are unique
Access keys let users quickly focus a part of the page. For proper navigation, each access key must be unique. Learn more about access keys.
|
nicht anwendbar
|
|
|
`[aria-*]` attributes match their roles
Each ARIA
role supports a specific subset of aria-* attributes. Mismatching these invalidates the aria-* attributes. Learn how to match ARIA attributes to their roles. |
bestanden
|
|
|
`button`, `link`, and `menuitem` elements have accessible names
When an element doesn't have an accessible name, screen readers announce it with a generic name, making it unusable for users who rely on screen readers. Learn how to make command elements more accessible.
|
nicht anwendbar
|
|
|
ARIA attributes are used as specified for the element's role
Some ARIA attributes are only allowed on an element under certain conditions. Learn more about conditional ARIA attributes.
|
bestanden
|
|
|
Deprecated ARIA roles were not used
Deprecated ARIA roles may not be processed correctly by assistive technology. Learn more about deprecated ARIA roles.
|
bestanden
|
|
|
Elements with `role="dialog"` or `role="alertdialog"` have accessible names.
ARIA dialog elements without accessible names may prevent screen readers users from discerning the purpose of these elements. Learn how to make ARIA dialog elements more accessible.
|
nicht anwendbar
|
|
|
`[aria-hidden="true"]` is not present on the document `<body>`
Assistive technologies, like screen readers, work inconsistently when
aria-hidden="true" is set on the document <body>. Learn how aria-hidden affects the document body. |
bestanden
|
|
|
`[aria-hidden="true"]` elements do not contain focusable descendents
Focusable descendents within an
[aria-hidden="true"] element prevent those interactive elements from being available to users of assistive technologies like screen readers. Learn how aria-hidden affects focusable elements. |
bestanden
|
|
|
ARIA input fields have accessible names
When an input field doesn't have an accessible name, screen readers announce it with a generic name, making it unusable for users who rely on screen readers. Learn more about input field labels.
|
nicht anwendbar
|
|
|
ARIA `meter` elements have accessible names
When a meter element doesn't have an accessible name, screen readers announce it with a generic name, making it unusable for users who rely on screen readers. Learn how to name
meter elements. |
nicht anwendbar
|
|
|
ARIA `progressbar` elements have accessible names
When a
progressbar element doesn't have an accessible name, screen readers announce it with a generic name, making it unusable for users who rely on screen readers. Learn how to label progressbar elements. |
nicht anwendbar
|
|
|
Elements use only permitted ARIA attributes
Using ARIA attributes in roles where they are prohibited can mean that important information is not communicated to users of assistive technologies. Learn more about prohibited ARIA roles.
|
bestanden
|
|
|
`[role]`s have all required `[aria-*]` attributes
Some ARIA roles have required attributes that describe the state of the element to screen readers. Learn more about roles and required attributes.
|
bestanden
|
|
|
Elements with an ARIA `[role]` that require children to contain a specific `[role]` have all required children.
Some ARIA parent roles must contain specific child roles to perform their intended accessibility functions. Learn more about roles and required children elements.
|
nicht anwendbar
|
|
|
`[role]`s are contained by their required parent element
Some ARIA child roles must be contained by specific parent roles to properly perform their intended accessibility functions. Learn more about ARIA roles and required parent element.
|
nicht anwendbar
|
|
|
`[role]` values are valid
ARIA roles must have valid values in order to perform their intended accessibility functions. Learn more about valid ARIA roles.
|
bestanden
|
|
|
Elements with the `role=text` attribute do not have focusable descendents.
Adding
role=text around a text node split by markup enables VoiceOver to treat it as one phrase, but the element's focusable descendents will not be announced. Learn more about the role=text attribute. |
nicht anwendbar
|
|
|
ARIA toggle fields have accessible names
When a toggle field doesn't have an accessible name, screen readers announce it with a generic name, making it unusable for users who rely on screen readers. Learn more about toggle fields.
|
nicht anwendbar
|
|
|
ARIA `tooltip` elements have accessible names
When a tooltip element doesn't have an accessible name, screen readers announce it with a generic name, making it unusable for users who rely on screen readers. Learn how to name
tooltip elements. |
nicht anwendbar
|
|
|
ARIA `treeitem` elements have accessible names
When a
treeitem element doesn't have an accessible name, screen readers announce it with a generic name, making it unusable for users who rely on screen readers. Learn more about labeling treeitem elements. |
nicht anwendbar
|
|
|
`[aria-*]` attributes have valid values
Assistive technologies, like screen readers, can't interpret ARIA attributes with invalid values. Learn more about valid values for ARIA attributes.
|
bestanden
|
|
|
`[aria-*]` attributes are valid and not misspelled
Assistive technologies, like screen readers, can't interpret ARIA attributes with invalid names. Learn more about valid ARIA attributes.
|
bestanden
|
|
|
Buttons have an accessible name
When 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 how to make buttons more accessible.
|
bestanden
|
|
|
The page contains a heading, skip link, or landmark region
Adding ways to bypass repetitive content lets keyboard users navigate the page more efficiently. Learn more about bypass blocks.
|
nicht anwendbar
|
|
|
Background and foreground colors have a sufficient contrast ratio
Low-contrast text is difficult or impossible for many users to read. Learn how to provide sufficient color contrast.
|
bestanden
|
|
|
`<dl>`'s contain only properly-ordered `<dt>` and `<dd>` groups, `<script>`, `<template>` or `<div>` elements.
When definition lists are not properly marked up, screen readers may produce confusing or inaccurate output. Learn how to structure definition lists correctly.
|
nicht anwendbar
|
|
|
Definition list items are wrapped in `<dl>` elements
Definition list items (
<dt> and <dd>) must be wrapped in a parent <dl> element to ensure that screen readers can properly announce them. Learn how to structure definition lists correctly. |
nicht anwendbar
|
|
|
Document has a `<title>` element
The 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 about document titles.
|
bestanden
|
|
|
ARIA IDs are unique
The value of an ARIA ID must be unique to prevent other instances from being overlooked by assistive technologies. Learn how to fix duplicate ARIA IDs.
|
nicht anwendbar
|
|
|
No form fields have multiple labels
Form fields with multiple labels can be confusingly announced by assistive technologies like screen readers which use either the first, the last, or all of the labels. Learn how to use form labels.
|
nicht anwendbar
|
|
|
`<frame>` or `<iframe>` elements have a title
Screen reader users rely on frame titles to describe the contents of frames. Learn more about frame titles.
|
nicht anwendbar
|
|
|
Heading elements appear in a sequentially-descending order
Properly 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 about heading order.
|
bestanden
|
|
|
`<html>` element has a `[lang]` attribute
If 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 about the lang attribute. |
bestanden
|
|
|
`<html>` element has a valid value for its `[lang]` attribute
Specifying a valid BCP 47 language helps screen readers announce text properly. Learn how to use the
lang attribute. |
bestanden
|
|
|
`<html>` element has an `[xml:lang]` attribute with the same base language as the `[lang]` attribute.
If the webpage does not specify a consistent language, then the screen reader might not announce the page's text correctly. Learn more about the
lang attribute. |
nicht anwendbar
|
|
|
Image elements have `[alt]` attributes
Informative elements should aim for short, descriptive alternate text. Decorative elements can be ignored with an empty alt attribute. Learn more about the
alt attribute. |
bestanden
|
|
|
Input buttons have discernible text.
Adding discernable and accessible text to input buttons may help screen reader users understand the purpose of the input button. Learn more about input buttons.
|
nicht anwendbar
|
|
|
`<input type="image">` elements have `[alt]` text
When an image is being used as an
<input> button, providing alternative text can help screen reader users understand the purpose of the button. Learn about input image alt text. |
nicht anwendbar
|
|
|
Form elements have associated labels
Labels ensure that form controls are announced properly by assistive technologies, like screen readers. Learn more about form element labels.
|
bestanden
|
|
|
Links are distinguishable without relying on color.
Low-contrast text is difficult or impossible for many users to read. Link text that is discernible improves the experience for users with low vision. Learn how to make links distinguishable.
|
bestanden
|
|
|
Links have a discernible name
Link 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 how to make links accessible.
|
bestanden
|
|
|
Lists contain only `<li>` elements and script supporting elements (`<script>` and `<template>`).
Screen readers have a specific way of announcing lists. Ensuring proper list structure aids screen reader output. Learn more about proper list structure.
|
bestanden
|
|
|
List items (`<li>`) are contained within `<ul>`, `<ol>` or `<menu>` parent elements
Screen readers require list items (
<li>) to be contained within a parent <ul>, <ol> or <menu> to be announced properly. Learn more about proper list structure. |
bestanden
|
|
|
The document does not use `<meta http-equiv="refresh">`
Users do not expect a page to refresh automatically, and doing so will move focus back to the top of the page. This may create a frustrating or confusing experience. Learn more about the refresh meta tag.
|
nicht anwendbar
|
|
|
`[user-scalable="no"]` is not used in the `<meta name="viewport">` element and the `[maximum-scale]` attribute is not less than 5.
Disabling zooming is problematic for users with low vision who rely on screen magnification to properly see the contents of a web page. Learn more about the viewport meta tag.
|
bestanden
|
|
|
`<object>` elements have alternate text
Screen readers cannot translate non-text content. Adding alternate text to
<object> elements helps screen readers convey meaning to users. Learn more about alt text for object elements. |
nicht anwendbar
|
|
|
Select elements have associated label elements.
Form elements without effective labels can create frustrating experiences for screen reader users. Learn more about the
select element. |
nicht anwendbar
|
|
|
Skip links are focusable.
Including a skip link can help users skip to the main content to save time. Learn more about skip links.
|
bestanden
|
|
|
No element has a `[tabindex]` value greater than 0
A 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 about the
tabindex attribute. |
nicht anwendbar
|
|
|
Touch targets have sufficient size and spacing.
Touch targets with sufficient size and spacing help users who may have difficulty targeting small controls to activate the targets. Learn more about touch targets.
|
bestanden
|
|
|
Cells in a `<table>` element that use the `[headers]` attribute refer to table cells within the same table.
Screen readers have features to make navigating tables easier. Ensuring
<td> cells using the [headers] attribute only refer to other cells in the same table may improve the experience for screen reader users. Learn more about the headers attribute. |
nicht anwendbar
|
|
|
`<th>` elements and elements with `[role="columnheader"/"rowheader"]` have data cells they describe.
Screen readers have features to make navigating tables easier. Ensuring table headers always refer to some set of cells may improve the experience for screen reader users. Learn more about table headers.
|
nicht anwendbar
|
|
|
`[lang]` attributes have a valid value
Specifying a valid BCP 47 language on elements helps ensure that text is pronounced correctly by a screen reader. Learn how to use the
lang attribute. |
nicht anwendbar
|
|
|
`<video>` elements contain a `<track>` element with `[kind="captions"]`
When a video provides a caption it is easier for deaf and hearing impaired users to access its information. Learn more about video captions.
|
nicht anwendbar
|
|
|
Document has a main landmark.
One main landmark helps screen reader users navigate a web page. Learn more about landmarks.
|
bestanden
|
|
|
`autocomplete` attributes are used correctly
The
autocomplete attribute values must be valid and correctly applied for screen readers to function correctly. Learn more about valid autocomplete values. |
bestanden
|
|
|
Elements with `role="none"` or `role="presentation"` do not have conflicts
There are certain cases where the semantic role of an element with
role="none" or role="presentation" does not resolve to none or presentation. To ensure the element remains removed from the accessibility tree, you should not add any global ARIA attributes to the element or make it focusable. Learn more about presentation role conflict. |
nicht anwendbar
|
|
|
SVG elements with an `img` role have an accessible text alternative
Ensures SVG elements with an
img, graphics-document or graphics-symbol role have an accessible text alternative. Learn more about SVG alt text. |
nicht anwendbar
|
|
|
Interactive controls are keyboard focusable
Custom interactive controls are keyboard focusable and display a focus indicator. Learn how to make custom controls focusable.
|
manuelle Prüfung nötig
|
|
|
Interactive elements indicate their purpose and state
Interactive elements, such as links and buttons, should indicate their state and be distinguishable from non-interactive elements. Learn how to decorate interactive elements with affordance hints.
|
manuelle Prüfung nötig
|
|
|
The page has a logical tab order
Tabbing through the page follows the visual layout. Users cannot focus elements that are offscreen. Learn more about logical tab ordering.
|
manuelle Prüfung nötig
|
|
|
Visual order on the page follows DOM order
DOM order matches the visual order, improving navigation for assistive technology. Learn more about DOM and visual ordering.
|
manuelle Prüfung nötig
|
|
|
User focus is not accidentally trapped in a region
A user can tab into and out of any control or region without accidentally trapping their focus. Learn how to avoid focus traps.
|
manuelle Prüfung nötig
|
|
|
The user's focus is directed to new content added to the page
If new content, such as a dialog, is added to the page, the user's focus is directed to it. Learn how to direct focus to new content.
|
manuelle Prüfung nötig
|
|
|
HTML5 landmark elements are used to improve navigation
Landmark elements (
<main>, <nav>, etc.) are used to improve the keyboard navigation of the page for assistive technology. Learn more about landmark elements. |
manuelle Prüfung nötig
|
|
|
Offscreen content is hidden from assistive technology
Offscreen content is hidden with display: none or aria-hidden=true. Learn how to properly hide offscreen content.
|
manuelle Prüfung nötig
|
|
|
Custom controls have associated labels
Custom interactive controls have associated labels, provided by aria-label or aria-labelledby. Learn more about custom controls and labels.
|
manuelle Prüfung nötig
|
|
|
Custom controls have ARIA roles
Custom interactive controls have appropriate ARIA roles. Learn how to add roles to custom controls.
|
manuelle Prüfung nötig
|
|
|
Tables have different content in the summary attribute and `<caption>`.
The summary attribute should describe the table structure, while
<caption> should have the onscreen title. Accurate table mark-up helps users of screen readers. Learn more about summary and caption. |
nicht anwendbar
|
|
|
All heading elements contain content.
A heading with no content or inaccessible text prevent screen reader users from accessing information on the page's structure. Learn more about headings.
|
nicht anwendbar
|
|
|
Uses ARIA roles only on compatible elements
Many HTML elements can only be assigned certain ARIA roles. Using ARIA roles where they are not allowed can interfere with the accessibility of the web page. Learn more about ARIA roles.
|
nicht anwendbar
|
|
|
Image elements do not have `[alt]` attributes that are redundant text.
Informative elements should aim for short, descriptive alternative text. Alternative text that is exactly the same as the text adjacent to the link or image is potentially confusing for screen reader users, because the text will be read twice. Learn more about the
alt attribute. |
nicht anwendbar
|
|
|
Identical links have the same purpose.
Links with the same destination should have the same description, to help users understand the link's purpose and decide whether to follow it. Learn more about identical links.
|
nicht anwendbar
|
|
|
Elements with visible text labels do not have matching accessible names.
Visible text labels that do not match the accessible name can result in a confusing experience for screen reader users. Learn more about accessible names.
Warum bei kandlen-it.de: Die Würfel-Bausteine-Buttons (Design, Inhalt, SEO, Recht, Ladezeit, …) haben aria-label wie „1 · Design (Sichtbar)", der sichtbare Buttontext lautet aber nur „1 Design" — der sichtbare Text ist kein Teilstring des aria-label. Screenreader- und Spracheingabe-Nutzer können den Button dadurch nicht zuverlässig referenzieren.
Wie lösen: aria-label so umbauen, dass der sichtbare Text darin vorkommt (z. B. „Design – Sichtbar" statt „1 · Design (Sichtbar)"), oder ganz auf aria-label verzichten und den sichtbaren Text allein sprechen lassen.
|
nicht bestanden
|
|
|
Tables use `<caption>` instead of cells with the `[colspan]` attribute to indicate a caption.
Screen readers have features to make navigating tables easier. Ensuring that tables use the actual caption element instead of cells with the
[colspan] attribute may improve the experience for screen reader users. Learn more about captions. |
nicht anwendbar
|
|
|
`<td>` elements in a large `<table>` have one or more table headers.
Screen readers have features to make navigating tables easier. Ensuring that
<td> elements in a large table (3 or more cells in width and height) have an associated table header may improve the experience for screen reader users. Learn more about table headers. |
nicht anwendbar
|
Best Practices — 21 Audits
|
Uses HTTPS
All 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 about HTTPS.
|
bestanden
|
|
|
Redirects HTTP traffic to HTTPS
Make sure that you redirect all HTTP traffic to HTTPS in order to enable secure web features for all your users. Learn more.
|
nicht anwendbar
|
|
|
Avoids requesting the geolocation permission on page load
Users are mistrustful of or confused by sites that request their location without context. Consider tying the request to a user action instead. Learn more about the geolocation permission. Also consider using the
<geolocation> element. |
bestanden
|
|
|
Avoids requesting the notification permission on page load
Users are mistrustful of or confused by sites that request to send notifications without context. Consider tying the request to user gestures instead. Learn more about responsibly getting permission for notifications.
|
bestanden
|
|
|
Ensure CSP is effective against XSS attacks
A strong Content Security Policy (CSP) significantly reduces the risk of cross-site scripting (XSS) attacks. Learn how to use a CSP to prevent XSS
|
informativ
|
|
|
Use a strong HSTS policy
Deployment of the HSTS header significantly reduces the risk of downgrading HTTP connections and eavesdropping attacks. A rollout in stages, starting with a low max-age is recommended. Learn more about using a strong HSTS policy.
|
informativ
|
|
|
Ensure proper origin isolation with COOP
The Cross-Origin-Opener-Policy (COOP) can be used to isolate the top-level window from other documents such as pop-ups. Learn more about deploying the COOP header.
|
informativ
|
|
|
Mitigate clickjacking with XFO or CSP
The
X-Frame-Options (XFO) header or the frame-ancestors directive in the Content-Security-Policy (CSP) header control where a page can be embedded. These can mitigate clickjacking attacks by blocking some or all sites from embedding the page. Learn more about mitigating clickjacking. |
nicht anwendbar
|
|
|
Mitigate DOM-based XSS with Trusted Types
The
require-trusted-types-for directive in the Content-Security-Policy (CSP) header instructs user agents to control the data passed to DOM XSS sink functions. Learn more about mitigating DOM-based XSS with Trusted Types. |
informativ
|
|
|
Allows users to paste into input fields
Preventing input pasting is a bad practice for the UX, and weakens security by blocking password managers.Learn more about user-friendly input fields.
|
bestanden
|
|
|
Displays images with correct aspect ratio
Image display dimensions should match natural aspect ratio. Learn more about image aspect ratio.
|
bestanden
|
|
|
Serves images with appropriate resolution
Image natural dimensions should be proportional to the display size and the pixel ratio to maximize image clarity. Learn how to provide responsive images.
|
bestanden
|
|
|
Page has the HTML doctype
Specifying a doctype prevents the browser from switching to quirks-mode. Learn more about the doctype declaration.
|
bestanden
|
|
|
Properly defines charset
A 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 about declaring the character encoding. |
bestanden
|
|
|
Baseline Features
Lists web features used on the page and their Baseline status as of 2026-07-15. Learn more about Baseline.
|
informativ
|
|
|
Detected JavaScript libraries
All front-end JavaScript libraries detected on the page. Learn more about this JavaScript library detection diagnostic audit.
|
informativ
|
|
|
Avoids deprecated APIs
Deprecated APIs will eventually be removed from the browser. Learn more about deprecated APIs.
|
bestanden
|
|
|
Avoids third-party cookies
Third-party cookies may be blocked in some contexts. Learn more about preparing for third-party cookie restrictions.
|
bestanden
|
|
|
No browser errors logged to the console
Errors logged to the console indicate unresolved problems. They can come from network request failures and other browser concerns. Learn more about this errors in console diagnostic audit
|
bestanden
|
|
|
Page has valid source maps
Source maps translate minified code to the original source code. This helps developers debug in production. In addition, Lighthouse is able to provide further insights. Consider deploying source maps to take advantage of these benefits. Learn more about source maps.
|
bestanden
|
|
|
No issues in the `Issues` panel in Chrome Devtools
Issues 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. |
bestanden
|
SEO — 11 Audits
|
Page isn’t blocked from indexing
Search engines are unable to include your pages in search results if they don't have permission to crawl them. Learn more about crawler directives.
|
bestanden
|
|
|
Document has a `<title>` element
The 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 about document titles.
|
bestanden
|
|
|
Document has a meta description
Meta descriptions may be included in search results to concisely summarize page content. Learn more about the meta description.
|
bestanden
|
|
|
Page has successful HTTP status code
Pages with unsuccessful HTTP status codes may not be indexed properly. Learn more about HTTP status codes.
|
bestanden
|
|
|
Links have descriptive text
Descriptive link text helps search engines understand your content. Learn how to make links more accessible.
|
bestanden
|
|
|
Links are crawlable
Search 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 how to make links crawlable |
bestanden
|
|
|
robots.txt is valid
If 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 about robots.txt.
|
bestanden
|
|
|
Image elements have `[alt]` attributes
Informative elements should aim for short, descriptive alternate text. Decorative elements can be ignored with an empty alt attribute. Learn more about the
alt attribute. |
bestanden
|
|
|
Document has a valid `hreflang`
hreflang links tell search engines what version of a page they should list in search results for a given language or region. Learn more about
hreflang. |
bestanden
|
|
|
Document has a valid `rel=canonical`
Canonical links suggest which URL to show in search results. Learn more about canonical links.
|
bestanden
|
|
|
Structured data is valid
Run the Structured Data Testing Tool to validate structured data. Learn more about Structured Data.
|
manuelle Prüfung nötig
|
Doku — wie das technisch läuft
Der Lauf nutzt engine/modules/pagespeed.py aus dem web-audit-Tool
(/var/www/audit.kandlen-it.dev/engine/) und ruft die Google-PageSpeed-Insights-API
(pagespeedonline/v5/runPagespeed) für die Kategorien Performance,
Accessibility, Best-Practices und SEO auf.
Diese Seite zeigt eine gespeicherte Momentaufnahme
(data/kandlen-lighthouse.json), keinen Live-Aufruf bei jedem
Seitenbesuch — das schont das API-Kontingent. Neu erzeugen:
cd /var/www/audit.kandlen-it.dev/engine
python3 -c "
import json, modules.pagespeed as ps
out = {s: ps.run('https://kandlen-it.de', s) for s in ['mobile','desktop']}
json.dump(out, open('/var/www/lighthouse.kandlen-it.dev/data/kandlen-lighthouse.json','w'))
"