Frontend: Warum wir an alle Auflösungen denken sollten

Frontend: Warum wir an alle Auflösungen denken sollten - Webseiten sehen auf Desktop-Rechnern heute mitunter sehr leer aus, wenn sie für mobile Endgeräte konzipiert sind. Dies erinnert an ein Zitat aus Raumschiff Enterprise.

Webseiten sehen auf Desktop-Rechnern heute mitunter sehr leer aus, wenn sie für mobile Endgeräte konzipiert sind. Dies erinnert an ein Zitat aus Raumschiff Enterprise.



Als Webentwickler ist man in der heutigen Zeit zwischen zwei Extremen hin- und hergerissen. Ich zumindest. Soll eine Webseite auf allen Endgeräten schön aussehen und funktionieren? Oder beschränkt man sich auf einen Typ von Endgeräten und lässt die anderen Versionen zweitrangig sein? Dies, so scheint mir, ist eine neue Grundsatzfrage.

Google hat ca. Ende 2014 bekannt gegeben, dass Webseiten für mobile Endgeräte bei Suchergebnissen bevorzugt dargestellt werden. Daraufhin haben offenbar viele Seitenbetreiber ihre Seiten umgestellt.

War es früher die Herausforderung für einen Frontend-Entwickler, Inhalte auf einem Desktop mit einer Auflösung von mindestens 1.280 Pixeln in der Breite auf einen Blick dazustellen, so ist heute eher das untereinander geschachtelte Design angesagt. Dies hat natürlich einen gewissen Charme: Man sucht Inhalte auf einer Seite nicht mehr in der gesamten Fläche, sondern hat die Blickrichtung gleich vertikal ausgerichtet.

Was mich dabei stört: Ich habe an meinem Entwicklungsrechner einen Bildschirm mit einer Auflösung von 1.920 Pixeln in der Breite. Auf dieser schönen großen Fläche sehe ich nun einen kleinen Text oder ein putziges Bild. Gefühlte 80% des Bildschirms vor mir sehen aus wie ein Fleisch gewordenes Zitat des Textes aus den Abenteuern von James Tiberius Kirk und dem in eine andere Welt aufgestiegenen Mr. Spock: Unendliche Weiten!

Ach, wie schön waren da doch die Jahre, als wir Spalten nebeneinander geschachtelt haben, Elemente miteinander verquickt, auf den Pixel genau Bilder und Texte koordiniert haben... Und nun: Es wird einfach alles untereinander geschachtelt.

Ich sehe den Vorteil: Mit Frameworks wie Bootstrap erreicht man schnell und sicher Designs, die auf jedes Endgerät passen. Das erspart einem Entwickler ziemlich viel Arbeit. Und trotzdem: Wenn ich schon die Möglichkeit habe, einen großen Bildschirm zu füllen, dann will ich diese auch ausnutzen. Also sollte man sich überlegen, welche Anordnung der Inhalte man dem Besucher zeigen will.

Für diese Seite hier hatte ich mir bei der Konzeption recht genau überlegt, wer was sehen soll. Die Grundsatzfrage Nr. 1 war schnell geklärt: Alle Besucher sollen alle Elemente sehen. Es sollten keine Bestandteile der Webseite bei kleineren Auflösungen weggeschaltet werden. Nr. 2 war dann die Bestimmung der Inhalte. Nr. 3 die Schachtelung. Ich habe dies so gelöst, dass einige Inhalte dieser Seite über das Style Sheet bei bestimmten Breiten zugewiesen bekommen, ob sie nebeneinander oder übereinander geschachtelt werden sollen. Und meinem Geschmack nach ist mir das gelungen.

 

Blog der Agentur IBK

Blog Agentur IBK: Webseiten mit  TYPO3 und  Wordpress. Tutorials zur Installation und Konfiguration von TYPO3. Anleitungen, Tipps und Erfahrungen zu Wordpress Themes und Wordpress Plugins. SEO für TYPO3 und weiteres Wissen zur Suchmaschinenoptimierung. Lesen Sie alle Beiträge in der Listenübersicht oder einzeln im Detail. Für ein Schlagwort oder eine Kategorie sehen Sie alle Treffer in der Liste.