Fabian Letscher – Blog + Portfolio

Qualität im Web II

Nachdem ich im ersten Artikel zu “Qualität im Web” Bezug auf eine konkrete Fehlbildung im Web genommen habe, soll dieser Artikel eher Fehler hinter den Kulissen aufweisen.

Im Großen und Ganzen sollen hier zwei verschiedene Aspekte angesprochen werden, die dem Web Qualität geben. Jedoch ist dieses in der Tat schwieriger zu bewerkstelligen, da teilweise der “Autor” eines Textes keinen direkten Einfluss darauf hat.

Die Syntax im Web – ein Muss!

Unter der Syntax versteht man salopp gesagt, die Grammatik des Quelltextes. Um über dessen Richtigkeit eine Aussage treffen zu können, muss man zunächst erahnen um welche “Sprache” es sich handelt. Dies ist leicht vergleichbar mit der Wirklichkeit: Deutsch und Englisch sind beides Sprachen, jedoch folgen sie verschiedenen Richtlinien bzw. Grammatiken. Demnach ist der erste Schritt zu einer syntaktischen Webseite die Dokumenttypdeklaration anzugeben und somit die Sprache festzulegen. Beispielsweise könnte das < !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> oder auch der wesentlich einfachere Doctype für HTML5 sein: < !doctype html>. Hier freut sich natürlich der Webentwickler, dass er sich nun endlich mal diese Zeile merken kann.

Weiterhin zur Syntax lässt sich nun nicht mehr viel sagen. Die üblichen Fehler können mit einem Validierungs-Tool überprüft und bereinigt werden. Eine Validierung der Webseite ist keine Pflicht, sollte aber durchaus als Kriterium für eine gute Webseite angesehen werden. Wobei man auch sagen muss, dass durch die Erzeugung dynamischen Inhalts (WYSIWYG-Editoren) leicht mal ein solcher Fehler sich einschleichen kann. Webmaster freuen sich aber in der Regel über einen solchen Hinweis.

Am Rande sei bemerkt, dass eine Validierung der CSS-Datei ebenfalls möglich ist, allerdings nicht unbedingt notwendig. Die richtige Auszeichnung des Inhalts sollte eine höhere Priorität haben als die Richtigkeit einer Formatierungsdatei.

Die Semantik – Streben nach Vollendung

Das ganze führt nun schließlich zum wichtigeren Teil, der in der Vergangenheit oft vernachlässigt wurde und nun seit einiger Zeit mehr im Vordergrund steht. Semantik bedeutet in diesem Sinne, dass die durch HTML vollzogene Auszeichnung des Inhalts logisch ist. Das Wort “logisch” beinhaltet auch schon einen Knackpunkt: Nicht immer ist man sich so einig, was semantisch richtig ist und was nicht. Semantik lässt sich nur sehr schwer in ein starres Konzept pressen, indem jedes Individualproblem ausreichend behandelt wird. Daher ist bei der Gestaltung einer Webseite auch nicht die Syntax, sondern die Semantik die höhere Hürde.

Aber wie genau kann man jetzt Semantik verstehen – dazu ein Ausblick: Man könnte so herangehen und zunächst festhalten, dass HTML eine Sprache zur Auszeichnung von Inhalt ist. Als Inhalt betrachtet man jeweils eine einzelne Seite. Diese Inhalte haben in der Regel eine logische Bedeutung und diese wird mit HTML untermauert. Fehler, die durch falsche Auszeichnung entstehen, können also grammatikalisch richtig sein, aber die falsche Bedeutung vermittlen.

Als Beispiel könnte man sich folgendes vorstellen: Die Kommentare eines Artikels werden zu einem blockquote zusammengefasst. Allerdings entspricht dies nicht einem üblichen Zitat – und hat somit eine falsche Bedeutung.

Semantik als Diskussionsstoff

Bei der semantischen Betrachtung gibt es im Gegensatz zur syntaktischen Richtigkeit keine eindeutigen Regelungen. Vielmehr muss der Mensch die Aufgabe übernehmen und logische Zusammenhänge auszeichnen. Dabei sollte klar sein, dass man sich nicht immer einig ist, wenn es um die Umsetzung geht. Daher möchte ich im Folgendem ein paar verschiedene Beispiele erläutern. Viele davon entstanden eng im Zusammenhang mit dem Entwurf von HTML5.

