Responsive Webdesign aus Bielefeld

Das Thema Responsive Webdesign ist heutzutage in aller Munde. Es hat sich zum neuen Goldstandard für die Gestaltung von Internetseiten entwickelt. Durch die Einfühung des iPhone im Jahr 2007 hat sich das mobile Internet komplett verändert. Das Internet wurde auf den neuen Geräten endlich wirklich nutzbar und die Menschen haben es auch genutzt. Und zwar von Jahr zu Jahr immer mehr. Heutzutage surfen ca. 90% der Internetbesucher mit einem Smartphone. Darauf hat auch Google reagiert und seinen Index komplett auf "mobile first" umgestellt. Das beudetet, dass nur noch Seiten angezeigt werden, die für die mobilen Endgeräte wie Smartphones und Tablets optimiert sind. Die Ihre Seitenbreite und Schriftgröße je nach Anzeige-Gerät anpassen. So wie diese Seite es hier vorbildlich demonstriert. ;)

Entwicklung vom Responsive Webdesign

Vor ein paar Jahren hat man zusätzlich zu seiner Desktop-Seite noch eine mobile Version angeboten. Diese war meist unter einer Subdomain erreichbar. Für unsere Domain hätte das beispielsweise so aussehen können: mobile.visiondesign.de. Der Nachteil dieser Lösung war es, dass man zwei Stände pflegen musste. Wenn sich Änderungen ergeben haben, musste man diese in beiden Versionen der Seite einpflegen. Nicht besondert effektiv. Daher raten wir lieber gleich zu unserem Responsive Webdesign aus Bielefeld.

Duplicate Content beim Webdesign

Außerdem sieht Google eine solche zweite Seite als Duplicate Content an und straft dies ab. Hintergrund ist hierbei, dass Google nicht auf unterschiedlichen Seiten mehrfach den gleichen Inhalt indexieren möchte. Google sieht dies als Spam und früher sogar als Betrugsversuch an, da man ja versucht, es mit mehreren Seiten in den Index zu schaffen. Heutzutage erkennt Google duplicate Content als das, was es ist. Eine schlechte Programmierung bzw. fehlerhafte Einstellung des Webservers.

Sie können es selbst testen: Wenn Ihre Internetseite zum Beispiel mit und ohne www. in der Adress-Zeile zu erreichen ist, dann haben Sie für die gesamte Seite schon Duplicate Content. Sie sollten sich dringend eine Internetagentur suchen, die auch die technischen Aspekte des Webdesigns versteht und im Idealfall sogar individuelle Hosting-Lösungen aus einer Hand anbietet. Denn wenn der Server abgestimmt ist auf das Content-Management-System (Joomla, Wordpress, Drupal, Contao und wie sie alle heißen...), dann hat das meist nicht nur schnellere Ladezeiten zur Folge sondern auch eine bessere Positionierung in den Suchergebnissen. Einfach deshalb, weil man sich technische Probleme spart, worüber sich Google schon sehr freut und dies auch honoriert.

CSS Breakpoints, Media Queries

Heute läuft das Ganze Prozedere des Responsive Webdesigns anders ab. Man erstellt seinen Content und gestaltet die Seite zunächst auf einem Endgerät. Zum Beispiel auf dem Desktop. Wenn die Seite fertig ist, dann erstellt man mittels CSS so genannte Breakpoints. Dies sind Auflösungen des Anzeige-Gerätes bei denen das Layout umbrechen soll. Dies wird mittels so genannter Media Queries realisiert. Dies ist eine Funktion von CSS3 und erlaubt auszulegen, wie viele Pixel das Gerät in der Breite darstellen kann. Außerdem auch was für ein Gerät sich die Seite gerade anschaut.

Davon kann man es abhängig machen, wie sich die Seite darstellen soll. Man definiert also im CSS die einzelnen Schriftgrößen und Spalten-Breiten. Während auf dem Desktop zum Beispiel auf unserer Seite Platz für vier Referenzen nebeneinander ist, so werden auf dem Smartphone alle Referenzen untereinander dargestellt. Der Monitor vom Smartphone hat ja viel weniger Pixel (also Bildpunkte) in der Breite zur Verfügung. Da ist dies nur ein logischer Schritt, finden sie nicht auch? Übersichtlichkeit ist eines der Haupt-Ziele beim Responsive Webdesign.

Mobile first

Aktuelle Zahlen zeigen: Über 90% der Suchanfragen bei Google kommen mittlerweile von mobilen Endgeräten. Also von Smartphones und Tablets. Dies zeigt einmal mehr, warum man auf Responsive Webdesign setzen sollte. Responsive Websites ranken besser. Mobile first! Sprechen Sie uns an!

Logo Internetagentur VisionDesign

© 2021 VisionDesign, Bielefeld