Umstieg von Tabellen auf Container

Aus Linupedia.org
Wechseln zu: Navigation, Suche
Höhe=24px
Achtung dieser Artikel ist noch in Arbeit und dient vorläufig nur als Vorlage. Dieser Beitrag zu Linux oder der Abschnitt ist in Bearbeitung. Weitere Informationen findest du hier. Der Ersteller arbeitet an dem Beitrag oder Abschnitt und entsorgt den Wartungsbaustein spätestens 3 Tage nach der letzten Bearbeitung. Änderungen außer Rechtschreibkorrekturen ohne Absprache mit dem Urspungsautor sind möglichst zu vermeiden, solange dieser Baustein noch innerhalb der genannten Frist aktiviert ist.

--Yehudi 21:17, 25. Sep 2006 (CEST)


Einleitung

Zunächst sei erst mal bemerkt, dass beide Möglichkeiten ihre Berechtigungen haben. Seiten wie der http:/www.spiegel.de gestallten immer noch erfolgreich ihre Seite mit Tabellen. Und nach den Massstäben gäbe es auch keine Notwendigkeit eines Umstieges. Die Seite funktioniert hervorragend. Und dort geht es in erster Linie um Informationen. Wer jedoch grafisch mehr aus seiner Seite rausholen will, dem bleibt ein Umstieg nicht erspart. Die meisten neuen Browser unterstürzen zwischenzeitlich CSS volständig. Allein der Internetexplorer tut sich oft schwer. Ein weiterer Punkt des Umstieges von Tabellen auf CSS ist der "Aufgeblähter Quellcode" das gleiche LayOut soll man mit CSS um 40% weniger erzeugen können. Eine Datei mit 5kb lässt sich danach auf 3 kb reduzieren, Bei 100.000 Besuchern spart man 2,4GB per anno für eine Datei.

Das template oder die html-Dokumente ausdünnen

Bevor man sich der Tabellen annimmt, sollte man die ganze Schrift konvertieren. Manche Dinge lassen sich dort in einem Atemzug erledigen. Haben wir bsp. solche Fälle:

<TD><FONT size="-2"  face="Verdana" >Text</FONT></TD>

dann können die ersetzt werden:

<div class="Text">Text</div>

Vorraussetzung die Anordnungen sind alle gleich.

In einer extra-Datei legt man dann Schriftgröße Hintergrund, und Kastengröße fest. Wie man sieht wird der Quelltext dadurch detulich schlanker.


Wann sollte man den Umstieg von Tabellen auf CSS vermeiden?

Wenn wie hier mehrere thumbnails verwendet werden, die mit einer Bildunterschrift in einer Tabelle liegen. Da die thumbnails mal hochkant und mal quer stehen, liegt automatisch eine unterschiedliche Größe vor.

In Tabellenform würde das gnaze so aussehen:

<table cellspacing="2" cellpadding="0" border="0" width="350px">
<tr>
    <td>Bild</td>
    <td>Bild</td>
    <td>Bild</td>
</tr>

<tr>   
     <td>Text</td>
     <td>Text</td>
     <td>Text</td>
</tr>
</table>

Bei CSS hingegen:

<ul id="albumlist">
        <li>Bild Text</li>
	<li>Bild Text</li>
	<li>Bild Text</li>  
 </ul>	

(Der Verständlichkeit halber habe ich die Bild aufrufungen weggelassen) Damit wird der Quelltext deutlich kürzer, aber die Verschachtelung ist auch eine andere. Der Text der in der Tabelle in einer neuen Zeile steht wird jetzt neben der Bildinformation aufgerufen.


Zurück zu Webdesign