• In HTML gibt es eine Unterscheidung zwischen logischen und physikalischen Ausdrücken. Vereinfacht kann man sagen, dass logische Ausdrücke dem Inhaltsabschnitt eine gewisse Bedeutung zukommen lassen während die physischen Ausdrücke eher der Darstellungsverbesserung dienen. So wurde das b-Element (fett) auf die Abschuss-Liste gesetzt, da es “keinerlei” Bedeutung hat und durch das strong-Tag nahezu ersetzt wird. Bei einer einfachen Betrachtung könnte man darauf schließen, dass dies die richtige Entscheidung sei. HTML5 sieht aber eine Wiederbelebung des b-Tags vor. b kennzeichnet äußerlich eine Textstelle, da man diese wirklich als fett kennzeichnen möchte und keine höhere Bedeutung hat. Als Anwendungsfall wäre ein Lexika-Artikel zu nennen. Der zu erläuternde Begriff verdient eine optische Hervorhebung im Text – allerdings wird diesem Wort keine Betonung gegeben. Auch wenn man nun mit “Trennung von Inhalt und Design” gegen das Fett argumentieren will, so hat dies durchaus seine Berechtigung.

• Eine weitere Sache, die eng mit der HTML5 Einführung zu tun hat sind die beiden Elemente span (Inline) und div (Block). Die Bedeutung dieser Elemente ist “leer”, wenn man das so sagen darf. Prinzipiell könnten diese beiden Tags ausreichen um eine Webseite zu gestalten (abgesehen von input/textarea). HTML-Dokumente basieren grundlegend auf solchen div-span-Konstrukten (“Box-Layout”). Allerdings geben diese dem Dokument keine logische Struktur. Abhilfe schaffen da die neuen HTML5 Elemente wie header, footer, aside,…

• Eine der wichtigsten Funktionen einer Webseite nimmt die Navigation ein. Überlicherweise wird diese als ungeordnete Liste dargestellt. Das hat auch seine Berechtigung. Zum einen ist eine Liste angebracht, da sie die verschiedenen Menüpunkte gruppiert und eine “Auswahl” lässt. Ungeordnet daher, da man ansonsten mit einer geordneten Liste den verschiedenen Punkten unterschiedliche Prioritäten zuweist. Das haben sie aber nicht, denn beispielsweise ist das Impressum genauso wichtig wie die Startseite. Ebenen können stattdessen mit Verschachtelungen der ungeordneten Liste dargestellt werden.

• Die übliche Überschriftenstruktur reicht bis zur sechsten Ebene – danach ist Schluss – zumindest bei HTML4 und XHTML1.0. HTML5 stellt hier einen Ausweg bereit, welcher in diesem Artikel erklärt wird.

Es gibt noch mehr an Diskussionsstoff, was hier aber nun letztlich den Rahmen sprengen würde.

Qualität im Web I

Die 42 Merkmale woran man fachliche #Inkompetenz im #Web erkennt – und dies ist einer davon!

Schon vor einiger Zeit habe ich diesen Tweet verfasst – und nun möchte ich ihn noch einmal aufgreifen und über die Qualität des Webs philosophieren.

Im Grunde genommen geht es hier um ein Phänomen, mit dem man täglich konfrontiert wird. Jeden Tag werde ich mit gewissen Tweets und Feeds bombardiert, die prinzipiell dem Schema folgen: Eine Ansammlung von Tipps & Tricks, Merkmalen, Plugins, Ideen, Websites, etc. … kombiniert mit einer Zahl allem voran. Der Titel suggeriert in den meisten Fällen eine enorme Qualität – zumindest lassen das Adjektive wie “wichtigsten”, “ultimativsten”, “schönsten” … verheißen. Glücklicherweise lässt sich der Superlativ nicht mehr steigern!

Jetzt muss man sich unweigerlich zwei Fragen stellen: [1] Warum stößt man an jeder Ecke auf solche Blog-Titel? und [2] Was für eine Qualität steckt dahinter? Auf beide Frage möchte ich nun im Folgenden eingehen.

Widmen wir uns der ersten Frage, die man wesentlich leichter beantworten kann: Zunächst einmal kann man ruhig einen Blick auf bekannte Blogs werfen, die genau dieses Schema nutzen. Auffällig zeigt sich da insbesondere das Smashing Magazine (en.), welches ja durchaus eine Reputation genießt. Ein solcher Artikel ist dann wie das nebenstehende Bild zeigt aufgebaut. Dies hat neben den suchmaschinen-technischen Vorteilen auch einen klaren Vorteil für den Leser: Übersichtlichkeit.

