Sie sind hier: edv-beratung-thomas.de / 10 Schritte zur eigenen Website (alt)


Für alle, die ein Tutorial suchen, um ihren Internet-Auftritt selbst zu entwickeln:

Anleitung: in 10 Schritten zur eigenen Website (alt):

neu Aktualisierung: Diese Anleitung ist schon einige Jahre alt und gibt nicht mehr in allen Punkten den aktuellen Stand wieder. Ein Beispiel: Wenn Ihre Seiten bei Google gut platziert sein sollen, sollten Sie die frame-Technik nicht verwenden, da Google darauf inzwischen keine besondere Rücksicht mehr nimmt. Ich verzichte auf die Korrektur der veralteten Punkte, weil ich eine vollständige Neufassung des Tutorials vorbereite.

1. Schritt: Entscheiden Sie sich: WYSIWYG-Editor oder HTML-Quellcode?

Leider schon ganz zu Anfang müssen Sie sich entscheiden, ob Sie Ihre HTML-Dateien mit einem WYSIWYG-Editor (What you see is what you get) erstellen oder ob Sie direkt HTML-Quellcode entwickeln wollen. Mit folgenden Ausführungen möchte ich Ihnen den Entschluß etwas leichter machen:

Mit einem WYSIWYG-Editor plazieren Sie (ähnlich wie mit einem Vektorgrafikprogramm, etwa Corel Draw) Ihre Gestaltungselemente (Schaltflächen, Linien, Bilder, Grafiken, Text usw.) auf dem Bildschirm. Die WYSIWYG-Programme erzeugen daraus automatisch den HTML-Quellcode, der dann von Ihrem Browser interpretiert wird. Bei guten Programmen entspricht das Ergebnis dann wirklich Ihren Eingaben im Editor.

Kostenlose WYSIWYG-Editoren sind etwa Microsoft Frontpage Express, das dem Internet Explorer beiliegt, und der Netscape Composer (Beigabe zum Navigator). WYSIWYG-Programme wie HoTMetaL und NetObjects Fusion sind gelegentlich kostenlos als Vorgänger-Vollversion auf PC-Zeitschriften-CDs enthalten; schauen Sie ab und zu mal ins Zeitschriften-Regal. Wenn das beste für Sie gerade gut genug ist, können Sie auch viel Geld ausgeben: Macromedias Dreamweaver z. B. kostet ab etwa 458,- Euro.

Wenn sie selber HTML-Quellcode entwickeln, gehen Sie keine fremdbestimmten Umwege, sondern sind "näher dran": von Ihrem Browser werden diejenigen Befehle interpretiert und umgesetzt, die Sie selbst eingegeben haben. Als Eingabeprogramm können Sie jeden Windows-Editor verwenden, also auch das Zubehör-Programm Notepad. Auf Dauer machen Sie sich das Leben aber leichter, wenn Sie mit einem besonderen HTML-Quellcode-Editor arbeiten. Auch hier ist das Angebot an Freeware, Shareware und kostenpflichtigen Programmen sehr vielfältig.

HTML-Editor Phase 5
Sicherlich eine gute Wahl (und zudem kostenlos) ist der HTML-Editor Phase 5 (siehe Kurzbeschreibung in Freeware top 20).

Als HTML-Kurs und Nachschlagewerk steht Ihnen im Internet z. B. Selfhtml zur Verfügung (siehe auch die Beschreibung unter Schritt 3), für den HTML-Editor Phase 5 gibt's das leicht verständliche Tutorial von Clairette Neumann unter www.clairette.de/tutorial.

Jetzt steht Ihre Entscheidung an: WYSIWYG-Editor oder HTML-Quellcode? Auf den ersten Blick erscheint der WYSIWYG-Weg weniger mühsam. Ich habe mich für die Entwicklung von HTML-Quellcode entschieden, aber nicht etwa, weil ich Programmierer bin, sondern aus folgenden Gründen:

