Webdesigner-Blog 

Istockphoto.com ist seit vielen Jahren der Platzhirsch unter den Bilddatenbanken für freie Bilder (Royalty Free Stock Photos – also Fotos die man unter bestimmten Lizenzbedingungen verwenden darf, ohne den Künstler am Gewinn beteiligen zu müssen).

Kaum eine andere Bilddatenbank wächst so rasant und hat so viele hochwertige Bilder wie Istockphoto.com; und vorwiegend hochwertige Bilder sind es, die eine Webseite besser aussehen lassen. Für Webdesigner also sehr wichtig.

Leider wurden in der Vergangenheit die Preise bei Istockphoto hochgesetzt. Einmal durch ein höheren Preis pro Credit und zum zweiten durch mehr Credits je Bild (Bei Istockphoto bezahlt man mit Credits, die man im Vorfeld zu unterschiedlichen Preisen erwirbt, je nachdem wie viele man auf einmal kauft.)

Zwar kommt man weiterhin nicht drum herum, Istockphoto.com zu benutzen, da es viele gute Bilder eines Themas nur dort gibt, jedoch könnten 2 Alternativen interessant sein (wenn nicht jetzt – vielleicht später):

Dreamstime
ca. 9 Millionen Bilder / Beispiel: Ein 800×533 px Bild kostet: ca. 2 Euro

Bigstockphoto.com:
ca. 5 Millionen Bilder / Beispiel: Ein 900 x 545 px Bild kostet: 1,05 (wenn man im Vorfeld 120 Credits kauft)

Das größte Manko bei den Istockphoto-Alternativen ist allerdings die kleinere Auswahl, die schlechtere künstlerische Qualität der Bilder und ein komplizierteres Bestellsystem. Viele Verlangen auch einen Copyright-Hinweis, was das Ausschlusskriterium schlechthin ist.

Trotz dieser beiden Alternativen ist Istockphoto daher in mancher Hinsicht immer noch die bessere Möglichkeit günstig Bilder zu bekommen. Der Preis ist momentan auch nur geringfügig teurer. Für ca. 3 Euro kann man Bilder (entsprechend obiger Auflösung) erhalten. Hochwertigere Bilder kann man für ca. 8 Euro haben.

Hier eine Liste weitere günstiger oder kostenloser Bild-Datenbanken:

http://www.morguefile.com/
http://www.photocase.de
http://stockfresh.com/
http://www.123rf.com/
http://www.shutterstock.com/
http://www.fotolia.com
http://www.deviantart.com/
http://www.flickr.com/
http://www.freedigitalphotos.net/
http://www.imagechef.com/
http://easy.agefotostock.com
http://www.sxc.hu/
http://www.pixmac.com/
http://www.digitalstock.de/
http://www.panthermedia.net/

Fazit: Aufgrund des Vergleichs mit anderen Bilddatenbanken, komme ich zu dem Schluß, dass es noch zu wenig gute Alternativen gibt. D.h. noch gibt es keine gute Alternativen zu Istockphoto.com (zumindest habe ich keine finden können). Deshalb lohnt sich ein Umstieg noch nicht. Diejenigen aber, die sich auch mit künstlerisch mittelmäßigen Bildern abgeben können und für die ein paar Euro Preisunterschied je Bild eine Rolle spielen, sind bei manchen Alternativen gut aufgehoben.

Hello Dave ist eine Webseite, dessen Navigation und Aufbau darin besteht, dass die einzelnen Bereiche (je nach Mausposition) vorbeifliegen.

Eine tolle Idee von der Agentur aus Stockholm.

Ich habe jetzt vor kurzem ein Webdesign mit dezentem floralem Hintergrund erstellt. Dabei habe ich in Photoshop CS4 sowohl mit einem kostenlosen Zusatzset an floralen Brushes als auch mit einem kostenlosen Zusatzset an floralen Custom Shapes gearbeitet. Diese kann man sich aus unterschiedlichen Quellen kostenlos downloaden; z.B. gibt es florale Photoshop-Brushes hier und florale Custom Shapes hier oder eben aus anderen Quellen (einfach mal googlen).

