Also womit fängt man an?

Ein gutes Grafikprogramm besorgen, welches für einen Webdesigner die Grundvoraussetzung für seine Arbeit darstellt. In der Regel wird mit Photoshop designt, doch ist dieses verhältnismäßig teuer. Daher solltet ihr euch nach kostengünstigen Alternativen umsehen. Ein Programm gefunden (Gimp, Ulead Photo Impact o.ä.)? Dann kann es loslegen.

Bevor ihr anfangt macht euch mit euren Werkzeugen vertraut. Lernt mit dem Grafikprogramm umzugehen. Prägt euch die Funktionen ein, und übt mit den Tools umzugehen. Gegebenenfalls arbeitet euch in das Ebenensystem ein. Das alles kann schon mal längere Zeit in Anspruch nehmen. Bei mir hat diese Phase ein halbes Jahr gedauert. Damals habe ich hauptsächlich Signaturen gemacht und mir Grundkenntnisse und Routinen erarbeitet.

Diese haben mir dann später sehr geholfen und mir den Einstieg ins Webdesign sehr erleichtert. Erst wenn ihr euch gut mit eurem Programm auskennt, solltet ihr euch daran machen euer erstes Webdesign zu erstellen. Allerdings solltet ihr nicht zu viel erwarten, wenn ihr nicht wirklich talentiert seid, dann enden die ersten Webdesigns in den meisten Fällen im Papierkorb . War bei mir auch nicht anders.

Bei diesem Design, achtet mal bitte auf die Ecken, die sehr unsauber gemacht wurden, auf den tristen Gesamteindruck und die unproportional großen Schriften. Alles Kennzeichen, für wenig gestalterisches Gefühl und wenig Stil. Wie ihr Ecken sauber macht, solltet ihr wissen, wenn ihr euch mit eurem Werkzeug auskennt. Schriften solltet ihr, dort wo sie im späteren Design dynamisch seien sollen, immer ohne Glättung in euer Screendesign einfügen. So wirkt euer Screendesign realistischer. Bei meinem Beispiel passen die runden Buchstaben einfach nicht in den Contentbereich und das sieht alles etwas verschwommen aus.

Nächster Tipp für den Anfang, experimentiert mit Farben und Formen bis ihr ein Gefühl dafür bekommt, was gut aussieht und was nicht gut aussieht. Falls ihr nur Hobbydesigner seid und keine Ausbildung habt, bzw. bekommt, dann solltet ihr euch vielleicht mal in die Farbenlehre einlesen, oder Tools wie http://kuler.adobe.com benutzen um schöne Farbkombinationen zu wählen.

Nicht nur bei den Farben kann man Hilfestellung in Anspruch nehmen. Ihr benötigt Menschen, die euch sagen, was ihnen an eurem Design nicht gefällt. Zu diesem Zweck eignen sich hervorragend Grafiker Communities, wie http://3dn4d0g.deviantart.com (schaut euch mal um). Dort können euch erfahrenere Designer beraten und euch Tipps geben. Ein anderer Vorteil dieser Communities ist, dass ihr euch die Werke von besseren Webdesignern angucken könnt, und eine Menge von diesen lernen könnt. Natürlich sollt ihr keine 1zu 1 Kopien erstellen, aber mal ein paar Farben abkupfern oder versuchen einen Effekt nachzubasteln ist nur lehrreich. Ihr könnt dann ruhig darauf hinweisen, dass ihr euch habt inspirieren lassen, das ist dort gängige Praxis.

Wovon ich weniger halte, ist das stumpfe auswendig lernen und Tutorials, Anleitungen und Workshops. Webdesign ist eine Kunst, und jeder Designer gibt seinen Webdesigns eine eigene persönliche Note. Aus diesem Grund übt lieber und bastelt fleißig für euch selber, anstatt nur eine billige Kopie von einem guten Designer zu werden.

Es dauert sicher länger seinen eigenen Stil zu finden, aber mit dem kann man sich dann schließlich von den anderen Webdesignern abheben. Und gerade das ist wichtig heutzutage. Nur wer besonders ist und einen eigenen Stil hat, der wird auch Aufmerksamkeit (Kunden) bekommen.

