Eine Mini-Website an einem Nachmittag

Transkript

1 Erforderliche Grundausstattung Ein Computer, der mit einer Software zum Erstellen einfacher Textdateien ausgestattet ist (SimpleText, Text-Editor...) Ein Internetanschluss Eine Software mit der man im Internet navigieren kann, genannt Internetbrowser (Internet Explorer, Netscape, Mozilla...) Einleitung Diese pädagogische Ausbildungseinheit ist kostenlos und von auf jedem Computer aus nutzbar. Sie werden hier mit sehr einfachen Hilfsmitteln Ihre ersten drei Internetseiten anfertigen und diese anschließend online stellen. Es ist hilfreich zu wissen, wie einfach dies geht und dass es für jeden möglich ist. Aber bevor Sie im Folgenden mit einigen kurzen Programmiercodes arbeiten, sollen Sie wissen, dass es eine Reihe kostenloser oder kostenpflichtiger Hilfsprogramme gibt, die Ihnen diese unangenehme Arbeit (im HTML-Code schreiben...) abnehmen. Eigentlich schreibt niemand seine Internetseiten selbst, so wie wir dies hier im Anschluss tun werden. Diese Vorgehensweise dient dem Verständnis. In einem ersten Schritt soll verdeutlicht werden, nach welchem Schema HTML-Seiten erstellt werden. Danach kann man die Software, die diese Arbeit später für uns übernimmt, besser verstehen. Die wenigen zuvor investierten Stunden, um Ihre ersten Seiten auf die schwierige Art und Weise zu erstellen, werden Sie anschließend viel Zeit gewinnen lassen. Ein Anfang in wenigen Stunden Eine Website mit drei Seiten anzufertigen und sie online zu stellen, dauert nicht länger als ein paar Stunden, selbst für Anfänger. Man muss in der Tat wissen, dass es einfach ist, eine Seite zu erstellen, ein Bild einzufügen und Links zwischen Seiten zu setzen. Es geht sogar SEHR einfach und schnell. Drei Zeilen Theorie sind unerlässlich Eine Website setzt sich aus Seiten, Bildern oder anderen Elementen (Tonaufnahmen, Animationen) zusammen, die auf einem Server gespeichert sind. Ein Server ist ganz einfach ein Computer, der mit dem Internet verbunden ist. Komplizierter ist es nicht. Mit Unterstützung der Europäischen Union

2 Wie funktioniert eine Website? Websites sind Seiten, die angefertigt werden, um von einem Internetbrowser (siehe oben) verstanden zu werden. Ihr Internetbrowser ist eine Software auf Ihrem Computer. Die meisten Computerbenutzer benutzen den Internet Explorer. Wie funktioniert also eine Website? Der Browser öffnet eine Seite und kann genau drei Dinge: Texte anzeigen, die die Seite beinhaltet Bilder an der richtigen Stelle anzeigen Eventuell feststellen, dass die Seite ein Inhaltselement beinhaltet, das er nicht bearbeiten kann und versuchen, ein Programm aufzurufen, welches das Element bearbeiten kann. Folgendes ist für das Verständnis wichtig: Bilder und andere Elemente (Tonaufnahmen, Videos...) SIND NICHT Inhalt und Teil der Internetseite. Sie befinden sich anderswo im Internet. Die Seite besitzt lediglich eine Adresse, die dem Browser anzeigt, wo diese zu finden sind. Damit der Browser all dies richtig ausführt, müssen ihm einige Anweisungen gegeben werden. In unserem Beispiel reichen 10 Anweisungen aus, um die ersten drei Seiten anzufertigen. Die erste Seite Erstellen Sie zu Beginn einen Ordner auf ihrer Festplatte und nennen ihn meinewebsite. Dieser Ordner wird ALLE Elemente Ihrer Website beinhalten. Innerhalb dieses Ordners erstellen Sie nun zwei weitere Ordner. Einen nennen Sie seiten, den anderen bilder. Dies ist der Anfang der Website- Struktur. Nun öffnen Sie den Editor (unter Start -> Programme -> Zubehör > Editor bzw. SimpleText, wenn Sie auf einem Macintosh arbeiten) und hier ein neues Dokument (dies geschieht normalerweise automatisch). Speichern Sie das neue Dokument im Ordner meinewebsite unter dem Namen index.html Sie haben damit eine erste HTML Seite geschaffen. Sie besitzt zwar noch keinen Inhalt, aber sie existiert. Meine erste Seite füllen <TITLE>Meine Seite</TITLE> Dies ist meine Internetseite Tippen Sie ganz genau folgende Zeilen, die im Anschluss hieran erklärt werden: Speichern Sie unsere Seite index.html. Jetzt öffnen Sie den Internetbrowser und hier (Datei Öffnen) die Seite index.html, die sich im Ordner meinewebsite befindet (man kann tatsächlich eine Website schaffen, die lokal auf dem Computer funktioniert und dies genau auf dieselbe Art und Weise wie eine Website, die mit dem Netz der Netze, also dem Internet verbunden ist). Seite 2

