Nutzung von Tabellen


Zum Text der Seite

Inhalt

Tabellen

In den folgenden Beispielen sind zur Veranschaulichung normalerweise unsichtbare Tabellen natürlich sichtbar dargestellt.

Die folgenden Beispiele führen zu nicht barrierefreien Webseiten!

Beispiel 1 - Spaltensatz von Text

Das ARPA-Net (C): Stefan Münz

Die Ursprünge des heutigen Internet reichen in die 60er Jahre zurück. Es war die Zeit des Kalten Krieges zwischen den beiden Weltmächten USA und UdSSR. Neue Impulse in der Elektronischen Datenverarbeitung (EDV) kamen in jener Zeit hauptsächlich durch militärische Initiativen zustande.

Im Departement of Defense, dem amerikanischen Verteidigungsministerium, wurde überlegt, wie man wichtige militärische Daten besser schützen könnte. Selbst bei einem

atomaren Angriff des Gegners sollten die Daten nicht zerstört werden können. Als Lösung kam nur ein elektronisches Datennetz in Frage. Die gleichen Daten sollten dabei auf mehreren, weit entfernten Rechnern abgelegt werden. Bei neuen oder geänderten Daten sollten sich alle angeschlossenen Rechner binnen kürzester Zeit den aktuellen Datenstand zusenden. Jeder Rechner sollte dabei über mehrere Wege mit jedem anderen Rechner kommunizieren können. So würde das Netz auch dann funktionieren, wenn ein einzelner Rechner oder eine bestimmte

Leitung durch einen Angriff zerstört würde.

Die Advanced Research Projects Agency (ARPA), Teil der US-Militärs, realisierte das geplante Projekt. In den ersten Jahren wurde das Netz deshalb ARPA-Net genannt. Ende 1969 waren die ersten vier Rechner an das ARPA-Net angeschlossen. Drei Jahre später waren es bereits 40 Rechner.

Die Geschichte des Internet beginnt also in Zeit der ersten Mondlandung und in jener Zeit, als die Hippies das Zeitalter des Wassermanns heraufziehen sahen.

Vorgehensweise
  1. den Text möglichst vollständig entwerfen, da bei Korrekturen kein automatischer Textfluß in den Spalten entsteht.
  2. Tabelle definieren, im Beispiel 2 Zeilen, 3 Spalten,
  3. Spaltenbreite mit 33%, 33% und 34% festlegen,
  4. die Felder der ersten Zeile zu einem Feld zusammenfassen (optional),
  5. den Text möglichst gleichmäßig in die drei Felder der 2. Zeile verteilen,

Beispiel 2 - Text mit definierter Breite

Das ARPA-Net (C): Stefan Münz)

Die Ursprünge des heutigen Internet reichen in die 60er Jahre zu- rück. Es war die Zeit des Kalten Krieges zwischen den bei- den Weltmächten USA und UdSSR. Neue Impulse in der Elek- tronischen Datenverarbeitung (EDV) kamen in jener Zeit haupt- sächlich durch militärische Initiativen zustande.

Im Departement of Defense, dem amerikanischen Verteidigungsministerium, wurde überlegt, wie man wichtige militärische Daten besser schützen könnte. Selbst bei einem atomaren Angriff des Gegners sollten die Daten nicht zerstört werden können. Als Lösung kam nur ein elektronisches Datennetz in Frage. Die gleichen Daten sollten dabei auf mehreren, weit entfernten Rechnern abgelegt werden. Bei neuen oder geänderten Daten sollten sich alle angeschlossenen Rechner binnen kürzester Zeit den aktuellen Datenstand zusenden. Jeder Rechner sollte dabei über mehrere Wege mit jedem anderen Rechner kommunizieren können. ...

Vorgehensweise
  1. Tabelle mit fester Breite in Pixel definieren <table width="640" border="2"> (Bitte nicht breiter als 780), im Beispiel 2 Zeilen, 1 Spalte,
  2. Überschrift und Text in die Felder stellen,
  3. der endgültig Text kann in diesem Fall manuell umgebrochen werden (Minus- und Leerzeichen an geeigneten Stellen einfügen), Achtung: für die Browser muß ein Leerzeichen nach dem Trennstrich kommen, für manchen Editor reicht fälschlicherweise der Trennstrich alleine für den Umbruch,
  4. Ergebnis im Browser kontrollieren, da manchmal Umbruch anders,

Während Beispiel 1 auch bei Schriftgrößenänderung funktioniert, stimmen im Beispiel 2 dann die handeingefügten Umbrüche nicht mehr!

Beispiel mit Ebenen

Die Ursprünge des heutigen Internet reichen in die 60er Jahre zu- rück. Es war die Zeit des Kalten Krieges zwischen den bei- den Weltmächten USA und UdSSR. Neue Impulse in der Elektronischen Datenverarbeitung (EDV) kamen in jener Zeit haupt- sächlich durch militärische Initiativen zustande.

Im Departement of Defense, dem amerikanischen Verteidigungsministerium, wurde überlegt, wie man wichtige militärische Daten besser schützen könnte. Selbst bei einem atomaren Angriff des Gegners sollten die Daten nicht zerstört werden können. Als Lösung kam nur ein elektronisches Datennetz in Frage. Die gleichen Daten sollten dabei auf mehreren, weit entfernten Rechnern abgelegt werden. Bei neuen oder geänderten Daten sollten sich alle angeschlossenen Rechner binnen kürzester Zeit den aktuellen Datenstand zusenden. Jeder Rechner sollte dabei über mehrere Wege mit jedem anderen Rechner kommunizieren können. ...

Vorgehensweise
  1. Einleitendes DIV-Element

    <div style="width:480px; text-align:justify;">

    schreiben.
  2. Den Text ganz normal schreiben.
  3. Ende DIV-Element </div>

Beispiel 3 - Ersatz von Listen durch Grafiken

Ist wohl ein Grenzfall der Linearisierung, die Ikonen würden im Fließtext wohl doch etwas stören. Diese Funktion läßt sich besser durch Stylesheets in Listen realisieren.

blauaer Ball Beim Einsatz von ungeordneten, nichtnumerierten Listen <ul> werden die sog. Bullets normalerweise in der Standardschriftfarbe des body-Tags dargestellt - das sieht selten hübsch aus !
blauaer Ball Abhilfe:
blauaer Punkt Beschaffung eines Punktes (Herstellung mit CorelDRAW oder Suche in Bildersammlungen) als transparente GIF-Grafik mit ca. 10 Pixel Durchmesser,
blauaer Punkt Definition einer Tabelle mit 2 Spalten ohne Rand (<table width="100%" border="0" cols="2">)
blauaer Punkt erste Spalte mit ca. 4% Breite und ggf. Ausrichtung einrichten,
blauaer Punkt in Felder der ersten Spalte die Punkte als Bild einfügen,
blauaer Punkt in Felder der zweiten Spalte die Texte der Listeneinträge setzen,

Realisierung mit StyleSheets


Anfang
  Seitenanfang
 Trennstrich  ...Farbevorherige Seite  Trennstrich  nächste SeiteSchriften...

Kurs Web-Design