Kostenlose WordPress-Themes

Gallery Theme

Demo | Download

Fotofolio Theme

Demo | Download

Grace Photoblog Theme

Demo | Download

xyloid

Demo | Download

Sharpfolio Theme

Demo | Download

F8

Demo | Download (Theme ist kostenlos, Anmeldung notwendig)

Premium-Themes

Anthology Theme

Demo | Download

Photoworks Theme

Demo | Download

Gallerific Theme

Demo | Download

Photo + Blog

Demo | Download

Dobin Folio Theme

Demo | Download

Aperture Theme

Demo | Download

Dandelion Theme

Demo | Download

Themeology

Demo | Download

Locus One Page Theme

Demo | Download

Eine neue Website entsteht (Artikelserie)

Screendesign für eine Portfolio-Website

Screendesign für einen Blog

Screendesign für eine Auto-Website

Layout für eine Website im Technik-Look

Screendesign im Öko-Stil

Screendesign für ein Reisebüro

Ein künstlerisch-kreatives Layout

Geld-verdienen-im-Internet-Blog

Screendesign für eine Video-Download-Website

Produkt-Website im Business-Look

Ein blau-graues Business-Template

Screendesign für einen Business-Blog

Kreatives Webdesign im Papier-Look

Verträumtes Wölkchen-Layout

Screendesign für einen Foto-Blog

Screendesign für eine Portfolio-Website

Portfolio-Layout mit Texturen

Screendesign für eine Musik-Website

Hübsches Blog-Layout

Da ich gerade eine Website für eine neu gegründete Non-Profit-Organisation umsetze, hatte ich vor einigen Tagen jedoch die Idee, auf die Suche nach schön gestalteten Internetauftritten aus diesem Themenbereich zu gehen und meine Linksammlung in Form eines Webdesign-Artikels zu veröffentlichen. Hier sind 20 inspirierende Websites, die sich Themen wie Umweltschutz, Weltfrieden, Menschenrechte, Bildung oder Welternährung widmen. Viel Spass beim Stöbern!

Eine Schafherde für Afrika

Help Your Habitat

Human Trafficking in Southern Africa

WWF

Omid for Iran

Graceful Seniors

Greenpeace

WideAwake.org

PETA

Housing Works

The Rockstar Foundation

Villa Hope

Yellow Bird Project

D.A.D.S.

Building for Peace

Fresh Artists

Africa Tour 2008

Plant With Purpose

cucweb.org

World Food Programme

Weiterführende Links

Noch mehr inspirierende Websites findest du hier:

• 40 of the Best Websites of Non-Profit Organizations
• Design Awards Gallery: NGO’s Websites
• CSS Mania: NGOs
• siteInspire: Non-profit websites

Jetzt bist du dran!

Kennst du weitere inspirierende Websites aus dem Non-Profit-Bereich? Welche Beispiele gefallen dir besonders gut? Ich bin gespannt auf deinen Kommentar!

Cathedral Mountain Lodge

Inspired by Iceland

Delia Explorers

Australia Day

Thornbury Castle Hotel

Places We Go

Trent River Cruises

Isla de Monterrico

Live Africa

Hellenic Holidays

Falk Custom Adventures

Talkeetna Viaggi

Under the Roman Sun

Visit Norway

Château de Bagnols

TripKick.com

Glover Lodges

Martis Camp

Isola d’Elba

Val Gardena

Jetzt bist du dran!

Kennst du weitere tolle Websites zum Thema Reisen und Urlaub? Wohin führt dich deine nächste Reise? Und welchen Ort der Welt möchtest du in deinem Leben unbedingt noch sehen? Ich bin gespannt auf deinen Kommentar!

Beispiele: 30 minimalistische Webseiten

Thomas Cheng

James Chambers

SOFA

Story Worldwide

Heartworker

Final Eyes

Ribbons of Red

Tim Parkin

Mark Boulton

Bobulate

Strukturblog

52 Weeks of UX

Sergio Villaquiran

The Rules of a Gentleman

Ross Bruggink

Dracula Studio

Zachary Pulman

North Kingdom

The Good Count

Tiny Villain

Affiliates in Perspective

Ken Deegan

Claire Coullon

Patrick Algrim

Francesco Fonte

VaultPress

t.grimes

StyleSpion

Monk Design

Cozette Lehman

Interessante Links zum Thema minimalistisches Webdesign

Minimal Exhibit
Minimalsites
Die Zauberformel für Designer

Buchtipps zum Thema Webdesign

Jetzt bist du dran!