Hier nochmal ein paar Tipps für eure Webdesigns:

• Breite auf max. 1024 Pixel setzen, da sonst User mit älteren Monitoren horizontal scrollen müssen
• 72 dpi Auflösung wählen, mehr sind im Web sowieso nicht sichtbar
• Ordnung halten (Gruppen und Ebenen benennen)
• Zielgruppe im Auge behalten
• nicht aufgeben!

Tipps für Fortgeschrittene:

Jaja auch für den ein oder anderen Semi-Profi habe ich vielleicht noch Neuigkeiten parat. Erstmal möchte ich ein bisschen über Kontraste erzählen. Wenn ihr ein Webdesign erstellt, dann achtet darauf, dass die Bereiche, die dem User in die Augen fallen sollen, dies auch tun. Wie kann man das erreichen?! Eben, durch Kontraste.

Farbkontraste:

Eine Seite, die nur blau ist, kann keinen Blickfang haben. Eine blaue Seite mit einem weißen Kästchen lenkt die Augen des Besuchers unweigerlich auf das weiße Kästchen. Gibt es Abstufungen? Ja gibt es, Schwarz-Weiß ist der stärkste Kontrast, sprich: Farbe und Gegenfarbe haben den größten Kontrast, auch wenn Schwarz und Weiß streng genommen keine Farben sind, wir sind aber mal nicht so kleinlich. Mit Abstufungen (Grau-Weiß, Hellgrau-Weiß) kann man auch eine thematische Gliederung in einem Webdesign vornehmen. Wie ihr also seht könnt ihr durch geschickte Farbwahl die Augen eures Besuchers beeinflussen. Dass ihr daraus auch Geld schlagen könnt, wenn ihr wollt, brauche ich ja dann nicht mehr erwähnen .

Größenkontraste:

Kleines Beispiel:

Worauf schaut man zuerst? Richtig, auf den fett gedruckten großen Text. Dies geschieht, weil unsere Augen immer auf der Suche nach festen Anhaltspunkten sind. Aus diesem Grund schauen wir uns ersten die dick gedruckte Passage an und dann den Rest. Dieses Prinzip lässt sich auch für eure Webdesigns missbrauchen, um zum Beispiel bestimmte Bereiche durch unterschiedliche Größen eine bestimmte Gewichtung zuzuordnen. Nicht nur Besucher eurer Internetseite werden es euch danken, wenn ihr wichtige Wörter und Bereiche highlightet, aber auch Google wertet dicke und große Schriften stärker als normale.

Funktionen:

Wenn ihr ein Webprojekt umsetzen wollt, dann macht euch bitte vorher über die Funktionen die es beinhalten soll Gedanken und lasst gegebenenfalls einen Programmierer drüber gucken, der euch sagt ob man das Webdesign so umsetzen kann. Ich sehe immer häufiger Webdesigns, die man so nicht umsetzen kann und ich finde es ist nur zweckmäßig, sich an gewisse Regeln zu halten. Vor allem wenn man Anfänger im Bereich Html  ist, sollte man sich nicht sofort mit sehr komplizierten Webdesigns rumschlagen müssen, sondern an kleinen Seiten üben.

Zielgruppen, angemessene Farbwahl:

Business-Website in Schwarz? Natürlich nicht (Kontrast). Nein Spaß bei Seite, ihr solltet euch Gedanken machen, wenn ihr mit eurer Webseite ansprechen wollt. Prinzipiell geht es doch darum, dass dem User das Design gefallen soll, und deshalb ist es nur sinnvoll, sein Design an die Geschmäcker der Zielgruppe anzupassen.

Kleine Zuordnung meinerseits:

• Frauen = warme Farben, helle Farben
• Business = Weiß, eine andere Kontrastfarbe (Blau, Grün, Orange oder sogar Grau)
• Bands = Ocker, erdfarben, Schwarz
• Esports = in allen Farben und Formen
• geht immer = Weiß, Schwarz, Grau, Farben mit wenig Sättigung
• geht nicht immer = Grün, Blau, Gelb etc. (Themenrelevant ja, d.h. Meerseite in blau ja, Gartenseite in Blau nein!)
• geht gar nicht = grelle Farben mit sehr viel Sättigung, die in den Augen stechen und den sog. “Augenkrebs” verursachen.