Doch Übersichtlichkeit und Suchmaschinen-Optimierung sind keine Kriterien für gute Inhalte. Mit der Zeit bekommt man ein Gespür für solche Ansammlungen und man weiß genau was sich dahinter verbirgt. Oftmals ist das weniger als gedacht. Das liegt zum einen daran, dass solche Artikel im Wesentlichen unvollständig sind. “Die 12 besten Tools wie man sein Leben besser organisiert” sind nunmal nicht die Antwort auf die Frage “Wie organisiere ich mein Leben?” – sie können zwar durchaus hilfreich sein, aber keinesfalls decken sie jedmögliche Situation ab. Der Kritikpunkt ist hier nicht unbedingt die Unvollständigkeit – sondern die Suggerierung einer Vollständigkeit (siehe Superlativ!).
Beim Durchlesen einiger solcher Artikel hat man auch zunehmend das Gefühl, es handle sich lediglich um eine Linksammlung. Vielfach wird auf andere Artikel verwiesen und lediglich noch ein Codeschnipsel dazugefügt und ein entsprechendes Bild gesucht. Das mag ja für den ein oder anderen nützlich sein – allerdings hat das wenig mit Eigenarbeit und Qualität zu tun – denn der ursprüngliche Artikel besteht ja bereits und wurde von einer anderen Person verfasst.

Was ich nun letztlich damit sagen will (oder auch “Fazit” genannt): Ich möchte und erwarte von jedem Blog eine gewisse Qualität. Das heißt nicht, dass jedes Wort eine Glanzleistung sein muss und auch bestimmt nicht, dass man keine Ansammlungen posten darf. Aber es wäre begrüßenswerter, wenn ein Artikel auch eine gewisse Eigenleistung erbringt und nicht nur leere (wiederholte) Phrasen beinhaltet.

Zum Abschluss möchte ich hier noch auf zwei Blogs verweisen, die genau der Qualität entsprechen, die ich so mag und damit auch deren Arbeit honorieren:

• bueltge.de [by:ltge.de]
• playground.ebiene.de – Sergej Müller

Startseite umgestaltet & Portfolio Update

Bei mir dauert wohl alles etwas länger! In einem Beitrag Ende Juli habe ich groß angekündigt die Startseite twittergerecht und etwas übersichtlicher zu gestalten – und erst jetzt habe ich es fertig gebracht und die neue Startseite zu gestalten.

In der Zwischenzeit war ich aber auch nicht ganz untätig. So habe ich mich etwas in die Google Chart API eingelesen und versucht daraus ein WordPress Plugin zu schreiben, welches das zugehörige Bild abspeichert. Damit bin ich dank meiner geringen PHP-Kenntnisse nicht sehr weit gekommen. Aber es könnte noch etwas werden.

Zusätzlich arbeite ich nach wie vor an dem WordPress Alpha Theme. Hier steht schon wieder eine ToDo-Liste an. Weiterhin suche ich aber freiwillige “Tester”, welche auch gerne mal ein HTML5 Theme benutzen möchten.

Zuletzt habe ich im Portfolio Bereich wieder ein neues Projekt hinzugefügt, welches schon seit einiger Zeit existiert, aber bisher noch keine ordentliche HTML-Struktur hatte. Dies habe ich nun ausgebessert und online gestellt.

Dies war es dann auch wieder im Großen und Ganzen. Ich nehme mir wieder vor, etwas “blogfreudiger” zu werden und verrate noch nicht, was neben dem Alpha Theme noch für die Zukunft ansteht.

WordPress Theme Alpha – Beta Phase

Das WordPress Theme Alpha steht nun zum Download bereit, jedoch erst mal in einer Beta Version. Dies liegt einfach daran, dass noch mögliche Bugs enthalten sein könnten und ich noch etwas Feedback möchte.

Vorschau:

Das besondere bei dem Theme ist der Einsatz von HTML5 und ein wenig CSS3. Das Design ist relativ schlicht gehalten. Bevor es in den Portfolio Bereich kommt, sollte es aber noch ausgiebig getestet werden. Daher freue ich mich, wenn sich ein paar Leute bereit erkären, dieses Theme genauer unter die Lupe zu nehmen!

→ Download Alpha Theme

Anregungen, Kritik und Bugs nehme ich gerne an. Entweder direkt als Kommentar oder über den Kontakt-Bereich.