JavaScript

JavaScript

Es handelt sich hierbei um eine Programmiersprache, die besonders häufig zur Aufwertung und funktionalen Erweiterung von Webseiten eingesetzt wird. Beispielsweise beim Öffnen von Eingabemasken zur Dateneingabe bei Anmeldungen zu Internetdiensten werden im Hintergrund von JavaScript-Programmen die Daten auf Konsistenz geprüft und gegebenenfalls entsprechende Fehlermeldungen ausgegeben, wenn eine Eingabe nicht das erwartete Format hat (Konto- oder Visakartennummer, Bankleitzahl, Geburtsdatum, E-Mail-Adresse usw.).

JavaScript-Einbindung in den HTML-Code

Zur Integration von JavaScript-Code in den HTML-Code einer Webseite stehen mehrere Möglichkeiten zur Verfügung.

  • Die „Inline-Variante“ erkennt man an den eröffnenden und beendenden Tags [script] und [/script].
  • Aufruf einer externen Datei, die den JavaScipt-Code enthält.
  • Als Parameter eines HTML-Tags.
  • Als HTML-Link, der im Code in Erscheinung tritt.

Bei jeder Form der Einbindung in den HTML-Code sollte das JavaScript unbedingt fehlerfrei programmiert sein, um Bugs auf der Webseite zu vermeiden. Letztere haben einen sehr negativen Einfluss auf die Suchmaschinenoptimierung.

Document Object Model (DOM)

Dieses allgemeine Modell für Objekte ist heute ein Standard, den eine Skriptsprache wie JavaScript unbedingt umsetzen können sollte. Das ist eine (verbindliche) Empfehlung des „World Wide Web Consortiums“ (W3C).
[Das W3C wurde in Cambridge am 01.10.1994 am MIT Laboratory for Computer Science gegründet. Dieses Unternehmen ist ein Gremium zur Standardisierung von Techniken im WWW.]

Anwendungsbeispiele

  • Wie bereits oben erwähnt, können mit JavaScript die Eingaben in Formulare überprüft werden.
  • Programm zum Zählen der Besucher einer Webseite
  • Einblenden eines Kalenders in Abhängigkeit von der Position des Mauszeigers
  • Bereitstellung eines Taschenrechners
  • Bereitstellung einer kyrillischen Tastatur
  • Der virtuelle Warenkorb im Webshop
  • Pop-up Fenster zur Werbeeinblendung (ein für die Nutzer eher lästiges Unterfangen, das sich für das beworbene Produkt sogar kontraproduktiv auswirken kann.)
  • Mit JavaScript lässt sich durch Blockade der rechten Maustaste verhindern, dass Texte und Bilder kopiert werden können, auch der Quelltext der Seite kann so „versteckt“ werden.

Eine Erweiterung von JavaScript ist CommonJS. Damit werden auch Programmierschnittstellen zur Implementierung weiterer Anwendungen wie Webservices, Datenbanken oder Desktop-Anwendungen ermöglicht.

Die Deaktivierung von JavaScipt hat Folgen

Mithilfe des „NoScript-AddOns“ kann der Browser so eingestellt werden, dass die Ausführung von JavaScript deaktiviert wird. Das war nur eine folgerichtige Entwicklung des Übermaßes an Werbeeinstreuungen. Im Übrigen machen zu viele gleichzeitige Elemente mit JavaScript-Anwendungen eine Webseite in ihrem Aufbau sehr langsam. Die Deaktivierung von JavaScript kann aber zu erheblichen Einschränkungen der Barrierefreiheit auf einer Seite führen. Darüber hinaus kann auch die Navigationsfähigkeit behindert werden.

Mehr Sicherheit durch das Sandbox-Prinzip

Um die Nutzer vor einem Missbrauch durch JavaSkript zu schützen, ist das Sandbox-Prinzip entwickelt worden. So stellt die „Sandbox“ eine Art Käfig dar, damit (perfide) JavaScript-Anwendungen nicht bis auf die Festplatte des Nutzers vordringen können, um dort beispielsweise lokale Dateien zu löschen oder zu überschreiben. (Im Prinzip wäre das alles möglich.)

