In diesem Artikel nenne ich mal ein paar Sachen, die mich persönlich an Webseiten immer nerven – wenn sie eingesetzt werden. Wie etwa Comic Sans, zu kleine Schriftgrößen, Tabellen als Abstandshalter oder verBreakte Inhalte.
Jedes mal, wenn ich eine Webseite sehe, die eine der hier aufgeführten Kriterien erfüllt, kotze ich mächtig im Strahl. Da kann der Inhalt noch so plausibel und sinnhaltig sein, aber ehe mein Gehirn über das Verweilen und Lesen auf der Seite nachdenkt, hat mein Nervensystem den Zurück-Button schon ganz automatisch betätigt.
Zu diesem Artikel hat mich das Video → A Defense of Comic Sans von → Vsauce inspiriert (Video).
Warnung: In diesem Artikel werden die aufgeführten Sachen auch eingesetzt. Spoiler Alert.
Inhaltsverzeichnis
Diese Schriftarten sind hässlich wie die Nacht
Comic Sans – schrecklich, hässlich und gehasst seit 1994
Comic Sans. Awful, Ulgy and Hated since 1994. Eigenes Bild (CC-BY-SA 3.0)
Jetzt mal ganz im Ernst. Wenn der Artikel nicht explizit darüber handeln würde, würdest du doch auch diesen Text nicht einmal andenken zu lesen, oder? Nicht, weil hier sowieso kein nützlicher Inhalt drin steht, sondern nur, weil er mit Comic Sans formatiert wurde. Richtig?
Laut Vsauce wurde Comic Sans im Jahr 1994 auf Wunsch von Melinda Gates (die damalige Frau von Bill Gates) in Auftrag gegeben und von Vincent Connare in drei Tagen entwickelt. Es sollte die Standard-Schriftart in Microsoft Bob werden (was MS Bob ist, erklärt → SemperVideo auf sehr humorvolle Weise). Auch wenn es den Einzug in MS Bob nie geschafft hat, Comic Sans wurde anschließend in alle Microsoft-Produkte als mögliche Schriftart integriert – und da sich damals (wie auch heute noch) viele nicht mit dem Aussuchen und Installieren von anderen Schriftarten auseinandergesetzt haben, ist Comic Sans auch heute noch eine häufig verwendete Schriftart in Werbeflyern, Prospekten, in Weblogs usw.
Es gibt sogar ein ungeschriebens Gesetz bzw. „Spiel“. Jedes mal, wenn du einen Text in Comic Sans siehst, brülle einfach genervt:
„COMIC SANS!!!!“
Times New Roman
Auch Times New Roman schafft es in meine Negativliste der schrecklichsten Fonts. Aber hier muss ich differenzieren. Times New Roman ist eine hervorragende Schriftart für gedruckte Inhalte wie Bücher oder Zeitungen. Auch auf Webseiten, die einen Nachrichtencharakter haben, sind diese teilweise auch sehr gut. Aber auf normalen Webseiten, wie einem Blog, einem Shop oder einer Vereinswebsite ist Times New Roman völlig fehl am Platze.
Courier New
Wenn mann Code darstellen möchte, ist Courier New die genau richtige Schriftart. Wenn man keinen Code darstellen möchte, ist die Verwendung aber sowas von daneben. Dann schwillt mein Puls doch gleich mal in den negativen Bereich an.
Schriftarten, die einem die Augen ausfallen lassen
Ich habe nichts gegen andere sonstige Schriftarten. Als Überschriften können diese sogar manchmal richtig geil wirken. Aber wenn ich ganze Absätze in diesen unleserlichen Schriftarten (wie hier: Ceviche One) lese, krieg ich Karies, Plaque und Parodontose – in dieser Reihenfolge.
Zu kleine Schriftgrößen und Headlines heben sich nicht vom normalen Content ab
Websites, welche sehr klein gehalten sind (wie etwa mit einer fixen Breite von 800 Pixel) verwenden häufig auch sehr kleine Schriftarten. Arial Schriftgröße 11 Pixel und ähnliches. Leute, ich will nicht zum Optiker. Ich will Inhalte. Lesen. Ohne die Seite manuell um 350% vergrößern zu müssen.
Was schlecht ist, ist mir zu bunt
Schriftfarben sollten mit Bedacht eingesetzt werden, denn diese signalisieren eine extrem hohe Wichtigkeit. Ebenso ist Überformatierung wie das Einsetzen von fett, kursiv und unterstrichen häufig viel zuviel. Bin ich auf ’nem Kindergeburtstag oder was soll der Müll hier?
Im Übrigen: Was ich auch an Websites hasse ist, wenn eingesetzte Überschriften nur fetter Text sind. Die Artikel auf n24.de erfüllen diesen Tatbestand. Ich will mich durch den Text orientieren können. Nur fett gemachte Überschriften helfen mir dabei aber nicht.
Und im Übrigen #2: Links müssen ersichtlich sein. Ein Link, der eine sehr ähnliche (oder schlimmstenfalls die gleiche Farbe) wie der Rest des Contents hat und nicht unterstrichen werden, sind kacke.
Werbung, Werbung und noch mehr Werbung (Ads Above The Fold)
Wenn ich eine Website besuche, auf der ich zum eigentlichen Inhalt schon scrollen muss, verlasse ich meistens, noch ehe ich überhaupt zum Scrollen gekommen bin. Warum? Ich erhalte die gesuchte Information nicht sofort.
Der Effekt tritt häufig auf Seiten auf, die sehr viel Werbung eingebunden haben. Das hat Google selbst auch erkannt und einen Filter erstellt – ähnlich dem Panda– oder Penguin-Filter. Den Ads Above The Fold-Filter. Wer von diesem Filter getroffen wird, sollte einige seiner vielen Werbebanner nochmal überdenken.
Allerdings erwischt es auch „normale“ Webseiten. Eben immer dann, wenn man zum eigentlichen Content scrollen muss.
Ultra-nervige Werbebanner: Sie sind der 999.999 Besucher. Image: Pascal Horn (CC-BY-SA 3.0)
Was mich an Werbebannern richtig nervt sind animierte Banner. Und zwar immer dann, wenn es blinkt und funkelt.
Was ist das? Etwa Marketing? Scheiße? Augenkrebs?
Bei Bannern wie diese wünsche ich mir, der Blitz möge demjenigen Webmaster beim Abseilen treffen – und zwar bei jedem einzelnen Klick.
Auch sehr unbeliebt bei mir sind etwa „In einem Monat 10 Kilo abnehmen“ oder „Im Internet reich werden in 5 Schritten“, wo man merkt, dass der Grafiker noch mit über Microsoft Paint hinaus gekommen ist…
Zu wenig Werbung kann auch blöd sein
Es kann aber auch umgekehrt sein. Eine Website, welche
- rein vom Thema her kommerzieller Natur ist,
- über keinen eigenen Shop verfügt und
- keine Werbeanzeigen integriert hat
ist wiederum verdächtig. Es schleicht sich automatisch ein komisches Bauchgefühl ein. Wenn stattdessen eine Facebook-Box in der Sidebar angeboten wird, in der nur 10 Leute zu sehen sind die diese Seite teilen, ist das ein ganz schlechtes Omen. Dann heißt es auch schnell Doswidanja, mein lieber Freund.
Bonus: Layout-Fehler – Von Tabellen und anderem HTML-Missbrauch
Hier noch ein paar Bonus-Fails, bei denen ich – aus Webmastersicht – auch regelmäßig an Facepalm-Talentshows teilnehmen könnte: (Profis aktivieren beim folgenden Absatz den Firebug):
Tabellen als Abstandshalter – Pfui!
 |
