Kaum zu glauben, aber das mobile Internet, das heutzutage fast jeder Smartphone- oder Tablet-User nutzt, ist der wahre Grund, warum sich die Homepage-Programmierung grundlegend verändern musste. Heute sind „Mobile First“ oder auch „Responsive Webdesign“ Standards geworden, die bei der Erstellung einer Internetseite nicht mehr fehlen dürfen. Doch wird zuerst Mobile First oder eine andere Variante gewählt, wenn man eine Homepage programmieren möchte? Gibt es Unterschiede oder Gründe, sich zuerst für Mobile First zu entscheiden oder spielt der Ablauf de facto gar keine Rolle?

Zuerst der Text, dann das Design – oder umgekehrt?

Handelt es sich um „Progressive Enhancement“, ist der Inhalt der Seite im Vordergrund. Das bedeutet, dass die Darstellung der Internetseite, die Anpassung für unterschiedliche Displaygrößen und auch die Browserkompatibilität erst im weiteren Verlauf von Bedeutung sind und somit erst später Berücksichtigung finden. Progressive Enhancement kümmert sich also zuerst um den Text, dann um das Aussehen. Zu Beginn sammelt der Programmierer die Inhalte, baut eine Struktur auf und entwickelt erst im weiteren Verlauf die Website. Dabei sollte der Programmierer aber immer ein schwaches System im Kopf haben; ein Internet Explorer, der ohne JavaScript läuft, muss die Website ebenfalls darstellen können. Nur dann, wenn die Website für veraltete und schwache Systeme zur Verfügung stehen kann, kommt der Umbau, der dahingehend endet, dass die Website auch von leistungsstarken Browsern angezeigt werden kann. Dabei werden umfangreiche Layouts und komplexe Technologien verwendet, die primär für den leistungsstarken Browser zur Verfügung stehen.

Die automatische Anpassung

Dabei werden unterschiedliche „Feature Detections“ – Browser-Funktionen – abgefragt. Eine Version wird derart entwickelt, dass sie auf einem sehr schlechten System funktioniert, während ein weiteres Script – wie etwa der Modernizr – überprüft, ob andere Funktionen, wie JavaScript oder etwa CSS3-Eigenschaften, zur Verfügung stehen und somit vom Browser aktiv unterstützt werden. Ist dies der Fall, werden die neueren Technologien genutzt, sodass es zu einer automatischen Verbesserung der Website kommt. Diese spezielle Vorgehensweise ist mitunter auch ein Grund, warum es zu optischen Veränderungen kommen kann, je nachdem, welcher Browser verwendet wird. Es ist daher keinesfalls ratsam, für alle Websites dasselbe Layout zu gestalten; am Ende hängt es nämlich vom Browser ab, wie der Internetauftritt aussieht.

Das „Progressive Enhancement“-Fazit

Progressive Enhancement stellt die Inhalte in den Mittelpunkt; alle Informationen, die für den User von Interesse sein könnten, stehen auch zur Verfügung. Zudem werden „alte Browser“ nicht bestraft und „neue Browser“ nicht belohnt; ganz egal, für welches System sich der User entscheidet – er kann auf die Internetseite zugreifen. Die Internetseiten sind zudem problemlos erweiterbar. Jedoch ist bei derartigen Prozessen ein Umdenken erforderlich; des Weiteren sind viele Tests notwendig, um die Gewissheit zu erlangen, dass der Internetauftritt auch – wie gewünscht – dargestellt wird.

Mobile First und Progressive Enhancement

Wer sich mit Mobile First befasst, wird relativ schnell feststellen, dass es hier eine Spur komplexer wird. Denn der Internetauftritt wird nicht nur für schwache Systeme bereitgestellt, sondern auch für Geräte, die ein kleines Display haben. So startet der Programmierer mit einer „Smartphone-Version“. Mobile First bedeutet, dass zuerst eine Version für Mobilgerät entwickelt wird, wobei sich der Internetauftritt – je nach Display-Größe – steigert. Ein Umstand, der sich wunderbar mit Progressive Enhancement ergänzen lässt, wobei keine zwangsläufige Verbindung gegeben ist. So können aufwändige Mobile-Seiten erstellt werden, die auf älteren Mobilgeräten nicht funktionieren oder falsch angezeigt werden. Das entspricht zwar dem Mobile-First-Prinzip, jedoch nicht dem Progressive Enhancement. Natürlich spielt der Platz eine wesentliche Rolle. Auf mobilen Geräten ist im Regelfall weniger Platz als auf gewöhnlichen PC-Monitoren. Aus diesem Grund ist es wichtig, dass sich die Programmierer auf die wesentlichsten Punkte der Internetseite konzentrieren. So stellt sich die Frage, welche Informationen tatsächlich benötigt werden. In weiterer Folge muss der Programmierer die wesentlichsten Informationen derart darstellen, dass sie präzise präsentiert werden können.

Das Mobile First-Fazit

Mittels Mobile First können prägnante Inhalte dargestellt werden, wobei die optimale Darstellung auf Mobilgeräten zählt. Mobile First-Seiten können unkompliziert auf größere Displays erweitert werden; zudem stehen derartige Internetauftritte auch für moderne Systeme zur Verfügung. Mobile First ist jedoch äußerst schwierig in der technischen Umsetzung; aus heutiger Sicht muss zudem ein starkes Umdenken erfolgen, sodass am Ende eine gut strukturierte Seite gegeben ist. Trotzdem geht heutzutage kein Weg an mobile first vorbei, denn wer zuerst für Desktop-Geräte entwickelt und anschließend versucht, für Mobilgeräte zu optimieren, wird einen extrem hohen Arbeitsaufwand haben.

Das Fazit

Wer sich mit der Programmierung einer Website befasst, wird vorwiegend aus Sicht bestimmter Gerätekonfigurationen handeln. Viele Webdesigner arbeiten mit riesigen Monitoren und neuen Browsern. Aus diesen Gründen ist die Verlockung auch groß, Internetauftritte derart anzupassen, dass sie ausschließlich für große Displays und starke Systeme ausgerichtet sind. Jedoch muss der Programmierer eine Website erstellen, die für alte, neue, schwache und starke Systeme geeignet ist.

Der Beitrag wurde am Mittwoch, den 9. November 2016 um 18:32 Uhr veröffentlicht und wurde unter SEO & Online Marketing, Smartphones & Tablets abgelegt. du kannst die Kommentare zu diesen Eintrag durch den RSS 2.0 Feed verfolgen. du kannst einen Kommentar schreiben, oder einen Trackback auf deiner Seite einrichten.