{"id":1395,"date":"2012-05-29T14:44:31","date_gmt":"2012-05-29T12:44:31","guid":{"rendered":"http:\/\/blog.till.de\/?p=1395"},"modified":"2012-05-29T14:44:31","modified_gmt":"2012-05-29T12:44:31","slug":"responsive-design-und-suchmaschinenoptimierung","status":"publish","type":"post","link":"https:\/\/blog.till.de\/allgemein\/responsive-design-und-suchmaschinenoptimierung\/","title":{"rendered":"Responsive Design und Suchmaschinenoptimierung"},"content":{"rendered":"

Responsive Design – ein Begriff \u00fcber den man in letzter Zeit h\u00e4ufig stolpert. Kaum jemand ausserhalb professioneller Agenturen kann etwas mit dieser Bezeichnung anfangen. Aus diesem Grund haben wir uns ausf\u00fchrlich mit dem Begriff des Responsive Designs und den Auswirkungen auf die Suchmaschinenoptimierung auseinander gesetzt:<\/strong><\/p>\n

Responsive Webdesign, was ist das eigentlich?<\/em><\/p>\n

Heute gibt viele verschiedene Ger\u00e4te, mit denen man eine Interseite betrachten kann. Angefangen bei einem HD-Fernsehger\u00e4t \u00fcber den g\u00e4ngigen Desktop-PC bis hin zu handlichen Smartphones sind alle denkbaren Ger\u00e4tegr\u00f6\u00dfen vertreten. Diese technische Vielfalt der Anzeigeger\u00e4te stellt ganz neue Herausforderungen an eine Website, wenn diese auf allen Ger\u00e4ten optimal genutzt werden soll. Die fr\u00fcher genutzten statischen Layouts mit einer festen Breite sind i.d.R. auf den Monitor eines Desktop-PCs zugeschnitten und bieten auf gr\u00f6\u00dferen oder kleineren Ger\u00e4ten kaum eine benutzerfreundliche Anzeige. Gerade bei kleineren Ger\u00e4ten lassen sich verkleinerte Buttons oder Men\u00fcf\u00fchrungen einer Website selten wie gew\u00fcnscht bedienen.
\nDie urspr\u00fcngliche Herangehensweise war die Erstellung von einer eigenen Website f\u00fcr jedes Ger\u00e4t mit jeweils angepasstem Layout und einer vorgeschalteten Browserweiche zur Erkennung der Ger\u00e4te und entsprechender Weiterleitung auf die korrekte Website. Diese L\u00f6sung ist eher suboptimal, da f\u00fcr vier Ger\u00e4te dann auch vier separate Websites erstellt und betreut werden m\u00fcssen.
\nEine zukunftsweisende L\u00f6sung bietet das Responsive Design: Hier bieten ein flexibles Raster und flexible Inhalte auf beliebigen Endger\u00e4ten stets das beste Nutzererlebnis, indem es auf den Nutzer und seine Anforderungen reagiert. Anstelle von festen Rastern werden die Gr\u00f6ßenangaben \u00fcber eine Prozentangabe flexibel gestaltet, so dass ein bestimmter Bereich einer Website z.B. immer 30% der zur Verf\u00fcgung stehenden Bildfl\u00e4che einnimmt; egal wie breit oder schmal das Anzeigeger\u00e4t ist. Die Gr\u00f6ßen der Elemente passen sich also dem jeweiligen Ger\u00e4t an, w\u00e4hrend die Gr\u00f6ßenverh\u00e4ltnisse der einzelnen Elemente zueinander dabei gleich bleiben. Auch Schriftgr\u00f6\u00dfen und Bilder werden flexibel dargestellt.
\nÜber Media Queries k\u00f6nnen zus\u00e4tzlich einige Eigenschaften des Ger\u00e4tes wie beispielsweise die maximale Anzeigebreite oder dessen Ausrichtung ausgelesen und das Layout noch weiter angepasst werden. Z.B. ist dadurch eine Verschiebung zu breiter Elemente m\u00f6glich, so dass sie auf schmaleren Displays untereinander angezeigt werden. So kann eine einzige Website auch auf mobilen Endger\u00e4ten unterschiedliche Layouts anzeigen, je nachdem ob sich das Ger\u00e4t in Portrait- oder in Landschafts-Orientierung (Hoch- oder Quer-Format) befindet. Zus\u00e4tzlich k\u00f6nnen nicht relevante Elemente sogar ganz aus der Anzeige entfernt werden.
\nResponsive Design macht die Erstellung unterschiedlicher Websites f\u00fcr unterschiedliche Ger\u00e4te unn\u00f6tig: Es wird nur noch eine Website erstellt, die ohne Browserweiche und Weiterleitung anhand ausgelesener Ger\u00e4teeigenschaften entscheidet, in welcher Breite sie angezeigt wird.<\/p>\n

Und die Auswirkungen auf SEO?<\/em><\/p>\n

Die Erstellung verschiedener Websites f\u00fcr unterschiedliche Anzeiger\u00e4te erforderte ggfs. auch das Anlegen von einer Subdomain pro Website und\/oder eine User-agent-spezifische Weiterleitung, damit ein Suchroboter auch die jeweils zu seinem Anzeigeger\u00e4t korrespondierende Website indizieren konnte und die Erkennung von double content verhindert wurde. Auch sollte jede Website eine eigene Verlinkung im Internet aufweisen.
\nDie aus verschiedenen Websites und Weiterleitungen resultierende Mehrarbeit f\u00fcr den Webserver verringert dabei gleichzeitig die Ladegeschwindigkeit der Websites.
\nResponsive Design wirkt dem entgegen. Die Serverlast wird durch den Wegfall der Weiterleitungen und der nun \u00fcberfl\u00fcssigen alternativen Websites verringert.<\/p>\n

Ist eine Verlinkung im Internet f\u00fcr Mobile Websites \u00fcberhaupt relevant?<\/em><\/p>\n

Wenn Websites ihre Betrachter auf Mobile Websites weiterleiten sollen und Mobile Websites selten oder nie in den vorderen Suchpositionen auftauchen, sind Links f\u00fcr Mobile Websites dann \u00fcberhaupt relevant? Aber ja doch! Es geht in diesem speziellen Fall nicht darum, m\u00f6glichst viele Links f\u00fcr die Mobile Website zu bekommen. Viel mehr k\u00f6nnten Betrachter der Mobile Website diese verlinken oder teilen, wodurch der Hauptseite potenzielle Links und Teilungen gestohlen werden.
\nBeispiel: Eine Haupt-Website mit 4 Alternativ-Websites f\u00fcr unterschiedliche Anzeigeger\u00e4te weist 20 Verlinkungen auf, auf die Alternativ-Websites wurden von Benutzern jeweils 5 Verlinkungen gesetzt. In dem Fall verteilt sich zus\u00e4tzliche Linkkraft auf 4 Websites, die genauso gut der Haupt-Website zu Gute kommen k\u00f6nnte. Bei der Nutzung von Responsive Design entfallen die 4 Alternativ-Websites, so dass deren Verlinkungen auf die Haupt-Website gesetzt werden. Die Hauptseite h\u00e4tte 40 somit Verlinkungen, statt der vormals 20.
\nMit Responsive Webdesign existiert nur eine URL f\u00fcr eine Website, von Betrachtern gesetzte Links oder Teilungen in Sozialen Netzwerken gelten somit f\u00fcr nur eine Website und verteilen sich nicht auf verschiedene Webpr\u00e4senzen.<\/p>\n

Responsive Design ist eine zukunftsweisende Art, Webseiten mit verringertem Aufwand f\u00fcr eine Vielzahl von Betrachtungsger\u00e4ten zur Verf\u00fcgung zu stellen, ohne das die Benutzerfreundlichkeit darunter leidet.<\/strong><\/p>\n","protected":false},"excerpt":{"rendered":"

Responsive Design – ein Begriff \u00fcber den man in letzter Zeit h\u00e4ufig stolpert. Kaum jemand ausserhalb professioneller Agenturen kann etwas mit dieser Bezeichnung anfangen. Aus diesem Grund haben wir uns ausf\u00fchrlich mit dem Begriff des Responsive Designs und den Auswirkungen auf die Suchmaschinenoptimierung auseinander gesetzt: Responsive Webdesign, was ist das eigentlich? Heute gibt viele verschiedene… Mehr lesen »Responsive Design und Suchmaschinenoptimierung<\/span><\/a><\/p>\n","protected":false},"author":5,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_seopress_robots_primary_cat":"","_seopress_titles_title":"","_seopress_titles_desc":"","_seopress_robots_index":"","neve_meta_sidebar":"","neve_meta_container":"","neve_meta_enable_content_width":"","neve_meta_content_width":0,"neve_meta_title_alignment":"","neve_meta_author_avatar":"","neve_post_elements_order":"","neve_meta_disable_header":"","neve_meta_disable_footer":"","neve_meta_disable_title":"","neve_meta_reading_time":"","_themeisle_gutenberg_block_has_review":false,"footnotes":""},"categories":[1,32,77],"tags":[483,485,61],"class_list":["post-1395","post","type-post","status-publish","format-standard","hentry","category-allgemein","category-seo","category-webdesign","tag-seo","tag-webdesign","tag-suchmaschinenoptimierung"],"_links":{"self":[{"href":"https:\/\/blog.till.de\/wp-json\/wp\/v2\/posts\/1395","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/blog.till.de\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blog.till.de\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blog.till.de\/wp-json\/wp\/v2\/users\/5"}],"replies":[{"embeddable":true,"href":"https:\/\/blog.till.de\/wp-json\/wp\/v2\/comments?post=1395"}],"version-history":[{"count":0,"href":"https:\/\/blog.till.de\/wp-json\/wp\/v2\/posts\/1395\/revisions"}],"wp:attachment":[{"href":"https:\/\/blog.till.de\/wp-json\/wp\/v2\/media?parent=1395"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blog.till.de\/wp-json\/wp\/v2\/categories?post=1395"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blog.till.de\/wp-json\/wp\/v2\/tags?post=1395"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}