Es gibt im CSS folgende Möglichkeiten: Float, Padding, Margin und Clear. Damit kann beispielsweise Bilder super zum Text positionieren.Was sehen meine von blinkenden Werbebannern verkalkten Augen stattdessen, und das immer wieder? Tabellen. What the f*cking Table???Am Besten sind dabei Kombinationen, wie diese hier. Eine Tabelle mit drei Spalten. In der ersten Spalte ist das Bild integriert. In der Dritten Spalte Text, der rechts umbrechen soll. Und dazwischen eine leere Spalte, die nur als Abstandshalter dient.Wo für einen Webmaster selbst Schnaps an seine Grenzen kommt sind dann Absätze, die aufgrund ihrer Zelle dann quasi „in der Luft schweben“, also nicht mehr linksbündig verlaufen. So wie dieser kleine Absatz. |
Leute, lernt und lehrt anständiges HTML und CSS – und setzt es um. Tabellen sind gemacht, um Tabellen darzustellen. Nicht, um Bilder und Inhalte zu positionieren.
Bilder als Überschriften verwenden
Der Klassiker. Und immer noch viel zu häufig verwendet.
Wenn ihr Webfonts einbinden wollt um Textbereiche oder Überschriften schöner darstellen zu können, dann benutzt auch die Webfonts. Und nicht Bilder, in denen nur Schrift mit den Webfonts integriert sind.
Google hat dazu eine hervorragende Bibliothek und Anleitung eingerichtet. Nennt sich → Google Fonts.
Breaks <br /> ohne Ende, aber kein einziger Paragraph <p>
Hier mein letzter Punkt. Auch wenn Webseiten auf dem Bildschirm normal und gut aussehen, kann mein Bildschirm mein Herz zum schnelleren Schlagen bringen. Und zwar, wenn im Contentbereich anstelle von Paragraphs (Absätzen) eben Breaks (Unterbrechungen) eingesetzt werden. Ich verwende dann gerne den Begriff der „verbreakten Seite“, weil es dem englischen Begriff „Broken“ nahe kommt.
Gibt es für dich auch regelmäßig Momente, wo du wegen solcher Kleinigkeiten ausflippst? Dann unten in die Kommentare damit. 😉
Aaaahhh… Noch etwas vergessen. Webseiten, auf denen Videos automatisch abgespielt werden. Kotzfaktor Hoch 10.
Wenn ich eine Nicht-Video-Website (also Nicht-Youtube, Nicht-Myvideo- usw. -Seite) öffne, will ich ums Verrecken nicht, dass in meinen Lautsprechern oder meinem Headset etwas abgespielt wird, von dem ich noch gar nicht weiß, dass etwas abgespielt wird. Ganz schlecht sind dann Seiten, auf denen automatische Video-Abspielungen stattfinden, wo ich erst 20 Kilometer runterscrollen soll, um das eigentliche Video zu sehen.
Ja Kinders, wo sind wir denn? Wenn ich das Video sehe und ich will, dass es abgespielt wird, dann klicke ich auf Play. Aber verdammt nochmal, baut keine automatisch abspielenden Videos in eure Websites ein.