Webdesign Praxis

Tutorials
Tutorials

von Fries Wesolutions

Obwohl einige Softwareschmieden uns Web-Workern erzählen wollen, dass es möglich sei, eine Webseite komplett mit einem Programm zu erstellen, ist das nicht möglich. Vereinzelt kann man bei Anwendungen wie, zum Adobes ImageReady oder Fireworks von Macromedia einzelne Funktionen für das Web einfügen, aber keine Anwendung enthält alle Features, die man benötigt.

Nachdem man fetsgestellt hat, wie groß eine Webseite werden soll, sollte man alles vorher auf Papier bringen.
Manchmal sind die Ideen, die man sich im Kopf schon ausgedacht hat, schon so, das man ein grobes Layout am Rechner erstellen könnte. Doch welches Programm nimmt man dann? Nun, es reicht ein einfaches Malprogramm. Man sollte aber darauf achten, dass die Bildformate, die man erzeugt, auch später in den anderen Anwendungen weiter verarbeitet werden müssen.

Im Normalfall legt man die Seitengröße auf 740 x 416 Pixel fest. Dieses Maß kann man durch einen Screen Shot auf einem Windows-Rechner mit 17″-Bildschirm bei 832 x 624 Pixel sehen. Diese Konfiguration ist die zurzeit am meisten verbreiteste.

Man tastet sich meist Schritt für Schritt an die Sache heran. Man sollte sich nicht durch die Flut an Features, die einem ein Programm bietet erschrecken lassen. Man sollte sich Zeit nehmen und ohne Druck versuchen, das Programm kennen zu lernen, um dann be deim Entwerfen besser damit umgehen zu können.

Bei der Navigation, die man am besten vorher auf einem Blatt Papier ordentlich strukturiert hat. Hierzu kann man auf das Web zurückgreifen. Aber am Ende, muss man schon eigene Ideen haben, und einbringen. Denn auch hier gilt, Qualität geht vor Quantität.

Und bei der Platzierung, gibt es im Prinzip nur zwei Positionen, horizontal oben oder vertikal links.

Man muss schon bei dem Entwurf der Seite daran denken, wie man die Seiten aufbauen möchte, ob man nun die Navigationen statisch in einem Frame bleibt, oder ob man alle Teile bei einem Klick neu aufbauen lassen will. Mit PHP kann man die verschiedenen Elemente in getrennten Dokumenten anlegen, und erst bei dem Aufruf der Seite zusammenbringen.

Wenn dann der Entwurf steht, dann heißt es, die Seite in HTML umzusetzen. Wenn man mit Adobes Photoshop gearbeitet hat, bietet es sich an, mit Adobe ImageReady zu benutzen.

Bei ImageReady handelt es sich eine abgespeckte Version des Photoshop, das Programm bietet darüber hinaus noch eine Reihe von anderen Funktionen, die einem das Leben erleichtern. Es ist verblüffend, wie einfach so etwas geht, wenn man mal an früher erinnert.

Aber es gibt noch kein Universalprogramm auf dem Markt, dass alle notwendigen Schritte bis hin zur erfolgreichen Umsetzung einer Webseite erledigt, muss man schon mit vielen verschiedenen Anwendungen üben und mehrere Programme beherrschen, um ein gutes Ergebnis zu produzieren.

Adobe ImageReady stellt schon einen bemerkenswerten Schritt nach vorn dar. Durch eine HTML-Exportfunktion von ImageReady kann man Rollovers nicht nur entwerfen, sondern auch direkt samt Bild und Code ausgeben. Doch auch die Optimierungsfunktion in dem Programm übernimmt Aufgaben, die man sonst mit der Hand manuell erledigen müsste.

ImageReady hat aber nicht alle Features, die man gern auf einer Website hätte. Die Funktionen wie Layer, PopUp-Fenster oder Multimedia-Objekte kann man sich mit Macromedia Dreamweaver oder Adobe GoLive relativ einfach einbauen.

Oft gibt es aber Änderungsbedarf für einen zu umfangreich geratenen Quellcode. Denn auch wenn die neuen Codier-Programme in den letzen Jahren immer besser geworden sind, muss man HTML-Code per Hand nachbessern. Neben den sog. spurious blanks (unsichtbaren Leerzeichen), weisen die automatischen Codier Tabellen gern einmal Attribute zu, die man nun wirklich nicht haben will.

Es empfiehlt sich also, den so erzeugten Code nach den eigenen Maßstäben zu prüfen. Dieses Vorgehen ist wichtig, weil ein und dasselbe HTML-Dokument auf verschiedenen Rechner-Plattformen, zu den verschiedensten Ergebnissen führen können.

Für die Korrektur eines HTML-Codes sollte man ein Editor-Programm benutzen, das nicht in die Arbeit eingreift. Denn der Grund, warum man ein nicht mitarbeitendes Programm verwenden sollte, ist simpel. Ist eine Datei korrigiert, kann man beim Ansehen meinen, es sei alles in Ordnung. Und dann bei dem Sichern des Dokumentes auf die Festplatte kommt die Überraschung, weil das Programm alles ändert, und zwar in den vorigen Zustand.

Dieser Schritt, erfordert neben der Konzeption auch die meiste Zeit. Es ist aber besonders wichtig, sich für diesen Arbeitsgang viel Zeit einzuplanen, weil es erfahrungsgemäß sonst nicht so gut geht.

Jetzt, wo die Seite fertig ist, kann man sie, mit einem anderen Programm weiterverarbeiten. Aber die Seite ist noch nicht im Web zu sehen und muss deshalb ins Netz hoch geladen werden. Dafür braucht man einen so genannten FTP-Client. Man sollte darauf achten, dass auch wirklich alle benötigten Bilder und alle HTML-Dokumente mit zu übertragen. Denn das ist eine der beliebtesten Fehlerquellen.

Jetzt sind im Prinzip alle Schritte getan. Natürlich ist es nicht so einfach, wie beschrieben. Man muss schon Grundkenntnisse in den Programmen haben, aber nicht alles beherrschen, was hier angesprochen wurde.Im laufe der Zeit kommen dann auch andere Programme hinzu, und man entwickelt sich so weiter.

Be the first to comment

Leave a Reply

Your email address will not be published.


*