Falls Sie als WYSIWYG-Editor Frontpage Express oder Netscape Composer verwenden wollen, sollten Sie auch wissen, daß diese Programme keine frames (Rahmen) unterstützen. Eine HTML-Datei mit der Rahmen-Aufteilung müssen Sie für beide Editoren also selbst erstellen, wenn Sie frames verwenden wollen.

Was sind nun frames? Sie dienen der Unterteilung des Anzeigebereichs im Browser in mehrere Teil-Fenster wie z. B. auf dieser Website: 1. Unterteilung des Gesamtfensters in ein oberes und ein unteres Fenster. 2. Unterteilung des unteren Fensters in ein linkes und ein rechtes Fenster. Natürlich sind auch andere Unterteilungen möglich: nur oben und unten, nur links und rechts, beliebige Kombinationen von links, rechts, oben und unten ...

Sie müssen keine frames verwenden, aber mit einem eigenen Rahmen ist Ihre Steuerleiste für Ihre Besucher immer im Blickfeld, unabhängig von der Länge der gleichzeitig angezeigten Nutzdaten-Webseite. Und wenn Sie Selbständiger, Freiberufler oder Geschäftsinhaber sind, sorgt ein frame mit Ihren Firmen- und Adreßangaben dafür, daß diese für Ihre Besucher immer sichtbar sind, auch wenn auf der Nutzdaten-Webseite mit den Bildlaufleisten nach unten "gescrollt" wird.

Wie auch immer Sie sich entscheiden, Sie brauchen Ausdauer und vor allem viel Zeit, um als Neuling Ihre Website zu entwickeln. Wenn Sie als Selbständiger oder als Firmeninhaber eine Website einrichten wollen, aber nur wenig Zeit haben, können Sie mich mit der Einrichtung Ihres Internet-Auftritts beauftragen: von der Beratung bis zur fertigen Website erledige ich alles für Sie.

Als Gewerbetreibender oder Freiberufler mit eigener Website müssen Sie die Impressums-Pflicht nach dem "Teledienstegesetz" beachten. Sonst drohen Ihnen saftige Bußgelder oder kostenpflichtige Abmahnungen durch Mitbewerber. Infos und Hilfe gibt's hier.

Wenn Sie sich entschieden haben, selber HTML-Quellcode zu entwickeln, geht's jetzt weiter mit Schritt 3.


2. Schritt: Wenn Sie mit einem WYSIWYG-Editor arbeiten wollen:

Sie haben sich für die Arbeit mit einem WYSIWYG-Editor entschieden, dann sollten Sie sich zunächst über die programminterne Hilfe-Funktion mit der Arbeitsweise Ihres Programms vertraut machen, bevor Sie loslegen.

Halt: Ein kleines Extra habe ich noch für Sie, wenn Sie Frontpage Express oder den Netscape Composer verwenden wollen (diese Programme unterstützen keine frames): den HTML-Code mit der Rahmenaufteilung nach dem Muster dieser Website.

Wenn Sie Ihre Webseiten erstellt haben, geht's weiter mit Schritt 4.


3. Schritt: Wenn Sie HTML-Quellcode entwickeln wollen:

Sie haben sich entschieden, selber HTML-Quellcode zu entwickeln. Dann sollten Sie sich überlegen, welchen Editor Sie verwenden wollen. Sie können mit dem Windows-Zubehör-Programm Notepad arbeiten, mit einem beliebigen Editor Ihrer Wahl oder mit einem auf HTML spezialisierten Programm, das Sie bei Ihrer Arbeit mit HTML unterstützt. Diese Website wurde mit dem HTML-Editor Phase 5 erstellt (siehe auch Kurzbeschreibung in Freeware top 20).

Um sich mit HTML vertraut zu machen, brauchen Sie keine dicken und teueren Bücher zu kaufen, denn HTML-Kurse stehen Ihnen im Internet kostenlos (auch zum Runterladen) zur Verfügung, z. B. Selfhtml.

