Podcast Episode 8 – Schlechte Typografie kann tödlich sein für die User Experience (UX)

Typografie und ihre Bedeutung für User Experience

Oliver Haake-Klink
Ich begrüße zur heutigen Distriko Perspektiven Podcast Folge. Und das Thema heißt, wie schlechte Typografie tödlich sein kann für deine Website, User Experience und für die Accessibility. sind ja alles viele Themen. Zu Gast ist heute der, wenn nicht überhaupt bekannteste, wie ich finde, Designer für das Thema

Typografie im deutschsprachigen Raum. Er hat einen schönen Vornamen, Oliver Schöndorfer. Und insofern, das musste ich mir nehmen. Das durfte ich nicht weglassen am Anfang. Das muss mit drauf. Und ja, ich begrüße dich sehr herzlich, Oliver. Ich finde es total cool, dass du dir die Zeit genommen hast heute, dass wir mal über Typografie ein bisschen fachsimpeln können.

Oliver Schöndorfer
Ja, ich freue mich auch extrem. Ich habe nicht nur den schönsten Vornamen Oliver, sondern auch einen schönen Nachnamen mit schönen Dorf.

Oliver Haake-Klink
Ja.

Da hast du noch einen oben drauf gesetzt. Sehr gut, das stimmt. okay, ich sag gar nicht viel am Anfang drumherum. Ich erwähne nur wieder ganz kurz unseren distriko Werte-Kompass. Das ist einfach so eine aus Erfahrung gewachsene kleine Mini-Seite, die wir gebaut haben, wo so ein paar Punkte aufgeschrieben sind. Und dort steht was zu unseren persönlichen Werten und auch, wie wir einfach wollen, dass Menschen abgebildet sind, sollten in dem Zusammenhang hier irgendwelche…

Oliver Schöndorfer (20:09.027)
Okay.

Oliver Haake-Klink (20:36.21)
Verstöße passieren oder jemand sich nicht entsprechend repräsentiert fühlen, dann bitte einfach im Nachhinein an podcast@distriko.de eine E-Mail schreiben. Dann können wir dort auch irgendwelche eventuellen Missverständnisse ausräumen. Ich denke, ist in Sachen Housekeeping schon vollkommen ausreichend. genau insofern, ja, wie gesagt, ich hatte gerade schon Oliver Schöndorfer namentlich erwähnt und

sich vielleicht so ein kleines Intro gönnt. er betreibt einen YouTube-Kanal und auch ein Portal oder eine Website PimpMyType und beschäftigt sich da eben mit seinem Lieblingsthema der Typografie. ja, ich finde es sehr cool, dass du heute dir die Zeit nimmst und wir das mal hier einfach festhalten dürfen, was du zu dem Thema zu sagen hast, lieber Oliver.

Oliver Schöndorfer
Gerne.

Einführung in das Thema Typografie

Oliver Haake-Klink
Gut, Dann sind wir schon mittendrin. Typografie, Schriftarten generell, diese finden wir in verschiedensten täglichen Anwendungen. Jeder kennt es im E-Mail-Programm, im Smartphone-Interface von irgendwelchen Apps, im Web-Interfaces, in Print-Medien etc. Also Schrift ist eine wichtige Sache. Die hat eine Grundfunktion.

Wie definierst du denn einfach eine geeignete Schriftart, Oliver? Was macht denn eine Schriftart aus? Wie wählt man die geeignete Schriftart aus?

Oliver Schöndorfer
Ja, wenn es jetzt darum geht, das gute oder eine gute Schrift ist natürlich ein Grundbaustein von einer geeigneten Kommunikation in jeder Hinsicht. Aber ich möchte vielleicht vorher noch einmal darauf zurückkommen, dass die Typografie selbst oder die Schrift vor allem im digitalen Kontext einen so wichtigen Stellenwert hat, der einfach oft übersehen wird, weil Schrift überall ist, wie du schon gesagt hast.

aber oft einfach unsichtbar ist. Und wenn sie unsichtbar ist, dann hat sie es richtig gemacht, weil sie in der Art und weil sie nicht negativ auffällt. Aber häufig fällt sie doch negativ auf, ohne dass man es wirklich bemerkt, dass es an der Schrift liegt oder an der Art, wie sie verwendet wird. Und Typografie selbst ist ja gar nicht jetzt so die Schriftwahl, sondern eher der Umgang mit der Schrift. Und ein eigenes Kapitel ist eben, Schrift auszuwählen. Und wenn jetzt Leute schon die Möglichkeit haben, sich eine Schrift auszusuchen,

Dann ist das oft, wie du schon sagst, die Qual der Wahl. Du gehst auf Google Fonts oder auf andere Schriftkataloge. Da müssen ja nicht immer die Free Fonts sein. Zum Beispiel auf Pimp My Type, da kann man viele Schriften nachschauen. Habe ich jetzt schon 201 reviewt. Über die letzten Jahre hinweg. Und da kann man sich mal inspirieren lassen und schauen, was gibt es denn da für Möglichkeiten. Und da ist immer die Frage, wofür eignet sich diese Schrift? Weil es gibt, wenn ich so möchte, drei verschiedene Kategorien an Schriften. Es gibt einerseits die

