Responsives und individuelles Frontend

Die Gestaltung von Webseiten zielt heute vor allem auf ein Ziel ab: Alle möglichen Geräte abzudecken. Ob der Besucher an einem Rechner mit 30-Zoll Bildschirm und einer flotten Internetverbindung über Glasfaser sitzt, an einem Tablet PC mit 10 Zoll über WLAN oder irgendwo im Wald an einem Smartphone mit 5 Zoll – die Webseite soll überall möglichst schnell geladen sein und gut aussehen. Dies kommt zwar der Quadratur des Kreises nahe, ist aber ein durchaus zu beherrschendes Unterfangen. 

Wenn man das Frontend für eine neue Webseite konzipiert und die Ausrichtung auf die Vielfalt der Endgeräte bedenkt, kommt man relativ schnell zu einer Lösung, bei der man die Elemente für eine Webseite entsprechend der Größe beim Bildschirm des Besuchers steuert. Im einfachen Fall kann man dies über das Style Sheet steuern.

Bootstrap als Standard

Mittlerweile hat sich jedoch das Bootstrap Framework als Standard bei der Gestaltung von Webseiten etabliert. Bootstrap bietet mit relativ geringem Aufwand die Möglichkeit, Elemente wie einen Header, eine Navigation, den Inhalt und den Fußbereich einer Webseite so zu gestalten, dass sich diese Elemente immer wie vom Webdesigner gewünscht anpassen. Auch Bilder können über das einfache Einfügen eines Styles stufenlos skaliert werden. 

Dies bietet den Vorteil, dass man die Webseite mit einem einfachen Gerüst an HTML-Elementen aufbauen kann. Zugleich reduziert diese Technik die Fehleranfälligkeit einer Webseite.

Navigation als Herausforderung

Als Nachteil kann man dabei sehen, dass sich die gestalterischen Möglichkeiten einer Webseite durch Bootstrap verringert haben. Gab es in den ersten Jahren des Internet eine Navigation mit einem bis in die fünfte Ebene aufgeklappte Menü der Webseite, so findet sich diese heute meist im Kopfbereich der Webseite und deckt nun nur noch zwei Ebenen ab. Dies ist der Navigation bei mobilen Endgeräten geschuldet. Hier zeigt sich der Ehrgeiz des Webdesigners, dem Benutzer auch bei größeren Webseiten eine Navigation anzubieten, bei der diese nicht nur weitere Seiten findet, sondern auch noch weiß, wo er sich gerade befindet. 

Die Internetagentur Irma Berscheid-Kimeridze hat im Jahr 2017 mehrere Webseiten gestartet, die auf der Basis von TYPO3 mit Bootstrap gestaltet sind. Dazu zählt diese Seite, auf der Sie sich gerade befinden. 

AMP mit Wordpress: Mobil schneller mit Google
Thomas Berscheid ‣ 22.05.2019, 16:44:00
Accelerated Mobile Pages als Plugin für Wordpress macht Webseiten zu Georgisch Dolmetschen und Übersetzen mobil schneller
Relaunch mehrerer Webseiten mit TYPO3 9.5
Thomas Berscheid ‣ 07.05.2019, 12:39:00
Die TYPO3 Webseiten unserer Agentur laufen nun auf der Version LTS 9.5. Größter Aufwand war Übernahme der Arbeiten zum Thema SEO in die neuen Versionen.
Eigenes Wiki für unsere Agentur
Thomas Berscheid ‣ 25.09.2018, 10:44:00
Die Internetagentur Irma Berscheid-Kimeridze hat ein eigenes Wiki. Codeschnipsel für TypoScript, Templates, JavaScript, jQuery und CSS.
Freie SSL-Zertifikate für unsere Webseiten
Thomas Berscheid ‣ 24.09.2018, 11:59:00
Let's encrypt bietet freie Zertifikate. SSL-Zertifikate auf Webserver installieren. Einbindung im Dauerauftrag.
Zukunft mit unseren Extensions für neue TYPO3 Version 9
Thomas Berscheid ‣ 19.09.2018, 11:09:00
Extensions auf neuesten Stand gebracht: Datenbank nun mit Doctrine QueryBuilder angebunden.
^