Hier die Webseite, die ich mit diesem floralem (pflanzenartigem) Hintergrund erstellt habe. Es handelt sich dabei um einen Hochzeitsfotografen in Hamburg.

www.hochzeitsfotograf-hamburg.cc

Ein Webdesign das so aussieht wie eine Skizze. Tolle Idee.

Die Webseite findet man hier

Es macht sich immer gut, wenn man in seinen eigenen Webdesignreferenzen eine Vielzahl von Webseiten mit unterschiedlichem Design zeigt. Schließlich sind Geschmäcker verschieden und man möchte ja den Kunden überzeugen, dass er auch etwas ganz individuelles bekommen wird, d.h. kein Webdesign von der Stange. Deshalb ist es wichtig gute Ideen mitzubringen. Aussergewöhnliches Design ist ein Design, dass vom Gewohnten abweicht und häufig durch besondere Effekte überrascht. Und wenn man dann noch die Kurve bekommt, es so zu machen, dass es benutzerfreundlich ist und aus ästhetischen Gesichtspunkten überzeugt, hat man wirklich eine super Webseite hinbekommen.

Hier ist z.B. eine Seite aus den USA, welche so wie eine Tageszeitung gestaltet wurde :

Die Seite ist hier erreichbar.

Eine aussergewöhnlich tolle Idee, die man sich merken kann.

Unglaublich aber wahr: Unter http://www.sumopaint.com/web/ kann man online Bilder kostenlos bearbeiten und zwar mit vielen Funktionen die Top Bildbearbeitungsprogramme (wie z.B. Photoshop) bietet. Klar an Photoshop (dem Top-Photobearbeitungsprogramm No.1) kommt kein anderes Fotobearbeitungsprogramm wirklich ran, aber das was man unter sumopaint.com machen kann, wird schon den einen oder anderen Designer begeistern. Man muß noch nicht einmal Bildbearbeitungs-Software installieren. Gerade die Werkzeugpalette, Filter, Styles, Brushes, Paletten, Shapes, Layer etc. sind so wie einer Top Bildbearbeitunssoftware. Da kann man mit den eigenen Grafiken schon beachtliches anstellen.

Kostenlos und Online: Wie es aussieht hat die Freeware bzw. kostenlose Internetsoftware Sumopaint noch eine große Zukunft vor sich.

Tipp: Wenn Ihr auf  http://www.sumopaint.com/web/ geht, dann einfach auf das große Vorschaubild klicken, dann kommt Ihr direkt zum Online-Editor. Um Bilder zu bearbeiten müßt Ihr nicht registriert oder angemeldet sein. Man kann also sofort loslegen!

Nachtrag: Pixlr.com – Auch ein gutes Online-Bildbearbeitungstool

Mal schnell etwas  per FTP hochladen ohne zusätzliches FTP-Programm.
Das geht jetzt ganz einfach

mit dem Interface von http://www2ftp.de/

Mit dem Online-Interface können Sie sich einloggen und schon kann der Dateientransfer beginnen.
Dies ist FTP ganz bequem per Internet ohne zusätzliches Programm wie z.B. Filezilla, Total Commander, Wise-FTP, WS-FTP etc.

Ein Online-FTP-Zugang ist ideal, um z.B. Webdesignkunden den schnellen Zugriff auf große Dateien zu ermöglichen oder eben auch mal anders herum.

Zur Seite von Vividresponsematters.com

Videomenschen gibt es immer häufiger. Doch selten ist das Zusammenspiel von herein- und herausgeblendetem Textanimatonen mit Videomenschen so schön gelungen wie bei Vividresponsematters.com.

Hier geht es zu dieser Seite