Displayschriften, das sind nicht wegen Computerdisplay, sondern die in Schaugrößen sind. Das heißt, etwas, was jetzt zum Beispiel größer ist als 24, 25, 30 Punkte, also was für Überschriften, für kurze, große Texte, Einleitungstexte, vielleicht ein Pullquote oder irgend sowas. Etwas, was interessant ist, was dich reinziehen soll, was gern zum Thema passen kann, vielleicht so was ein bisschen klassisch wirkt, wenn es irgendwie ernstere Themen geht, eine Serifenschrift.

Oder vielleicht ein bisschen historisch Richtung gebrochene Schriften kann auch funktionieren. Und die Schriften müssen nicht super easy zu lesen sein. Die können ruhig interessant ausschauen, wenn sie für wenig Text verwendet werden. Die sollen dich eher verführen da hinein zu gehen. Und bei diesen großen Schriften, da kannst du dich richtig, richtig frei orientieren. Da nimmst du das, wo du denkst, das passt gut zum Thema und dann probierst es mal aus.

Oliver Schöndorfer
Und dann haben wir noch zwei andere Kategorien eben. Das eine wären die Fließtextschriften. Das sind die Schriften, die du brauchst einfach für den langen Textsatz. Und natürlich liest ja auch nicht jeder und jeder die ganze Website oder die ganzen Texte, die dort sind. Wir wollen unsere Texte ja optimieren, dass Leute sie überfliegen können. Weil das ist ja der geheime Vorteil des Lesens versus Podcast hören, Video schauen, andere Sachen. Ich kann mich schnell orientieren, überfliegen, wohin springen.

Und diese Lesetexte, müssen gut, gut lesbar sein, indem die Schriften eher zurückgenommen sind, nicht allzu auffällig sind. Die sollen nicht wirklich Aufmerksamkeit auf sich ziehen. Außer natürlich für mich, ich sehe die immer, aber normale Menschen sehen die nicht. Also, für die verschwinden die einfach. Und da können das auch Serifenschriften sein, das können auch Serifenlose sein, also die mit diesen kleinen Füßchen dran sind, diese Serifenschriften, wie Times New Roman zum Beispiel, die haben man vielleicht.

und Arial ist jetzt oder Roboto oder Inter ist eine serifenlose die so schlicht und mit diesen kann man beiden ganz gut arbeiten also es kommt dann eher auf Details dann da noch an wo man noch darauf eingehen kann wenn wir wollen aber es ist schon sehr „nurdig“ dann und dann abschließend gibt es noch die funktionalen texte also das ist dann mehr oder weniger das ganz kleine in einem user interface die menü labels deine texte in einem interface

Also wenn du jetzt so Warnungen bekommst oder andere Dinge und zum Beispiel auch die Sachen, jetzt in ein, Passwortfeld, Inputfelder, das sind alles so sehr funktionale Texte, die müssen einfach richtig gut klappen. Kontrast haben, in kleinen Graden funktionieren, gut leserlich sein. Also das sind wirklich die, wo es besonders drauf ankommt, dass das Ganze dann funktioniert. Vor allem, dass diese Dinge auch in der Usability nicht zu einem Problem führen.

Oliver Haake-Klink
Punkt. Das kann man nicht besser in einem Atemzug sagen. Korrekt. Ja, es ist so wichtig. Man kennt die Probleme, die entstehen. Ich weiß nicht, ob du die ganz, ganz, wie ich immer ganz sehr liebe, irgendwelche Webseiten, die dann vermeintlich mit Schriften wichtige Inhalte vermeintlich verstecken. Man hat das Gefühl, irgendwo in einem Footer …

zwei verschiedene Graufarbtöne aufeinander gelegt, so ganz blass sind dann irgendwelche Verlinkungen auf der Seite gerade so mit Lupe oder mit Browserzoom noch findbar, wo ich mal sage, bedient diese Seite denn nicht mal auch jemand, selbst der das dann macht. Aber gut, sind halt Dinge, da beschäftigen wir uns vermutlich auch in dem digitalen Raum mehr als andere damit, ganz klar. Die Frage ist,

Oliver Schöndorfer
Ja.

Schriftauswahl und Schriftgrößen

Oliver Haake-Klink
Wenn wir uns den jeweiligen Anwendungsfall ausgewählt haben und die vielleicht auch ein, zwei oder drei maximal geeignete Schriftarten auswählen, wie gehst du da vor? Wie machst du das? Und auch vielleicht, wie clusterst du diese Schriftgrößen auf? wenn du jetzt vorhin auch schon von Überschriften gesprochen hast und Fließtexten und so weiter, wie wählt man da die passenden Schriftgrößen aus?

Oliver Schöndorfer
Mh.

Oliver Schöndorfer
Okay, also du meinst jetzt die Schriftgrößen oder die Schriftauswahl noch?

Oliver Haake-Klink
Ja, wie man einfach die richtige Kombination baut. Wie verwendet man sie einfach richtig? Du kannst dir ja irgendein Beispiel mal rausnehmen. Wenn wir jetzt an einem Webprojekt sind, wird es logischerweise verschiedene Anwendungsfälle geben und auch Best Practices in verschiedenen Szenarien geben. Aber wenn wir vielleicht bei einem klassischen Webthema einfach mal bleiben. Wie baut man sowas auf? Wie wählt man da die passende Schrift und die Größe einfach richtig aus?

Oliver Schöndorfer
Okay.

Oliver Schöndorfer
Ja,

