webmatze.de

Ist display=“none“ jetzt irrelevant?

Beim Studieren der aktuellen HTML5 Spezifikation, ist mir ein neues Attribut aufgefallen, welches möglicherweise bald eine große Bedeutung bekommen könnte. Ich spreche hier vom Attribut irrelevant, welches allen HTML Elementen zugewiesen werden darf.

Wofür steht irrelevant?

Das Attribut irrelevant darf die Werte "true" oder "false" enthalten und gibt an, ob ein so ausgezeichnetes HTML Element im aktuellen Kontext noch nicht oder nicht mehr relevant ist. So gekennzeichnete Elemente werden vom Browser weder gerendert, noch angezeigt. Das heißt, man kann damit beliebige Elemente ein- und ausblenden.

HTML 5 Draft Recommendation Screenshot

Bisher konnte man diese Funktionalität nur durch das Setzen der CSS Eigenschaft display auf display: none erreichen. Damit werden die entsprechenden Elemente ebenfalls nicht gerendert und angezeigt.

Der Nachteil hier wäre allerdings, dass ein Gerät oder Browser, welcher keine Stylesheets versteht, solche Elemente dann trotzdem darstellen würde. Bei Verwendung von irrelevant würde der entsprechende Teil auch in diesem Fall nicht angezeigt werden. (Vorausgesetzt das Gerät versteht HTML5.)
Weiterlesen →

Firefox3 kann jetzt auch schüchtern

Der Internet Explorer konnte ja schon seit Längerem schüchtern, doch nun ist auch der Firefox nachgezogen und kann jetzt ebenfalls schüchtern.

Warum ich solch eine Schwachsinn schreibe? Okay, bevor mir jemand die Tastatur aus der Hand reißt... Was ich mit der Überschrift eigentlich sagen wollte: Firefox unterstützt in der Version 3 nun endlich auch Sollumbrüche in Wörtern. Und zwar solche, bei denen der Trennstrich nur dann angezeigt wird, wenn der Umbruch wirklich benötigt wird. Diese "bedingten Trennstriche", oder im Englischen auch "soft hyphen" genannt, werden durch das Zeilenumbruch-Entity ­ im HTML Text definiert.

Firefox Homepage Screenshot

Im folgenden Beispiel wird das vielleicht deutlich:

Soll­um­brü­che können in Wörtern eingefügt
 werden, welche ohne bedingte
 Zei­len­um­brü­che nicht richtig umbrechen

Soft Hyphen = ­ = schüchtern

Gut, damit hätten wir das Rätsel auch geklärt. Aber "schüchtern" finde ich in diesem Zusammenhang gar nicht mal so unangebracht. Denn was auf dem ersten Blick vielleicht verlockend erscheint, nämlich den bedingten Trennstrich in jedem Wort eines Textes unterzubringen, ist natürlich auf dem zweiten Blick mehr als bedenklich.

Damit würde man den HTML Code erheblich aufblähen und die Leserlichkeit von Text im HTML deutlich erschweren. Wer solch einen Text später nach bearbeiten muss, wird sicherlich nicht viel Freude an dieser Arbeit haben.

Darum sollte man den bedingten Trennstrich nur "sehr schüchtern" anwenden, also nur an Stellen, bei denen es sonst zu Problemen in der Darstellung kommen könnte. Ich könnte mir z.B. Label Elemente in einem Formular vorstellen, welche nur eine bestimmte Breite haben sollen und wo man damit zu lange Wörter zum Umbruch zwingen kann, ohne dass das Layout des Formulars zerschossen wird. Hier findet Ihr ein Beispiel dafür, wie man ansprechende Formulare erstellt. Das Gleiche könnte auch auf Spaltenüberschriften einer Tabelle zutreffen, welche nur eine bestimmte Breite haben sollen.

Fazit

Ich finde es gut, dass Firefox 3 nun auch bedingte Trennstriche unterstützt, zumal der IE dies schon seit einigen Jahren kann. Weise und sparsam angewendet, können sie sicherlich sehr hilfreich sein. Doch im Netzt gibt es auch Bedenken darüber, was die Verwendung von bedingten Trennstrichen angeht. Was haltet Ihr davon?

WordPress 125×125 Pixel Banner Plugin