Wie gefallen dir Webseiten mit minimalistischem Layout? Kennst du ein sehenswertes Beispiel, das hier noch fehlt? Ich freue mich auf deinen Kommentar!

Dieses Problem lässt sich jedoch erstaunlich leicht beheben, wenn man einen einfachen Trick kennt. Hier erfährst du, wie das geht.

IE-Probleme beheben mit IE9.js & Co.

Mit einer einfachen JavaScript-Lösung kannst du ältere Versionen des Internet Explorers dazu bringen, sich wie ein moderner Browser zu verhalten. Das Script löst viele HTML- und CSS-Probleme und ermöglicht eine korrekte Darstellung von transparenten PNGs.

Kopiere einfach den folgenden Code und füge ihn in den Kopfbereich deiner Website ein:

1
2
3

<!--[if lt IE 9]>
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta2)/IE9.js"></script>
<![endif]-->

Die aktuelle Version des Codes findest du auch hier:
» IE9.js

Transparente PNGs richtig darstellen

Sobald du den Code eingefügt hast, sind die meisten IE-Probleme gelöst. Nur transparente PNGs werden noch nicht automatisch richtig angezeigt. Damit der IE 6 sie einwandfrei darstellen kann, musst du die Namen deiner transparenten PNGs anpassen. Und zwar so:

Vorher: bild.png
Nachher: bild-trans.png

Nur Bilder mit dem Anhängsel «-trans.png» kann der IE 6 richtig interpretieren.

Weitere Infos

Wenn du noch mehr zu diesem Thema erfahren möchtest, schaust du am besten hier vorbei:
» code.google.com

Business-Website

Grungy Business-Website

Fotogalerie

Portfolio-Website

Portfolio-Layout im Grunge-Stil

Einfache Portfolio-Website

Layout für eine Innenarchitektur-Website

Schickes blaues Portfolio

Einfaches Portfolio-Layout

Einfache Business-Website

Layout für ein Fotografie-Portfolio

WordPress-Theme mit dunklem Hintergrund

Kreatives Webseiten-Layout

Layout für ein Fotografie-Portfolio

Business-Website im Öko-Stil

Kreative Produkt-Website

Blog-Layout im Magazin-Stil

Kreatives WordPress-Theme

Webseite für eine Zeitschriftenfirma

Minimalistisches Portfolio-Layout

Portfolio-Website im Bokeh-Stil

Leuchtend blaue Website mit Texturen

Kreatives Layout mit Maskottchen

Professionelles und kreatives Portfolio

Business-Website

Blog-Layout im Natur-Look

Business-Website mit Wolkenhimmel

Layout für eine Fotogalerie

Professionelles Business-Layout mit Sparschweinchen

Business-Layout

Buchtipps zum Thema Webdesign

Statt einen langen Selbstbeweihräucherungsartikel über das Redesign zu schreiben, möchte ich euch aber lieber etwas Nützliches bieten. Nämlich eine inspirierende Liste von weiteren Webseiten mit handgezeichneten Elementen, die ich für euch zusammengesucht habe. Viel Spass und gute Inspiration :)

Creatividad sin límites

Esteban Muñoz

Biola Undergrad

Los colores olvidados

Web Designer Wall

RedVelvetart

We Are not Freelancers

N.Design Studio

Christian Sparrow

Matt

Befter

Mahmoud Omar

Yellow Bird Project

Hire Tijs Vrolix

Dan Conaway

Urban Roots

pwStudio

Varnion Technology

Bearskinrug

twentytwentyone

Mark Forrester

Sushi & Robots

Hire Best Website Designers

Tame Clothing

No Sleep for Sheep

Project 365

DaZa Portfolio

odosketch

Sophie Henson

Jetzt bist du dran!

Kennst du weitere tolle Beispiele von handgezeichneten Webseiten, die dir besonders gut gefallen? Ich freue mich auf deinen Kommentar!

Browser und Umlaute in Domain-Namen

Internet Explorer

Domain-Namen mit Umlauten funktionieren nicht in jedem Browser gleich gut. Der Internet Explorer 6 unterstützt beispielsweise keine IDNs, man kann ihn jedoch mit einem Plugin nachrüsten (auch wenn es sinnvoller ist, einen neueren Browser zu installieren). Ab Internet Explorer 7 sind die Umlaute kein Problem mehr.

Firefox