Ich würde mal mit dem Thema anfangen. Was ist denn das Wichtigste an dieser Seite? Das Wichtigste, ist es eher eine Marketing-Seite oder ich sage jetzt damit Marketing, hat es eine geringere Informationsdichte. Haben wir kurze Texte, dann können wir gerne von Displayschriften starten. Oft sind diese Sachen ja vom Branding auch vorgegeben. Ist ja nicht so, dass

Die Projekte, an denen ich arbeite, wenn ich berate, häufig so, dass die Marketing-Abteilung oder das Branding haben schon eine Schriftfamilie definiert. Häufig ist es dann aber so, dass diese Schriftfamilie nicht funktioniert in gewissen Situationen. Und dann baut man ein Designsystem auf, mit Schriftgrößen und all diesen Dingen. Und dann wird es einfach schwierig, wie funktioniert das in diesen Situationen oder eben auch nicht. Und eine Situation ist dann…

Ich habe jetzt was Marketing-Lastiges und ich habe die freie Wahl. Dann kann ich wie gesagt etwas nehmen, was zum Thema passt und dann mache ich eine interessante Typografie vielleicht. Da brauche ich mir nicht so viel Gedanken machen. Es kommt wirklich immer auf den Umfang des Projektes an. Und wenn es jetzt aber eine Seite ist, wo ich viele Informationen habe, eine Versicherungs-Webseite, vielleicht ist es ein Onlineshop, wo ich auch Descriptions habe zu meinen Produkten.

Vielleicht ist es etwas, wo ich natürlich dann in meinem Produktraster Titel von Produkten habe und so weiter. Das sind dann alle Situationen, wo ich natürlich die Schriften strapazieren muss. Das heißt, hier würde ich ausgehen eher von einer dieser funktionalen Schriften, damit ich von dem Anwendungsfall starte, der am kritischsten ist oder der am wichtigsten für den Erfolg der Seite ist. Das müssen wir uns dann einfach immer von Fall zur Fall überlegen. Und dann

Oliver Schöndorfer
Wenn ich jetzt mir anschaue, funktioniert diese Schrift in den verschiedenen Graden? Und das heißt, ich muss zumindest davon ausgehen, bei funktionalen Texten wird der Text oft etwas kleiner gesetzt. es ist, unser Default Size sollte schon die 16 Pixel ein Rem oder Em sein, Default Größe, aber für unsere funktionalen Texte innerhalb einer Website wie zum Beispiel Hilfetexte, da ist eine Aktion oder sonst irgendwas.

Diese Texte sind sehr kurz und deshalb auch oft kleiner. Wenn diese Texte 16 Pixel groß sind oder 17 oder 18, dann wirkt das schnell sehr plump, sehr klobig. Es macht es auch schwieriger, Interface dann nochmal zu skalieren. Falls wir das denn möchten, muss es ja auch möglich sein, auf 200 Prozent Skalierbarkeit zu haben, was Barrierefreiheitsrichtlinien betrifft. Und da…

geht es dann darum, mit diesen 14 Pixel oder so manchmal auch gut arbeiten zu können und zu schauen, kann man das noch gut lesen. Und wenn jetzt ein Unternehmen zum Beispiel eine Schrift hat, ist ein bisschen zu leicht, also die Strichstärke ist zu dünn. Ich habe da einmal einen beraten bei Tchibo, die haben auf ihrer Webseite zwei Schriftgrade gehabt. Die hatten die Regular Schrift und die Light Schrift und auch Bold, aber

Das war für den Bodytext was Regular und Light. Das Problem war, die Regular war zu fett für den Bodytext und ist in den kleinen Graden fast verlaufen. Und die Light war zu dünn. Es gab nichts dazwischen. Auch wenn die Schriftgrößen so, also die Schriftstärken so heißen, heißt es nicht, dass sie so ausschauen. Weil das ist immer anders bei jeder Schrift. Das muss man optisch beurteilen. Und dann war es einfach notwendig, eine Schrift zu finden, die sehr ähnlich ist. Das haben wir dann in dem Zuge, wo ich sie beraten habe, auch gemacht.

die auch gut funktioniert für User Interface und alle Sachen, ohne dass sie wirklich anders aussieht als die ganzen Sachen, schon in den Filialen und überall im nicht-online Bereich implementiert sind. Weil das wäre eine ziemliche Katastrophe, wenn ich jetzt wegen der Website da die Konsistenz auch wieder gefährde, weil das schon etwas ist, was sehr relevant ist. Und da muss man sich dann im Endeffekt immer diese Kriterien überlegen, was sind denn die Dinge, die ich besonders brauche? Mehrsprachigkeit.

Oliver Haake-Klink
Ja.

Oliver Schöndorfer
auch ein wichtiges Thema hat meine Schrift die Zeichen, Akzente, die ich eigentlich benötige, wenn ich sie aussuche. Wie ist es mit den Lizenzbedingungen? Ist das überhaupt leistbar für das Projekt? Ich habe mich schon sehr oft verliebt in Schriften und dann wurde mein Herz gebrochen, weil ich zu arm dafür bin. Also, das ist für den Use-Case. Und auch hier leider, Lizenzen sind immer anders. Ja.

Oliver Haake-Klink
Da habe ich Erfahrungswerte auch im Domainbereich gesammelt. Das würde jetzt hier den Kontext verlassen und den Rahmen sprengen. Es gibt Domains im Premiumbereich, die so viel Geld kosten, dass man sich als kleiner Mittelständler das Genick brechen kann, wenn man dort mal eben einfach Lizenzgebühren nicht kennen würde und die einfach kauft. Also das ist irre, was da für Premium dot-Art Domains zum Beispiel, wo es um Kunstprojekte und sowas geht.