Wie ich vor einigen Tagen bereits angemerkt habe, ist das 125x125 Pixel Banner Format auch in Deutschland auf dem Vormarsch. Blogs wie Selbständig im Netz, Freetagger, Bloggonaut und der Netgestalter haben damit begonnen, dieses Werbeformat einzubinden und heute möchte ich euch ein kleines WordPress Plugin vorstellen, mit dem sich diese Banner noch einfacher in eure Blogs integrieren lassen.

Das UBD Block Ad Plugin

Uniqueblogdesigns.com, eigentlich mehr für deren WordPress Themes bekannt, hat das UBD Block Ad Plugin für WordPress veröffentlicht. Mit diesem Plugin lassen sich auf einfache Weise die 125x125 Pixel großen Werbebanner in jedes WordPress Blog einbinden.

UBD Block Ad Plugin

Das Plugin ist schnell konfiguriert. Man kann zwischen mehreren Layoutvarianten wählen. So lassen sich Werbeblöcke mit ein oder zwei Spalten erstellen, in denen sich dann bis zu zehn Werbebanner anzeigen lassen.

Besonders interessant finde ich auch, dass sich die Banner automatisch Rotieren lassen. So wird die Reihenfolge der Banner bei jedem Seitenaufruf automatisch geändert und kein Werbepartner benachteiligt, weil dieser sonst nicht an erster Stelle erscheinen würde. Außerdem lassen sich so auf beschränktem Raum mehr Banner anzeigen, da einfach immer wieder Andere eingeblendet werden.

Fazit

Ich habe mich selbst noch nicht entschieden, ob ich in meinem Blog auch 125x125 Pixel Banner einblenden werde. Doch wer dies vor hat, der sollte sich das Plugin auf jeden Fall mal näher ansehen.

Hinweis: Leider funktioniert das Plugin momentan noch nicht mit der aktuellen WordPress 2.6 Version, aber ein Update wird sicher in den nächsten Tagen folgen.

Das Plugin läßt sich hier herunterladen: Download UBD Block Ad Plugin

Update (31.07.2008)

Jetzt gibt es das Plugin auch für die aktuelle WordPress Version 2.6 zum Download!

Posterous – Per Email Bloggen

Ich bin heute auf eine interessante neue Blog-Anwendung gestoßen. Posterous verspricht, eine der einfachsten Anwendungen zu sein, um ein eigenes Blog zu erstellen und mit Inhalten zu füllen. Der Clou dabei ist, dass man alles über Email steuern kann.

Es lässt sich komplett ohne Administrationsoberfläche bedienen. Wenn man ein neues Blog eröffnen möchte, braucht man einfach nur eine Email an eine spezielle Email-Adresse senden. Die Betreffzeile der Email wird dabei als Überschrift veröffentlicht und der Inhalt der Email als Text.

Posterous Screenshot

Für jede Email die man schickt, wird ein neue Blog-Eintrag erstellt. Doch hier fängt es erst an interessant zu werden, denn Posterous hat einige Automatismen eingebaut, welche das Bloggen mit dieser Anwendung wirklich vereinfachen.

Nehmen wir zum Beispiel Bilder. Möchte man ein Bild in den neuen Blogeintrag einbinden, braucht man dieses nur als Anhang an die Mail hängen, und schon erscheint es im neuen Eintrag. Sendet man mehrere Bilder, werden diese als interaktive Bildergallerie dargestellt. Genauso gut kann man aber auch MP3 Dateien mitschicken, welche dann als Flash MP3 Player eingebunden werden. Es werden aber noch eine Vielzahl weiterer Formate unterstützt.

URLs werden ebenfalls automatisch in einen klickbaren Link umgewandelt. Und auch hier haben die Macher weitergedacht. Bindet man z.B. eine URL auf ein YouTube Video ein, so wird für dieses automatisch der Videoplayer von YouTube eingebunden.

Ich finde, dass Posterous wirklich das Potenzial hat um erfolgreich zu werden. Bereits jetzt gibt es unzählige Einträge von tausenden Nutzern. Ähnlich wie auch mit Tumblr lassen sich so sehr schnell kleine Blogs erstellen, ohne erst viele Einrichtungsschritte zu durchlaufen oder gar eigenen Webspace bereitstellen zu müssen.