Selfhtml
HTML-Einführung, Anleitung und Befehlsnachweis
  • außerdem Beschreibung von CSS, JavaScript, CGI/Perl
  • durch den Umfang bedingt manchmal etwas unübersichtlich
  • zum Runterladen: selfhtml80.zip (ca. 7 MB)
  • gilt als Standard-Nachschlagewerk (hier finden Sie alles)

Ob Sie nun Selfhtml verwenden oder einen der vielen anderen HTML-Kurse bevorzugen, die im Internet angeboten werden, zwei Dinge sollten Sie auf keinen Fall tun: Befehle auswendig lernen und alles auf einmal verstehen wollen. HTML hat einen riesigen Befehlsvorrat, aber am Anfang brauchen Sie bestimmt nicht alle Befehle, sondern nur einige wenige. Die beste Methode bei der Webseiten-Gestaltung ist, schrittweise vorzugehen und sich nur mit den Befehlen zu befassen, die man gerade benötigt.

Noch einige Tips von mir:

4. Schritt: Webseiten lokal auf Ihrem PC testen (nach Teststrategie):

Wenn Sie Ihre HTML-Dateien erstellt haben, ist der Zeitpunkt gekommen, Ihre Webseiten (lokal auf Ihrem Rechner) zu testen. Legen Sie eine Teststrategie fest, in der folgende Maßnahmen nicht fehlen dürfen:

5. Schritt: Besucherzähler auf Ihren Webseiten einbauen:

Wenn Sie wissen wollen, wie oft Ihre Seiten besucht werden, können Sie Zähler einbauen. Mehrere Zähler sind zu empfehlen, wenn Sie über Verweise mehrere Seiten anbieten und feststellen wollen, welche Seiten bei Ihren Besuchern besonders gut ankommen, und welche überhaupt nicht.

ZählerWerden Sie auch so viele Besucher haben wie dieser "Webmaster"?

Im Internet gibt es ein großes Angebot an Zählern. Berücksichtigen Sie bei Ihrer Auswahl folgende Gesichtspunkte:


6. Schritt: Ihre Webseiten mit einem "favorite icon" ausstatten:

Auch kein Muß, aber sinnvoll: Bauen Sie auf Ihren Webseiten ein "favorite icon" ein:

Zunächst einmal: was ist ein "favorite icon": Jeder Besucher Ihrer Webseiten hat die Möglichkeit, die Adresse in seine Lesezeichen (im Internet Explorer heißen die "Favoriten") aufzunehmen, dort fügt dann der Browser Ihres Besuchers sein eigenes Symbol an erster Stelle ein: Bei 100 Lesezeichen sieht der Anwender also 100 mal das Browser-Symbol. Mit einem "favorite icon" wird statt des Browser-Symbols das von Ihnen festgelegte Symbol angezeigt, so daß sich Ihre Seiten unter den vorhandenen Lesezeichen Ihres Besuchers deutlich hervorheben.

Sie haben 3 Möglichkeiten, ein "favorite icon" festzulegen:

7. Schritt: Webhoster auswählen und Domain anmelden:

Sie benötigen im Internet Speicherplatz, auf den Sie Ihre Website hochladen, und eine Adresse, über die Ihre Besucher auf Ihre Website zugreifen können (als Beispiel: wenn Sie Max Müller heißen und Ihre Website im Browser durch die Eingabe von www.max-mueller.de aufgerufen wollen, dann ist max-mueller.de Ihre Domain). Hoffentlich klagt keiner namens Max Müller gegen mich, daß ich sein Urheberrecht verletze oder sein Warenzeichen mißbrauche!

Webspace-Provider, die zugleich auch Ihre Wunsch-Domain registrieren, gibt's inzwischen wie Sand am Meer: große, kleine, teuere, billige. Die beiden größten Anbieter sind 1&1 und Strato, deren Werbebroschüren ziemlich regelmäßig den gängigen PC-Zeitschriften beiliegen.

Berücksichtigen Sie bei der Auswahl Ihres Webspace-Providers auch folgende Gesichtspunkte:

