{"id":4897,"date":"2017-02-27T14:15:27","date_gmt":"2017-02-27T12:15:27","guid":{"rendered":"https:\/\/8660.at\/?p=1027"},"modified":"2017-02-27T14:15:27","modified_gmt":"2017-02-27T12:15:27","slug":"erste-hilfe-web-typografie","status":"publish","type":"post","link":"https:\/\/zeichenschatz.net\/en\/typografie\/erste-hilfe-web-typografie\/","title":{"rendered":"Erste Hilfe Web Typografie"},"content":{"rendered":"<p class=\"lead-in\">Das Web ist Text und Webdesign ist Typografie.\u00a0Doch\u00a0leider wird Typografie\u00a0oft\u00a0zu einem Randthema. Websites mit schlecht gesetztem Text\u00a0funktionieren schlechter \u2013 ihre Inhalte kommen nicht so an, wie sie es sollten. Typografie geht deshalb alle etwas an, die im Web arbeiten.<\/p>\n<p>\u201e95 % of the information on the web is written language\u201c <a href=\"https:\/\/ia.net\/topics\/the-web-is-all-about-typography-period\/\" target=\"_blank\" rel=\"noopener noreferrer\">schrieb<\/a> Oliver Reichenstein 2006 und schloss daraus, dass es bei Webdesign vorwiegend um Typografie ginge. Diese Behauptung best\u00e4tigt sich \u00fcber zehn Jnahr sp\u00e4ter in Zeiten des Responsive Webdesign umso mehr. Denn was bleibt vom Design, wenn die Website auf der Gr\u00f6\u00dfe eines Smartphone Displays reduziert wird? Genau, vor allem Text.<\/p>\n<p><em>Typografie ist das Sichtbarmachen von Sprache durch den Umgang mit Schrift<\/em> ist meine freie Definition dazu. Und das Ziel der Lesetypografie im Web sollte es sein, den Inhalt einer Website m\u00f6glichst optimal darzustellen und dadurch zu vermitteln. Typografie ist dabei keine exakte Wissenschaft, wenn sie auch der Bereich des Kommunikationsdesigns mit den l\u00e4ngsten Traditionen und Konventionen nun dadurch auch \u201eRegeln\u201c ist. Aber Regeln gibt es um sie dem Anlass entsprechend zu biegen und zu brechen. Nur um sie biegen und brechen zu k\u00f6nnen m\u00fcssen wir sie verstehen. (Typo)grafisch wie technisch.<\/p>\n<h2>Wir hatten noch nie so wenig\/viel typografische Kontrolle<\/h2>\n<p>Noch nie hatten wir als Designer so wenig Kontrolle \u00fcber das Ergebnis der Typografie wie im Web. Wir wissen nicht welches Ger\u00e4t mit welchem Betriebssystem auf welcher Aufl\u00f6sung mit welchem Display verwendet wird und dabei auch alles korrekt geladen wird. Wir die Website \u00fcberhaupt \u00fcber den Browser konsumiert oder \u00fcber einen Bookmarking Service wie Instapaper? Wird sie \u00fcberhaupt gelesen oder vorgelesen? Im Vergleich zum Setzen eines Buches oder Magazins haben wir fast keine Kontrolle \u00fcber das Ergebnis.<\/p>\n<p>Andererseits hatten wir noch nie so viel typografischen M\u00f6glichkeiten im Web wie heute. Dank <strong>Webfonts,<\/strong> immer besser werdender Displays und Browser, den zahlreichen M\u00f6glichkeiten in <strong>CSS<\/strong> und rosigen Zukunftsaussichten von <strong>Open Type Features<\/strong> oder <strong>variable Fonts<\/strong>. Nat\u00fcrlich bleibt die allgemeine Unsicherheit des dargestellten Ergebnisses, die es im Webdesign immer gibt, erhalten. Aber wenn wir das Wort Kontrolle mit Einfluss austauschen, sieht die Welt gleich ganz anders aus. Ich gebe lieber den Wunsch nach Kontrolle auf und schaffe die besten Rahmenbedingungen, die mir m\u00f6glich sind. Und in den allermeisten F\u00e4llen wird das zu einem besseren Ergebnis f\u00fchren.<\/p>\n<p>F\u00fcr mich pers\u00f6nlich war die Besch\u00e4ftigung mit HTML und CSS in den letzten f\u00fcnf Jahren ein gro\u00dfer Gewinn von Einfluss. Denn wenn <em>ich<\/em> mich nicht mit Web Typografie und den M\u00f6glichkeiten dahinter besch\u00e4ftige, wer dann? Nat\u00fcrlich gibt es die Developer, die ebenfalls Wert darauf legen und Designs sehr sorgf\u00e4ltig umsetzen. Doch wie gut ist mein Design, wenn es nicht unter vollem Bewusstsein der technischen M\u00f6glichkeiten entworfen wird? Wenn ich das Thema Typografie im Web wirklich erst nehme f\u00fchrt kein Weg am Code vorbei. So konnte ich mein typografisches Wissen ins Web tragen.<\/p>\n<h2>Vortrag beim Webclerks Meetup<\/h2>\n<p>Ich habe das Thema beim <a href=\"https:\/\/www.meetup.com\/de-DE\/webclerks\/events\/236971660\/?comment_table_id=476408796&amp;comment_table_name=event_comment\" target=\"_blank\" rel=\"noopener noreferrer\">Webclerks Meetup<\/a>\u00a0am 27. Februar 2017 vorgestellt. Die Slides dazu sind <a href=\"https:\/\/de.slideshare.net\/zeichenschatz\/erste-hilfe-web-typografie\" target=\"_blank\" rel=\"noopener noreferrer\">hier<\/a> zu finden.<\/p>\n<p><iframe loading=\"lazy\" title=\"Erste Hilfe Web Typografie\" src=\"https:\/\/www.slideshare.net\/slideshow\/embed_code\/key\/2lltzdysOtYW3T\" width=\"427\" height=\"356\" frameborder=\"0\" marginwidth=\"0\" marginheight=\"0\" scrolling=\"no\" style=\"border:1px solid #CCC; border-width:1px; margin-bottom:5px; max-width: 100%;\" allowfullscreen> <\/iframe> <\/p>\n<div style=\"margin-bottom:5px\"> <strong> <a href=\"https:\/\/de.slideshare.net\/zeichenschatz\/erste-hilfe-web-typografie\" title=\"Erste Hilfe Web Typografie\" target=\"_blank\">Erste Hilfe Web Typografie<\/a> <\/strong> from <strong><a href=\"https:\/\/www.slideshare.net\/zeichenschatz\" target=\"_blank\">Oliver Sch\u00f6ndorfer<\/a><\/strong> <\/div>\n<h2>Rettet die Web Typografie<\/h2>\n<p>Wir k\u00f6nnen die typografische Qualit\u00e4t des Webs verbessern, wenn es ein breiteres Bewusstsein daf\u00fcr gibt. In den n\u00e4chsten Blog-Beitr\u00e4gen werde ich auf einige Einzelaspekten von Web Typografie eingehen. Es wird unter anderem um die Wahl der Schrift, harmonische Ma\u00dfe, gef\u00e4hrlichen Blocksatz, Fake Fonts und teuflische Details gehen. Wie immer freue ich mich \u00fcber Anregungen und Kommentare.<\/p>","protected":false},"excerpt":{"rendered":"<p>Das Web ist Text und Webdesign ist Typografie.\u00a0Doch\u00a0leider wird Typografie\u00a0oft\u00a0zu einem Randthema. Websites mit schlecht gesetztem Text\u00a0funktionieren schlechter \u2013 ihre Inhalte kommen nicht so an, wie sie es sollten. Typografie geht deshalb alle etwas an, die im Web arbeiten. \u201e95 % of the information on the web is written language\u201c schrieb Oliver Reichenstein 2006 und [&hellip;]<\/p>","protected":false},"author":3,"featured_media":4927,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[12],"tags":[380,412],"class_list":["post-4897","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-typografie","tag-typografie","tag-web-typografie"],"_links":{"self":[{"href":"https:\/\/zeichenschatz.net\/en\/wp-json\/wp\/v2\/posts\/4897","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/zeichenschatz.net\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/zeichenschatz.net\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/zeichenschatz.net\/en\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/zeichenschatz.net\/en\/wp-json\/wp\/v2\/comments?post=4897"}],"version-history":[{"count":0,"href":"https:\/\/zeichenschatz.net\/en\/wp-json\/wp\/v2\/posts\/4897\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/zeichenschatz.net\/en\/wp-json\/wp\/v2\/media\/4927"}],"wp:attachment":[{"href":"https:\/\/zeichenschatz.net\/en\/wp-json\/wp\/v2\/media?parent=4897"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/zeichenschatz.net\/en\/wp-json\/wp\/v2\/categories?post=4897"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/zeichenschatz.net\/en\/wp-json\/wp\/v2\/tags?post=4897"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}