Sicherstellen, dass die Hauptfunktion Ihrer Website immer verfügbar, zugänglich, sicher, nutzbar, auffindbar und schnell ist
Auf dieser Seite finden Sie Hinweise dazu, wie Sie dafür sorgen, dass Ihre Website jederzeit für alle verfügbar, zugänglich, sicher und nutzbar ist.
Die Informationen auf dieser Seite stammen von funktionsübergreifenden Teams bei Google, die sich kurzfristig auf den Support von Websites konzentrieren, die Nutzern helfen, während der Coronakrise sicher zu bleiben. Diese Google-Mitarbeiter haben festgestellt, dass die Nachfrage nach wichtigen Informationen auf Websites noch nie so stark angestiegen ist. Viele von ihnen haben das Internet bisher selten oder noch nie genutzt. Es kann eine Herausforderung sein, dafür zu sorgen, dass Websites während dieser Zeit verfügbar und für alle zugänglich sind.
Anleitung
Verfügbarkeit, Zuverlässigkeit, Robustheit und Stabilität
Wenn auf Ihrer Website Traffic-Spitzen auftreten und sie ausfällt oder Sie einen Fehler verhindern möchten, können Sie mithilfe der folgenden Anleitung Probleme schnell beheben oder erkennen, bevor sie zu schwerwiegenden Problemen werden.
- Unter Überlastete Server beheben erfahren Sie, wie Sie Probleme mit Trafficspitzen erkennen, minimieren und verhindern können.
- Entfernen Sie unnötige Bilder, Videos, Skripts und Schriftarten. Achten Sie darauf, dass Ihre Seiten genau die Funktionen bieten, die Nutzer Ihrer Website wirklich benötigen.
- Durch das Optimieren von Bildern kann die Nutzung der Serverbandbreite erheblich reduziert werden, da Bilder die Hauptquelle für Bloß im Web sind.
- Möglichst viele statische Inhalte auf CDNs auslagern Weitere Details von gängigen Anbietern: AWS, Azure, Cloudflare, Google Cloud, Firebase.
- Prüfen Sie, ob Ihr CDN Optimierungen aufweist, die sich einfach aktivieren lassen, z. B. die dynamische Bildkomprimierung, Textkomprimierung oder die automatische Komprimierung von JS- und CSS-Ressourcen.
- Durch die Optimierung des HTTP-Cachings kann die Nachfrage auf Ihren Servern mit minimaler Codeänderung erheblich reduziert werden. Einen Überblick erhalten Sie unter HTTP-Cache: Ihre erste Verteidigungslinie. Spezielle Empfehlungen finden Sie unter HTTP-Caching und Best Practices für Caching. Mit der Prüfung Statische Assets mit einer effizienten Cache-Richtlinie bereitstellen in Lighthouse können Sie Ressourcen schnell erkennen, die nicht im Cache gespeichert werden. Denken Sie daran, dass verschiedene Arten von Ressourcen unterschiedliche Anforderungen an die Aktualität haben und daher unterschiedliche Caching-Strategien erfordern.
- Service Worker sind eine weitere Möglichkeit, die Nachfrage auf Ihren Servern erheblich zu reduzieren, erfordern jedoch möglicherweise erhebliche technische Investitionen. Außerdem kann Ihre Website damit offline genutzt werden. So können Sie wiederkehrenden Nutzern ohne Internetverbindung Öffnungszeiten, Telefonnummern und andere Informationen präsentieren. Workbox ist der empfohlene Ansatz zum Hinzufügen von Service Workern zu Websites, da dieser viele Boilerplate-Standards automatisiert, die Umsetzung von Best Practices erleichtert und kleinere Fehler verhindert, die häufig auftreten, wenn die Low-Level-
ServiceWorker
API direkt verwendet wird. - Wenn Ihre Website stark ausgelastet wird, prüfen Sie, ob Sie ausreichenden Schutz vor DDoS-Angriffen haben, da Ihre Website jetzt ein attraktiveres Ziel ist. Weitere Details von gängigen Anbietern: AWS, Azure, Cloudflare, Google Cloud.
Weitere Informationen finden Sie unter Netzwerkzuverlässigkeit.
Barrierefreiheit
Der Fokus auf Barrierefreiheit ist wichtiger denn je, da wahrscheinlich mehr Menschen mit ganz unterschiedlichen Bedürfnissen auf Ihre Website zugreifen. Beachten Sie die folgenden Richtlinien, damit die Hauptfunktionen Ihrer Website für alle zugänglich sind.
- Barrierefreiheit ist eine Teamleistung, an der jeder eine Rolle spielt. Sehen Sie sich zuerst den Leitfaden Barrierefreiheit im Internet von Google und den Teamleitfaden des U.S. Digital Service an. In diesen Leitfäden wird erläutert, was jedes Teammitglied (Produktmanager, Entwickler, Designer, QA usw.) beitragen kann.
- Führen Sie eine Überprüfung der Barrierefreiheit durch, um festzustellen, was gut funktioniert und was verbessert werden muss. Mit den WAVE-Browsererweiterungen können Sie die Barrierefreiheit Ihrer Website manuell prüfen.
- In den Leitfäden zur Barrierefreiheit finden Sie Informationen zu bestimmten Themen wie Tastaturnavigation und Screenreader-Unterstützung.
- Führen Sie eine Lighthouse-Prüfung durch, um häufige Probleme bezüglich der Zugänglichkeit zu erkennen. Der Bericht enthält auch eine Liste manueller Prüfungen, mit denen du die Funktionsfähigkeit deiner Website verbessern kannst. Ein Barrierefreiheitswert von 100 ist keine Garantie dafür, dass Ihre Website barrierefrei ist. Es gibt viele wichtige Probleme, auf die Lighthouse nicht automatisch prüfen kann. Daher ist eine manuelle Überprüfung wichtig. Weitere automatisierte Auditing-Tools sind die WAVE API und die AXE-Erweiterung.
- Absolvieren Sie den Kurs Jetzt loslegen und barrierefreie Webanwendungen auf egghead.io erstellen oder sehen Sie sich den Kurs zur Barrierefreiheit im Web auf Udacity an.
- In der Playlist A11ycast findest du weitere Tipps zu bestimmten Themen der Barrierefreiheit im Internet.
Identität, Sicherheit und Datenschutz
Es kann verlockend sein, wichtige Fehlerbehebungen per Abkürzung zu knacken. Achten Sie aber immer darauf, dabei keine Sicherheitslücken zu schaffen. Nutzer müssen auf Inhalte zu Themen zugreifen, die extrem privat sind. Diese sensiblen Nutzerdaten müssen auf Websites um jeden Preis geschützt werden und die Nutzer müssen davon überzeugt werden, dass ihre personenidentifizierbaren Informationen sicher sind.
- Warum sollten alle Websites mit HTTPS geschützt werden und nicht nur Websites, die vertrauliche personenidentifizierbare Informationen verarbeiten.
- Wechseln Sie zu einem Hostanbieter, der standardmäßig HTTPS verwendet, oder nutzen Sie Let's Encrypt oder ähnliche Dienste, um HTTPS auf Ihren Servern zu aktivieren.
- In der Erläuterung zu SameSite-Cookies erfährst du, wie du die Verwendung von Cookies sicherer machen kannst. Beachten Sie, dass die Erzwingung des SameSite-Labelings für Cookies vorübergehend zurückgesetzt wurde.
Weitere Informationen finden Sie unter Sicherheit und Datenschutz.
Usability, UI und UX
Immer mehr Menschen nutzen das Internet, um ihre Grundbedürfnisse zu erfüllen. Viele von ihnen nutzen das Web nur selten. Es lohnt sich, die Hauptfunktionen deiner Website zu prüfen und dafür zu sorgen, dass sie so einfach und benutzerfreundlich wie möglich sind.
- Sie können oben auf Ihrer Website ein auffälliges Banner (das mit einer X-Schaltfläche entfernt werden kann) entfernen, auf dem Aktualisierungen der Dienste klar erkennbar sind. Verwenden Sie einen Call-to-Action im Banner, um Nutzer zu spezifischeren Ressourcen weiterzuleiten. Verwenden Sie verschiedene Farben und Schriftarten, die sich vom Rest des Seiteninhalts abheben. Halten Sie Ihre Texte empathisch, konzentrieren Sie sich auf die Bedürfnisse der Menschen und klar, welche Art von Dienstleistungen Sie erwarten können.
- Suchen Sie nach Möglichkeiten, physische Interaktionen in Ihren kritischen User Journeys (kritischen User Journeys, CUJs) zu minimieren, und schlagen Sie diese Änderungen Ihrem Produktteam vor. Wenn Ihr Lieferservice beispielsweise in der Regel eine Unterschrift erfordert, sollten Sie prüfen, ob es eine Möglichkeit gibt, dies zu umgehen.
- Prüfen Sie noch einmal, ob Ihre CUJs so einfach und intuitiv wie möglich sind, und schlagen Sie Ihrem Produktteam Änderungen vor, wenn Sie Verbesserungsmöglichkeiten sehen.
- Sehen Sie sich die Prinzipien eines guten mobilen Designs an und testen Sie Ihre CUJs auf verschiedenen Mobilgeräten, um sicherzustellen, dass es keine glorreichen Probleme gibt. Die Menschen, die nur selten das Internet nutzen und plötzlich feststellen, dass sie sich vermehrt auf das Internet verlassen müssen, greifen wahrscheinlich über Mobilgeräte auf Ihre Website zu.
- Refaktorieren Sie Ihre Website nach Möglichkeit so, dass sie Muster für responsives Design verwendet.
- Achten Sie darauf, dass Ihre Formulare effizient und gut gestaltet sind.
SEO
Die Menschen suchen nach wichtigen gesundheitsbezogenen und berufsbezogenen Informationen. Deine Websites müssen von allen Suchmaschinen gefunden werden können. Die Lighthouse-SEO-Prüfungen können Ihnen helfen, grundlegende Probleme zu erkennen. Aktuelle Informationen und Informationen finden Sie in den offiziellen Suchmaschinenblogs: Google, Bing, Baidu, DuckDuckGo und Yandex. Aktuelle Beiträge zu COVID-19:
- Onlineaktivitäten ändern und gleichzeitig die Auswirkungen auf die Präsenz in der Google Suche minimieren
- Neue Properties für virtuelle, verschobene und abgesagte Veranstaltungen
- Bing verwendet das schema.org-Markup für besondere Ankündigungen zu COVID-19
- Den COVID-19-Ankündigungen strukturierte Daten hinzufügen
- Wir helfen Organisationen im Gesundheitswesen dabei, Informationen zu COVID-19 zugänglicher zu machen
- Allgemeine Best Practices für die Suche nach Websites des Gesundheitswesens und Behörden
Weitere Informationen findest du unter Sichtbar.
Leistung
Einige Internetanbieter (zum Beispiel in Indien) verzeichnen einen starken Anstieg der Internetnutzung zu Hause und haben nicht die nötige Infrastruktur, um der gestiegenen Nachfrage gerecht zu werden. In solchen Fällen kann die Geschwindigkeit Ihrer Website ohne Ihr Verschulden geringer ausfallen. Die Optimierung der Lastleistung könnte eine Möglichkeit sein, den Gegenwind einer reduzierten Bandbreite auszugleichen. Mit anderen Worten: Sie können die Auswirkungen der reduzierten Bandbreite auf die Leistung ausgleichen, indem Sie die Anzahl der Byte reduzieren, die zum Laden Ihrer Seiten über das Netzwerk gesendet werden müssen.
- Bilder sind die Hauptursache für Blähungen im Web. Durch Optimierung Ihrer Bilder können Sie die Bandbreitennutzung Ihrer Website erheblich reduzieren. Squoosh ist ein einfaches Open-Source-Tool zur Bildkomprimierung, mit dem sich Bilder schnell komprimieren lassen.
- Führen Sie WebPageTest oder Lighthouse aus, um die besten Möglichkeiten zur Leistungssteigerung zu ermitteln.
- Aktivieren Sie die Textkomprimierung, um die Netzwerkgröße von Textressourcen zu reduzieren. Dies ist oft ein einfacher Leistungsgewinn, der nur einen geringen technischen Aufwand erfordert.
- Unter Funktionsübergreifende Korrektur der Websitegeschwindigkeit erfahren Sie, wie Sie mit anderen Abteilungen zusammenarbeiten und die Zustimmung von anderen Abteilungen erhalten können.
- Verwenden Sie standardisiertes Lazy Loading für Bilder, um Anfragen für Bilder zu minimieren, die Nutzer möglicherweise nie sehen. Die Browserkompatibilität beträgt nicht 100 %, aber die Funktion kann als progressive Verbesserung behandelt werden. Wenn ein bestimmter Browser also kein standardisiertes Lazy Loading unterstützt, sollte das Bild wie gewohnt geladen werden.
- Prüfen Sie, ob Ihre Website A/B-Test- oder Personalisierungsskripts enthält, die asynchron geladen werden können, oder ob die Skripts nicht kritische Funktionen enthalten, die deaktiviert werden können. Skripts für A/B-Tests und Personalisierung können in der Regel nicht vollständig asynchron geladen werden, da sie vor dem Laden des Seiteninhalts ausgeführt werden müssen. Es besteht jedoch die Möglichkeit, Teile der Skripts asynchron zu laden. Unter Kritischer Rendering-Pfad wird der grundlegende Kompromiss zwischen synchronen Skripts (auch als Rendering-blockierende Skripts bezeichnet) im Allgemeinen und der Seitenladezeit erläutert. Entscheiden Sie dann, ob Sie die Skripts, die das Rendering blockieren, der Seitenladezeit priorisieren sollen oder umgekehrt.
- Bei den meisten Websites macht Drittanbietercode etwa die Hälfte aller Anfragen aus. Sie können Drittanbietercode, der für die Ausführung Ihrer Website nicht unbedingt erforderlich ist, optimizing oder vorübergehend entfernen oder deaktivieren.
- Wenn die Priorität von Funktionsreleases herabgestuft wird, ist dies möglicherweise der perfekte Zeitpunkt für eine Bereinigung. Entfernen Sie Tags aus den Tag-Managern, bereinigen Sie aufgeblähtes CSS und JavaScript und entfernen Sie eingestellte Funktionen oder Code nicht mehr. Auf dem Tab Abdeckung in den Chrome-Entwicklertools und der Klasse
Coverage
in Puppeteer können Sie nicht verwendeten Code erkennen.
Weitere Informationen finden Sie unter Schnelle Ladezeiten.
Hero-Image von NASA auf Unsplash