Die Website-Design und Marketing-Agency Lounge Lizzard aus den USA haben als Webseite einen verspielten Schreibtisch. Es gibt so einige Webseiten im Schreibtischlook, aber diese ist besonders schön.

…zur Seite von Windsor

Die Idee beim Webdesign für das Modelabel Windsor diesen Stoff-Background (Webseiten-Hintergrund) zu nehmen, ist einfach genial. Der Hintergrund passt sich sehr gut dem Webseitendesign an, obwohl die Struktur des Backgrounds sehr intensiv ist. Super umgesetzt!

Auf dieser Seite kann man sich Videomenschen zusammenstellen und rotieren lassen. Die Menschen sind winterlich gekleidet. 

Hier klicken, um die Webseite aufzurufen.

Logos sind wichtig für die Corporate Identity. Eine Corporate Identity ist die Selbstdarstellung, mit der ein Unternehmen identifiziert werden kann. Es ist sozusagen die Unternehmensidentität.

Bei der Corporate Identity spielt das Logo eine zentrale Rolle, da es zur Persönlichkeit des Unternehmens maßgeblich beiträgt.

Hier nun 10 Tipps für ein gutes Logo, da Internetagenturen und Webdesigner auch häufig beauftragt werden, zusammen mit der Webseite, ein neues Logo zu entwerfen. 

1. Ideenfindung: Für die Ideenfindung ist es wichtig zu verstehen, wie sich das Unternehmen selbst sieht. Hier stellen sich wichtige Fragen bezüglich des Unternehmens und dessen Leistungen, Zielgruppen, Schwerpunkte, Größe, Wunschimage, Vorteilen gegenüber den Mitbewerber, Preislage  etc. 

2. Vektorgrafik: Logos sollten stets mit einem Vektorgrafikprogramm erstellt werden, damit dieses auch hinterher in allen Größen skalierbar sind; z.B. wenn ein größeres Plakat erstellt werden soll.  Ein sehr professionells Programm ist der Illustrator von Adobe. Ein gutes kostenloses Opensource-Programm ist Inkscape.

3.  Schriftart: Wenn möglich sollte man bei maximal zwei Schriftarten bleiben. Auch ist der Wiedererkennungswert besser, wenn die Schriftart nicht so häufig vorkommt  (Siehe Coca Cola, Walt Disney oder Ford). 

4. Lesbarkeit: Das Logo sollte noch gut erkennbar sein, selbst wenn es stark verkleinert wird oder wenn die Hintergrundfarbe wechselt. 

5.  Symbole: Logos bestehen meistens aus der Schrift und einem Symbol. Das Symbol sollte grob gehalten werden, um auch hier eine gute Erkennbarkeit zu garantieren. Auch in Schwarz-Weiß, sollte der Wiedererkennungswert immer noch gegeben sein.

6. Copyright: Logos sollten nicht der Konkurenz ähneln, da man hinter mit großen finanziellen Verlusten rechnen kann vor allem in Bezug auf die nachträgliche Änderung des Logos und den Kosten, die aus einem Gerichtsstreit hervorgehen.

7. Auswahl: Der Kunde sollte das Logo auswählen und wirklich zufrieden damit sein. Es ist besser dem Kunden dafür eine Vielzahl an möglichen Logos zu präsentieren, um eine Übereinstimmung zu erreichen. Meistens reichen hierfür 10 Entwürfe unterschiedlicher Logos aus. Falls man nicht auf einen gemeinsamen Nenner kommt, kann man dem Kunden eine Auswahl unterschiedlicher Logos verschiedener bereits existierender Firmen präsentieren, damit man weiß, welche grobe Richtung man einschlagen sollte, ohne in Copyrightsverletzungen hineinzugeraten.

Manchmal reicht es aus ein professionell gemachtes interaktives Video ins Netz zu setzen, um den Surfer zu begeistern. So hat sich auch ein französisches Modelable dazu entschlossen, eine Webseite mit einem beeindruckendem interaktiven Web-Video zu gestalten.

