LautundKlar

Beim Durchstöbern einer Webseite fallen oft schöne Schriftarten auf. Sehr oft möchte man wissen, um welche Fonts es sich dabei handelt. Um das herauszubekommen, ist meist eine Recherche im Quelltext + CSS-Datei (oder Firebug) notwendig.

WhatFont ist ein Bookmarklet, welches diesen Prozess um einiges vereinfacht. Einmal aktiviert, zeigt es die verwendete Schriftart beim einfachen überfahren mit dem Mauszeiger.

Wenn man auf den Text klickt, erhält man eine Infobox mit detaillierten Informationen zu der Font wie z. B. neben dem Fontnamen auch Zeilenhöhe und Schriftgröße. Da diese Infoboxen nicht ausgeblendet werden, lassen sich auch verschiedene Schriftarten miteinander vergleichen.

Außerdem erkennt WhatFont Schriften, die von Services wie Typekit oder Google Font API ausgehen und zeigt diese Informationen an.

Ein Muss für jeden Web-Designer.

Kompatibilität: Alle modernen Browser
Website: http://chengyinliu.com/whatfont.html
Download: https://github.com/willow/WhatFont-Bookmarklet

Popularity: 1% [?]

RandomText ist eine Webseite zum einfachen Erstellen von Blindtext bzw. Dummytext, entweder in Lorem ipsum oder verworrenem Kauderwelsch.

Es ist möglich, den Typ des Elements (Absatz, Liste oder Überschrift) sowie die Anzahl und Länge zu definieren.

Der Generator bietet Kurzbefehle um den HTML-Quelltext formatiert auszugeben bzw. für die vollständige Ausgabe als Text/HTML-Datei.

Für einen schnelleren Zugriff auf den Dienst kann ein bestimmtes URL-Format aufgerufen werden. Zum Beispiel randomtext.me/lorem/ul-10/5-10/ um eine ungeordnete Liste mit jeweils 5-10 Wörtern Lorem ipsum Text zu erzeugen.

Webseite: http://www.randomtext.me/

Popularity: 1% [?]

The Wall ist ein MooTools Plugin zur Erstellung eines Inhaltsbereichs, der vertikal sowie horizontal verschoben werden kann.

Das Plugin bietet eine hohe Flexibilität und kann auf jedes Element angewandt werden, egal ob es sich um ein <div> oder ein <image> Tag handelt.

Die Galerie, welche erzeugt wird, kann durch Ziehen in die gewünschten Richtung verschoben werden. Übergänge und die Geschwindigkeit können individuell angepasst werden. Eine Callback-Funktion nach jeder Benutzer Interaktion hilft dabei, das Plugin noch weiter anzupassen.

Außerdem stehen noch weitere andere Funktionen bereit, wie z. B. das “spiegelverkehrte Ziehen”, automatische Slideshow etc.

Voraussetzungen: MooTools 1.3.2 +
Kompatibilität: Alle gängigen Browsern
Webseite: http://wall.plasm.it/
Demo: http://wall.plasm.it/examples
Download: https://github.com/plasm/the-wall

Popularity: 1% [?]

Beim Erstellen von CSS Code schleichen sich, zumindest bei mir, immer mal wieder kleine Fehler ein. Entweder schickt man zu guter Letzt das CSS durch den W3C Validator oder man benutzt den neueren Service CSS Lint.
CSS Lint ist ein spannendes Open-Source-Projekt, das beim Auffinden von Problemen im CSS-Code hilft.
Wie erwartet, zeigt es keine Fehler beim Parsen wie falsch eingegeben Zeichen, die möglicherweise zu Darstellungsfehlern führen.

Darüberhinaus überprüft CSS Lint den Code in Hinsicht auf die besten CSS-Codierung Praktiken und warnt bei:

• Aneinandergereihte CSS Klassen (wie .foo.bar die in IE7 und IE6 problematisch sind)
• Leere Regeln, die ineffizient sind
• Korrekte Verwendung der display Eigenschaft
• Verwendung von zu vielen floats, Web-Schriftarten und font-size Erklärungen
• Überschriften Styles, die nur einmal deklariert werden sollen
• Und vieles mehr ..

Ein insgesamt sehr gutes Tool das wirklich hilft den CSS-Code zu verbessern, wie es auch auf der Website heißt:
“it will hurt your feelings but help coding better”

Website: http://csslint.net/

Popularity: 1% [?]