Ausrüstung

Skizze / Inhalt

Webdesign beginnt mit simplen und einfachen Werkzeugen, denn alles was es braucht sind Stifte und Papier. Wer es nicht bereits macht, sollte spätestens ab jetzt immer ein Skizzenbuch mit sich führen. Denn anhand einfacher Skizzen werden unteranderem auch grosse Webprojekte zuerst aufgezeichnet und skizziert.

"Lass dir keinen Gedanken inkognito passieren und führe dein Notizheft so streng wie die Behörde das Fremdenregister." Walter Benjamin (Philosoph, 1892-1940)

>> teasketches / urbansketchers / Sketching for Web rules!

Inhalt / Zielgruppe
Ausserdem sollte man sich zuerst Gedanken zur Zielgruppe machen, wer wird die Website anschauen, was wird erwartet und was möchte man vermitteln? Dies hat wesentlichen Einfluss auf die Gestaltung der Webseite.

gestalterische Umsetzung / Planung
Nach den handschriftlichen Aufzeichnungen folgt ein erster digitaler Gestaltungsentwurf. Dies erfolgt noch ohne Webseiten-Codierung (technische Umsetzung), sondern mit einem Gestaltungsprogramm, um einen 'Look & Feel' (Mock-up) der Webseite zu erhalten. Farbkombinationen, Schriftbild und Layout/Komposition werden hier gestaltet. Dies kann mit offline Gestaltungsprogrammen (Photoshop, InDesign, Illustrator) geschehen oder man greift bereits auf Webeditoren (Muse, Dreamweaver) zurück, die bereits parallel zur Gestaltung die Website technische umsetzen (Codierung mit Websprachen HTML/CSS etc.). Es kann auch mit online-Webtools (z.B. webflow) gearbeitet werden, die die Website bereits online stellen.

technische Umsetzung
Grundsätzlich können Webseiten mit jedem Texteditor geschrieben werden. Es gibt kommerzielle sowie freie Softwares, welche die Arbeit von WebdesignerInnen erleichtern und den Inhalt der Website direkt in Websprachen (HTML, CSS) umsetzen.
Jedes Programm ist so gut wie die Designenden selbst. Es empfiehlt sich daher, sich vorher mit dem Aufbau, Struktur und Gestaltungseigenschaften einer Webseite auseinanderzusetzen, um danach das passende Programm/Tool auszuwählen. Es gibt Tools, wie Blogs, die vorgefertigte Templates anbieten, welche jedoch die Gestaltungsfreiheiten einschränken. Mit Webeditoren kann man dank Eingabehilfen für Websprachen die Website komplett selbständig gestalten. Und ein CMS erlaubt die programmunabhängige und strukturierte Organisation einer Website.
Weitere Informationen zu den einzelnen Tools/Programmen sind unter Webbearbeitung aufgelistet.

Websprachen:
>> HTML
>> CSS

Webbearbeitung:
>> Blog
>> Editor
>> CMS

Webseitenname, Speicherplatz und FTP (Hosting)
Nebst der Idee und des Programms und wird für die Umsetzung einer Webseite noch ein Webseitenname (Domain/URL) sowie Speicherplatz für die Daten (Webseiten und dazugehörige Mediendaten) und ein Programm/FTP (File Transfer Protokoll) benötigt, damit die Daten vom eigenen Computer auf dem externen Server gespeichert werden. Teilweise ist dies bereits in den Tools (wie beispielsweise Blog) integriert oder es wird von Webhostern (Server mit Speicherplatz, FTP) gegen Entgelt angeboten.

>> weitere Informationen zu Host / Domain
>> Informationen zu Projektstruktur eines Webprojekt

Freie Software - Open Source Software
Freie Software kann für jeden Zweck ausgeführt, untersucht, modifiziert und in ursprünglicher und modifizierter Form weiterverarbeitet werden. Open Source bedeutet quelloffen, der Quelltext (Programmiersprache/Softwaresprache) ist somit öffentlich zugänglich. Open Source widerspiegelt eher die Entwickelndensicht, während der Begriff Freie Software den Nutzen der Anwendenden und der Gesellschaft im Allgemeinen heraushebt.

GNU General Public License
Die GNU ist eine von der Free Software Foundation (FSF) veröffentliche Lizenz mit Copyleft für die Lizenzierung von freier Software. Das Copyleft ist eine Klausel in urheberrechtlichen Nutzungslizenzen, die festschreibt, dass Bearbeitungen des Programms nur dann erlaubt sind, wenn alle Änderungen ausschließlich unter den identischen oder im Wesentlichen gleichen Lizenzbedingungen weitergegeben werden. So wird verhindert, dass veränderte Fassungen mit Nutzungseinschränkungen weitergegeben werden.

Vorherige Seite: Beispiele Nächste Seite: Blog