Kategorien
Gestaltung und Design Mediengestalter-Ausbildung

Flash

Ich steiger mich ja gerade so ein wenig in Flash und ein bisschen in ActionScript ein. Ähm nein, ich arbeite mich rein, also ich setze mich irgendwie damit auseinander. Über Schultern schauen, dumme Fragen stellen und irgendwie auch ausprobieren und so.

Also ist eigentlich ganz cool, zwar totgesagt (Hallo iPad) aber totgesagte leben länger und selbst Latein wird ja irgendwie noch benötigt. Letzteres kann ich übrigens gar nicht, sehen wir mal vom großen Lorem ipsum ab. Ist aber auch egal.

Jedenfalls habe ich Flash die letzten Jahre als Konsument gehasst. Eigentlich immer noch, gerade jetzt auf dem Mac, da das Plugin so derbst kacke programmiert wurde, dass es meinen Lüfter steil gehen lässt und ich quasi gezwungen bin, Flash-Blocker installiert zu haben. Aber als Produzent (das klingt so derbe wichtig und cool) reizt es mich schon mehr. Was nicht heißt, dass ich jetzt vom rechten Pfad der Webgestaltung abkommen werde. Ne, ich schau mir mal an, was man damit tolles machen kann und ja. Das wollte ich mal festhalten. Nichts erwarten bitte. Danke.

Und seien wir ehrlich, auf Dauer HTML rumschubsen rumscheuchen ist ja auch langweilig, warum nicht einfach was neues lernen?

Kategorien
Gestaltung und Design Linktipps

Linktipps

Man kommt ja durchs Netz und findet da das ein oder andere wichtige, gutaussehende und gehaltvolle Zeug. Das möchte ich euch natürlich nicht vorenthalten, deswegen sammel ich das beste, interessanteste, best-betitelste und stelle es hier als dicke Linkpackung herein.

Grid Based Design Toolbox
Alles was man für ein anständiges Raster im Web braucht und wissen sollte

Design by Grid: Showcase
Zusammenstellung von Grid-/Raster-Layouts im Web

Great Collection of Visual Identities
sehr schicke Sachen dabei (via agenturblog)

How To Quickly & Easily Remove A Background In Photoshop
war mir irgendwie auch nicht so bewusst. Kannte bisher nur die Pfad- und Lasso-Methode, hörte von Lab-Kanälen (mal ausprobieren) und habe das Zauberstabwerkzeug als massiv ungeeignet eingestuft.

12 free grunge cement textures
Grunge. Zement. Photoshop.

19 Top Fonts in 19 Top Combinations, via Webdesignblog
Ja doch, kann man so machen

Passfotos selbst gemacht
da ich anscheinend einen neuen Personalausweis brauche, kommt das ja vielleicht ganz entgegen. Wobei.

What looks real is just fake
Möchte man kaum glauben, ist aber so.

5 Kundenausagen, die Webdesigner in Zukunft nicht mehr hören wollen
verdammt viel wahres dran!

Kopfbunt
sehr schönes Weblog das sich mit Design und so beschäftigt.

Textile und Markdown
Gerrit van Aaken über die Vor- und Nachteile der beiden Auszeichnungssprachen

Sliding Boxes and Captions with jQuery

Kategorien
Gestaltung und Design Video

How To Be a Freelance Designer …

… OR How To Be a Designer Who Works Out of An Office By Themself. Also What We Do at 36 Point.

via 36point, via Typeoff

Kategorien
Gestaltung und Design Typographie Webdesign/Gestaltung

Tipps zu hellem Text auf dunklem Grund

In Light text on dark background vs. readability von Roger Johansson geht’s mal wieder um die Probleme und Tipps zu weißem/hellen Text auf schwarzen/dunklen Hintergrund. Besonders im Hinblick auf die Lesbarkeit. Oftmals verwischen sich die hellen Buchstaben zu einem nicht lesbaren Brei. Die wichtigsten Regeln einmal zusammengefasst:

Schriftgröße

Als allererstes sollte man eine ausreichende Schriftgröße verwenden. Mini-Texte jenseits der 10px sollten generell vermieden werden, lesbar wird es so ab 12px. Auf eine geeignete Schriftart ist wie immer auch zu achten!

Beispiel zur Schriftgröße ansehen.

Zeilenabstand vergrößern

Um die Lesbarkeit zu steigern und keinen Textbrei zu erhalten, sollte der Zeilenabstand vergrößert werden. Am einfachsten geht dies mit der CSS-Anweisung line-height: Ein Beispiel: line-height: 1.4em;. Dies würde den Zeilenabstand um 40 % der Schriftgröße erhöhen.

Beispiel zum erhöhten Zeilenabstand ansehen.

Wie man sieht, hat die Lesbarkeit enorm zugenommen. [Feed-Abonnenten sollten einfach mal die Original-Seite anschauen und das Stylesheet neu laden (F5 drücken).]

Laufweite erhöhen (sperren)

Zusätzlich zum Zeilenabstand kann man auch noch die Abstände zwischen den Buchstaben vergrößern: letter-spacing: 0.03em;. Hierbei ist es wichtig, das ganze nicht zu übertreiben! Außerdem sollte man hier auch die Wortabstände per word-spacing vergrößern, da es bei hohen Werten sonst schwer werden könnte, Zwischenräume und Leerzeichen auseinanderzuhalten. Dieser Wert sollte über dem Buchstaben-Abstand liegen.

Beispiel zur erhöhten Laufweite ansehen.

Kontrast

Der Kontrast zwischen Hintergrund- und Textfarbe sollte ausreichend genug sein, beide voneinander zu unterscheiden, aber auch nicht zu groß oder auch grob ausfallen, da dies auf Dauer schwer für die Augen werden kann. Wählt man für den Hintergrund die Farbe Schwarz #000 und gibt dem Text ein dunkles grau wie #666, dann ist der Text kaum zu erkennen. Färbt man den Text allerdings weiß (#FFF) wird es wieder besser mit der Lesbarkeit.

Beispiel zum Kontrast ansehen.

Natürlich gelten diese Regeln auch bei dunkel-auf-hell-Webseiten. Vielen Dank nochmal an Christoph für seine Hinweise in den Kommentaren.

Weitere Infos