Die können also sehr schnell sechsstellige Preise haben. Die sind richtig, richtig, richtig teuer, je nachdem, was es für Rubriken sind. Aber das ist ein anderes Thema. Würde jetzt von dem Schriftthema vielleicht zu sehr wegführen. Aber es ist gut, wie du gerade das so auch nochmal aus dieser wissenschaftlichen Perspektive einfach beleuchtest und auch das so sagst. Ich finde das so super cool, weil ja, das ist eine Schriftart.

Oliver Schöndorfer
Okay, wow.

Oliver Schöndorfer
Mhm, mhm.

Oliver Haake-Klink
Die hat so eine hohe Prägnanz und so eine hohe Relevanz und ist so wichtig. Und die wenigsten Leute machen sich auch diese vielen verschiedenen Anwendungsszenarien überhaupt vorweg Gedanken darüber. Und man setzt irgendwo auf irgendwas auf default, wie du schon sagst, und legt was fest, was aber gar nicht den verschiedenen digitalen Anwendungen gerecht werden kann. Und dann hat man ganz schnell solche Dilemma, wo man wirklich …

sich schwer wieder in die richtige Richtung bewegt. Habe ich auch schon, die Erfahrung habe ich auch schon selber gehabt.

Oliver Schöndorfer
Und die Leute, das macht ja niemand, weil er jetzt gemein ist oder irgendwie seinen Job schlecht machen möchte oder so. Das ist einfach, weil das nicht im Kopf ist. Mit Typografie ist alles gut, bis es nicht mehr gut ist. Also bis da nirgends was passiert, womit du nicht gerechnet hast. So wie immer. Und du denkst einfach, wieso soll da was passieren? Das Problem halt mit der Schrift ist, wenn du die Entscheidung getroffen hast und die Branding Agentur findet eine echt coole Schrift, ich hab für eine schwedische Versicherung letztlich beraten.

Oliver Haake-Klink
Mh.

Typografie in der Praxis

Oliver Schöndorfer
Die haben halt wirklich sehr lange Texte. Beschreibungen, da geht es um Pensionsversicherung. Und die waren sich sehr unsicher mit der Schrift, weil die Agentur hat das ausgewählt. Die war auch sicher, dass die gut ist. Leider funktioniert sie für die Fließ-Texte gar nicht gut, weil sie so kontrastreich ist und so fein ist. Und es sind meistens Leute auch, die schon älter sind. Die Sehstärke lässt nach. auch bei mir lässt die Sehstärke nach. Also man merkt einfach …

dass gewisse Dinge eine Hürde dann erzeugen. Und das Interessante war, diese Schrift ist so fein gewesen, dass sie auf schlechten Bildschirmen besser aussah, weil die das nicht so gut rendern konnten, als auf dem Handy. Und das Problem war, die meisten haben es halt auch am Handy angeschaut, was die Nutzerdaten gezeigt haben. Und dann sind wir da in einer Situation, wo wir eigentlich eine theoretisch gute Schrift haben, die aber in der Praxis dann doch nicht funktioniert. Und die Agentur hat das natürlich …

so in der Art und Weise auch nicht erwartet. Die hat geglaubt, vielleicht müssen Sie eh nicht so viel Texte schreiben. Und von der Atmosphäre super Schrift. Aber dann sind wir halt vor dieser Herausforderung gestanden, wo finden wir jetzt eine Schrift, die diesen praktischen Dinge funktioniert, wenn deine 6, deine 8 und deine 3 und deine 9 sehr ähnlich werden? Dann ist das ein Problem. Vor allem wenn es um Geld geht. Also optisch, ja.

Oliver Haake-Klink
Auf jeden Fall. Da kann es schnell zu ernsten Schwierigkeiten kommen natürlich auch ganz klar. Okay und wenn du jetzt schon dazu einen Fall von dem Versicherungsgenre rausgenommen hast, lass uns doch noch mal zu diesen Details in Sachen Zeilenabständen, Absetzen und den einzelnen Zeichen und so noch mal vielleicht was sagen. Magst da noch mal so ein paar Insights verraten wie

Oliver Schöndorfer
Ja klar.

Oliver Haake-Klink
Wie geht man denn darauf so ein, dass das ideal funktioniert?

Oliver Schöndorfer
Also in der Hinsicht sagen wir jetzt mal, mein wunderbares Sprachbild ist jetzt, dass Typografie ist so wie Steine schlichten, wenn man möchte. So Steinchen übereinander stapeln. Ich gehe im Sommer immer gern wandern, ich bin ja, wie man vielleicht unschwer hört, aus Österreich und wir haben einige Berge und das ist so mein Sommer-Escape. Dann bin ich ein paar Tage mit meiner Frau da auf ein paar tausend Metern unterwegs und da sieht man überall diese Steinpyramiden, wo jemand so ein Steinchen aufs andere legt.

Und so kann man sich das mit der Schrift und der Typografie auch vorstellen. Das sind vier Steine. Also wir haben den ersten Stein, das ist der größte Stein, das ist einfach die Schriftwahl. Oft ist diese Schriftwahl schon definiert. Das heißt, das Branding hat die vorgegeben oder die sind einfach so, weil wir müssen Systemschriften verwenden, kann auch eine Situation sein. Also es ist einfach definiert, der erste Stein. Und dann habe ich aber noch drei Steine, die oben drauf kommen, die das Bild von meiner Webseite und von meinen Sachen

