Alle guten Dinge sind drei - muss nicht immer sein!

CSS only - warum JavaScript nicht unbedingt Bestandteil einer Website sein muss

Schlank muss er sein, sauber programmiert und frei von unnötigen Codeteilen - der Quelltext einer Webseite

Als Basis baut auf ihm die Logik, Struktur und das Aussehen einer Seite auf. Bis alle Funktionalitäten und das Design harmonisieren, besitzt der Code meist komplexe Zusammenhänge mit unterschiedlichen Programmiersprachen. SEO-Experten (Search Engine Optimizing) wissen, was das bedeutet. Ist der Code unsauber programmiert oder besitzt Bestandteile, die unnötigerweise noch Teil des Codes sind, obwohl man sie eventuell nicht einmal auf der Website sieht, dann folgt ein schlechtes Ranking durch die Suchmaschine. Viele mittelständische bis große Unternehmen haben deshalb fest angestellte SEO Experten, die sich konstant mit der Frage auseinandersetzen: Welche nächsten Schritte führen zu einer besseren Platzierung unserer Unternehmenswebsite und wie betreibe ich die effektivste Suchmaschinenoptimierung?

CSS, HTML, JavaScript - eine kurze Erklärung 

HTML ist die Kurzform für Hyper Text Markup Language. HTML basiert auf dem Datenformat XML und ist so gesehen nur der Rahmen, in dem alle Bestandteile einer Homepage liegen, die im Browser angezeigt werden. Dazu gehören die Struktur und Inhalte einer Seite. Überschriften, Bilder, die Navigation, sowie Interaktionselemente, wie Buttons, Links und Formulare sind Elemente, die in HTML festgelegt sind und zur Webseiten-Erstellung verwendet werden können. HTML selbst besitzt eine Syntax, die vom Browser erkannt wird. Dieser zeigt die Elemente anschließend richtig an. In Kombination mit JavaScript und CSS können so Webanwendungen, mobile Apps und vieles mehr erstellt werden. 

CSS ist die Abkürzung für Cascading Style Sheets und legt die Gestaltung und Formatierung einer Internet-Seite fest. Durch CSS wird das Aussehen von HTML-Dokumenten bestimmt, wie beispielsweise die Schriftart, Farben, Breite und Höhe. Dabei besitzen die Elemente eine eindeutige Bezeichnung, Selektoren, wie eine ID (Identifikation), eine Klasse oder einen Typen. Durch diese Bezeichnung kann das Element angesprochen werden. Die Elementselektoren besitzen dabei Übereinstimmungsregelungen, die sich aus verschiedenen Arten der Elementselektoren zusammensetzen. Dabei ist die Spezifität die Basis, auf der vom Browser entschieden wird, welche CSS-Eigenschaftswerte für ein Element am relevantesten sind. Dieses wird anschließend angewendet. Insofern ist die Spezifität eine Gewichtung, die einer bestimmten CSS-Deklaration gegeben wird. Wenn mehrere Deklarationen die gleiche Spezifität haben, dann wird die zuletzt gefundene Deklaration im CSS für das Element verwendet. Diese Spezifität wird nur benötigt, wenn das gleiche Element von unterschiedlichen Deklarationen angesprochen wird. Im CSS haben direkt ausgewählte Elemente immer Vorrang vor Elementen, die ihre Regeln von einem Überelement (Vorfahren) erben. Wird der Zusatz "!important" auf eine Deklaration angewendet, so hat diese immer Vorrang. 

JavaScript (JS) ist eine Programmiersprache, die vom Web-Browser interpretiert wird, Prozessoranweisungen übersetzt und anschließend auf dem Rechner des Nutzers ausgeführt werden. Dies ist auch der Grund, warum hierbei von einer clientseitigen Programmiersprache die Rede ist. Dabei hat JS Zugriff auf das HTML-Dokument, sowie das Browserfenster und führt Aufgaben aus. Im Detail bedeutet dies, dass ein Nutzer mit einem Element der Seite interagiert und JS auf genau diese Benutzereingabe reagiert. JS kann so Änderungen vornehmen, wie beispielsweise die Eingabe der E-Mail-Adresse in einem Formular. Diese Änderung findet im Arbeitsspeicher des Rechners statt und nicht direkt im Dokument des Web-Servers. So können durch JavaScript Funktionen Inhalte und auch die Darstellung eines Dokumentes geändert werden. 

 

All diese Auszeichnungssprachen sind notwendig, um eine Seite zu erstellen und die Interaktionen der Besucher möglichst benutzerfreundlich und einfach zu gestalten. Im Prinzip ist diese Ansatzweise richtig gedacht, denn viele Elemente einer Seite erfordern, wie beispielsweise eine globale Suche auf einer Seite, eine JavaScript Funktion für eine korrekte Anwendung. 

Aber warum dann "CSS only" und "no JavaScript"?

Immer wieder treten Anwendungsfälle auf, bei denen eine Umsetzung nicht unbedingt der Anwendung von JavaScript bedarf. Erfordert eine Interaktion des Nutzers mit einer Seite keine großen Änderung, wie beispielsweise die Veränderung des Aussehens eines Elementes oder die Überlagerung einer Textpassage mit einem anders aussehenden Text, dann kann dies leicht mit CSS umgesetzt werden. 

Dabei kann ein Element ausgeblendet und ein anders gestyltes Element an genau der gleichen Stelle wieder eingeblendet werden. Für den Nutzer entsteht eine scheinbar echte Interaktion mit der Homepage. Technisch gesehen wird jedoch nur eine Style-Änderung des Elementes vorgenommen. 

Warum ist die Vorgehensweise gut? 

Aus Sicht eines Entwicklers kann die Komplexität des Codes minimiert werden. In manchen Fällen kann die Zusammenstellung der drei Aspekte HTML, CSS und JavaScript im Optimalfall auf zwei reduziert werden. 

Aber auch aus Sicht der Suchmaschinenoptimierung bietet diese Vorgehensweise drei wesentliche Vorteile. Zum einen bedeutet die Komplexitätsreduktion kürzere Ladezeiten, zum anderen spielen ein schlanker und einfacher Code eine wichtige Rolle bei der Suchmaschinenoptimierung. Auch die Sicherheit des Codes wird somit erhöht.

Fazit

Welche Programmbasis eine Seite haben sollte, ist situationsabhängig. Jedoch lohnt sich ein genauerer Blick. Die Optimierung der eigenen Seite ist ein konstanter Prozess, der niemals endet.

Kontaktieren Sie uns
Gerne unterstützen wir Sie bei der Optimierung Ihrer Website
Nehmen Sie Kontakt mit uns auf
Schließen
Eine Case Study anfordern
Schließen