 Willkommen auf dem Portal für Mediengestalter
|
|
|
| Autor |
Nachricht |
bixxl
Dabei seit: 08.10.2005
Ort: Wien
Alter: -
Geschlecht: 
|
Verfasst Di 14.07.2009 09:40
Titel
|
  |
|
Ich stand vor 1 1/2 Jahren genau vor der gleichen Frage.
Ich habe zum Einstieg einen sehr guten Kurs für HTML und CSS besucht. Ich fand es sehr hilfreich, dass mich da sozusagen jemand an der Hand genommen hat, bei dem ersten Schritt in diese komplexe Materie. Danach konnte ich auch viel besser entscheiden, wo es für mich hingehen soll und das kann ich mir jetzt auch sehr gut selbst beibringen.
|
|
| |
  |
 |
sahnemuh
Dabei seit: 19.06.2003
Ort: /dev/null
Alter: 42
Geschlecht: 
|
Verfasst Di 14.07.2009 10:56
Titel Re: Erste Schritte im Bereich Webdesign - How to start? |
|
|
| remote hat geschrieben: | | DBGD hat geschrieben: |
Setze ich das mit einem Grafikprogramm um? Baue ich diese Dinge direkt im Photoshop, arbeite ich mit Illustrator. Fertige ich das komplette Layout an und zerschneide es, füge es dann im Dreamweaver ein? Riesen Problem ist für mich schonmal der Anfang. Welche Auflösung? Wie groß lege ich das Dokument an? |
1. Entwurf
Ob Du die Reinzeichnung mit Photoshop, Illustrator oder Fireworks (gerade für die ersten Entwürfe nicht zu verachten!) umsetzt, bleibt letztlich dir überlassen. Ich selbst arbeite mit Fireworks und Photoshop.
2. Umsetzung
Wenn Du die Projekte wirklich eigenständig umsetzen möchtest, kommst Du um HTML/CSS nicht herum.
Ich bin auch der Meinung, dass man einen großen Bogen um wysiwyg Programme machen sollte. Wenn Du mit Macs arbeitest, empfehle ich CODA (und ggf. CSSEdit). Es gibt auch einige andere IDE's die weitaus umfangreicher sind (Eclipse, Netbeans u.a.)... aber wenn Du keine komplexen Webanwendungen programmieren willst, ist das übersichtliche/abgespeckte CODA sicher leichter zu erfassen.
SELFHTML ist sehr gut ...ein Buch braucht es da weniger.
Was die Ausgangsbasis betrifft, lohnt es sich, mal einen Blick in diverse (Grid-)Templates zu schauen. Sehr populär sind zum Beispiel das 960 grid oder das 975er. Bei beiden findest Du leere "Templates" für PS, AI etc. die Dir zumindest diese Einstiegshürde abnehmen.
---
Am schnellsten geht es sicher, wenn Du anfangs mit jemandem zusammen arbeitest der in der Materie fit ist und bei dem Du auch mal über die Schulter schauen kannst. |
Schritt 1: Ideenfindung! - Mach dir Gedanken, was du mit der Seite zu tun gedenkst, wie sie wirken soll, was sie BEwirken soll (geht fließend über in Schritt 2).
Schritt 2: Konzept(!) - Überleg' dir, wie was funktionieren soll: Entwickle eine sinnvolle Navigationsstruktur, mach eine Zielgruppenanalyse, Benchmarking (Wettbewerb ansehen), Use-Cases (wie würde ein Nutzer die Seite benutzen und wofür - wie schaffe ich es ihn mit möglichst wenig Klicks und Verständnisschwierigkeiten zum Ziel zu bringen) etc.
Schritt 3: Funktionalskizzen/Wireframes/Mockups - (kann auch im Zuge von Schritt 2 passieren) - Mach dir Abbildungen davon was wo hingehört, was es für eine Funktion hat und wie der Nutzer damit interagieren soll. Das hilft unendlich beim "runtergestalten". Bei größeren Projekten kann man das ganze auch schon "benutzbar" machen (z.B. mit Axure).
Ist vor allem toll für etwaige Kunden, da sie schon mal was zum Anfassen haben aber auch für dich zur Kontrolle ob sich alles so "anfühlt" wie du es dir wünscht.
Schritt 4: Entwürfe - Ich persönlich lege sie in Photoshop an. Andere schwören auf Fireworks oder Illustrator (wurden ja alle schon genannt). Im Prinzip ist es egal, so lange sich der "Workflow" für dich gut anfühlt. Achte beim Entwerfen auf jeden Fall darauf, dass das ganze Später auch umsetzbar sein sollte - dafür ist es eigentlich unerläßlich vorher(!) schon Ahnung von den entsprechenden Sprachen/Möglichkeiten und den Fallstricken zu haben. Es gibt nichts gräßlicheres als Entwürfe von einer "Werbeagentur"/"Kreativagentur" (also einer Printbutze) umsetzen zu müssen, die von Tuten und Blasen keine Ahnung haben.
Schritt 5: Wäre bei mir das HTML Markup semantisch sinnvoll strukturiert runter zu schreiben, und DANACH das ganze per CSS anzuhübschen. Da man anfangs eher weniger in der Lage ist sich ein sinnvoll strukturiertes Markup einfach per CSS dann "hinzudengeln", kannst du natürlich auch visuell orientiert arbeiten. Versuch aber wenigstens die Auszeichnungen (Überschriften, Absätze, Listen etc.) korrekt zu benutzen. Irgendwann kommt das Verständnis wie was tickt von selbst. Learning by doing! (wie schon andere hier sagten).
Schritt 6: "Eyecandy" - Javascript, Flash, Silverlight dazu. Sofern es keine Full-Flash Seite wird. Dann sollte dieser Step wohl eher kommen 
Links zu den entsprechenden Steps:
1: http://www.creaffective.de/blog/ | http://www.kreativblog.de/
2: http://www.benutzerfreun.de/ | http://217.115.158.193//iw_downloads/eBook/Websitekonzeption.pdf
3: http://alp-uckan.net/blog/2008/12/06/XHTMLCSS-Mockups-versus-grafische-Mockups/ | http://www.rosenblut.org/wp-content/gallery/balsamiq/balsamiq-mockups-for-desktop-_users_rosenkrieger_documents_balsamiqmockups_twitter-rosenkriegerbmml.png | http://www.alistapart.com/articles/paperprototyping/ | http://www.axure.com/
4: http://www.adobe.com 
5: http://jendryschik.de/wsdev/einfuehrung/ (!) | http://de.selfhtml.org/
... ich packe nachher noch ein paar dazu. Muß erstmal schaffen 
|
|
| |
|
|
|
Anzeige
|
|
|
DBGD
Threadersteller
Dabei seit: 13.07.2009
Ort: Dortmund
Alter: -
Geschlecht:
|
Verfasst Fr 17.07.2009 12:17
Titel
|
|
|
Zunächst möchte ich mich für das ausführliche Feedback bedanken.
Wie ich mir schon gedacht habe wartet eine ganze Menge Arbeit auf mich...
Ich habe mir jedoch vorgenommen mich znächst in ganz kleinem Rahmen mit dem Thema Webdesign zu beschäftigen. Für die anspruchsvollen Sachen werde ich mir einen fähigen Mann/Frau suchen.
Es geht mir nun also um das erstellen ganz einfacher Webseiten. Z.B. eine Webseite für einen Anwalt. Keine Ahnung... Info, Anfahrt, Leistungen... Solche Seiten haben ja max. 5 Menüpunkte und dürften im Rahmen meiner Möglichkeiten liegen, bzw. könnte ich mir dieses Wissen wohl schneller aneignen.
Ich werde mich mal ans Werk machen und bei Bedarf weitere Fragen stellen.
Vielen Dank!
|
|
| |
|
|
| |
|
|
| Ähnliche Themen |
Webdesign: Tatsächlich sichtbarer Bereich bei 1024 x 768 px
Tabellenloses Layout - Die ersten Schritte...
Photoshop Cs2 (Pinselgröße 10er Schritte?)
Photoshop Aktion einzelne Schritte umbenennen
suche sounds, schritte, brennende lunte usw...
automatischer start einer .pdf !
|
|
|
Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.
|
|