3 Der Browser zeigt dies an: Wie funktioniert das? Die Elemente, die wir zwischen das Zeichen < und das Zeichen > geschrieben haben, werden nicht angezeigt. Dies sind Befehle für den Browser. Die Bezeichnung hierfür ist Tag [ausgesprochen: tæk] oder auch Identifizierungskennzeichen. Der Tag, der mit einem </ beginnt, ist ein abschließender Tag. Wollte man die Befehle, die dem Browser gesagt werden, in Worte fassen, würde dies etwa Folgendes ergeben: - Du betrittst eine HTML-Seite, eine Internetseite - Du betrittst die Kopfleiste der Seite <TITLE> - Achtung, die Seite hat einen Titel Meine Seite Dies soll an der Stelle des Titels stehen </TITLE> - Hier endet der Titel - Du verlässt die Kopfleiste der Seite - Du betrittst den Textkörper der Seite. Von hier ab zeigst Du alles an, was Du anzeigen kannst Dies ist meine Internetseite Dies ist kein Tag, also zeigst Du es an - Du verlässt den Textkörper der Seite - Du verlässt die HTML-Seite Seite 3

4 Strukturieren meiner Seite (Zeilenumbrüche und Leerzeichen) Der Text innerhalb der Tags und wird vom Browser ohne Unterscheidung abgewickelt. Er berücksichtigt nicht, ob beispielsweise ein schönes Seitenlayout erstellt wurde. Als Beispiel haben wir folgende HTML-Seite erstellt: <TITLE>Meine Seite</TITLE> Guten Tag, Dies ist die Internetseite des Unternehmens XY. Sie können auf unserer Website Folgendes sehen: - unseren Katalog - unsere Grundsätze - und wie unser Betrieb funktioniert Wir wünschen Ihnen einen angenehmen Besuch. Der Direktor Peter Hausmann Wenn Sie diese Seite von Ihrem Browser anzeigen lassen, ist dies das Ergebnis: Seite 4