noch mehr beeinflussen bzw. wo ich es noch mehr ruinieren kann, wenn ich möchte oder nicht möchte. Und der nächste Stein, den ich draufsetze, der ist größer. Danach kommt als nächstes Kontrast und dann kommt Abstände. Also das ist dann meine Pyramide, die ich oben habe. Und ich kann meine Schriftwahl oft kompensieren mit diesen anderen Sachen, mit den anderen Einstellungen. Das heißt, wenn meine Schrift vielleicht zu interessant wirkt oder zu fein ist,

Vielleicht kann ich sie größer machen, vielleicht kann ich sie dünkler machen, vielleicht kann ich die Abstände enger machen oder weiter machen, damit das Ganze dann wieder ein ausbalanciertes Pyramidchen wird aus Steinen. Also das ist so mehr oder weniger die Idee. Vielleicht aber, wie bei dem Fall der Versicherung, brauche ich einen anderen Stein noch dazwischen, der mir eine komplementäre Schrift dazugibt, damit ich die Schwächen meiner Hauptschrift vom Branding ausgleichen kann, der aber gut dazu passt.

Und vielleicht brauche ich noch einen dritten, vielleicht noch für andere Situationen zu funktionieren. Das ist dann, wenn es komplexer wird. Also so muss man sich das Ganze immer vorstellen, dass man alles ein bisschen ausbalanciert. Mache ich meine Schrift größer, muss ich vielleicht den Abstand wieder verändern. Oder kleiner muss ich ihn erhöhen. Und ein Beispiel ist jetzt, wenn wir jetzt über Zeilenabstände und diese Dinge reden, das ist eigentlich schon das letzte, was ich dann verfeinere, ist, dass man…

Oliver Schöndorfer
Also ich muss fast vorher nochmal was sagen über die Größe, weil die Größe ist wirklich eines der größten Haha-Probleme, weil wir oft Text zu klein sehen. Würde der Text einfach nur ein bisschen größer sein, würde das Ganze schon wesentlich besser funktionieren. Als Faustregel alles, was unter 16 Punkt oder Pixel oder wie auch immer die Einheit heißt, auf iOS und Android sind 17 Punkt die Standard-Größeneinheit.

Alles was kleiner ist als das für Fließtexte ist ein Problem. Es hängt wieder sehr von der Schrift ab, leider. Deshalb habe ich Arbeit, weil eine Schrift auf derselben Schriftgröße, technisch, kann optisch komplett anders wirken. Also es gibt Schriften, die schauen kleiner aus oder größer aus, obwohl sie auf die gleiche Größe gesetzt sind. Du nickst, hast du das schon erlebt, Oliver?

Oliver Haake-Klink
Es ist … Du Ja, wie soll ich sagen? Du sprichst mir aus der Seele in dem Thema. Und natürlich, du bist konkret, was das Typografie-Thema anbelangt. Wissenschaftlich noch so richtig tief drinne und deswegen halt natürlich noch weiter. Aber ich will einfach nur zuhören, ja, weil ich das so geil finde, wenn du da immer so in diese Details reingehst. … Ja, es ist … Es hat riesen Auswirkungen. Das kann man halt auch schwer oftmals auf Kundenebene

darlegen oder man muss sich kurz fassen, weil die Leute in der Tiefe vielleicht auch gar nicht das Interesse haben. So ist es in meinem Genre, wo ich jetzt vielleicht zu tun habe, eher so. Natürlich, man versucht die Relevanz und auch die Wichtigkeit zu klarzustellen. Aber wenn ich jetzt vielleicht für ein Webprojekt mich an solchen Parametern langhangel und es gibt vielleicht, wie du schon vorhin sagtest, auch vorhandene Werbe-Printmedien, die eingesetzt sind oder Filialen, wie du es bei deinem Kundenfall hattest.

wo es einfach schon Anwendungsfälle gibt, dann muss man natürlich gucken, wie baut man dort möglichst was auf, was sich nicht beißt, was letztendlich kein Konflikt oder was die Konsistenz gefährdet, wie du schon auch vorhin sagtest. Das sind halt so meine Anwendungsfälle. Gerade jetzt mit dem Smartphone-Bereich oder wenn es App-Gestaltung und so was geht, das ist definitiv nicht mein Kerngeschäft oder da kenne ich mich auch zu wenig im Detail aus. Allerdings ist es auch

einfach aus der Perspektive mal spannend zu hören, was dann für Probleme dort entstanden sind bei deinen Beratungsprojekten.

Markenbeispiele und Fehler

Können wir vielleicht direkt mal eins weitergehen und zu dem, ja vielleicht zu so einem Markenbeispiel mal kommen. Kennst du eine berühmte Marke Apple? Haben die da in dem Bereich vielleicht mal irgendwie ein Fail gelandet?

Oliver Schöndorfer
Natürlich, ja habe ich ja auch vor einem Jahr haben wir alle dieses traumatische Erlebnis noch in Erinnerung bei der World Wide Developer Conference 2025, wo sie Liquid Glass vorgestellt haben und das ist halt wirklich ein super Beispiel, wo man merkt, dass es die Schrift war, du kannst die beste Schrift haben, weil es SF Pro ist die Schrift, die sie haben, die ist super leserlich, die funktioniert gut, die ist technisch top, also die hat optische Größen.