Die Angebote sind selten übersichtlich, und jeder Anbieter gliedert seine Angebote anders, so daß der Vergleich manchmal schwer fällt. Gerade deswegen sollten Sie sich für Vergleich und Auswahl Zeit nehmen. Vielleicht können Ihnen auch die Testberichte in einschlägigen Fachzeitschriften weiterhelfen.

Meine Empfehlung: Für Anfänger und für Profis, die keine MySQL-Datenbank und keine Subdomains brauchen, ist das Paket "Visitenkarte" (1,99 Euro/Monat) von PS-Webhosting ein gutes Angebot: eine de-Domain, 1000 MB Speicherplatz, Traffic-Flatrate, PHP 4 und 5, .htaccess - Unterstützung mit mod_rewrite- und anderen wichtigen Apache-Modulen sowie 1000 email-Adressen sind im Preis enthalten (Stand Dezember 2012). Die kostenlose telefonische Hilfe ist montags bis freitags von 09:00 bis 19:00 Uhr über eine normale Festnetznummer erreichbar. Kostenlose email-Unterstützung gibt es an allen Tagen rund um die Uhr.

Domain und Webspace kostenlos? Auch das gibt's, ist allerdings mit Werbung verbunden und kommt deswegen wohl nur für private Websites in Betracht (alle Angaben nach Stand Juni 2006):
Wenn Sie Ihren Netzauftritt für eine gute Platzierung in Suchmaschinen optimieren wollen, sollten Sie auf solche kostenlosen Lösungen aber verzichten, denn bei vielen Katalogen können Sie Adressen wie "...de.vu" & Co oder einer Domain untergeordnete Verzeichnisse nicht anmelden. Gelegentlich kommt es auch vor, daß Suchmaschinen Seiten von Domains mit Hunderten oder gar Tausenden von Verzeichnissen nicht erfassen und folglich die dort enthaltenen Links nicht berücksichtigen.


8. Schritt: FTP-Programm auswählen und installieren:

Um ihre HTML-Dateien, Grafiken, Bilder, Symbole usw. (also alle Bestandteile Ihrer Website) von Ihrem PC auf den bei einem Webspace-Provider angemieteten Speicherplatz hochzuladen, benötigen Sie ein FTP-Programm (FTP: Abk. für file transfer protocol, auf gut Deutsch: Datei-Übertragung).

Auch hier haben Sie mehrere Möglichkeiten:

Nach der Installation müssen Sie Ihr FTP-Programm noch konfigurieren: Zuerst stellen Sie eine Verbindung zum Internet her und rufen dann Ihr FTP-Programm auf. Anschließend tragen Sie Ihre Zugangsdaten ein.


WS_FTPMax Müller hat die Domain max-mueller.de angemeldet und verwendet WS-FTP LE:

Unter "General" nimmt er die Einträge vor wie links dargestellt.

Unter "Startup" trägt er hinter "Initial Local Folder" den Pfad zu den Dateien ein, die er hochladen will: Da sich seine Dateien im Verzeichnis C:\MMueller befinden, trägt er hier also ein: C:\MMueller .

Unter "Advanced" sind keine Änderungen erforderlich!

Wenn Sie einen Firewall einsetzen, müssen Sie im FTP-Programm Ihrer Wahl unter Umständen besondere Parameter eintragen, die Sie beim Hersteller Ihres Firewall-Programms erfragen können.


9. Schritt: Hochladen Ihrer Website mit allen zugehörigen Dateien:

Wenn Sie alle Vorbereitungen getroffen und vor allem Ihre Website lokal auf Ihrem PC ausgiebig getestet haben, laden Sie alle für die Website vorgesehenen Dateien hoch. Verwenden Sie hierfür das FTP-Programm Ihrer Wahl (siehe Schritt 8).

