Volksbildungswerk Klarenthal e.V.

Kurs 232/Herbst 2002:
Workshop: Wir erstellen eine Homepage!

Zusammenfassung Doppelstunde 2 (09.09.2002)

[zurück] Vorherige Doppelstunde  Index Nächste Doppelstunde [weiter]

  1. EXKURS - nur kurz behandelt, aber hier zum Nachlesen:
    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 für Ihre Website: 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://www.sat24.de/1a-info/web/robots.html).

    Im IE und ab Netscape 7 auffallen durch favicon.ico (siehe http://www.favicon.de/favicon.html).

  2. Mit Hilfe von HTML Editor Projektdefinition erstellen.
    Da diese Eintragungen in der Windows Registry vorgenommen werden, können wir dies in unserem Kurs nicht einsetzen. Aber für IHR Webprojekt sicher mehr als hilfreich!
    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).

  3. 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">.
    Die Schriftgröße size= wird in absolut Werten zwischen 1 und 7 angegeben, wobei 3 die Normalschrift repräsentiert, oder aber relativ im Verhältnis zu dieser Größe mit +n oder -n (n eine Zahl zwischen 4 und 1).
    Um eine Schriftgröße in exakten Punktgrößen anzugeben, wie sie z.B. aus Textverarbeitungsprogrammen bekannt sind, nutzt man das Attribut style= in Verbindung mit den Cascading Style Sheets (CSS) Elementen: style="font-size:8pt" definiert eine exakt 8-Punkt-Schrift.
    Beispiel:<font style="font-size:14pt" face="serif"> stellt eine 14 Punkt große Serifenschrift in grün dar.

    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, ...)

  4. 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 ...

  5. 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 Effekt von <hr width="30%" noshade size="30" align="right">

[zurück] Vorherige Doppelstunde  Index Nächste Doppelstunde [weiter]
© 2002 Andreas Schmidt