5 Der Text hängt komplett aneinander. Kein Element des Seitenlayouts wurde berücksichtigt. In der Tat liest der Browser alles hintereinander. Leerzeichen und Zeilenumbrüche der Tastatur interessieren ihn nicht. Um dem Browser die gewünschte Strukturierung verständlich zu machen, gibt es die Tags. Der Tag <BR> ergibt einen Zeilenumbruch. Dieser Tag wird nicht geschlossen. Es gibt entsprechend keinen </BR>. Um einen größeren Abstand zu erzielen und um Textelemente zu identifizieren, die unterschiedlich behandelt werden sollen, gibt es den Tag für Paragraphen <P></P>. Dies wird folgendermaßen geschrieben: <P>Dies ist mein Paragraph, der eine bestimmte Farbe und/oder Form haben wird</p> <P>Und dies ist ein weiterer Paragraph, den ich anders behandeln werde</p> Leerzeichen Wenn Sie Folgendes schreiben: Meine Firma wird der Browser anzeigen: Meine Firma. Er berücksichtigt auch nicht die Anzahl der verwendeten Leerzeichen. Um ihm mehrere Leerzeichen hintereinander verständlich zu machen, gibt es den Tag (non-breakable space). Wenn Sie schreiben: Meine Firma, werden die 6 Leerzeichen berücksichtigt. Der Tag dient außerdem dazu, den Browser davon abzuhalten, Zeilenumbrüche anzuzeigen, wo diese nicht erwünscht sind. Die Gestalt meines Textes verändern Um den Text anders zu gestalten, muss man dem Browser weitere Befehle geben. Wichtige Tags zum Verändern des Text sind die folgenden: <U></U> = unterstrichener Text <B></B> = fetter Text <EM></EM> = kursiver Text <H1></H1> = sehr großer Text <H2></H2> = großer Text... <H7></H7> = sehr kleiner Text Alle Tags werden UM den betroffenen Text HERUM gesetzt. <TITLE>Meine Seite</TITLE> <P><U>mein Text</U></P> <P><STRONG>mein Text</STRONG></P> <P><EM>mein Text</EM></P> Seite 5

6 Eine noch präzisiere Beschreibung erhält man mit dem Tag <FONT></FONT>. Die häufigsten Parameter sind: Schriftart, Größe des Textes und nicht zu vergessen die Farbe. Aus diesem Grund werden wir im Folgenden kurz auf Farben im Internet eingehen. Farben Farben im Internet sind ein gutes Beispiel kollektiver Dummheit. Die verschiedenen Computer (PC, Macintosh, UNIX...) besitzen jeweils eine Farbpalette mit 256 Farben, jedoch nicht die gleichen. Um die Paletten wieder in Einklang zu bringen, wurde eine weitere Palette für das Internet geschaffen. Die sogenannte Web-Palette unterscheidet sich von den ersten drei Paletten und enthält 216 Farben. Zur Bestimmung der Farben wird ein Hexadezimal-Code benutzt mit dem Millionen von Farben beschrieben werden können. Er dient letztlich dazu, klägliche 216 Farben hervorzubringen. Der Farbcode ist der folgende: Das # bezeichnet den Beginn der Beschreibung, gefolgt von drei Zahlenpaaren von 0 bis F (00,33,66,99,FF), die die Menge der Primärfarben auf dem Bildschirm (rot, grün und blau) angeben. Der Code # steht für schwarz und #FFFFFF für weiß. Seite 6

7 Hier sehen Sie die Farbpalette im Internet: <TITLE>Meine Seite</TITLE> <FONT face= Arial, Verdana, Myriad Web, sans-serif size= 2 color= #FF0000 >mein Text</FONT><BR> und um die Tags zu kombinieren: <U><B><FONT face= Arial, Verdana, Myriad Web, sans-serif size= 4 color= #0000CC >mein Text</FONT></B></U> Damit der Text nun eine Farbe erhält, fügt man einen Tag ein, der dem Browser sagt, wie er den Text anzuzeigen hat. Dies ist der Tag <FONT></FONT>. Er kann Angaben zu der Textfarbe, der Größe des Textes und der Schriftart beinhalten. Dies ergibt Folgendes: Seite 7