Üblicherweise haben FTP-Programme nach Art von Dateimanagern zwei Dateifenster: Im einen Fenster werden die Dateien Ihres lokalen PC-Verzeichnisses angezeigt, im anderen die Dateien Ihres Server-Verzeichnisses. Dieses Server-Verzeichnis ist vor dem erstmaligen Hochladen meistens leer; wenn Ihr Webspace-Provider eine Datei index.html eingestellt hat, löschen Sie sie, denn diese Datei index.html hat Vorrang vor Ihrer selbsterstellten Datei index.htm.

Dann markieren Sie im Fenster Ihres lokalen Verzeichnisses die hochzuladenden Dateien und kopieren sie ins Fenster Ihres Server-Verzeichnisses: Damit veranlassen Sie das Hochladen der gewünschten Dateien.

Nach dem Hochladen sollten Sie Ihre Webadresse in Ihrem Browser aufrufen und Ihre Website erneut testen. Verwenden Sie hierfür die gleiche Teststrategie, nach der Sie Ihre Webseiten lokal auf Ihrem PC getestet haben (siehe Schritt 4). Wenn Sie noch Fehler entdecken, laden Sie Ihre Dateien mit Ihrem FTP-Programm wieder runter, beseitigen die Fehler und laden dann erneut hoch.


10. Schritt: Ihre Website bekannt machen:

Was nützt Ihnen Ihre schöne Website, wenn Sie keine Besucher haben. Teilen Sie also Ihre Webadresse Ihren Kollegen, Schulkameraden, Kommilitonen, Freunden, Bekannten und Verwandten mit. Und sorgen Sie dafür, daß Ihre Website von Google und anderen Suchmaschinen erfaßt wird. Hier finden Sie einige Tipps zur Suchmaschinenoptimierung.


Anhang: 6 gute Gründe für die Fähigkeit, HTML-Dateien erstellen zu können:

  1. Das Erstellen von HTML-Dateien wird in wenigen Jahren eine so selbstverständliche Kulturtechnik sein wie heute lesen, schreiben, rechnen, mit Messer und Gabel essen, telefonieren, mit dem PC umgehen können.

  2. Verlassen Sie sich nicht darauf, daß für alle Zeit Microsoft Word das inoffizielle Standardformat für den Dateiaustausch bleiben wird: Word setzt Windows voraus, aber Windows ist nur ein Betriebssystem unter mehreren. Niemand weiß, ob Windows auch in 10 Jahren noch die gleiche Marktstellung wie heute haben wird. Linux hat schon mächtig aufgeholt. Mit HTML sind Sie auf der sicheren Seite, denn HTML ist betriebssystem-unabhängig!

  3. In Zukunft wird es in vielen Berufen selbstverständlich sein, Bewerbungen als e-mail-Anhang im HTML-Format einzureichen. In der Werbebranche, bei Grafikern und natürlich bei Webdesignern ist diese Art der Bewerbung schon heute weit verbreitet. Wer das künftig nicht beherrscht, kommt nicht in die engere Wahl.

  4. Eine eigene Website sichert Unabhängigkeit: Wer anderen etwas mitteilen will, kann dies selber tun und ist nicht auf andere (Zeitungen, Rundfunk, Fernsehen) angewiesen.

  5. Schnelligkeit: Über das Internet kann man am schnellsten vielen etwas mitteilen: mit Telefongesprächen und Briefen erreicht man stets nur eine Person, mit selbstgemachten Druckerzeugnissen zwar mehrere, aber Druckschriften müssen erst mühsam verschickt oder verteilt werden.

  6. Kostenfrage: Es gibt keine billigere Möglichkeit als das Internet, vielen etwas mitzuteilen.


Weitere Links zum Thema:

  CSS 4 You - Layouten ohne Tabellen - Mustervorlagen für Ihre Website
  Browser-Test unter allen möglichen Browsern - ohne diese zu installieren
  kostenlose Straßenkarten für private und geschäftliche Websites
  WEBMART - email-Newsletter, Foren, Online-Shops, Ad-Server, Mini-CMS
  OnlineWebService - kostenloses HTML-Gästebuch mit anpaßbarem Layout
Zur Startseite
Stand: 01.05.2013 nach oben ©2001-2018 Gösta Thomas