Zur Seite

Zur Präsentation

Volkswagen in den Niederlanden hat ein sehr anschauliche Video-Webpräsentation mit sich bewegenden Videosquenzen

Browsershots.org

Mit Browsershots kann man sich bequem eine Screenshot des eigenen Webdesigns anfertigen lassen, um es auf verschiedenen Browser-, Javaskript-, Flash- und Windowsversionen zu testen. Auch kann man verschiedene Bildschirmauflösung einstellen. Oder man testet die Webseite unter verschiednen Betriebsystemen.

Ein schöne Webdesignidee. Eine Stadt als Navigation:

Die Webseite der australische Regierung findet man hier.

Oder so wie bei den M&Ms in Frankreich, wo man eine Strasse in der City als Navigation nutzt:

Zur Webseite der französischen M&M-Street gehts hier entlang.

Immer mehr Unternehmen und Geschäftsleute sehen das Internet als eine unverzichtbare Plattform sich zu präsentieren. Als Internetagentur sollte man daher beim Gestalten von Internetauftritten folgende Regeln beachten:

1. Unternehmens-Logo
Das Logo ist das Markenzeichen des Unternehmens und Teil der Corporate Identity (Unternehmensidentität). Daher sollte dem Logo beim Webdesign besondere Gewichtung beigemessen werden. Das Logo muß an einer prominenten Position (meistens oben links) auf der Webseite erscheinen. Es darf nicht zu stark komprimiert sein. Ausserdem sollte die Kanten genügend Klarheit, Glätte und Schärfe aufweisen.

2. Text auf der Internetseite
Eine klare sachliche Schriftart ist Pflicht. Es empfiehlt sich hier Arial, Times New Roman, Verdana oder Garamond.

Jede Schrift sollte gut lesbar sein.  Einstellungen von 10 bis 24 pt sind normal. Es sollte im Zweifelsfall die Variante mit der größeren Schrift gewählt werden.

3. Farben des Internetauftritts
Die Farbwahl auf der Webseite sollte die Philosophie und Strategie des Unternehmens unterstreichen. Hintergrundfarben sollten in einem angemessenen Kontrast zur Schrift stehen. Warme Farben sollten eher nicht mit kalten Farben gemischt werden. Es gibt zwar Ausnahmen zu dieser Regel; aber so grundsätzlich bleibt man im gleichen Bereich.

Wichtig zu erwähnen wäre, dass man von den Standardfarben weg kommt und in der Farbwahl sehr individuelle Farben wählt. Anfänger verwenden häufig Standardfarben und daher sieht man diese häufig auf Webseiten mit niedrigem Niveau.  Wenn man auch Standard-Farben verwendet, so rutscht man ein bisschen in diese Sparte. Diese Assoziation gilt es zu vermeiden.  Am besten man verwendet Farbverläufe. Farbverläufe unterstreichen die Exklusivität.

Den Farben sollte besonderes Augenmerk gewidmet werden, da die Farbwahl entscheidend ist, wie der Betrachter der Webseite das Unternehmen wahrnimmt.

4. Bilder auf der Webseite
Die auf der Webseite verwendeten Bilder sollten zum Unternehmen passen. Zuerst sollte man sich die Zielgruppe anschauen. Handelt es sich um eine sehr jugendliche Zielgruppe, so verwendet man Bilder, welche Teenager als ansprechend empfinden.

Die Bilder auf der Webseite sollten alle ein sehr hohe Qualität haben. Professionelle Fotos findet man in Bildagenturen. Gerade bei größeren Firmen ist es häufig notwendig einen professionellen Fotografen zu engagieren. Aber auch bei der Aufbereitung der Bilder für das Internet sollte man lieber auf bessere Qualität achten. Ein beliebtes Bildformat ist JPEG. Hier gilt zu beachten, dass die Kompression nicht zu stark eingestellt wird. Artefakte auf Bildern gilt es gänzlich zu vermeiden.

