{"id":789,"date":"2017-01-14T19:54:12","date_gmt":"2017-01-14T18:54:12","guid":{"rendered":"http:\/\/www.der-informationsdesigner.de\/agentur-blog\/?p=789"},"modified":"2023-01-30T11:15:51","modified_gmt":"2023-01-30T10:15:51","slug":"was-ist-gutes-webdesign","status":"publish","type":"post","link":"https:\/\/www.der-informationsdesigner.de\/agentur-blog\/webdesign\/was-ist-gutes-webdesign\/","title":{"rendered":"Was ist gutes Webdesign?"},"content":{"rendered":"<p>Gutes Webdesign ist also mehr als nur Dekor. <a target=\"_blank\" href=\"https:\/\/99designs.de\/web-design\" rel=\"noopener noreferrer\">Gutes Webdesign<\/a> ist ein entscheidender Erfolgsfaktor f\u00fcr die Firmen-Webseite und letztendlich f\u00fcr das ganze Unternehmen. Wenn das Webdesign so wichtig ist, wie entscheidet man, ob das Design der eigenen Firmenwebseite hochwertig ist? <!--more--><\/p>\n<p><strong>Und was ist letztendlich gutes Webdesign?<\/strong><\/p>\n<h2 class=\"blogdetailseite\" style=\"margin-top: 0;\">Gutes Webdesign ist benutzerfreundlich<\/h2>\n<p>Die klassische <strong>Designregel \u201eform follows function\u201c<\/strong> (Die Funktion bestimmt die Form) beh\u00e4lt auch im Bereich Webdesign ihre G\u00fcltigkeit. Jedes Element einer Internetseite sollte derart gestaltet werden, dass es nicht nur das Auge anspricht, sondern auch seine Funktion optimal erf\u00fcllt.<\/p>\n<p><img decoding=\"async\" src=\"https:\/\/www.der-informationsdesigner.de\/agentur-blog\/wp-content\/uploads\/2016\/12\/Was-ist-gutes-Webdesign-Eyetracking.png\" alt=\"Was ist gutes Webdesign? | Beispiel Eyetracking-Studie\" \/><br \/><span class=\"wp-caption-text\">Bildquelle: https:\/\/www.nngroup.com\/articles\/f-shaped-pattern-reading-web-content\/<\/span><\/p>\n<p>So sollte das <a title=\"Mehr zum Thema Webdesign als Bestandteil unserer Leistungen als Webagentur aus dem Allg\u00e4u\" href=\"https:\/\/www.der-informationsdesigner.de\/leistungen\/webdesign-allgaeu\/\">Webdesign<\/a> die Inhalte der Seite sinnvoll strukturieren und den Besuchern die Navigation erleichtern. Eye-tracking Studien k\u00f6nnen dabei helfen, die \u00fcblichen Grundelemente auf der Seite zweckm\u00e4\u00dfig zu positionieren, um die Navigation so intuitiv wie m\u00f6glich zu gestalten. Nach dem sogenannten \u201eF-Schema\u201c beginnt der Blick eines Durchschnittsusers in der linken oberen Ecke der Seite und bewegt sich horizontal zur rechten Ecke. Dann geht er zur\u00fcck nach links und bewegt sich wieder nach rechts. Letztlich scannt der User die linke Seite des Bildschirms von oben nach unten. Basierend auf diesen Einsichten sollten die Grundelemente einer Webseite angeordnet werden. So findet man das Logo meistens in der oberen linken Ecke der Seite und das Navigations-Menu im oberen Bereich. Den sogenannten <strong>Hero-Shot<\/strong> (mit der Kernaussage) findet man generell in der Mitte.<\/p>\n<ul class=\"cta-kontakt hinweis-fuer-links-etc\" style=\"margin-bottom: 4rem !important\">\n<li><em>Ebenfalls interessant: <\/em> <a title=\"Was ist gute Website-Usability?\" href=\"https:\/\/www.der-informationsdesigner.de\/agentur-blog\/webdesign\/was-ist-gute-website-usability\/\">Was ist gute Website-Usability?<\/a><\/li>\n<\/ul>\n<p>Die Benutzerfreundlichkeit einer Seite wird nicht nur vom Layout bestimmt. Andere graphische Elemente, wie etwa die <strong>Typographie und Farbpalette<\/strong>, sind genauso wichtig f\u00fcr eine gelungene Homepage. Beide Elemente sollten im Einklang mit der \u00fcbergeordneten Corporate Identity ausgew\u00e4hlt werden. Dabei ist es aber auch wichtig, die richtige Schriftgr\u00f6\u00dfe auszuw\u00e4hlen und den Kontrast zwischen Text und Hintergrund zu maximieren. Da die Sehst\u00e4rke der Nutzer und die Qualit\u00e4t der Monitore sehr stark schwanken, sollte der Unterschied zwischen Text- und Hintergrundfarbe so deutlich wie m\u00f6glich sein. Das altbew\u00e4hrte Schwarz auf Wei\u00df ist meistens am besten.<\/p>\n<p>Auch die Organisation des Wei\u00dfraums ist entscheidend, um das richtige Look and feel zu erzielen. Wenn es um Webdesign geht, ist meistens weniger wirklich mehr. Der wei\u00dfe Raum bietet dem Leser die M\u00f6glichkeit, durchzuatmen und die Inhalte zu priorisieren. Au\u00dferdem wirken minimalistische Webseiten heutzutage besonders professionell und schick.<\/p>\n<h2 class=\"blogdetailseite\" style=\"margin-top: 0;\">Gutes Webdesign ist technisch einwandfrei<\/h2>\n<p>Wenn von gutem Webdesign die Rede ist, geht es nicht nur um \u00c4sthetik. Gutes Webdesign ist nicht nur sch\u00f6n, sondern auch <strong>technisch einwandfrei<\/strong>. Insbesondere 404-Fehler sollten vermieden und Ladezeiten verk\u00fcrzt werden.<\/p>\n<p><img decoding=\"async\" style=\"border: 1px solid #eee\" src=\"https:\/\/www.der-informationsdesigner.de\/agentur-blog\/wp-content\/uploads\/2016\/12\/Was-ist-gutes-Webdesign-Beispiel-einer-guten-Fehlerseite.png\" alt=\"Was ist gutes Webdesign? | Beispiel einer guten Fehler- bzw. 404-Error-Seite\" \/><br \/><span class=\"wp-caption-text\">Bildquelle: https:\/\/99designs.de<\/span><\/p>\n<p>Vor allem CMS (<a title=\"Mehr erfahren zum Thema CMS - Content-Management-Systeme\" href=\"https:\/\/www.der-informationsdesigner.de\/leistungen\/cms-agentur-allgaeu\/\">Content-Management-Systeme<\/a>) sind anf\u00e4llig f\u00fcr 404-Fehler. Sie treten auf, wenn Seiten gel\u00f6scht oder umbenannt werden. Um die 404s zu beheben, sollten entsprechende Redirects eingerichtet werden. Es gibt aber durchaus F\u00e4lle, in denen 404-Fehlerseiten notwendig sind. Sollte zum Beispiel der Besucher einen fehlerhaften Link eingetippt haben, ist es angemessen, ihm durch eine Fehlermeldung mitzuteilen, dass die Seite, nach der er sucht, nicht existiert. In dem Fall sollte die 404-Fehlerseite den Besucher nicht verwirren oder abschrecken, sondern ihn auf den richtigen Pfad locken. <strong>Gut gestaltete Fehlerseiten motivieren den Besucher, das Gesuchte erneut zu finden<\/strong>. Eine klare und schlichte Struktur, eine \u00fcbersichtliche Auflistung der Kategorie-Seiten und eine Suchfunktion sind nur einige Elementen, die dazu beitragen k\u00f6nnen. Auch eine am\u00fcsante Sprache kann positiv auf die Besucher wirken.<\/p>\n<p>Genauso wichtig ist es, <strong>schnelle Ladezeiten<\/strong> zu erm\u00f6glichen. Eine aktuelle Untersuchung von der Site-Optimierung Firma Strangeloop hat gemessen, wann der durchschnittliche User das Warten aufgibt und von der Seite abspringt. Das Ergebnis lag nah, dass der <strong>Durchschnittsbesucher schon nach 3 Sekunden zur\u00fcck zur Google-Suche wechselt<\/strong>. Somit wird klar, dass auf technischer Ebene einwandfreie Funktionalit\u00e4ten wichtige Voraussetzungen f\u00fcr gutes Webdesign und f\u00fcr eine positive User-Experience sind.<\/p>\n<h2 class=\"blogdetailseite\" style=\"margin-top: 0;\">Gutes Webdesign ist \u201eresponsive\u201c<\/h2>\n<p><a title=\"Mehr erfahren \u00fcber responsives Webdesign als Bestandteil unseres Leistungsspektrums\" href=\"https:\/\/www.der-informationsdesigner.de\/leistungen\/responsive-webdesign-allgaeu\/\">Responsive Webdesign<\/a> erm\u00f6glicht das Layout einer Website so flexibel zu gestalten, dass dieses auf dem Computer-Desktop, Tablet und Smartphone eine gleichm\u00e4\u00dfige Benutzerfreundlichkeit erlaubt und der Inhalt vollst\u00e4ndig und sofort vom User aufgenommen werden kann. <\/p>\n<p><img decoding=\"async\" style=\"border: 1px solid #eee\" src=\"https:\/\/www.der-informationsdesigner.de\/agentur-blog\/wp-content\/uploads\/2016\/12\/responsive-webdesign-allgaeu-kaufbeuren-kempten-webdesign.jpg\" alt=\"Was ist gutes Webdesign? | Responsives Design als wichtiger Faktor\" \/><\/p>\n<p>In Deutschland besitzen heutzutage 51 Prozent der M\u00e4nner \u00e4lter als 13 und 49 Prozent der Frauen in der gleichen Altersgruppe ein Smartphone. Laut Statistiken soll diese Zahl noch in diesem Jahr um 11,1 Prozent steigen. In einer Zeit, in der das Smartphone f\u00fcr viele Menschen zum st\u00e4ndigen Begleiter geworden ist, ist <strong>responsive Webdesign eine unentbehrliche Voraussetzung f\u00fcr jede moderne Webseite<\/strong>. Mithilfe dieser Technik passen sich Inhalts- und Navigationselemente sowie der strukturelle Aufbau der Website automatisch der Bildschirmaufl\u00f6sung des mobilen Endger\u00e4ts an.<\/p>\n<h2 class=\"blogdetailseite\" style=\"margin-top: 0;\">Gutes Webdesign ist SEO-optimiert<\/h2>\n<p>Responsive Webdesign tr\u00e4gt nicht nur zur Benutzerfreundlichkeit bei, sondern ist auch ein wichtiger Ranking-Faktor. <strong>Google beachtet n\u00e4mlich die responsive Umsetzung einer Website als Rankingkriterium<\/strong>. Laut Statistiken verdoppelt sich die Zahl der mobilen Suchanfragen j\u00e4hrlich, w\u00e4hrend die Anfragen von Desktop-Computern seit 2013 abnehmen. <\/p>\n<p>Responsive Design ist aber nicht die einzige Schnittstelle zwischen Webdesign und <a title=\"Unsere Leistungen als Agentur aus dem Allg\u00e4u f\u00fcr SEO und SEA\" href=\"https:\/\/www.der-informationsdesigner.de\/leistungen\/suchmaschinenoptimierung-allgaeu-sem-seo-sea\/\">Suchmaschinenoptimierung<\/a> (SEO). In seinen Internet Search Quality Guidelines schreibt Google, dass auch die visuelle Struktur einer Seite eine gro\u00dfe Rolle spielt. Ein wichtiger Faktor f\u00fcr Google beim Bewerten einer Webseite ist, ob der Hauptcontent sofort (also ohne scrollen) sichtbar ist und ob das Design einer Seite f\u00fcr den User hilfreich ist. Content, Wei\u00dfraum, Navigationsmen\u00fc \u2013 alle Grundelemente einer Webseite sollen derart positioniert werden, dass der Erstbesucher in wenigen Sekunden verstehen kann, worum es auf der Webseite geht.<\/p>\n<p>Des Weiteren ist es empfehlenswert, auf die Verwendung von JavaScript und Flash zu verzichten. Beide stellen gro\u00dfe Herausforderungen f\u00fcr die Crawler dar und Flash wird von vielen mobilen Ger\u00e4ten nicht unterst\u00fctzt.<\/p>\n<h2 class=\"blogdetailseite\" style=\"margin-top: 0;\">Gutes Webdesign ist zielgruppenorientiert<\/h2>\n<p>Um eine gelungene Webseite zu gestalten ist es n\u00f6tig, sich schon in der fr\u00fchen Phase der Planung mit folgender Frage zu besch\u00e4ftigen: <strong>Wer sind die Besucher meiner Webseite eigentlich?<\/strong><\/p>\n<p>Es gibt kaum feste Regeln, die besagen, wie gutes Webdesign aussehen sollte. Egal ob minimalistisch oder vintage &#8211; Hauptsache das Webdesign <strong>spricht die richtige Zielgruppe<\/strong> an. Hierf\u00fcr ist es notwendig, sich im ersten Schritt mit der Zielgruppenbestimmung und \u2013recherche zu befassen. <\/p>\n<p><img decoding=\"async\" src=\"https:\/\/www.der-informationsdesigner.de\/agentur-blog\/wp-content\/uploads\/2016\/12\/Was-ist-gutes-Webdesign-Zielgruppenorientiert.png\" alt=\"Was ist gutes Webdesign? | Webdesign ausgerichtet auf die Zielgruppe\" \/><br \/><span class=\"wp-caption-text\">Das Design der Website zugeschnitten auf die Zielgruppe &#8211; Designed von Big Blue Roo<\/span><\/p>\n<p><strong>Grundeigenschaften wie Alter, Geschlecht und technische F\u00e4higkeiten<\/strong> sollten als erstes in Betracht gezogen werden. \u00c4ltere Menschen sehen zum Beispiel oft nicht mehr optimal. Aus diesem Grund ist es empfehlenswert, keine zu kleine Schriftgr\u00f6\u00dfe auszuw\u00e4hlen. Au\u00dferdem interessieren sie sich eher f\u00fcr Seriosit\u00e4t und wertvolle Inhalte als f\u00fcr das Design einer Seite. J\u00fcngere Menschen hingegen legen mehr Wert auf ein hochwertiges Design und modernes Look and Feel.<\/p>\n<p>Demographische Eigenschaften sind aber nicht alles. Sowohl die Einstellung der Besucher als auch ihre Bed\u00fcrfnisse und Erwartungen spielen eine gro\u00dfe Rolle in der Gestaltung eines Webdesigns. Zum Beispiel wird sich eine informative Seite \u00fcber eine non-profit Umweltorganisation von einem modischen Online-Shop f\u00fcr Frauen nicht nur im Content, sondern auch in der visuellen Gestaltung deutlich unterscheiden.<\/p>\n<h2 class=\"blogdetailseite\" style=\"margin-top: 0;\">Fazit<\/h2>\n<p>Obwohl es allgemein gilt, dass gutes Webdesign technisch einwandfrei ist und reibungslos navigiert werden kann, k\u00f6nnen keine weiteren spezifischen Eigenschaften fest definiert werden. <strong>Im Mittelpunkt steht hingegen der User<\/strong>. Gutes Webdesign ist in dem Sinne benutzerfreundliches und zielgruppenorientiertes Webdesign \u2013 ein Design also, das die Bed\u00fcrfnisse und Erwartungen der Nutzer erf\u00fcllt.<\/p>\n<p class=\"cta-kontakt\"><strong>Sie planen einen neuen Internetauftritt oder ben\u00f6tigt Ihre Website ein Redesign?<\/strong> Wir informieren Sie gerne in einem unverbindlichen Erstgespr\u00e4ch \u00fcber die vielf\u00e4ltigen technischen und visuellen M\u00f6glichkeiten zum Thema Webdesign.<\/p>\n<p><a class=\"cta-kontakt-button\" title=\"Kontaktaufnahme - Der Informationsdesigner | Agentur f\u00fcr Webdesign aus dem Allg\u00e4u\" href=\"https:\/\/www.der-informationsdesigner.de\/kontakt\/index.php\">Kontaktieren Sie uns<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Gutes Webdesign ist also mehr als nur Dekor. Gutes Webdesign ist ein entscheidender Erfolgsfaktor f\u00fcr die Firmen-Webseite und letztendlich f\u00fcr das ganze Unternehmen. Wenn das Webdesign so wichtig ist, wie entscheidet man, ob das Design der eigenen Firmenwebseite hochwertig ist?<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1,3],"tags":[14,9],"class_list":["post-789","post","type-post","status-publish","format-standard","hentry","category-allgemein","category-webdesign","tag-content-management-system","tag-responsive-webdesign"],"modified_by":"thomas.soyter","_links":{"self":[{"href":"https:\/\/www.der-informationsdesigner.de\/agentur-blog\/wp-json\/wp\/v2\/posts\/789","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.der-informationsdesigner.de\/agentur-blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.der-informationsdesigner.de\/agentur-blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.der-informationsdesigner.de\/agentur-blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.der-informationsdesigner.de\/agentur-blog\/wp-json\/wp\/v2\/comments?post=789"}],"version-history":[{"count":36,"href":"https:\/\/www.der-informationsdesigner.de\/agentur-blog\/wp-json\/wp\/v2\/posts\/789\/revisions"}],"predecessor-version":[{"id":2605,"href":"https:\/\/www.der-informationsdesigner.de\/agentur-blog\/wp-json\/wp\/v2\/posts\/789\/revisions\/2605"}],"wp:attachment":[{"href":"https:\/\/www.der-informationsdesigner.de\/agentur-blog\/wp-json\/wp\/v2\/media?parent=789"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.der-informationsdesigner.de\/agentur-blog\/wp-json\/wp\/v2\/categories?post=789"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.der-informationsdesigner.de\/agentur-blog\/wp-json\/wp\/v2\/tags?post=789"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}