8 Dies ergibt wiederum: Erklärung: Das Attribut face ermöglicht Angaben zur Schriftart. Im Internet sind dies Richtwerte. Im Großen und Ganzen würde das Attribut, wenn man es in einen Text übersetzen würde, den folgenden Befehl ergeben: Wenn Du die Schriftart Arial besitzt, setze den Text in Arial, wenn nicht, setzt Du ihn in Verdana. Wenn Du auch kein Verdana besitzt, setze ihn in Myriad Web und wenn Du kein Myriad Web besitzt, dann nimm egal welche Schriftart ohne Serifen. (ohne Serifen bedeutet eine gerade Schriftart, die keine Endstriche besitzt. Helvetika ist beispielsweise eine Schriftart ohne Serifen). Falls der Internetnutzer alle Schriftarten außer Gothik von seinem Computer gelöscht hat, wird der Browser als standardmäßige Vorgabe Gothik verwenden. Dies bedeutet, dass es sinnlos ist, dem Browser Angaben zu seltenen oder teuren Schriftarten zu geben: Die Internetnutzer werden diese höchstwahrscheinlich nicht besitzen. Das Attribut size legt die Größe des Textes fest. Im Internet gehen die Größen von 1 bis 7. Dabei ist 1 ganz klein und 7 sehr groß. Falls keine Angaben vorliegen, zeigt der Browser eine vorgegebene Standardschriftgröße an. Das Attribut color bestimmt die Farbe des Textes. Wichtig es gilt IMMER: Wenn keine Angaben vorliegen, zeigt der Browser die standardmäßig vorgegebene Schriftart, Farbe und Größe an. Diese vorgegebenen Werte SIND NICHT notwendigerweise dieselben von Internetnutzer zu Internetnutzer. Sie können auf die Vorlieben des Internet-Surfers angepasst sein. Seite 8

9 Umlaute und Sonderzeichen Das Internet wurde einerseits größtenteils von Amerikanern und Programmierern entwickelt. Diese benutzen keine Umlaute und Sonderzeichen. Für die Amerikaner ist dies normal, da es im Englischen keine gibt. Für die Programmierer ist es ebenso verständlich: Sie verwenden kaum Umlaute und Sonderzeichen, da sie zu Problemen beim Programmieren führen. Erst später wurde ein System entwickelt, um dennoch Umlaute und Sonderzeichen darstellen zu können. Für Umlaute ist es SEHR einfach: Der Buchstabe mit einem Akzent wird zwischen die Zeichen & und ; gesetzt. Dies ergibt: ä für ein ä (Umlaut)... Die deutschen Sonderzeichen werden folgendermaßen ausgedrückt: Ä oder ä Ö oder ö Ü oder ü ß Ä oder ä Ö oder ö Ü oder ü ß Wenn wir all dies auf einer Internetseite zusammensetzen, wird die Seite bereits relativ kompliziert. <TITLE>Meine Seite</TITLE> <H1><FONT face= Arial, Verdana, Myriad Web, sans-serif color= #0000CC >Herzlich Willkommen auf der Website des Vereins XY</FONT></H1> <P>Sie finden auf meiner Website alle <B>Informationen</B> über unsere <EM>Aktivitäten</EM></P> <FONT face= Arial, Verdana, sans-serif, color= #00CC00 size= 3 >- unsere Aktivitäten am Meer</FONT> Seite 9

10 Ein Beispiel: Die Seite strukturieren (Tabellen) Sie können nun bereits Zeilenumbrüche und Leerzeichen erstellen, einen Text farbig gestalten, unterstreichen, fett oder kursiv setzen, die Schrift in unterschiedlichen Schriftgrößen und Schriftarten verwenden und Sonderzeichen einfügen. Um eine fortgeschritteneres Strukturieren der Seite zu erhalten, gibt es Tabellen. Es handelt sich um ganz einfache Tabellen mit Spalten und Zeilen. Tabellen ermöglichen es, Elemente in Spalten darzustellen. Dies wird folgendermaßen geschrieben: Mit dem Tag <TABLE> beginnt die Tabelle. Anschließend folgt die erste Zeile mit dem Tag. Die Zeile wiederum beinhaltet eine Reihe von Spalten. Der Tag für Spalten ist <TD></TD>. Am Ende der Zeile steht der Tag. Schließlich endet die Tabelle mit dem Tag </TABLE>. Dies ergibt folgenden Code: <TITLE>Meine Seite</TITLE> <TABLE> <TD>1</TD> <TD>2</TD> <TD>3</TD> </TABLE> Seite 10