Die verändert die Zeichenabstände, je nachdem, ob ich sie kleiner oder größer mache. Auch die Öffnung der Buchstabenformen wird angepasst, je kleiner und je größer sie ist, dass es wirklich leserlich bleibt. So eine gute Schrift, so gut überlegt. Und dann setzt man sie einfach in weiß auf Glas. Du kannst aber nichts mehr sehen.

Oliver Haake-Klink
Ich habe dein Video dazu unter anderem auch gefeiert. Das war eines der wahrscheinlich auch vermeintlich besten auf den Punkt gebrachten Reels, die ich dazu in Erinnerung behalten habe. Das ist wirklich gruselig.

Also ganz ehrlich, ich habe auch da kein gutes Wort daran gelassen an dem Thema, wenn es jetzt intern, also in der Familie auch diese Sache ging. Und wir müssen jetzt hier nicht irgendwelche Bashing von irgendwelchen Marken betreiben. Aber es ist wirklich nicht nachvollziehbar, wie eine Person mit so einer hohen Verantwortung, wenn ich mir überlege, wie viele Millionen Devices da im Markt unterwegs sind. Und ich entscheide dann so eine Sache und hebel die Grundfunktion aus, dann

Frage ich mich wirklich, wie kann so ein Fehler passieren?

Oliver Schöndorfer
Ja, es gibt jetzt im Update, das haben sie gerade vorgestellt, auch die Möglichkeit, dass du es mehr getönt machst und noch transparenter für alle, die es nicht genug schlecht hatten. Aber ich muss ehrlich, also jetzt kommt jetzt, wir können ja bisschen unter uns, ich kann jetzt ehrlich reden, weil du kannst ja auch alles so auf Glasoptik einstellen, dann schaut jedes Icon gleich aus, also es gibt keine Farbeunterschiede mehr und so weiter.

Und ich habe das damals ja nur gemacht, damit ich mich ärgere und einfach die Wut in mir weiterhin am Leben bleibt. Andererseits muss ich feststellen, ich habe letztlich, weil ich ein Appdesign gemacht habe mit Widgets, wieder auf Farbe gestellt und mir ist aufgefallen,

wie furchtbar ablenkend dieses Handy geworden ist. Also ich finde nichts auf diesem Handy, weil jedes Icon gleich ausschaut. Ich muss immer in die Suche gehen und den Namen der App eintippen, damit ich es finde. Aber es ist eigentlich ein Vorteil, weil es ist umständlicher und dadurch hat es mehr Friktion, damit verwende ich dieses Handy weniger. Also wenn man Digital Detox machen möchte, dann ist es eigentlich eine gute Idee, wenn man es nicht lesen kann.

Wie man sieht, ist das immer kontextabhängig,

Oliver Haake-Klink
Argumentation. Das eine gute Argumentation. Das Handy einfach öfter mal weglegen. Das ist der Grund, was Apple damit ein Stück weit vielleicht beflügelt oder befeuert hat.

Oliver Schöndorfer
Absolut.

Wahrscheinlich eher nicht. Es ist eher einfach passiert und ich denke die Motivation dahinter, dass es einfach eine Vermutung war, wir müssen was Neues machen, machen wir irgendwas shiny Neues, okay, es schaut cool aus. Aber es ist aus der Effekthascherei wirklich funktional ein Rückschritt gewesen.

Oliver Haake-Klink
Und das Schlimme an der Sache ist, wenn ich dann so eine wichtige Position im Markt der digitalen Sachen habe, es lehnen andere ja ihre Designs auch noch daran an und greifen das auf und machen das weiter und verwenden es in irgendwelchen… Ja, also ich habe einfach eine Verantwortung auch damit in dem Moment, wenn ich sowas publik mache.

Oliver Schöndorfer
Das ist das Problem. Ja.

Oliver Schöndorfer
Ja.

Richtig. Und das ist halt einfach der Punkt. Man merkt aber vor allem auch, was hat Apple gemacht. Also das sind jetzt super Nuancen und Details. Sie haben die Schriftstärke erhöht. Sie haben die Zeichenabstände erhöht, damit das alles noch gerade funktioniert. damit es nicht so furchtbar ist. Aber der Hintergrund, wenn der Hintergrund durchscheint und der Hintergrund sich verändernd ist, dann hast du im Endeffekt keine Chance. Je transparenter es ist und je glasmäßiger es ist, per Definition halt durchsichtig in dem Fall.

Das ist halt blöd, Und das ist einfach falsch abgebogen. Und da merkt man wieder, dass die Schriftwahl alleine nicht so das Hauptargument ist. Und das kann eine gute Schrift sein, aber halt nicht ideal verwendet, in dem Fall wegen dem Kontrast.

Oliver Haake-Klink
Absolut.

Oliver Haake-Klink
Genau. Jetzt haben wir uns Apple vorgeknüpft. Da gibt es noch so einen großen Möbelriesen. Vier Buchstaben. IKEA hat auch schon mal irgendwie daneben gegriffen, oder? Kann das sein?

Oliver Schöndorfer
Genau.

Oliver Schöndorfer
Das stimmt, das stimmt. IKEA hat in der Hinsicht ja eine traditionelle oder die wurden ja sehr bekannt, weil sie clevererweise die Futura verwendet haben. Futura ist eine sehr schlichte Schrift, wirkt zeitlos, wird aber, halte dich fest, nächstes Jahr 100 Jahre alt. Also es ist arg wie gut diese Schrift gealtert ist. Natürlich in den Details gibt es auch Probleme und gibt auch neuere Versionen, die sehr toll sind. Meine Lieblingsversion ist

