Tipps zur Homepageerstellung.

Bevor Sie Ihr Programm zur Erstellung des grafischen Layouts oder der HTML Grundstruktur starten, sollten Sie genau Wissen, was Sie eigentlich erstellen möchten und wie die Strukturen sein sollen. Folgender kleiner Leitfaden sollte Ihnen den Beginn erleichtern:

• Machen Sie ein ausgiebiges Brainstorming:
  Durchdenken Sie, wen Sie mit Ihren Inhalten erreichen wollen und was der Sinn und Zweck Ihrer Homepage ist. Legen Sie die Struktur und Hirachie der Navigation fest. In welche Bereiche soll die Homepage unterteilt werden, soll es ein ein-, zwei- oder dreispaltiges Layout werden oder gar vier? Müssen Sie Platzhalter für die Einblendung von Werbeflächen berücksichtigen? Dies soll Ihnen lediglich ein paar Anhaltspunkte verdeutlichen, wie wichtig die Phase der Konzeption vor der Kreation ist!
• Erster Schritt - das grafische Layout:
  Nachdem die Phase der Konzeption abgeschlossen ist, beginnt die Umsetzung. Ausgehend davon, dass Sie kein bestehendes grafisches Erscheinungsbild (Layout) zur Verfügung haben, wird dieses im einem Grafik Programm Ihrer Wahl erstellt. Dabei überlassen wir Ihnen die Auswahl der Software, bewährt hat sich aus unserer Sicht das Programm Adobe Photoshop. Selbstverständlich gint es auch kostengünstigere oder auch kostenlose Programme zur Erstellung eines Layouts. Im nächsten Schritt ist wichtig, dass Sie die bestehenden Farben von Logos und / oder bestehender Unternehmensfarben berücksichtigen. Darüber hinaus sollten Sie auch die Erwartungen Ihrer Zielgruppe bedenken. Beispielsweise wäre die Farbe schwarz für den Einsatz einer Arzt Homepage eher ungeeignet! Legen Sie im grafischen Layout alle Bereiche fest, die Sie später benötigen.
• Zerschneiden der Grafik - Slicen für den HTML Einsatz:
  Prüfen Sie Ihr erstelltes Layout sorgfältig. Wenn Sie über wenig Erfahrung verfügen, vergleichen Sie es mit Ihren Mitbewerbern. Sie sollten sich positiv davon abheben können und schnell feststellen, ob Sie keine grundlegenden Fehler begannen haben. Wenn Sie zufrieden sind, geht es daran, dass "Bild" zu zerschneiden (Slicen), damit es in HTML umgesetzt werden kann. Darunter ist zu verstehen, dass Sie die Grundelemente wie z.B. Headergrafik, Footer, Hintergründe etc. in separate Grafiken schneiden müssen, damit diese in den einzelnen Spalten angezeigt werden können. Grundsätzlich sollten Sie die Größe der Bilddateien im Auge behalten, um die Ladezeit Ihrer fertigen Homepage so kurz wie möglich zu halten.
• Das HTML Grundgerüst: Regel Nummer 1 sollte lauten: Vergessen Sie Tabellen! Die Zeit in der man Tabellen zum ausrichten von Elementen und Layouts benutzt hat ist längst vorbei! Nutzen Sie ausschließlich CSS zur Formatierung und Ausrichtung wie z.B. Positionierung Ihrer Elemente. Das Erlernen von CSS ist relativ einfach, gute Inhalte für Einsteiger finden Sie z.B. auf http://www.css4you.de/ oder die Referenz auf http://de.selfhtml.org/css/index.htm Darüber hinaus sollten Sie darauf achten, dass Sie korrekten und validen bzw. semantisch korrekten HTML Quellcode erzeugen. Um dies zu überprüfen können sie den Validator auf W§C benutzen, den Sie hier finden. Ihre CSS Fomatierungen sollten Sie in externe Dateien speichern. Ob diese den Bestimmungen des W3C entsprechen können Sie hier prüfen. Mit Hilfe dieser Validatoren können Sie Fehler bereits in der Erstellphase ermitteln und abstellen.
• Einbinden von Skripten etc:
  Lagern Sie Skripte wie z.B. Javascript in externe Dateien aus und binden Sie diese im HEAD Bereich der Seite ein. Dies hat den Vorteil, das z.B. Suchspider schneller an den eigentlichen Inhalt Ihrer Seite gelangen, da manche bereit beim durchforsten der Skripte abbrechen und Ihre Seite somit nicht in Ihrem Index aufnehmen. Das gleiche gilt für CSS Angaben. Auch hier sollten Sie zentrale Dateien einbinden. Bei umfangreichen Projekten macht es Sinn mehrere CSS Dateien zu erstellen. Auf diese Weise können Sie später schnell und einfach Bestandteile anpassen. Beginnen Sie mit einer Basis Datei, die z.B. den Aufbau aller DIV-Tags beinhaltet.
• Textlinks statt Grafiken oder Flash Menüs:
  Wenn Sie bereits bei der Erstellung Regeln für die Suchmaschinenoptimierung berücksichtigen ersparen Sie sich spätere Optimierungen. Suchspider bevorzugen Links und Menüs aus Text. Google ist zwar in der Lage SWF Dateien zu durchforsten, dennoch sind Textmenüs die beste Variante für die Verlinkung bzw. die Navigation. Hier sollten Sie alle Navigationselemente in ungeordnete Listen anlegen. Diese bieten vielfältige Formatierungsmöglichkeiten und werden von den Suchspidern einfach indiziert.
• Formulare, der Weg Ihrer Besucher zu Ihnen:
  Ein Kontaktformular gehört zum Standard einer Homepage. Hier hat der Besucher die Möglichkeit eine vorgefertigtes Formular zur Kontaktaufnahme zu verwenden. Überlegen Sie sich vorweg, welche Daten Sie erfragen möchten und welche Felder sinnvoller Weise Pflichtfelder sein sollen. Dies trifft besonders bei sensiblen Daten wie Z.B. Kreditkarten- oder Kontoinformationen zu, die stets verschlüsselt werden sollten.
  Ein weiterer wichtiger Aspekt ist die Überprüfung der Daten vor dem Versand. Hier sollten Sie beachten, dass kein Missbrauch durch Dritte zum Beispiel für Spam möglich ist. Reine Javascript Überprüfungen sind zumeist nicht sicher genug. Setzen Sie lieber auf eine serverseitige Validierung mittels PHP und versteckten Texctfeldern.
• Impressumspflicht für kommerzielle Projekte:
  Wenn Sie Ihre Seite kommerziell einsetzen, müssen Sie ein Impressum anlegen in dem verschiedene Angaben pflicht sind. Immer wieder wurden und werden Unternehmen aufgrund fehlerhafter Daten im Impressum abgemahnt. Welche Angabe tatsächlich notwendig sein, hängt auch von Ihrer Branche ab!

Dies soll nur eine Anregung zur Homepageerstellung sein. Der Artikel erhebt keinen Anspruch auf Vollständigkeit. Für eventuelle Fehler kann sector12 nicht haftbar gemacht werden.

Gerne stehen wir Ihnen zur Beratung zur Verfügung. Schreiben Sie uns eine Nachricht oder rufen Sie uns an.