11 Dies ergibt Folgendes : Eine Tabelle kann aus so vielen Linien bestehen, wie man möchte. Dies gilt ebenso für die Anzahl der Spalten in den Linien. Die einzige Einschränkung ist: In ein- und derselben Tabelle muss jede Linie gleich viele Spalten besitzen. Dies ergibt die Zellen. Am besten lässt man die Zellen nicht völlig leer stehen. Dies wird von den Nutzern nicht geschätzt. Um eventuelle Probleme zu vermeiden, reicht es aus, in jede Zelle einen untrennbaren Leerschritt ( ) einzufügen. Einige Zeilen können verbunden werden. Allerdings ist es nicht ganz einfach dies festzuschreiben, ohne sich im Vorfeld hierüber Gedanken gemacht zu haben. Bevor man eine Tabelle erstellt, ist es am Einfachsten, sich ein Schema auf ein Blatt zu zeichnen. Für folgende Tabelle zeichnet man also zunächst alle Linien gepunktet ein, bevor man die Tabelle beschreibt: Zum Verbinden der Zellen gibt es zwei Befehle: colspan= x, welches die Spalte mit der x-1 Seite 11

12 folgenden verbindet und rowspan= y, welches die Zelle mit den Zellen y-1 der folgenden Linie verbindet. Dabei gilt folgende Regel: Jede Zelle wird nur EINMAL beschrieben. Wenn ich also <TD rowspn= 2 ></TD> schreibe, beinhaltet die Zeile darunter ein Tag <TD></TD> weniger. <TITLE>Meine Seite</TITLE> <TABLE border= 1 > <TD colspan= 2 rowspan= 2 > </TD> <TD colspan= 2 > </TD> </TABLE> Seite 12

13 Dies ergibt: Dies ist die gleiche Tabelle, nur dass sie in der Breite etwas eingedrückt ist. Um ihr die gewünschten Dimensionen zu geben, kann man die Größe in Prozentangaben im Verhältnis zum Navigationsfenster angeben. Dies geschieht entweder in Pixel oder indem sich die Größe der Tabelle an den jeweiligen Inhalt anpasst. Letzteres erfolgt teilweise ohnehin automatisch. Wenn Sie ein 250x350 Pixel großes Bild in eine Zelle setzen, die 100x100 Pixel groß ist, wird die Zelle die Größe des Bildes annehmen. Das Bild wird NIEMALS abgeschnitten. Pixelangaben schreibt man folgendermaßen: Dies ergibt: <TITLE>Meine Seite</TITLE> <TABLE width=300 border= 1 > <TD width= 100 > </TD> <TD width= 100 > </TD> <TD width= 100 > </TD> <TD colspan= 2 rowspan= 2 > </TD> <TD colspan= 2 > </TD> </TABLE> /HTML> Seite 13

14 Um die Größe in Prozentzahlen anzugeben, schreibt man width= 90. Es ist nicht ratsam, die Anweisungen (in Pixel und Prozentzahlen) in ein und derselben Tabelle zu mischen. Der Profi-Tipp: Tabellen können mit dieser Art von Größenanweisungen sehr schwer gehandhabt werden. Die einzige Möglichkeit, die Tabellen einfach zu bearbeiten, ist die folgende: Setzen Sie kleine transparente Bilder in die Zellen, um die Höhe und Breite der Zellen zu erzwingen. Wenn Sie einmal den Quellcode etwas komplexerer Seiten ansehen, werden Sie dort überall Bilder finden, die sich spacer.gif oder platzhalter.gif... nennen und selbst gar nicht sichtbar sind. Ein Bild in meine Internetseite einfügen Damit man ein Bild in eine Internetseite einfügen kann, muss man zunächst ein Bild im Format Gif, JPEG oder PNG besitzen. Bilder finden Sie in großer Zahl im Internet. Sie können sie auch selbst mit Hilfe eines Scanners, eines digitalen Fotoapparates oder eines Bildverarbeitungsprogramms erstellen. Für diese Übung stehen Ihnen bereits drei Bilder auf unserer Website europschool.net zur Verfügung. Sie werden sie für diese Übung auf Ihren Rechner herunterladen. Wie eigene Bilder hergestellt werden, wird in weiteren pädagogischen Ausbildungseinheiten unserer Website erklärt, ebenso wie diese aus dem Internet heruntergeladen werden können. Seite 14