Futura100 von Time Together, die letztes Jahr rausgekommen ist, die auch in vielen verschiedenen Sprachen und Schreibsystemen sind, also auch in thailändisch, koreanisch und arabisch und weiteren. Und da hat man damals bei IKEA die Entscheidung gehabt, Futura, das ist unsere Hausschrift, das ist die Schrift, die wir verwenden. Es kam natürlich, muss man sagen, auch noch nicht so viele Schriften damals, wie es heute gibt. Und dann

hat man aber gemerkt, die Leute verwenden mehr das Internet, und zwar war das 2007, als den Katalog, den wir noch gedruckt haben. das Problem war, im Internet gab es halt damals noch keine Webfonts. Da gab es Lizenzprobleme, Performanceprobleme. Jetzt haben sie gesagt, okay, wir müssen halt die Systemschriften nehmen, die es gibt. Und das war damals unter anderem Arial, Verdana und so weiter. Und sie haben sich entschieden für Verdana.

Was jetzt keine so schlimme Wahl ist, wenn du sagst, hast jetzt nur ein paar Systemschriften zur Auswahl. Und damals hatten wir auch nur Desktopcomputer, da gab es mobil so gut wie noch gar nicht. Und im Endeffekt hat man halt eine genommen, die am besten gepasst hat. Aber das Problem ist, dass dann IKEA entschieden hat, nein, nein, nein, wir nehmen nicht die Verdana nur für die Website, sondern wir nehmen die einfach für alles, überall, immer. Und das war einfach der Fehler, weil die Verdana auch eine super Schrift.

Aber am falschen Platz. Die ist gemacht für Bildschirme mit geringer Auflösung. Du weißt noch die Röhrenmonitore, die wir damals hatten in den 90ern. Die wurden in den 90ern von Matthew Carter entworfen für Microsofts Superschrift. Kleine Größen, schlechte Auflösung, Verdana funktioniert immer noch. Also dafür wurde sie gemacht. Und die ist da auch besser als die Futura. Aber wenn du die jetzt in Überschriften verwendest, in großen Texten, in diesen schönen

Oliver Schöndorfer
Display-Texten einfach, dann schaut die einfach nur klobig und grob aus, die braucht total viel Platz und die zerstört halt einfach total viel und da gab es einen Aufschrei, weltweiten Aufschrei gegen diesen Wechsel, wo dann auf einmal alles, die Schilder, die Kataloge, die ganzen Produkt Bezeichnungen, also die Labels, die Verpackungen.

Alles Verdana, alles geändert. Und IKEA hat das im Endeffekt weggesteckt. Ja, gesagt, ja, werden sich schon die Leute daran gewöhnen. Ästhetik ist halt zurückgefallen. Und dann haben sie aber festgestellt, zehn Jahre später, dass Verdana auch nicht mehr unterstützt wird. Weil auf Android gibt es kein Verdana. Es gibt kein Verdana auf Android. Es gibt keine Systemschriften von diesen klassischen, die wir hatten.

Verdana hat nicht funktioniert in Arabisch, wo IKEA auch einen Markt hat, in Thailand, in Korea auch nicht funktioniert, wo sie gerade Märkte geöffnet haben. Das heißt, die mussten dort auch schon wieder Ersatzschriften wählen und dann war das Ganze wieder inkonsistent. Und im Endeffekt haben sie sich dann für eine Version von Noto entschieden. Das ist eine bessere Variante auf jeden Fall. Alles nicht so elegant wie Futura, aber sie mussten dann über den Weg zurückgehen. Und das ist halt

die Art und Weise, wo man merkt, wo Schrift einen Einfluss hat. Weil wenn das Ding mal drinnen ist, dann ist es die Hölle schwer, das wieder rauszukriegen. Also, und dann hat man nur Arbeit, das rauszukriegen. du musst jetzt gar nicht IKEA sein. musst jetzt sagen, das ist Webprojekt, bin ja nicht IKEA. Was interessiert mich das, was der Oliver erzählt. Das verstehe ich. Aber in dem Fall geht es darum, dass selbst wenn du nur eine andere Schrift dann in deinem Webprojekt verwendest und du tauschst sie aus,

Das Risiko ist extrem hoch, dass nachher alles verrutscht. Die Schriftgrößen passen nicht mehr, die Zeichenabstände passen nicht mehr, weil diese Schrift eine eigene Metriken hatte als die andere. Und dann merkst du im Nachhinein, ich muss das alles wieder anschauen und überarbeiten. Und das ist Zeit und Energie und Aufmerksamkeit, die an der Stelle hineinfließt, weshalb es total sinnvoll ist oder sagen wir so, weshalb ich häufig gefragt werde um Hilfe.

Oliver Schöndorfer
Wenn eben dieser Punkt ist, dass man ein Designsystem aufbaut, Designsystem erweitert, ein Rebranding gekommen ist und bevor jetzt alles implementiert wird, möchte man vielleicht auch noch mal auf Nummer sicher gehen, ob das in allen Situationen gut funktioniert.

Oliver Haake-Klink
Genau so sieht es aus. Besser kann man das nicht sagen. Es ist wirklich genauso, wie du es gerade sagst. Da können vor allen Dingen die Leute, denke ich, mitreden, die in der Branche sich solche Arbeit gemacht haben. Es gibt nichts Schlimmeres als kontextlos irgendwelche Wireframes oder vielleicht auch in der Theorie Layouts zu entwerfen, ohne final den Kontext zu kennen oder den Inhalt des Textes, weil das hinterher letztendlich

