Flexible Layouts für Websites

Vom 12. Juni 2008, Kategorie(n): Webdesign

Flexible Layouts für Websites

Ausgerechnet bei Dr. Web, einer Seite deren Layout ungefähr so sexy wie Jakob Nielsen ist, erschien heute ein Gastartikel von Dirk Jesse.

Dirk Jesse ist der Herr, der hinter YAML, einem (X)HTML/CSS Framework, steckt. Sein Artikel ist gut, und er spricht ein Thema an, das mir selbst auch sehr am Herzen liegt:

Flexible Layouts für Websites

Für alle, die damit nicht so Recht etwas anfangen können: Gemeint ist, dass sich das Layout einer Webseite der Größe eures Browserfensters anpasst. Idealerweise so, dass ihr das gleiche Layout auf eurem Handy und auf eurem 32″ Display betrachten könnt.

Praxis

In der Praxis sieht das (leider) meist so wie bei Dr Web aus: das Layout wäre auf einer Aufllösung von 800 oder 1024 Pixel Breite gut lesbar, fahrt ihr eine höhere Auflösung, läuft der Fliesstext unendlich weit, und ihr werdet Schwierigkeiten haben, eine Zeile zu lesen, ohne dass das Auge dauernd verrutscht.

Flexibel ist nicht einfach

Ein gutes und flexibles Layout zu entwickeln, ist verdammt schwer - ich scheitere seit Monaten daran, für stylespion.de solch ein Layout umzusetzen. Und ganz ehrlich: Ich habe noch nie ein flexibles Layout gefunden, das Usability und gutes Design exzellent zusammen bringt, und bei dem man im Vergleich zu anderen fixen Website-Layous, keine Abstriche machen muß.

Flexible Layouts, die auch das Skalieren von Grafiken handeln können, werden die Zukunft sein, doch ich befürchte, dass es noch ein langer Weg bis dahin ist.

Zum Artikel: Flexible Layouts - die Herausforderung der Zukunft

Tags:, , , , ,

Konigi - Resource für Interface Designer

Vom 17. Februar 2008, Kategorie(n): Webdesign

Konigi - Resource für Interface Designer

The idea of researching how others have designed the look and feel of web sites and crafted their user interfaces is a practice many of us are engaged in continually. We may monitor innovative designers and the sites of influence that have paved the way for the practices we engage in as user experience and visual designers. In a way, it allows us to remain competitive to know what others are up to, but that awareness alone can be a double-edged sword.

Das Konzept ist cool und die gezeigten Beispiele gefallen mir auch. Nur lustig, dass ich mit dem Interface von Konigi selbst nicht allzu viel anfangen kann :)
Für alle Web Designer und Interface-Spezialisten ein Must-Bookmark.

Konigi.com

via SwissMiss

Tags:, , , , ,

Tutorial: flickr Badges optisch anpassen

Vom 28. Januar 2008, Kategorie(n): Coding, Fotografie

Eine einfache Möglichkeit, Besuchern auf eurer Website die aktuellsten Fotos aus eurem flickr Profil zu zeigen, sind die angebotenen Vorlagen (Batches), die flickr bereithält. Das steigert eure Views und ihr habt damit nach der Integration des Codes keine zusätzliche Arbeit mehr.

Der Nachteil dieser Vorlagen ist, dass sie kaum angepasst werden können. Zumindst bietet flickr das nicht an. Christian Hanneman hat auf seinem Blog beschrieben, wie ihr die einzelnen Parameter des Style Sheets (beispielsweise die ausgegebene Bildgröße) so anpassen könnt, dass das Badge optisch besser in das Layout eurer Website integriert ist.

Zum Artikel “flickr Badge konfigurieren

Tags:, , ,

Farbfindung, oder wie finde ich passende Farben für meine Layouts?

Vom 27. Januar 2008, Kategorie(n): Gestaltung

passende Farben für Layouts

Ich denke es wird allen Webgestaltern und Grafikdesignern schon passiert sein: Das Layout steht, die Boxen sind positioniert, das Raster der Website ist aufgeräumt, harmonisch, doch der letzte Kick, die Auswahl des Farbschemas, will einfach nicht klappen.

In solchen Fällen greife ich gerne auf ein Tool wie kuler, oder auf die Webcommunity Colourlovers zurück, um auf frische Ideen für die Farbwahl zu kommen.

Eine weitere, sehr gut funktionierende Methode ist, wenn die die Website (wird im Print genauso funktionieren) ein Foto im Header hat, einfach mit der Pipette einige Farben aus dem Bild zu picken. In 90% der Fälle, passen diese Farben zusammen, und ergeben ein harmonisches Farbbild. Die Reduzierung der Deckkraft mancher Farben, bringt ebenfalls oft gute Ergebnisse für dezente Farbtöne hervor.

Ein nützliches Tool für die Zusammenstellung einer Farbpalette habe ich vor wenigen Tagen gefunden (Mac only): Mondrianum

“Lithoglyph’s Mondrianum is a powerful plug-in that enables Mac applications to leverage the resources of the kuler community. Once installed, Mondrianum acts like a built-in, system-wide color picker, available in any Mac application that supports this feature of Mac OS X.”

Ein nützliches Tutorial, wie ihr Mondrianum in Photoshop zum Laufen bringt, gibt es bei Bittbox.

Wie geht ihr vor, um euren Themes und Layouts den letzten Farbkick zu geben?

Tags:, , , , , , ,