wir erklären Technik

Kurz und bündig erklärt: Websites und responsive Webdesign

In diesem kurzen Artikel erklären wir Ihnen, was man unter responsive Webdesign versteht und warum das für Ihre Website so wichtig ist.

Webdesign und Websites

Die guten alten Zeiten des Webdesigns. Ein kurzer Rückblick.

Zum besseren Verständnis blicken wir als erstes zurück, in die Zeit, in der es noch keine modernen Smartphones und Tablets gab und die Bandbreite der Monitorauflösungen gering und überschaubar war. Zu dieser Zeit hatten Agenturen wie wir, die es sich zur Aufgabe gemacht haben, moderne Internetauftritte zu erstellen, ein Problem weniger: Man musste sich nicht großartig auch noch mit den unterschiedlichen Bildschirmgrößen beschäftigen. Es gab i.d.R. ein festes, statisches Layout, das auf jedem Monitor oder Laptop gut aussah und perfekt zu bedienen war.

Und dann kamen die Mobilgeräte

Mit dem Einzug der Internetfähigen Mobilgeräte hat sich das geändert. Denn die Anforderungen eines Mobilgerätes hinsichtlich Bedienung sind andere, als bei herkömmlichen PCs oder Laptops. Der Hauptunterschied ist offensichtlich: Die Bildschirmgröße. Eine normale Homepage, die für Mobilgeräte nicht optimiert ist, lässt sich auf Mobilgeräten i.d.R. nur sehr schlecht bedienen und im schlimmsten Fall sogar überhaupt nicht. Und hier kommt das responsive Design ins Spiel.

Responsive Webdesign

Ab jetzt nur noch responsive Webdesign

Mit dem Einzug der Smartphones und Tablets wurde es nötig, Websites nun mittels responsive Webdesign so flexibel zu gestalten, dass diese den Website-Besuchern auch auf Mobilgeräten eine perfekte Bedienung ermöglichen.

Die wichtigsten konkreten Maßnahmen

Responsive Webdesign beinhaltet verschiedenste Maßnahmen, um das Ziel der Mobiloptimierung zu erreichen. Die wichtigsten sind:

  • Inhalte müssen anders angeordnet werden. Ein Beispiel: Angenommen, eine Website hat standardmäßig auf einem PC oder Laptop z. B. für den reinen Inhalt 3 Spalten. Die linke einhält ein schönes Bild, die mittlere und die rechte Spalte jeweils Text. Auf großen Bildschirmen ist das perfekt, da alles groß genug dargestellt wird. Nun stellen Sie sich vor, das würde man so auf einem Smartphone darstellen! Die Inhalte in den Spalten wären sehr winzig und kaum zu lesen. Der Trick, den man beim responsive Webdesign anwendet ist der, dass man diese drei Spalten untereinander aufführt und sie dann die volle Breite zur Verfügung haben.
  • Unwichtige Elemente entfernen oder alternative Inahlte darstellen. Mobile User haben andere Leseweisen und das lesen auf kleinen Displays ist mühsamer, als auf einem großen Bildschirm. Daher kann man eher unwichtige Inhalte entfernen bzw. durch gekürzte Fassungen ersetzen.
  • Die Navigation muss eine andere sein. Übliche, horizontal angeordnete Aufklappnavigationen sind auf Mobilgeräten schlecht zu bedienen. Dass ist der Grund, weshalb sie üblicherweise durch die sog. "Hamburger"-Navigation ersetzt werden - die drei Balken im Kopfbereich.
  • Verwendung kleiner Bilddateigrößen. Die Bandbreiten sind unterwegs/mobil meist deutlich geringer, als zuhause oder im Büro. Daher ist es umso wichtiger, möglichst kleine Bilddateien zu verwenden.

Website Check-Formular

Ich stimme zu, dass meine Angaben aus dem Kontaktformular zur Beantwortung meiner Anfrage erhoben und verarbeitet werden. Hinweis: Sie können Ihre Einwilligung jederzeit für die Zukunft per E-Mail an info@leadingsystems.de widerrufen. Detaillierte Informationen zum Umgang mit Nutzerdaten finden Sie in unserer Datenschutzerklärung (siehe hier).

Kostenloser Check Ihrer Website

Nutzen Sie unseren kostenlosen Service! Wir werfen einen Blick auf Ihre jetzige Website und sagen Ihnen, ob sie gravierende Schwächen hat und was man verbessern könnte. Auch erkennen wir, ob sie mobilfähig ist oder größere Fehler bzgl. der Suchmaschinenoptimierung (SEO) hat.

Einfach das kleine Website-Check-Formular ausfüllen

Füllen Sie bitte einfach kurz das Formular aus und senden es ab. Wir schauen uns Ihre Homepage kurzfristig an. Wichtig: Das ist für Sie gänzlich kostenlos und garantiert unverbindlich.