alles kaputt macht oder oftmals zu unnötigen Mehrarbeiten führt. So gehe ich beispielsweise auch selber in Webprojekten vor, dass ich gerne in direkten Staging-Umgebungen sowas baue und dann auch wirklich also versuche so echt wie möglich mich an ein Webprojekt heranzuhangeln, wenn es bis zu einem Relaunch kommt, nahezu die echte Seite schon vorher

zu haben, die dann auch nur noch letztendlich auf der richtigen Domain veröffentlicht wird. Dass solche Überraschungen möglichst ausbleiben.

Oliver Schöndorfer
Ja.

Fazit und Ausblick

Oliver Schöndorfer
Ja, aber da muss ich gleich einhaken, weil das ist absolut super, dass du das so denkst und so machst, weil wir müssen es ja in der Realität am Ende auch checken. In Figma schaut alles wunderbar aus. Alles wie Butter. Alles ist so weich und schön. Und das liegt an der Schriftglättung. Figma glättet die Schriften anders. du kannst fast eine Schriftstärke dazugeben.

von dem was du jetzt siehst in Figma und im Browser schaut es fetter aus. Und das ist oft nicht schlecht, weil mehr Kontrast oft hilfreich ist, also auch einfach Kontrast, weil die Schrift stärker ist, aber es schaut halt oft auch nicht so aus, wie man sich das vorgestellt hat. Das heißt, die Sachen, die man in Figma sieht und dort sieht es wieder anders aus. Und man muss es auch auf Windows checken, kommt halt auch immer auf die Usergruppe an. Aber ich hatte schon Situationen, wo die Schrift einfach so schlecht gerendert hat auf Windows, dass wieder anderes Rendering verwendet.

dass ein kleines i mit dem Punkt zu einem kleinen l wurde, weil das zusammengelaufen ist bei gewissen Schriftgrößen und dadurch einfach wirklich andere Wörter ergeben kann. Das muss man im Browser, in der Realität checken, mit realen Inhalten und nicht nur einfach in seiner wunderbaren Figma-Fantasie. Die ist super toll, aber sie ist halt nicht das Web.

Oliver Haake-Klink
Lieber Oliver, ich danke dir vielmals, dass du dir hier solche Insights geliefert hast und auch deine Nuggets oder deine Geheimnisse hier so bisschen gar nicht für dich behalten hast, sondern auch direkt davon Gebrauch gemacht hast und zu, ja, dass auch Zuhörerinnen und Zuhörer direkt daran teilhaben lässt. Ich würde sagen, wir machen einen Deckel drauf für heute.

Ich sage ganz vielen Dank, dass du dir die Zeit genommen hast, dass ich das heute hier aufzeichnen durfte und an alle Zuhörerinnen und Zuhörer, die die Folge vielleicht hören bei einem der Podcastkanälen, wo sie erscheinen wird oder bei YouTube, falls jemand in das Thema tiefer einsteigen möchte und sich nicht auf den Zufall verlässt, wie ich sehr empfehlen kann, dann ist sicherlich Oliver einer der Adressen, wo es kompetente

Hilfe in dem Bereich gibt, wenn man das Typografie-Auswahlthema auf ein professionelles und hohes Level bringen möchte. Das kann ich auf jeden Fall hier so als Fazit am Ende nochmal Revue passieren lassen.

Oliver Schöndorfer
Da muss ich gleich noch was ergänzen. Danke für die lieben Worte. Ich habe auf pimpmytype.com einige Artikel und Videos. Es gibt auch auf pimpmytype.com den Font Friday Newsletter, den man abonnieren kann. Alle zwei Wochen review ich dort eine Schrift und ich erkläre auch, warum die Schrift geeignet ist für Überschriften, für Fließ-Texte, für funktionale Texte. Ich gebe eine Entscheidungshilfe in der Art und Weise schon mal. Dann hat man es schon leichter, wenn man etwas sucht.

Und zusätzlich freue ich mich halt wirklich jedes Mal, wenn mir jemand eine typografische Frage schickt, wenn man sich nicht ganz sicher ist, passt das da, kann da noch wer einen Blick drauf werfen. Letztlich hatte ich eine Frage, ob ich die Schrift nach Barrierefreiheitsrichtlinien anschauen kann. Also das sind Sachen, die ich total gerne mache, wo man auch mal nur kurz drüber plaudern kann und sich das schon anschauen. Da freue ich mich über eine Kontaktanfrage auf LinkedIn oder eine E-Mail oder was auch immer ihr gerne habt.

Dann können wir gemeinsam schauen, wie wir da mehr rausholen können.

Oliver Haake-Klink
Das ist der Plan. Genauso darf ich das gerne publik machen. Das freut mich sehr. In diesem Sinne freue ich mich, wenn wir weiter im Kontakt bleiben und sicherlich bei der ein oder anderen Gelegenheit vielleicht sogar mal in Persona uns über den Weg laufen. Darauf freue ich mich. Das würde ich auf jeden Fall mal einplanen bei Gelegenheit.

Oliver Schöndorfer
Dankeschön.

Oliver Haake-Klink
Dann machen wir einen kleinen Stopp für heute.

Website Pimp My Type von Oliver Schöndorfer