bilder
aufgabe
Ein junger ambitionierter und höchst professioneller Fotograf wünscht sich zu seinem neuen Erscheinungsbild (gestaltet vom wunderamt, münchen) eine adäquate Website, um vor allem potentiellen Kunden einen Überblick über sein Reportoire und Arbeitsweise zu geben.
konzept
- Transfer der Merkmale des neu entstehenden Corporate Designs auf die Website
- einfache und durchdachte Navigation
- der User soll jederzeit überall hin springen können und immer anzeigt kriegen, wo genau er sich befindet
- schnelle Ladezeiten der Fotos
- einzeln optimierte Bilder und Grafiken
- gute Größe der Vorschaubilder, die bereits eine Vorauswahl/Beurteilung ermöglichen
- weblesefreundlich aufbereiteter Text mit nur den wichtigsten Informationen
- Nutzung des Mediums hinsichtlich schneller und sinnvoller Bildwechseln/Galerien
- repräsentative, aktuelle, gute und sinnvolle Auswahl, die den User in der Menge nicht überfordern soll (deshalb keine Datenbankanbindung nötig)
einige details
- Schaffung einer übersichtlichen Siteaufteilung in Photographierubriken und allgemeine Rubriken
- Vorschaubilder in korrekter Proportion und Geamtheit (keine Ausschnitte, die nicht aussagekräftig wären und nur als Symbölchen dienten, wie man es leider so oft auf anderen Fotowebsites sieht)
- Vorschaubilder dienen als Übersicht, gleichzeitig wird aber bereits das Großfoto der Leiste angezeigt; dadurch vermeidet man lästige Surfzeit über umständlichen oder große Auswahl- oder Übersichtsseiten
- multiple Navigationsmöglichkeiten
- entweder über die Unterrubrikenziffern
- mittels der Pfeile links und rechts (vor bzw. zurück) neben den Vorschaubildern oder
- mittels der Pfeile links und rechts (vor bzw. zurück) neben den Großfotos
man kann sich so durch die gesamte Galerien klicken und die Maus/Hand an einer Stelle ruhen lassen
- ungewöhnlich schnelle Ladezeiten trotz großer Bilder durch optimale Bildbearbeitung-/abspeicherung und -integration (große Bilder sind wichtig, um sich von der Qualität des Fotografen überzeugen zu können)
- Verwendung von reinem CSS für geschicktes Layout und elegante Navigation (schlanker, asketischer, leicht editierbarer Code)
- auch die Menübuttons sind alles ul und li Listen!
- kein Flashfirlefanz, der nur unnötige Ladezeiten verursachen würde (so schön Überblendungen, transparente/blurrige Effekte auch sein mögen; bei einer Erstinformation der Zielgruppe (die ja zumeist viele Websites hintereinander abklappern muss) gilt das Prinzip der schnellen, ausreichenden Übersicht und schneller Kontaktmöglichkeit)
- alle Seiten haben einen Footer mit kompletter Adresse und Textmenü
- die allgemeinen Rubriken sind gegenüber den bildlastigen Galerienseiten sehr schlicht gehalten und enthalten alle wichtigen Informationen in wenigen Auflistungen oder kurzen Textparagraphen
- die Site wurde für ein Suchmaschinenranking optimiert (wobei das bei einer Site mit wenig Text nicht leicht ist, mit den ganzen Fotoforen zu konkurrieren; dem Kunden ist das aber auch nicht so wichtig er sieht seine Zielgruppe in anderen Kreisen als den Fotocommunities; der Fotograf betreibt zudem noch eine andere, eher atmospärisch angehauchte Website, die andere User ansprechen soll
- Barrierefreiheit bei allen Vorschau- und großen Bildern stehen sinnvolle Texte in den alt tags, die sie erläutern auch wenn eine Fotografenwebsite natürlich hauptsächlich sehende User ansprechen soll; die Menübuttons deshalb sind mit Text (display: none) und Hintergrundbildern angelegt
- komplette Website mit Hilfe von Adobe GoLive und Photoshop innerhalb von sechs Wochen (nach Designentscheidung) gestaltet/programmiert
- interessant war die Diskussion mit dem Fotografen, an welcher Stelle denn die Vorschaubilder stehen sollten: während er für den visuell harmonischeren Platz unterhalb des Großbildes votierte (und was umgesetzt wurde), hätte ich sie lieber oberhalb platziert aus Gründen der Userfreundlichkeit, der verkürzten Mauswege, dem logischeren Seitenaufbau, des einheitlich großen Bildfläche (immer ca 2500 Pixel, egal of Panorama-, Hoch-, Quer- oder Quadratformat und etwaigen künftigen Ergänzungen einzelner Bilder mit weiteren Projektfotos und erläuternden Texten variabler Länge. Nichtsdestotrotz sind derartige Fragestellungen und möglichen Lösungen immer konstruktiv nutzbar für aktuelle und künftige Konzepte. Sie helfen auch sich über Vorhaben und Ziele (sowie Zielgruppen) einer Website klar zu werden.
erfolg
Fotograf, Agenturen die, die das Erscheinungsbild gemacht und nun perfekt umgesetzt findet, als auch andere (die ja zur Zielgruppe gehören) und bis jetzt befragte Einzelpersonen und Designer sind überzeugt von der einfach zu handhabenden, funktionell einwandfreien und schnellen Website.
Beim telefonischen Kundenkontakt kann außderdem gleichzeitig die Website aufgerufen werden und mit den Interessenten über Bildervergleiche künftige Projekte besprochen werden (ihnen können auch konkrete Einzel-URL mit Motiven zugsandt werden).
Die Zusammenarbeit mit Fabian Helmich verläuft freundschaftlich, tadellos und konstruktiv. Die Vorbereitung der Fotos und Texte durch ihn ist vorbildlich.
zukunft
Zwei- bis dreimal im Jahr werden neue Projekte mit Fotos und Text aufgenommen werden Aufwand jeweils ca. 2-4 Stunden.
(Eine Suchmaschinenüberprüfung und daraus sich evtl. ergebener Seitenanpassung wird nur ca. alle 4-6 Monate nötig sein)
Die Gesamtanzahl der Fotos soll sich dabei nicht wesentlich erhöhen. Eine Best-of Auswahl und entsprechender Umbau der Galerie sind sinnvoller. Qualität vor Quantität!
Eine Ergänzung um weitere Hauptrubriken und Unterkategorien wird bei Bedarf leicht möglich sein, weil die Navigationsleisten so angelegt wurden, dass ausreichend Spielraum besteht, ohne dass das Design angepasst werden müsste.
Ebenso könnten die allgemeinen Rubriken ausgebaut werden (um z.B. technische Details oder Bilder(vergleiche) detaillierter zu erläutern.
Bei den Großfotos bestünde die Möglichkeit, eine Casestudy anzulegen und dabei entweder durch Klick auf das Foto an der Stelle den Text zu zeigen oder einen langen Text auf einer zusätzlichen Seite zu zeigen und mit „Vor“ bzw. „Zurück“ zu Navigieren. (Erst soll der User das Foto sehen; nur bei stärkerem Interesse würde ihn auch das Lesen einer Erläuterung reizen).