Es lässt sich also festhalten, dass ihr je nachdem für wen ihr ein Webdesign erstellt, die Farbwahl komplett anders wählen müsst. Falls ihr Langeweile habt, oder keine Kunden, probiert halt etwas aus und versucht ein gutes Gefühl für passende Farben zu bekommen.

Fokus eines Webdesigns:

Abhängig von der Verwendung eures Webdesigns, müsst ihr einen Fokus für das Design setzen. Wollt ihr informieren, und schreibt gute Texte, würde ich den Fokus definitiv auf die Texte legen und keinen großen graphischen Aufwand betreiben. Möchtet ihr euch aber als Webdesigner anbieten, rate ich euch nur seid kreativ und professionell und legt den Fokus ruhig auf die graphische Gestaltung.

Tiefe und Dimensionen:

Während im Web1.0 noch nicht so viel Wert auf 3-Dimensionalität gelegt wurde, sieht man heutzutage immer wieder plastische Webdesigns, die schon fast zum anfassen und spielen anregen. Doch was ist wichtig, bei eines solchen Web2.0 Webdesigns? Zum einen kann man Schatten verwenden, um einem Button oder einer Box und somit seinem gesamten Webdesign, plastisch wirken zu lassen. Aber auch der kluge Einsatz von Verläufen (Hell-Dunkel = Wölbung zum Besucher, Dunkel-Hell = Wölbung vom Besucher weg) kann dem Besucher das Gefühl von 3-Dimensionalität vermitteln. Zusätzlich wird durch das Einsetzen eines Schlagschattens eine Tiefe im Design erzeugt, das bedeutet, das ein Teil des Designs über einem anderen Teil liegt. Damit kann man ebenfalls einen Kontrast zwischen verschiedenen Bereichen eines Webdesigns erstellen.

Usability:

Auch das schönste Web 2.0 Webdesign kann eurem Besucher nicht helfen, wenn er sich auf eurer Seite nicht zurecht findet. Daher gilt es einige Regeln zu beachten. Bei der Anordnung eines Webdesigns sollten die Strukturen klar gewählt sein und auf den ersten Blick ins Auge fallen (Kontraste etc.), damit für den Besucher sofort ersichtlich ist, wo er was wie bedienen kann um zu seinem Ziel zu kommen.

Außerdem sollte man darauf Wert legen, dass wichtige Elemente wie eine Navigation nicht erst durch Scrollen erreicht werden müssen. Auch übergroße Header und viel zu große Bilder verschlechtern die Benutzerfreundlichkeit. Beachtet man diese Regeln und kann man guten Gewissens sagen, dass man selber keine Probleme hat die Seite zu browsen, nur dann sollte man die Seite auch dem unbedarften Besucher zumuten.

Fazit:

Mann muss viel lernen und viel beachten, um ein zufriedenstellendes Webdesign erstellen zu können. Wie ihr sehr existiert neben der Praxis auch noch eine Menge an Theorie zum Thema Webdesign, welche ich hier nur sehr oberflächlich vermitteln konnte. Allerdings schadet sicherlich keinem von euch ein kurzer Blick in diese Theorie, die euch bei einer Ausbildung zum Mediengestaltet so oder so erwartet.

Aller Anfang ist wie gesagt schwer, aber ich wünsche euch viel Glück und viel Spaß, denn dass ist die Hauptsache. Ohne Spaß an der Arbeit, könnt ihr auch kein vernünftiges Webdesign erstellen. So einfach ist das. Also lasst euch nicht unterkriegen.

Schluss!

Geschafft wieder einmal einen schönen Monsterpost verfasst, der wie ich hoffe einiges an Informationen über Webdesigns für euch enthält. Solltet ihr noch Fragen haben, oder Verbesserungen, dann zögert nicht mich über das Kontaktformular zu kontaktieren.

Liebe Grüße Alexander