Startseite » SEO Glossar – Begriffe aus der SEO erklärt » Responsive Design

Responsive Design

Logo 3S+WebDesign

Was ist Responsive Design?

Als Responsive Design bezeichnet man im Webdesign, wenn sich eine Website in Ihrer Darstellung an das jeweilige Ausgabegerät anpasst. Bei einer Website wurde das CSS und JavaScript so erstellt, das Mobilgeräte wie Tablets oder Smartphones berücksichtigt werden und die Webseite korrekt dargestellt wird und funktioniert. So wird eine Website, die über ein responsive Design verfügt, auf einem Mobilen Endgerät (z.B. Smartphone) in den richtigen Maßen ausgegeben. Ebenso wird der Personal Computer oder das Tablett berücksichtigt.

Responsive Design ist eine Begrifflichkeit aus dem Webdesign. Es bedeutet, dass der Quellcode einer Webanwendung oder Website entsprechend programmiert wurde, um auf verschiedenen Endgeräten grafisch passend ausgespielt zu werden. Dies soll zum einen Darstellungsfehler vermeiden und dem Nutzer eine angenehme, weil gut sichbare Anwendung gewährleisten. Responsive Design bedeutet nicht zwangsläufig, das eine Website für ein mobiles Endgerät wie ein Tablett oder ein Smartphone programmiert wurde, sondern nur, dass die Website oder Anwendung auf diesem grafisch korrekt angezeigt wird.

Google hat bereits seinen Index für Suchergebnisse komplett auf Mobile umgestellt. Dass bedeutet vereinfacht Google hat nun nur noch einen “Pool” aus dem sich die SERPS zusammensetzen. Früher hatte Google einen Datenbereich für Desktop und einen für Mobile. Die logische Konsequenz ist, dass Google Seiten bevorzugt, die für mobile Endgeräte optimiert sind. Dies ist sogar einfach nachvollziehbar. Prüfen Sie selbst Stichpunktartig Ihre Suchergebnisse auf Ihrem Smartphone oder Tablett, werden Sie unter den ersten drei Seiten keinen oder nur bei Nischenkeywords nicht mobile Websiten finden.

Wie macht man Responsive Design?

Ein Responsive Design funktioniert über CSS. Im ersten Schritt wird der Browser quasi gefragt, für welches Endgerät er die Darstellung der Website übernimmt. Meist erfolgt das mit der Abfrage der Auflösung. Der Browser gibt an welche Auflösung sein Gerät hat und in der CSS sind die entsprechenden Anweisungen hinterlegt, wie die Seite dargestellt werden soll. Diese Erklärung ist stark vereinfacht.