WordPress 2.6 ist da!

Fast einen Monat vor dem angestrebten Veröffentlichungstermin ist die neue Version von WordPress nun offiziell zum Download verfügbar.

Version 2.6 enthält eine Reihe von wirklich guten Verbesserungen und neuen Funktionen. So können nun jederzeit Änderungen rückgängig gemacht werden, da eine History angelegt wird, welche es einem ermöglicht zu jedem beliebigen Speicherstand zurückzugehen. Diese Funktionalität ist z.B. auch aus Wikis bekannt.

Aber seht euch dazu doch einfach das folgende Video an, in dem alle neuen Funktionen vorgestellt werden.

Wer nicht warten möchte, kann sich hier die neue Version gleich herunterladen.

Meta-Description: Wie wichtig ist sie wirklich?

Wer sich mit Suchmaschinenoptimierung (SEO) beschäftigt, der wird auf jeden Fall auch schon mal etwas von Meta-Tags gehört haben. Meta-Tags beschreiben unter anderem den Inhalt einer Webseite genauer. Sie geben vor allem den Suchmaschinen ein paar Hinweise darüber, was in einer bestimmten Seite zu finden ist.

Die bekanntesten Meta-Tags

Die bekanntesten Meta-Tags sind hier sicherlich Meta-Description:

<meta name="description" content="Das Meta-Description Tag
enthält eine kurze Beschreibung vom Inhalt einer Webseite." />

und Meta-Keywords:

<meta name="keywords" content="meta-tags,html,suchmaschinen,
optimierung,seo" />

Allerdings ist Meta-Keywords in den Anfangsjahren des Webs massiv missbraucht worden - um bei möglichst vielen Suchanfragen gelistet zu werden, waren viele Webmaster dazu übergegangen, eine riesige Liste an verschiedenen Keywords in dieses Tag einzutragen, auch wenn diese absolut nichts mit dem eigentlichen Inhalt der Seiten zu tun hatten. Daher wird dieses Tag heute von den Suchmaschinen nur noch sehr vorsichtig betrachtet und ausgewertet.

Eine gute Meta Beschreibung ist wichtig

Anders ist dies bei dem Meta-Description Tag. Dieses Tag hat auch heute noch eine sehr große Bedeutung und wird von vielen Suchmaschinen ausgewertet. Je nach Art der Suchanfrage, wird der Inhalt dieses Tags auch gerne mal als Textauszug unter dem Suchergebnis angezeigt.

Meta-Description Tag in Suchergebnissen

Der Grund dafür ist, dass die Suchmaschinen den ersten Text, der auf einer HTML Seite gefunden wird, sehr hoch bewerten. Hat man das Meta-Description Tag eingebunden, enthält dieses den ersten Textinhalt, den die Suchmaschine sehen kann. Wird es weggelassen, kann es daher sein, dass statt dessen der Inhalt der Navigation angezeigt wird - wenn diese an erster Stelle in einer Seite steht.

Wie sollte eine gute Beschreibung aussehen?

Wenn man sich mal die Suchergebnisse von Google genauer anschaut, dann kann man erkennen, dass die Textauszüge meistens eine Länge von etwa 160 Zeichen haben - also etwa die Länge einer SMS. Daher sollte man auch möglichst nicht mehr Text in das Meta-Description Tag schreiben, denn je weniger Text in der Beschreibung steht, um so höher wird jedes einzelne dort enthaltene Wort bewertet werden.

Kurz gesagt: die Beschreibung sollte den Inhalt der Seite so genau wie möglich und in kurzer Form wiedergeben.

Google gibt in seiner Webmaster Hilfe dazu sehr gute Hinweise und Tipps.

Ich selbst habe auf webmatze.de leider bisher den Fehler gemacht, auf jeder Seite den gleichen Text in der Meta-Description zu verwenden. Ergebnis ist, dass nun in jedem Suchergebnis, wo webmatze.de auftaucht, der gleiche Textausschnitt angezeigt wird.

Werde mich also hinsetzen und für jeden Blogeintrag eine kurze Beschreibung anfertigen müssen. Und ich möchte gar nicht daran denken, dass es auf webmatze.de bereits über 300 Blogbeiträge gibt...