CSS gibt jeder Website ihr Design. Ohne sie sind Websites sicher nicht sehr unterhaltsam und freundlich! Ich habe von jemandem gelesen, der eine Woche lang ohne JavaScript auskam und wie diese Erfahrung dazu führte, dass Websites schneller waren, obwohl bestimmte Aspekte davon nicht wie erwartet funktionierten.
Aber CSS. Das Deaktivieren von CSS beim Surfen im Web würde das Web nicht gerade weniger nutzbar machen ... oder? Oder würden, wie bei JavaScript, einige Funktionen nicht wie erwartet funktionieren? Aus Neugier beschloss ich, es auszuprobieren und dem HTML-Skelett das CSS-Fleisch abzureißen, während ich ein paar Seiten durchsuchte.
Warum, fragst du dich vielleicht? Gibt es nicht-masochistische Gründe, CSS zu deaktivieren? Heydon Pickering hat einmal getwittert, dass das Deaktivieren von CSS eine gute Möglichkeit ist, einige Zugänglichkeitsstandards zu überprüfen
- Häufige Elemente wie Überschriften, Listen und Formularsteuerelemente sind semantisch und sehen immer noch gut aus.
- Eine visuelle Hierarchie wird immer noch mit Standardstilen etabliert.
- Der Inhalt kann immer noch in logischer Reihenfolge gelesen werden.
- Bilder existieren immer noch als `<img>`-Tags, anstatt als CSS-Hintergründe verloren zu gehen.
Eine WebAIM-Umfrage aus dem Jahr 2018 berichtete, dass 12,5 % der Benutzer, die auf irgendeine Art von assistierender Technologie angewiesen sind, mit benutzerdefinierten Stylesheets im Web surfen, was auch das Entfernen jeder CSS-Deklaration auf einer Website beinhalten kann. Und wenn wir über langsame Internetverbindungen sprechen, könnte das Weglassen von CSS eine Möglichkeit sein, Inhalte schneller zu konsumieren. Es besteht auch die Möglichkeit, dass CSS aus Gründen deaktiviert wird, die außerhalb unserer unmittelbaren Kontrolle liegen, z. B. wenn ein Server Aussetzer hat oder Assets nicht geladen werden können.
Als Experiment habe ich fünf Websites und eine Web-App ohne CSS verwendet, und dieser Beitrag wird meine Erfahrungen behandeln. Es entwickelte sich zu einem eher aufschlussreichen Abenteuer für mich persönlich, hat mich aber auch als Entwickler auf professionelle Weise informiert, auf eine Weise, die Sie hoffentlich auch sehen werden.
Aber zuerst, so deaktivierst du CSS
Du bist absolut willkommen, stellvertretend durch mich in Form dieses Beitrags zu leben. Aber für diejenigen unter euch, die sich der Aufgabe gewachsen fühlen und das web ohne Stil erleben möchten, hier ist, wie du CSS in verschiedenen Browsern deaktivieren kannst
- Chrome: Es gibt tatsächlich keine Einstellung in Chrome, um CSS zu deaktivieren. Wir müssen also auf eine Erweiterung zurückgreifen, wie z. B. disable-HTML.
- Firefox: Ansicht > Seitenstil > Kein Stil
- Safari: Safari > Einstellungen... > Entwicklermenü in der Menüleiste anzeigen. Gehe dann zum Dropdown-Menü Entwickler und wähle die Option „Stile deaktivieren“.
- Opera: Wie bei Chrome benötigen wir eine Erweiterung, und Web Developer passt dazu.
- Internet Explorer 11: Ansicht > Stil > Kein Stil
Ich konnte keinen dokumentierten Weg finden, CSS in Edge zu deaktivieren, aber wir können CSS programmgesteuert über die CSS Object Model API in der DevTools-Konsole aus ihm und jedem anderen Browser entfernen
var d = document;
for (var s in S = d.styleSheets)
S[s].disabled = true;
for (var i in I = d.querySelectorAll("[style]"))
I[i].style = "";Die erste Schleife deaktiviert alle externen und internen Stile (in `` und `