This page is currently available in German only...

Einführung in die Dokumenterstellung mit HTML

  1. Kurze Einführung zum Thema Internet
    1. Kurze geschichtliche Grundlage
      - urspünglich zum Informationsaustausch von Unis verwendet, um Forschungsergebnisse möglichst plattformunabhängig zu publizieren
    2. Unterschied Internet und WWW
      - WWW populärster Dienst im Internet, allerdings noch weitere, wie z.B. FTP, Archie
  2. Grundbegriffe zu HTML
    1. Hyper Text Markup Language
      - aus den Anforderungen ergab sich eine Inhaltsorientierte (Inhalt zählt, nicht die Formatierung) Seitenbeschreibungssprache.
      - HTML ist keine Programmiersprache.
  3. Einführung in HTML
    1. Grundsätzlicher Aufbau eines Tags (<...> </...>)
      -Tags dienen zur Formatierung und logischen Gliederung des Dokuments.
      - stehen in spitzen Klammern.
      - öffnendes Tag: <Tagname>
      - schließendes Tag: </Tagname>
      1. Was sind Attribute
        - Parameter, die die Darstellung oder Funktionsweise von Tags genauer spezifizieren (z.B. ALIGN zur Ausrichtung von Bildern, Absätzen...)
    2. Grundsätzlicher Dokumentenaufbau
      <HTML>
          <HEAD>
              <TITLE>Titel des Dokuments</TITLE>
          </HEAD>
          <BODY>
              Dokumentkörper - dieser Bereich wird im Browser Dargestellt
          </BODY>
      </HTML>
       
    3. Die wichtigsten Tags
      1. <HTML>
      2. <HEAD>, <TITLE>
      3. <BODY>
        - Attribute: BACKGROUND, BGCOLOR, TEXT, LINK, VLINK, ALINK
      4. <H1> ... <H6>
        - Attribute: ALIGN {left, right, center, justify}, NOWRAP
      5. <P> (kein </P>, aber nicht tragisch)
        - Attribute: ALIGN {left, right, center, justify}, NOWRAP
        1. Zeilenumbruch (<BR>)
        2. Zeilenumbruch verhindern (<NOBR>)
        3. Zeichenformatierung
          1. BASEFONT-Tag (Grundgröße der Schrift)
            - Attribute: SIZE (nur absolute Angaben)
            - nur einmal pro Dokument verwenden!!
          2. FONT-Tag (Größe, Farbe...)
            - Attribute: SIZE (absolut, relativ), COLOR (entweder Farbnamen oder, hex-values)
          3. Zeichenattribute (Fett, unterstrichen ...)
            1. Fett: <B>
            2. Kursiv: <I>
            3. Durchgestrichen: <S>
            4. Unterstrichen: <U>
            5. Tiefgestellt: <SUB>
            6. Hochgestellt: <SUP>
            7. "Teletype"-Schrift: <TT>
            8. Größer schreiben: <BIG>
            9. Kleiner schreiben: <SMALL>
      6. Kommentar (<!-- ... -->)
      7. Horrizontale Trennline (<HR>)
        - Attribute: SIZE (Dicke), WIDTH (Länge), ALIGN (Ausrichtung: left, center, right), NOSHADE (einfache Linie)
      8. Listen
        1. Unsortierte Listen (<UL>)
          - Attribute: PLAIN (keine Aufzählungspunkte), COMPACT (der Browser soll versuchen Platz zu sparen)
          - <LH>: Listenüberschrift
          - <LI>: Listeneintrag
        2. Sortierte Listen (<OL>)
          - Attribute: TYPE (siehe unten), START (Startnummer der Liste)
          - <LH>: Listenüberschrift
          - <LI>: Listeneintrag - Attribute: VALUE
          1. Nummerierungsformate (TYPE-Attribut)
            - 1: arabische Ziffern
            - A: Großbuchstaben
            - a: kleine Buchstaben
            - I: große römische Ziffern
            - i: kleine römische Ziffern
        3. Definitionslisten (<DL>)
          - <LH>: Listenüberschrift
          - <DT>: zu definierender Begriff
          - <DD>: Definition des Begriffs
      9. Tabellen
        - Attribute: BORDER, WIDTH, HEIGHT, ALIGN, VALIGN, CELLPADDIG (Verschiebung des Zelleninhalts innerhalb der Zelle), CELLSPACING (Abstand zwischen den Zellen), BGCOLOR
        1. Tablellenzeile <TR>...</TR>
          - Attribute: ALIGN, VALIGN, HEIGHT, BGCOLOR
        2. Tabllenkopf <TH>...</TH>
          - Attribute: ALIGN, VALIGN, WIDTH, HEIGHT, BGCOLOR
        3. Feldinhalt <TD>...</TD>
          - Attribute: ALIGN, VALIGN, WIDTH, NOWRAP, BGCOLOR, COLSPAN, ROWSPAN
      10.  Hyperlinks <A> ... </A>
        1. Links auf eine Seite auf dem eigenen Server
          - Attribute: HREF - Aufbau: HREF="relative Lageangabe"
          - Beispiel: <A HREF="/index.html">Home</A>
        2. Links zu einem entfernten Server
          - Attribute: HREF - Aufbau: HREF="Protokoll://Server/Seite"
          - Beispiel: <A HREF="http://members.xoom.com/chrordig/">Meine Homepage</A>
        3. Sprung zu einer bestimmten Stelle in einem Dokument
          - Vorgehensweise:
          1. Textmarke setzen: <A NAME="Markenname"></A>
          2. Eigentlichen Sprung zur Textmarke einfügen: <A HREF="Dokumentname#Markenname">Link-Text</A>
      11. Graphiken <IMG>
        - Attribute: SRC, HEIGHT, WIDTH, ALIGN, ALT
        - werden relativ zur Textgrundlinie positioniert
        - vertikale Ausrichtung (ALIGN):
        top - am höchsten Punkt auf der Grundlinie ausgerichtet
        middle - Mitte des Bildes in Höhe der Grundlinie
        absmiddle - Mitte des Bildes in Mitte der Zeilenhöhe
        bottom - unterer Bildrand in Höhe der Grundlinie
        absbottom - unterer Bildrand am unteren Rand der aktuellen Zeile
        1. Unterstützte Formate
          - GIF, JPEG (JPG)

Download: Gesamten Vortrag als ZIP-Archiv downloaden.


© 1998 by Christian Ordig