Volksbildungswerk Klarenthal e.V.: Kurs 60 2001: Homepageerstellung, DSt. 2

Volksbildungswerk Klarenthal e.V.

Kurs 60/Herbst 2001:
Workshop: Wir erstellen die Homepage des Volksbildungswerkes Klarenthal e.V.

Zusammenfassung Doppelstunde 2 (10.9.2001)

Suchmaschinen, Kataloge, Metasuche, Crawler, Robots.
Es gibt verschiedene Suchhilfen im Internet, die sich in der Art, wie sie Seiten im Web auffinden und katalogiesieren und somit auffindbar machen, unterscheiden. Die anspruchsvollsten Such(und Find!)kataloge sind von Menschen redaktionell bearbeitet. Testsieger in PC Professionell 9/2001 wurde allerdings der Metacrawler http://www.ixquick.com/.
Empfehlungen: Metatags <meta> verwenden mit den Attributen

   name="description" content="Beschreibungstext"
   name="keywords" content="Schlüsselwortliste, mit Komma und Leerzeichen getrennt"
   name="author" content="Name(n)"
   name="date" content="2001-09-10"
   name="robots" content="index,follow"
   name="revisit-after" content="60 days"

Eine (leere) Datei robots.txt verwenden (siehe http://1a-info.de/web/robots.html).

Im IE als Bookmark auffallen durch favicon.ico (siehe http://www.favicon.de/favicon.html).

Mit Hilfe von HTML Editor Projektdefinition erstellen.
Projekt=>Projekteinstellungen. Im Tabellenreiter "Vorgaben" Farben und Metatags festlegen.
Empfehlung: Unix-Speichermethode auswählen.
Alle Seiten, die nun neu im Rahmen des Projektes angelegt werden, erhalten dieses Grundgerüst
(Datei=>neu erstellen oder Einfügen=>HTML Grundgerüst).

Textauszeichnungstags.
Überschriften mit <h1>, <h2>, ... <h5>. Fettschrift, Absatz automatisch mit dabei!

Schriftart und -größe mit

<font face="VERDANA,HELVETICA,ARIAL">,
<font size="+2"> bzw. <font size="-2">,
<font color="#FF7D00">.

Schriftbild mit

<b> bold - fett</b>,
<i> italics - kursiv</i>,
<u> underline - unterstrichen</u>,
<tt> diktengleiche Schrift (TeleTyper - Fernschreiber)</tt>,
<sup> ^{superior - hochgestellt}</sup>,
<sub> _{sub - tiefgestellt}</sub>.

Endtags </...> nicht vergessen!
Empfehlung: Diese Tags reichen aus. Es gibt zwar noch einige Textauszeichnungstags mehr, deren Interpretation aber dem Browser überlassen ist - verzichten Sie auf diese (z.B. em, strong, big, small, ...)

Bereich-, Absatz- und Zeilenkontrolle.
Division(Bereichs)tag <div> versieht verschiedene Elemente wie Absätze, Bilder, etc. mit der gleichen Ausrichtung.
Der folgende Text ist mit dem div-Tag zentriert.

Die Ausrichtung erfolgt mit dem Attribut align.

align="center" zentriert
align="justify" Blocksatz
align="left" linksbündig
align="right" rechtsbündig

Das align-Attribut ist auch im img-Tag und in vielen anderen Tags gebräuchlich.

Paragraphtag <p> erzeugt eine Absatzschaltung, hier zusätzlich mit align="right" eingesetzt..

Hier erfolgt wieder normale Ausrichtung; p-Tag und div-Tag sind mit </p></div> abgeschlossen worden.

Anmerkung: das <center>-Tag wird zwar noch häufig eingesetzt, steht aber auf der Abschussliste des www-Standardisierungskonsortiums. Verwenden Sie daher besser <div align="center">.

Zeilenumbrüche werden mit <br> erzwungen. Dieser Tag hat keinen Schlusstag!

Um Einrückungen exakt und damit in diktengleicher (nicht proportionaler) Schrift darzustellen (z.B. für Programmcode oder für tabellarische Aufstellungen ohne Verwendung des <table>-Tag), wird der <pre>-Tag eingesetzt (preformatted - vorformatiert).

Dieser Text           sieht zwar aus
als ob                mit Tabulatoren
und mit               Zeilenumbrüchen
gearbeitet            worden ist.
Aber                  in Wirklichkeit
wird dieser           Text von
<pre>                 </pre>
eingeschlossen.       Interessant ...

Trennlinien.
Zur besseren Gliederung kann man Trennlinien verwenden, um eine Seite auch optisch in Überschrift/Kopfzeilen, Text und Fußteil zu trennen. <hr>-Tag. Der zweite Tag ohne Schlusstag. Beliebte Attribute sind

noshade
width="30%"
size="30"
align="right"

Effekt von <hr width="30%" noshade size="30" align="right">