Einfluss auf die Suchmaschinenoptimierung

Suchmaschinen lassen den Code-Bereich von JavaScript grundsätzlich außer Acht. Die auf der Grundlage von JavaScript möglichen Interaktionen des Nutzers können durch einen „Crawler“ nicht ausgewertet werden (ein Crawler ist ein Programm zur Webseiten-Analyse). Für einen Crawler erscheint die Webseite so, als wäre die JavaScript-Funktion deaktiviert. Alle Seiten (Links), die nur via JavaScript-Applikationen erreichbar sind, sind für einen Crawler tabu. Dies gilt auch für reine Texte, die natürlich auch mit JavaScript auf den Bildschirm gebracht werden können.

Performance und Dateigrößen

Bei mehreren umfangreicheren Elementen zur Interaktion mit dem Nutzer, die als JavaScript-Code hinter die Quellcodes der Seiten gesetzt werden, ergibt sich jeweils eine beachtliche Vergrößerung der einzelnen Dateien. Das erhöht dann den Aufwand der Suchmaschine beim Crawling immens. In der Folge können die Ladezeiten gerade bei langsamen Internetanschlüssen (Smartphones) für den Nutzer ziemlich unerträglich werden.

Es ist daher besser, den Code extern in eine Javascript-Datei auszulagern, um die Datei am Ende des Quellcodes dann zu integrieren. Die externe Datei kann man mit dem ersten Seitenaufruf im Cache des Browsers unterbringen, sodass sie nur einmal geladen werden muss. Im Ergebnis erzielt man einen deutlichen Performance-Gewinn bei wiederholten Aufrufen der Seite und die Suchmaschinen werden bei schlankerem Quellcode aller Unterseiten weniger stark beansprucht. Die Crawler können sich so besser auf die Inhalte der Webseiten „konzentrieren“, was sie mit einem „Bonus“ beim Ranking honorieren.

Conversion Optimierung

In der Konsequenz werden oftmals die JavaScript-Programme der verschiedenen Unterseiten in mehrere externe Dateien ausgelagert. Logischerweise führt das dann dazu, dass viele externe JavaScript-Dateien im Zuge des Ladevorgangs angefordert werden müssen. Das wirkt sich dann ganz negativ auf die sogenannten Renderzeiten aus, weil jeder Browser hinsichtlich der parallel ablaufenden Downloads begrenzt ist. Bei langsamer Internetverbindung und zu vielen gleichzeitig abgeforderten Dateien kommt es zu extrem langen Ladezeiten, die der Nutzer als schlechte „User Experience“ bewertet, die wiederum eine negative Auswirkung auf die „Conversion-Rate“ hat.

Wir weisen an dieser Stelle nochmals darauf hin, dass die Platzierung der externen JavaScript-Dateien als Schlusslicht des Quellcodes sowohl die Conversion als auch die Performance der Webseite ganz wesentlich verbessert. Das liegt mit daran, dass der Browser das Rendering der Webseite zunächst dort stoppt, wo eine externe Datei verlinkt ist, um diese eben erst einmal zu laden. Nun kann sich diese JavaScript-Datei auf einem externen Server befinden, der recht langsam antwortet. In solchen Fällen erscheint lange Zeit nur eine leere Seite.

Das Rendering wird dann wirklich beendet, wenn alle CSS-Dateien oder Scripts fertig geladen sind. Daher ist es so wichtig, alle Referenzen zu externen Dateien erst ans Ende des Quellcodes zu setzen. Auf diese Weise werden dem Nutzer die wesentlichen Inhalte und vor allem die Texte der HTML-Datein angezeigt. Ein langsamer externer Server wirkt sich dann nur dahin gehend aus, dass der Nutzer lediglich noch etwas auf den Zugriff auf die Interaktions-Möglichkeiten (JavaScript) warten muss.

Leave a Reply

Your email address will not be published.