5. Navigation der Internetseite
Das Navigieren sollte gerade auf Unternehmensseiten sehr benutzerfreundlich sein. Eine klare, übersichtliche Navigation spielt hier eine wichtige Rolle. So wie man z.B. bei Ikea intuitiv durch die Ausstellungsräume geführt wird, sollte der Surfer auf der Webseite des Unternehmens leicht zu der gewünschten Information gebracht werden. Wichtiges sollte von Unwichtigem unterschieden werden. Z.B. kann man den Menüpunkt “Impressum” aus der Hauptnavigation streichen und ans Ende einer jeden Webseite verbannen. Wichtige Menüpunkte kommen an eine gut sichtbare Stelle. Wichtigkeit sollte sich gerade bei der Navigation daran orientieren, was für den Kunden wichtig ist, damit dieser schnell zum Ziel kommt. Typisches Negativbeispiel ist der Punkt “Philosophie”. Mal ganz ehrlich: Wen interessiert schon die Unternehmensphilosophie. Also auch hier ganz nach unten auf die Webseite.

6. Einbindung von Schlüsselworten in die Webseite
Beim Webdesign für Unternehmen sollten die Schlüsselworte des Produktes oder der Dienstleistung in die Seite mit einfließen, um eine bessere Positionierung unter diesen Begriffen bei Suchdiensten zu erreichen. Sowohl in den Metadaten der Webseite, als auch auf der Webseite selbst, sollten die Schlüsselworte immer wieder aber auch nicht zu häufig auftauchen. Am besten man fokussiert unterschiedliche Schlüsselwortkombination für die verschieden Seiten des Webautritts, wobei die Hauptseite die wichtigste Schlüsselwortkombination beinhaltet.

7. Qualitätskontrollen
Egal ob beim Design, Text, Erreichbarkeit oder Funktionalität. Fehler sollten frühzeitig erkannt und behoben werden. Gerade bei Unternehmen darf die Webseite keinen Makel aufweisen. Qualitätskontrollen sollten daher immer wieder durchgeführt werden. Laden alle Bilder? Ist jede Seite erreichbar? Gibt es Rechtschreib- oder Grammatikfehler? Funktionieren die Formulare und Programme auf der Webseite? Wie macht sich die Webseite auf anderen Systemen mit unterschiedlichen Browsereinstellungen?

Geschäftlicher Erfolg oder Mißerfolg hängt immer mehr von einem seriösen Internetauftritt ab. Deshalb sollte jeder Webdesigner, der für Unternehmen bzw. Unternehmer Webseiten gestaltet, sich diese Regeln sehr zu Herzen nehmen.

Den Katalog kann man per Schieberegler blättern.

Probiert es mal aus:
http://www.girlsmusthave.com/

Die Idee ist zwar schon älter, aber hier gefällt mir die Umsetzung mit Flash.
Auch ist der Katalog schön mit der restlichen Webseite integriert.

Heute bin ich auf eine Webseite gestoßen, die in Sachen Benutzerfreundlichkeit katastrophal ist.

Erst wenn man die Maus klickt, kommt die Navigation zum Vorschein und selbst dann ist es nicht einfach.

Auch wenn das Flash nicht schlecht aussieht, muß man schon ein kleiner Mausakrobat sein, um vernünftig Navigieren zu können.

Aber seht selbst:
http://www.nickad.com/

Wir kennen bestimmt noch alle diese 3D-Bücher aus unseren Kindertagen, wo man bestimmte Teile raus ziehen kann, damit mehr Interaktivität beim Lesen oder Betrachten des Buches entsteht.

Der Webdesigner des Restaurants in Dempsey, Singapur hatte die Webdesignidee, dies auch für seinen Auftraggeber umzusetzen.

Die Webseite finden Ihr hier