Das praxisnahe Schweizer Online-Marketing Magazin
Im Ratgeber-Magazin erfahren Leser seit 2001 praxisnahes Wissen, Tipps und Strategien zu Online-Tools, Online-Marketing, Webdesign und Website-Optimierung!
Über 2'000 Links rund um Traffic & Conversion für Webmaster und Websiteverantwortliche. RSS


Gratis NewsAboNews­abo Tipps: Als Danke­schön er­hal­ten Sie die PDF-Reporte „Alles was Sie über die Verlin­kung wis­sen müs­sen“ und „Wie Sie mit meiner Hilfe Tools fin­den, mit denen Ihre Web­si­te effek­ti­ver wird“ gra­tis!

„Was ist ein responsives Layout?“

„Online-Marketing Beitrag: Responsives Webdesign“

Informationen gemäss Stand vom 21.1.2021

Responsives WebdesignDas responsive Layout (Synonyme: Responsive Webdesign, Responsive Design) ba­siert auf flexiblen Layouts. Diese dynamischen Layouts passen sich an die ver­fügbare Bild­schirm­auf­lösung an. Der Inhalt eines kompletten Webauftritts wird dementsprechend skaliert (also alle Texte, Fotos und die Navi­gation). Das Web­design rea­giert auf die Ressourcen des End­geräts und liefert ein ange­passtes Seiten­layout aus. So können Sie einen Web­auftritt auf einem grossen Bild­schirm als auf einem Smart­phone betrachten.

„Inhaltsverzeichnis: Responsives Layout“

nach oben

Responsives Webdesign soll man nicht verwechseln mit einer mobilen Website! Die mobile Website ist ein zu­sätzlicher, spezieller Webauftritt, der automatisch geladen wird, wenn jemand mit dem Smartphone auf die Website gelangt.

Eine für respon­sives Webdesign we­sent­liche Voraus­setzung sind Media Queries, ein CSS3-System, welches unter­schiedliche Design­vorlagen des Ausgabe­mediums erlaubt. Ab dem 21.04.2015 ist es für das Google-Ranking wichtig, dass der eigene Webauf­tritt den Regeln der res­pon­siven Layouts unter­steht. Dazu gehört, dass Sie die Flash-Technik nicht mehr einsetzen.

Responsives Layout
Foto Quelle: swisscom.ch

Diese responsive Layouts sind für CMS wie zum Beispiel WordPress verfügbar.

nach oben

„Regeln“

Für die mobile Benutzerfreundlichkeit müssen die Berührungs-Elemente die richtige Grösse und ausreichenden Abstand untereinander haben.

Standard ist bei den Besuchern das Icon-Elemente wie Burger-Menü.

Leider ist Mouseover eine Desktop-Funktion, die auf mobilen Devices entfällt.

nach oben

„Wertvolle Informationen“

nach oben

„Wie kann ich responsives Layout testen?“

Dafür gibt es viele Tools im Web. Einige werden hier vorgestellt.

nach oben

„Wie kann ich mobile Websites optimieren?“

Um mobil Suchenden bessere Ergeb­nisse zu liefern, werden reine Desk­top­varianten ab März 2021 von Google nicht mehr berück­sichtigt. Google wird keine Desk­top-Inhal­te mehr in den Sucher­gebnissen auflis­ten.

Um den Webauf­tritt zu optimieren, müssen wir zuerst wissen, wo die Pro­bleme sind. Helfen können folgende drei Online-Tools:

nach oben

„Was ist AMP?“

„Accelerated Mobile Pages (AMP) ist ein quelloffenes, platt­form­übergrei­fen­des Framework, mit dessen Hilfe die Lade­geschwin­digkeit mobiler Websites deutlich erhöht werden kann. AMP ba­siert auf der Reduktion von CSS und JavaScript, einem Content Delivery Net­work sowie ange­passtem HTML. Unter­stützt wird das Accelerated Mo­bile Pages Project von Google.“
Quelle: https://de.ryte.com/wiki/

Autor: Walter B. Walser, kundennutzen.ch

Redaktor

Walter B. Walser ist Online-Mar­ke­ting Ma­na­ger und Re­dak­tor. Er half frü­her Un­ter­neh­mern 100% mehr aus Ihrer Web­site her­aus­zu­ho­len. Er hat KMU in Bezug auf deren Web­auf­tritt be­raten und sich auf die Web­si­te-Pfle­ge, Web­site-Opti­mie­rung und das On­li­ne-Mar­ke­ting mit On­li­ne-Tools spe­zia­li­siert.
„Sie dürfen ihn gerne kontak­tie­ren!“

Walser Organisation
https://kundennutzen.ch/

TwitterFacebook

nach oben