Mail schreiben

         

 

 




Button grau AKTUELL
Button grau OKTOBER 2014
Button grau SEPTEMBER 2014
Button grau AUGUST 2014
  JULI 2014

Blog

  • Responsive Webdesign

    Veröffentlicht am 25. Juli 2014
  • Vor ein paar Jahren war die Gestaltung von Webseiten, die anschließend auf einem Desktop-Computer oder Laptop ordnungsgemäß geladen werden können, eine relativ grundlegende Funktion des Web-Designs. Wenn man in Betracht zieht, dass die Anzahl von Bildschirmauflösungen und Web-Browsern übersichtig war, war auch die Codierung der Webseiten relativ einfach. Erfahrene Web-Designer hatten keine großen Probleme eine Webseite diesen kleinen Unterschieden bei den Bildschirmgrößen anzupassen.
  • Und dann kam das Smartphone mit seinem integrierten Web-Browser, welcher die Erwartungen der Nutzer, was ihnen ein mobiler Web-Browser bieten sollte, auf ein komplett neues Niveau verlegt hat. Smartphone Nutzer wollten in der Lage sein, das Internet auf ihren Smartphones genau so einfach benutzen zu können, wie sie es auf ihrem Desktop-Computern gewohnt waren.
  • Fast über Nacht fanden sich die meisten Web-Designer in einem echten Dilemma, da sie eine schnelle und vor allem angemessene Lösung finden müssen, um sich der Welt von abwechslungsreichen Bildschirmgrößen und Auflösungen anpassen zu können. Die ursprüngliche Reaktion war, dass zwei Versionen einer Website erstellt wurden, die reguläre Desktop-Version und die Smartphone-freundliche mobile Version.
  • Die Ergebnisse waren in vielen Fällen unbefriedigend, insbesondere wenn die mobile Version der Internet-Seite mit der Desktop-Version verglichen wurde. Benutzer mussten mehrfach scrollen und sich mühevoll durch die Seite navigieren, um diese vollständig auf dem Smartphone ansehen zu können.
  • Viele Web-Designer stellten sich die Frage wie sie eine Website so gestalten können, dass diese sowohl auf Smartphones, Tablets und Computer-Bildschirmen mit hochauflösenden Displays in gleicher Qualität angezeigt werden kann. Die Herausforderung war es genau das hinzubekommen, ohne dabei separate Versionen der gleichen Webseite für jedes Gerät einzeln zu entwickeln und zu verwalten? Die Lösung für dieses Problem war die Einführung von Responsive Web-Design.
  • Responsive Web Design ist kein einmaliges Projekt, das entwickelt wurde, um das Problem der unterschiedlichen Bildschirmgrößen zu reparieren. Diese Methode ist viel mehr eine Sammlung von Ideen und Techniken, die, wenn sie richtig angewendet werden, als Resultat haben, dass eine Webseite in allen Browsern gleich funktioniert und dargestellt wird, unabhängig von der Bildschirmgröße. Diese Angehensweise reagiert auf das jeweilige Gerät, das benutzt wird, um die Seite zu laden, daher auch der Namen Responsive Webdesign.
  • Bei der Anwendung von Responsive Webdesign schreibt der Web-Designer einen Code auf der Webseite um die Bildschirmgröße und die Auflösung des Web-Browsers des Geräts lesen zu können, von welchem die Seite aufgerufen wurde.

     

    Infolgedessen werden die Seitenelemente der Webseite dem jeweiligen Gerät so angepasst, dass sie die bestmögliche Darstellungsform bieten. In der Regel ist dann nur sehr wenig Scrollen erforderlich, um die Seite in vollem Umfang sehen zu können. Dies ist besonders wichtig bei Smartphones mit einem kleineren Bildschirm.

     

    Das Ziel ist es, das die Webseite sowohl auf einem Desktop-Computer als auch auf einem Smartphone in gleicher Qualität dargestellt wird. Dies ist vielleicht die wichtigste Eigenschaft der Funktionalität einer Webseite, vor allem für ein optimales Nutzererlebnis.

     

    Responsive Webdesign ist eine Vorgehensweise die in erster Linie die Probleme versucht zu lösen, die durch die Verbreitung von neuen Arten von mobilen Geräten verursacht werden, da diese den Zugriff auf viele Webseiten erschweren. Webseiten, die mit dem Responsive Design gestaltet werden, verwenden für das Layout x- und y-Koordinaten auf einem Gitter und mathematische Prozentsätze für Bilder, anstatt nur festegelegte Breite-Parameter zu benutzen. Im Gegensatz zu festgelegten Parametern schafft die Anwendung von Prozenten und einem Gitter-Entwurf ein fließendes Layout, das flexibel ist und sich der Größe des Displays problemlos anpassen kann.


    Responsive Design ist eine innovative Erstellung von Webseiten, die mit der Verwendung von flexiblen Layouts, Bildern und flexiblen CSS-Media Queries den Inhalt einer Seite so gestaltet, dass dieser sich verschiedenen Bildschirmgrößen und mobilen Geräten automatisch anpasst. Das Ziel von diesem Design ist es, Webseiten so zu entwickeln, dass sie die Bildschirmgröße und Orientierung des Besuchers erkennen, und dementsprechend das Layout verändern. Anstatt eine spezielle mobile Version einer Webseite zu bauen, was oft bedeutet, dass die gesamte Codierung von Grund auf neu geschrieben werden muss, können Entwickler einfach mehrere Stylesheets für dieselbe Webseite erstellen und sogar verschiedene Bilder mit jedem der einzelnen Stylesheets assoziieren. Als Folge dessen müssen HTML-Codes nicht neu geschrieben werden, sie werden nur umfunktioniert, was erhebliche Entwicklungszeit einsparen kann.

     

    Das Prinzip von Responsive Web-Design sorgt dafür, dass jede Webseite von jedem beliebigen Gerät betrachtet werden kann, unabhängig von der Größe des Bildschirms. Es geht vor allem darum, dass die Bedürfnisse der Internet-Nutzer berücksichtigt werden, und dass Internet-Erlebnis auf dem Smartphone, Mini-Tablet, Full-Size Tablet, dem Laptop und sogar auf dem Großbild-HDTV gleichermaßen dargestellt wird. Das Design ist Responsive, zu deutsch "reagierend" weil es die Eigenschaften der Geräte berücksichtigt und sich dem Browser anpasst, auf welchem der Benutzer den Inhalt aufruft.

     

    Der größte Teil der Internet Nutzer in diesen Tagen verwendet hauptsächlich tragbare Geräte in allen Größen und Formen, um im Netz zu surfen. Die meisten Entwickler können nicht mehr davon ausgehen, dass Ihre Seiten ausschließlich auf einem Desktop-PC aufgerufen werden, und müssen daher sicherstellen, dass der Inhalt auch auf anderen Vorrichtungen bestmöglich dargestellt wird.
  • Beim Responsive Web-Design werden überwiegend Media Queries verwendet, um die Eigenschaften des Gerätes zu identifizieren, insbesondere die Breite des Browsers. Daraufhin bietet der Server verschiedene CSS-Stilregeln, um letztendlich die beste Version zu bestimmen und die Webseite bestmöglich präsentieren zu können.
  • Eine weitere Herausforderung für viele Webseiten Besitzer und vor allem für eine Werbeagentur ist es, die Werbeanzeigen auf verschiedenen Geräten präsentieren zu können. Banner-Anzeigen haben in der Regel eine feste Breite und können nur schwer verkleinert oder degradiert werden. Sie funktionieren am Besten bei einer bestimmten Breite, und wenn sich diese verringert besteht, auch die Gefahr, dass die Anzeige nicht mehr dargestellt wird.

     

    Dies betrifft offensichtlich die Einnahmen von einigen Webseiten, und da ist Responsive Webdesign die beste Technik um kompatibel zu sein, und die Werbeanzeigen flexibel anzupassen. Da Responsive Webdesign noch immer ein relativ unbekanntes Thema für viele Homepage Besitzer ist, wird das Jahr 2014 vor allem Werbeagenturen die sich mit dieser Technik befassen, die Gelegenheit bieten, Responsive Design einem breiten Publikum vorzustellen.

     

    Vor allem Homepage Besitzer, die Umsatz mit ihren Webseiten machen wollen, müssen sicherstellen, dass ihre Seiten von jedem Gerät aus optimal erreichbar sind. Online Shopping ist mittlerweile eine der beliebtesten Arten einzukaufen, und diese beschränkt sich nicht nur auf Computer und Laptops. Die meisten Smartphone Besitzer wollen überall die Möglichkeit haben ins Internet zu gehen und ihre Einkäufe auch unterwegs zu erledigen.

     

    Jedoch haben Webseiten-Betreiber oftmals nicht das Fachwissen und die richtigen Tools um ihre Seite so zu gestalten, dass sie diesen Anforderungen gerecht wird. Das wiederum gefährdet den Umsatz, und zahlreiche mobile Kunden haben Schwierigkeiten sich auf der Homepage zurechtzufinden, wenn diese nicht optimal angezeigt wird.Glücklicherweise gibt es inzwischen zahlreiche Werbeagenturen, die sich mit genau diesem Problem befassen. Sie besitzen das benötigte Fachwissen um jede Webseite im Responsive Design zu gestalten, sodass sie auf jedem beliebigen Gerät bestmöglich angezeigt wird.

     

    Zurück zur Übersicht

     

Zitat der Seite

Star Star Star Star Star

 

"Facebook ist doch nur ein Verzeichnis im Web!"

Rupert Murdoch

Medienmogul, 2008