15 Die drei Bilder von der Website europschool.net laden: Sie öffnen zunächst Ihren Browser und anschließend folgende Seiten: Die drei Bilder werden auf Ihrem Bildschirm erscheinen. Laden Sie sie auf Ihren Computer herunter. Wenn Sie einen PC besitzen, klicken Sie mit der rechten Maustaste auf das erste Bild und wählen Bild speichern unter. Sie speichern das Bild im Ordner bilder, der sich im Ordner meinewebsite befindet. Wiederholen Sie den Vorgang für die beiden weiteren Bilder. Auf einem Macintosh klicken Sie mit der Maus auf das Bild (ACHTUNG: nicht loslassen, sondern gedrückt halten!) und ziehen es auf den Arbeitsplatz. Nachdem Sie so alle drei Bildern heruntergeladen haben, müssen Sie die Bilder lediglich in den Ordner bilder, der sich im Ordner meinewebsite befindet, ziehen. Ihr Ordner bilder beinhalten nun drei Bilder: boot.gif, euro_flagge.jpg und ente.png Nun werden wir drei Internetseiten schaffen, je eine Seite pro Bild. Öffnen Sie den Text-Editor oder SimpleText und schreiben Sie folgenden Code: <TITLE>Seite 1</TITLE> <TABLE width=300 border= 0 > <TD width= 190 > </TD> <TD width= 10 > </TD> <TD width= 100 > </TD> <TD width= 190 > </TD> <TD width= 10 > </TD> <TD width= 100 > </TD> <TD colspan= 3 > </TD> </TABLE> Seite 15

16 Ein Bild einfügen Zunächst muss man verstehen, nach welchem Schema ein Bild auf eine Seite gelangt. Im Internet werden die Bilder nicht wirklich dauerhaft in die Seiten eingegliedert. Es handelt sich demnach nicht um ein echtes Einfügen. Es wird lediglich die ADRESSE des Bildes an dem Ort eingefügt, an dem das Bild im Verhältnis zur übrigen Seite angezeigt werden soll. In dem Moment, in dem die Seite vom Browser angezeigt werden soll, sucht der Browser das Bild bei der angegebenen Adresse und zeigt es ERST DANN an. Der Tag, der hierfür zuständig ist, heißt <IMG> und beinhaltet IMMER das Attribut src=. SRC ist die Quelle: Wo finde ich das Bild? Der Pfad zum Auffinden des Bildes ist folgendermaßen beschrieben: Das Dokument bild1.html befindet sich im Ordner bilder, welcher sich im Ordner meinewebsite befindet. Das Bild, das wir anzeigen wollen heißt boot.gif und befindet sich im Ordner bilder, der sich im Ordner meinewebsite befindet. Um von seite1.html zu einem der bilder.gif zu wechseln, muss man also den Ordner seiten verlassen und sich in den Ordner bilder begeben. Dies ist ganz einfach: Um einen Ordner zu verlassen, gibt man../ ein und um sich in einen Ordner zu begeben, schreibt man den Namen des gewünschten Ordners, gefolgt von /. Dies ergibt den Pfad: <IMG src=../bilder/boot.gif > Dies ergibt folgenden Code: <TITLE>Seite 1</TITLE> <TABLE width=300 border= 0 > <TD width= 190 ><IMG src=../bilder/ boot.gif ></TD> <TD width= 10 > </TD> <TD width= 100 >Mein Bild</TD> <TD colspan= 3 > </TD> </TABLE> Seite 16