Auch mit Firefox (ab Version 0.8) sind internationale Domains mit Umlauten prinzipiell zugänglich, allerdings wandelt er Domain-Namen mit Sonderzeichen aus Sicherheitsgründen für den Benutzer sichtbar in Punycode um. Wenn man beispielsweise den Domain-Namen www.üü.net im Firefox aufruft, macht er daraus www.xn--tdaa.net. Die Website funktioniert dann zwar immer noch, aber hübsch anzusehen ist der Punycode nicht. Ausserdem kann es Probleme mit Dateipfaden (z.B. Bildern) geben, und das Einrichten von CMS und Templates kann etwas umständlich sein.

Weitere Browser

Welche Browser sonst noch IDNs unterstützen, kannst du hier nachlesen:
Internationalizing Domain Names in Applications

Mail-Programme und Domains mit Umlauten

Viele Mail-Programme unterstützen IDNs noch nicht. Sowohl E-Mail-Adressen als auch Links in E-Mails können davon betroffen sein. Zwar gibt es auch für Mail-Programme (z.B. Outlook) Plugins, aber wenn man selbst E-Mail-Adressen und Links mit Umlauten in der Domain verwenden kann, heisst das noch lange nicht, dass der Empfänger das auch kann.

Was bringen .net, .com & Co. mit Umlauten überhaupt?

Domain-Namen mit Umlauten sehen vor allem schöner aus als ihre Cousins mit den altbekannten ae-, oe- und ue-Schreibweisen. Besonders für die Kommunikation auf Drucksachen ist die korrekte Schreibweise mit ä, ö und ü deshalb verlockend.

Bei einem aktuellen Projekt habe ich das Problem gelöst, indem ich sowohl die Domain-Variante mit ü als auch jene mit ue bestellt habe. Die Website läuft jetzt auf der URL natuerliches-heilen.net. Auf dem Logo und auf allen Drucksachen steht jedoch die Version mit ü. Wer natürliches-heilen.net direkt in den Browser eingibt, wird dann einfach auf natuerliches-heilen.net weitergeleitet. Im E-Mail-Verkehr wird jedoch die ue-URL verwendet, damit sie sicher bei jedem funktioniert.

Weitere Infos

• IDN-Domains
• Internationalizing Domain Names in Applications (Wikipedia)
• Fehlende XN-Codierung für .net Umlaut-Domains (Forenbeitrag)

Kommentar schreiben und gewinnen!

Mit etwas Glück kannst du beim ersten Advents-Gewinnspiel ein sehr interessantes und inspirierendes Buch gewinnen. Es heisst «Transcending CSS – Neue kreative Spielräume im Webdesign» und wurde von Andy Clarke und Molly E. Holzschlag geschrieben.

Das Buch richtet sich an alle, die bereits über CSS- und XHTML-Kenntnisse verfügen und ihre Webdesign-Kunst perfektionieren möchten. Du erfährst, wie du Designprozesse optimal gestalten kannst – vom Konzept über die Gestaltung bis zur technischen Umsetzung. Die Autoren geben in ihrem Buch viele konkrete Tipps und arbeiten mit anschaulichen Beispielen.

Mir selbst hat das Buch eine komplett neue Welt eröffnet. Besonders gut gefällt mir der ganzheitliche Ansatz, bei dem kein Thema zu kurz kommt.

Einige Themen aus dem Buch:

• Was ist Transcendent CSS?
• Semantisches Markup
• Die Arbeit mit interaktiven Prototypen
• Der Arbeitsprozess in der Praxis
• Inspiration
• Gitter (Grids) im Webdesign
• Und vieles mehr » mehr Infos bei Amazon

So kannst du gewinnen.

Wenn du das Buch «Transcending CSS» gewinnen möchtest, hinterlasse einfach einen kurzen Kommentar am Ende dieses Beitrags.

Teilnahmeschluss ist der 22. Dezember. Am 23. Dezember wird der glückliche Gewinner (bzw. die glückliche Gewinnerin) per Los gezogen und per E-Mail kontaktiert. Vergiss also nicht, bei deiner Teilnahme eine gültige E-Mail-Adresse anzugeben ;) Sobald definitiv feststeht, wer gewonnen hat, wird der Name des Glückspilzes hier bekannt gegeben.

Viel Glück!

Update: Der Gewinner steht fest!

Die Glücksfee hat Daniel von gedankenreiter.de zum Gewinner erkoren. Ich wünsche ihm viel Spass mit dem Buch!

Und euch allen wünsche ich frohe Feiertage! Vielen Dank fürs Mitmachen und für all die guten Wünsche :) Übrigens war dies bestimmt nicht das letzte Gewinnspiel im WordWeb-Blog. Mit etwas Glück zählt ihr beim nächsten Mal auch zu den Gewinnern.