Der Korsti bloggt über Web, Design und Webdesign

Bereits im vorherigen Artikel bin ich auf das frische Design eingegangen. Allerdings lagen mir zu dem Zeitpunkt noch keine Bilder der Voting-Phase vor. Und gerade da ließ sich das Design sehen. Entschuldigt die schlechte YouTube-Qualität, aber anderswo konnte ich noch keine Screenshots auftreiben.

Für die Schrift-Fans: Die Ländernamen in der Einzelansicht wurden in der Rosewood Fill gesetzt.

Wer die Abstimmungsphase verpasst hat, kann sich auf YouTube von der Animation überzeugen lassen.

YouTube: Eurovision 2007 vote of France
Zum Artikel: Eurovision Song Contest 2007 – Schiebung und schönes Design

Das Copyright der Screenshots liegt jeweils bei den Sendern.

Über den Eurovision Song Contest 2007 in Helsinki möchte ich nicht viele Worte verlieren. Jedenfalls nicht über die musikalische Leistung der selbsternannten Künstler und schon gar nicht über das Abstimmungssystem. Darüber wird ja schon genug geschimpft (zu Recht). Neben diesem Tohuwabohu berichte ich mal über das, meiner Meinung nach gelungene, Screendesign.

Ein simples, vierfarbiges Kaleidoskopmuster auf weißem Grund machte das Design-Konzept des Eurovision Song Contest aus. Darüber ein schwarzer Balken mit weißem Eurovision-Logo. Ganz ehrlich? Dieser einfache, minimalistische Aufbau hat mir zugesprochen. Allerdings war ich noch mehr vom Screendesign des Voting und Score-Boards beeindruckt. Es wirkte frisch, stimmig und gut abgepasst – Daumen hoch. Die finnische Agentur „Dog Design“ war mit dem visuellen Design beauftragt.

Wenn ich Screenshots der Voting-Phase finde, liefer ich sie nach.

Milos Radovic weist auf das, mir bisher unbekannte, .net magazine hin. Neben interessanten Inhalten zum Thema Design und Development bietet es zahlreiche Tutorials, die als PDF kostenlos zum Download bereitstehen. Der englischsprachige Podcast lohnt sich übrigens auch. Seit gerade ist das .net magazine in meinem RSS-Reader vertreten — mal schauen, ob die Webseite meinen guten Ersteindruck bestätigt ;-)

(via superdeluxe)

Gerade bei pixelgraphix gefunden: Florian Steglich gibt Tipps zum Ordnen und Ausmisten von RSS-Feeds. Hauptgedanke ist es, die Feeds nach Wichtigkeit zu sortieren. Persönlich wichtige Feeds landen in einem »Pflichtlektüre« Ordner, andere beispielsweise in einen »Langeweile« Ordner. Unter anderem spart man so Zeit, man kann sich schnell einen Überblick verschaffen und an stressigen Tagen kann man die unwichtigeren Feeds getrost ungelesen lassen.

Mir gefällt die Idee, Feeds nach dem System zu ordnen. In meinem RSS-Reader herrscht im Moment Chaos: Die Feeds sind weder nach Kategorien, noch nach irgendwelchen anderen Kriterien sortiert. Da mir eine Einteilung in Kategorien generell schwer fällt, da viele Feeds verschiedene Kategorien abdecken, werde ich es in den kommenden Tagen mal dieses System ausprobieren ;-)

Googles Counter-Dienst „Google Analytics“ geht demnächst in eine neue Runde. „Vom hässlichen Entlein zum schönen Schwan“ – Robert bringt es auf den Punkt. Google Analytics ist als kostenloses Statistiktool umfangreich, zählt genauer als andere, kostenlose Counter und überzeugt auch im Handling. In der neuen Version kommen neue Funktionen – und ein neues Layout. Seit heute kann die neue Version in der Betaphase getestet werden. Fazit: Das neue Google Analytics kann sich sehen lassen.

Link: Google Analytics
Link: Neue Funktionen im Überblick

Beim Surfen und ausmisten alter Bookmarks, bin ich auf einen Artikel von Jens Meiert gestoßen. Anfang letzten Monats schrieb er über Druck-Stylesheets – direkt fühlte ich mich ertappt:

„Es gibt keine Entschuldigung dafür, nicht wenigstens ein einfaches Druck-Stylesheet zu haben, und wenn man bereits mit Webstandards jongliert, ist die ganze Geschichte mehr als trivial. Hintergrund ist, dass man tunlichst vermeiden sollte, Benutzer dazu zu zwingen, Stylesheets zu deaktivieren, Druckvorschauen zu öffnen und Seiten auszuwählen, die gedruckt werden sollen, um schließlich auch mal drucken zu können.“

Also hab ich mich mal direkt an die Arbeit gemacht und ein kleines, feines Druck-Stylesheet für mein Blog erstellt. Hier der CSS-Code:

{ background: #fff; color: #000; }
//Stellt sicher, dass der Text schwarz ist und der Hintergrund weiß. Das soll zu einer besseren Lesbarkeit führen.

body { font: 100%/1.3 Arial, "Lucida Grande", Verdana, Tahoma, sans-serif; }
//Formatierung des Textes

#navigation, #f-recent, #sidebar, #f-blogroll, li.flickr, h3.respond#respond, .c-formular { display: none; }
//Blendet alle nicht für den Druck relevanten Elemente aus.

Print-Stylesheets werden entweder per
<link rel="stylesheet" href=”{Verzeichnis}/print.css" type="text/css" media="print" />
in den HTML-Header eingebunden, oder mithilfe von
@media print { /* CSS Code */ }
direkt in die CSS-Datei.

In letzter Zeit kommen im Webdesign immer häufiger Gestaltungsraster in Sprache. Jedenfalls kommt mir das so vor. Erst auf der SXSW 2007 hielten Khoi Vinh und Mark Boulton den Vortrag „Grids Are Good“. Darin erklärten sie die Vorteile und Gründe für Webdesign innerhalb eines Gestaltungsrasters. Anhand eines Beispiels zeigten sie, wie Webseiten mit Grids aufgebaut werden und auf was geachtet werden sollte.

Jetzt hat auch Agenturblogger Oliver Wagner das neue Layout seines Blogs strikt nach Rastern aufgebaut. Es fällt sofort die klare, übersichtliche Struktur auf. Das Auge braucht nicht lange, um sich auf der Seite zurechtzufinden und bekommt ein bestimmtes System geradezu aufgezwängt.

Webseiten mit Grids wirken langweilig? Kein bisschen, gerade durch den strikten Aufbau wirkt eine Webseite in sich stimmig und übermittelt eine gewisse Harmonie. Auch ich habe beim Erstellen des Blog-Templates auf Grids zurückgegriffen (siehe Screenshot). Ich halte mich zwar nicht immer so strikt an die Regeln, versuche aber im System zu bleiben ;-)

Drei gute Beispiele für erfolgreiche, auf Rastern basierende Designs sind zum einen Khoi Vinhs Blog „Subtraction“, Mark Boultons Webseite und der neue Agenturblog.

Neugierig geworden? Einen guten Einstieg in die Welt der Raster bietet unter anderem der SXSW-Vortrag, der als PDF-Datei zum Download bereitsteht.

Link: Artikel auf subtraction
Download: Grids Are Good (PDF, 8,34 MB)