17 SEHR WICHTIG! Achtung, benutzen Sie in Ihren Internetadressen oder den Namen der Dokumente und Bilder NIEMALS Akzente, Leerzeichen, Sonderzeichen (wie %, *...) oder Satzzeichen! Man kann davon ausgehen, dass es zu Problemen kommt, sobald Sie Ihre Seiten ins Internet stellen. Um diese Probleme zu vermeiden, lesen Sie bitte unsere pädagogische Ausbildungseinheit Dateiformate. Das Bild wird ohne Probleme angezeigt. Nun werden Sie Ihre seite1.html vervielfachen und sie einmal seite2.html und ein weiteres Mal seite3.html nennen. Um ein Dokument zu vervielfachen, muss man es einfach öffnen und einmal unter dem Namen seite2.html und einmal unter seite3.html speichern. Im Dokument seite2.html nehmen Sie folgende Veränderung vor: <IMG src=../bilder/boot.gif > wird zu <IMG src=../bilder/euro_flagge.jpg >. Wenn Sie ein Perfektionist sind, verändern Sie zudem <TITLE>Seite 1</TITLE> in <TITLE>Seite 2</TITLE>. Im Dokument seite3.html wird entsprechend <IMG src=../bilder/boot.gif > zu <IMG src=../bilder/ente.png > und <TITLE>Seite 1</TITLE> zu <TITLE>Seite 3</TITLE>. Sie können überprüfen, ob die Bilder auf den drei Seiten angezeigt werden. Nun fehlen noch die Links zwischen den Seiten. Seite 17

18 Erstellen von Links zum Navigieren zwischen den Seiten Nachdem Sie nun ein Bild einfügen können, wird das Erstellen eines Links für Sie unglaublich leicht sein. Links werden immer um eine Element auf einer Seite gesetzt. Entweder ist dies ein Stück Text (ein Zeichen, ein Wort, ein Satz, mehrere Sätze...) oder ein Bild. Der Grund ist einfach: Man muss auf etwas klicken können. Der Tag <A></A> schafft Links. Wie auch der Tag <IMG> benötigt er eine Adresse. Er braucht die Adresse der Seite, die er suchen soll. Wenn Ingenieure unkompliziert denken würden, würde man dies folgendermaßen schreiben: <A src= seite2.html >Mein Link</A>. Aber nachdem sie nicht unkompliziert denken, schreibt man dies anders. Statt src wie bei Bildern, schreibt man href. Nehmen wir an, dass dies von hypertexte reference (auf Deutsch Linkverweis ) kommt. Dies ergibt folgenden Code: <A href= seite2.html >Mein Link</A> Um nun von der Seite index.html zur seite1.html zu gelangen, fügen Sie folgenden Code dort ein, wohin Sie den Link setzen wollen: <A href= seiten/seite1.html3>zur Seite 1</A> Dies ergibt folgenden Code: <TITLE>Meine Seite</TITLE> <TABLE width=300 border= 1 > <TD width= 100 ><A href= seiten/ seite1.html >Zur Seite 1</TD> <TD width= 100 ><A href= seiten/ seite2.html >Zur Seite 2</TD> <TD width= 100 ><A href= seiten/ seite3.html >Zur Seite 3</TD> <TD colspan= 2 rowspan= 2 >Willkommen auf meiner Website</TD> <TD colspan= 2 > </TD> </TABLE> Seite 18

19 Dies ergibt Folgendes: Die erste Seite index.html ermöglicht den Zugang zu den drei weiteren Seiten. Um eine kleine Website zu erhalten genügt es, auf jede dieser Seiten einen Link zurück zur Seite index.html zu setzen und außerdem Links zu setzen, um von Seite zu Seite zu navigieren. Versuchen Sie dies einmal selbst. Sie können sich dabei an den Beispielen der vorherigen Codes orientieren. Für den Link von einer der drei Seiten zurück zur Seite index.html denken Sie daran, dass Sie für diesen Pfad einen Ordner verlassen müssen. Wenn Sie dies meistern, können Sie sich ins Erstellen ganz gleich welcher Website stürzen alles Übrige ist gesunder Menschenverstand. Einziges Manko Ihrer Website ist nunmehr, dass sich die Seiten zwar auf Ihrem Computer befindet, aber dass sie noch keinem anderen Internetnutzer zugänglich ist. Lesen Sie hierfür die Ausbildungseinheit Eine Website beherbergen. Seite 19