Eine kurze Diskussion darüber, wie man Div und Tabelle auswählt und kombiniert

Das Seitenlayout war mir schon immer ein Anliegen, seit ich angefangen habe, mich mit Webseiten zu beschäftigen. Von den frühen tabellenstrukturierten Seiten über DIV bis hin zu DIV+Tabelle kann man sagen, dass sich unsere Anforderungen geändert haben, der Zweck jedoch nicht. Warum sage ich das? Es ist offensichtlich, dass sich alles vom Einfachen zum Komplexen und dann vom Komplexen zum Einfachen, von der einfachen Anwendung zur komplexen Anwendung an der Nachfrage orientiert. Viele Entwickler und Designer müssen bei der Entwicklung von Seitenlayouts mehrere Punkte beachten: Ist das Layout sinnvoll, ist die Struktur kompakt, ist die Skalierbarkeit ausreichend und die Lesbarkeit gewährleistet. Der sinnvolle Einsatz von Tabellen und DIV zum Aufbau unseres Webs ist ein wichtiges Thema, das wir diskutieren. Dies kann aus mehreren verschiedenen Perspektiven betrachtet werden:

1. Positionierung

Zunächst einmal sind streng genommen sowohl Tabellen als auch Divs sinnvolle Layoutmethoden. Man kann den Wert von Tabellen nicht leugnen, oder dass Divs nur Vorteile und keine Nachteile haben. Man kann sagen, dass die Webarchitektur sowohl Tabellen als auch Divs verwenden kann. Der Schlüssel liegt dann in der Positionierung Ihrer Webanforderungen.

Wir müssen berücksichtigen, welchen Einfluss eine Webseite auf unsere Site hat. Wenn unsere Site beispielsweise auf eine große Anzahl von Besuchen und Daten abzielt (Cache-Probleme werden hier natürlich nicht behandelt), wird die Architektur normalerweise die Verwendung von Tabellen reduzieren, insbesondere wenn viele Schleifen vorhanden sind. Natürlich sind Tabellen auch nützlich. Bei komplexen Websites ist es mit Div+CSS manchmal schwierig, den Inhalt, den wir ausdrücken möchten, genau zu definieren. In diesem Fall ist eine Tabelle eine gute Wahl. Auch dies ist ein Aspekt, der vor der Entwicklung berücksichtigt werden muss, um sicherzustellen, dass die erforderlichen Kosten gedeckt werden und gleichzeitig die Entwicklungsziele erreicht werden. Ebenso ist die Implementierung einer komplexen Seite mithilfe von Div+CSS oft nicht so einfach wie die Verwendung einer Tabelle.

2. Funktionen

Tabelle und Div haben ihre eigenen Eigenschaften. Dies bedeutet auch, dass sie unterschiedliche Wertorientierungen haben, was für Entwickler und Designer sehr wichtig ist.

Tabellen können problemlos strukturierte Schnittstellen erstellen. Indem wir die eigenen Parameter der Tabelle definieren, können wir das Seitenlayout schnell so definieren, wie wir es benötigen. Natürlich kann die Koordination von CSS relativ reduziert werden. Der Nachteil besteht darin, dass die Skalierbarkeit und Lesbarkeit relativ schlecht sind. Die schlechte Skalierbarkeit wirkt sich auf Wartung und Änderungen aus. Bei einer Site mit einem komplexen Tabellenlayout und einer großen Anzahl von Seiten sind Entwickler ratlos, wenn sich die Anforderungen ändern. Eine große Anzahl von Änderungsanforderungen wird die Entwicklungsarbeit der Weboberfläche vollständig zunichte machen. Schlechte Lesbarkeit, das ist auch relativ, nehmen wir ein Beispiel: Wir verwenden dieselbe Effekttabelle und denselben Div, um eine Seite anzuzeigen

----Tisch----

<Tabellenbreite="300" Rahmen="0" Zellenabstand="0" Zellenpadding="0">

<tr>

<td rowspan="3" bgcolor="#FF0000"> </td>

<td> </td>

<td rowspan="3" bgcolor="#0000FF"> </td>

</tr>

<tr>

<td> </td>

</tr>

<tr>

<td> </td>

</tr>

</Tabelle>

----Tisch----

－－－－Div. 1－－－－

<div Stil="Breite:100px;Hintergrundfarbe:rot;"></div>

<div Stil="Breite:100px;Hintergrundfarbe:weiß;">

<div></div>

<div></div>

<div></div>

</div>

<div Stil="Breite:100px;Hintergrundfarbe:blau;"></div>

－－－－Div. 1－－－－

－－－－Abschnitt 2－－－－

<div style="Anzeige: Inline-Tabelle; Breite: 300px;">

<div Stil="float:links; Breite:200px; klar:links">

<div Stil="Anzeige: Inline-Tabelle;">

<div Stil="float:left;clear:left;width:100px; background-color:red;"></div>

<div Stil="float:right; klar:right; Breite:100px;">

<div></div>

<div></div>

<div></div>

</div>

</div>

</div>

<div Stil="float:right; Breite:100px; klar:right; Hintergrundfarbe:blau;"></div>

</div>

－－－－Abschnitt 2－－－－

...

Die Tabelle ist im Ausdruck „ strenger “ und weist Einschränkungen auf. Bei der Darstellung komplexer Strukturen kann es sehr schwer verständlich sein. Oft ist der Programminhalt unserer Website sehr umfangreich und es ist für Entwickler sehr schwierig, sich sofort einen klaren Überblick über den Code zu verschaffen.

Was div betrifft, kennen wir die Bedeutung und Funktion von div in der HTML-Syntax. Wenn wir es zur Implementierung des Seitenlayouts verwenden, wird es fast vollständig von CSS unterstützt. Man kann sagen, dass div nicht allein verwendet werden kann, insbesondere für das stark zielgerichtete Web, das sehr strenge Anforderungen an die visuelle Wirkung für Benutzer stellt. Die Verwendung von div muss in Verbindung mit professionellen CSS-Parametern implementiert werden. Aus den vorherigen Beispielen können wir ersehen, dass das Div-Layout flexibler ist und einfach oder komplex sein kann. Durch die Kombination von CSS und DIV kann der gleiche Anzeigeeffekt auf unterschiedliche Weise erzielt werden. Sein Vorteil liegt in der starken Erweiterbarkeit . Entwickler und Designer können dem Layout durch einfache Anpassung des entsprechenden CSS ein völlig neues Aussehen verleihen, was bei Tabellen weit über die Möglichkeiten hinausgeht. Bei Teilen mit relativ komplexen Strukturen ist die Div+CSS-Entwicklung jedoch oft schwierig . Es dauert einen halben Tag, einen einfachen Div- und CSS-Effekt zu schreiben. Table ist in dieser Hinsicht viel besser. Mit WYSIWYG-Software wie dw können wir problemlos etwas erstellen, für dessen Erstellung wir mit Div+CSS einen halben Tag brauchen.

3. Kompatibilität

Dies ist ein wichtiges Thema für jede Website: Browserkompatibilität. In Bezug auf die Kompatibilität zwischen Tabelle und Div bietet die Tabelle mehr Vorteile.

Die von uns häufig verwendeten IE- und FF-Browser sind sehr wählerisch, was die DIV-CSS-Einstellungen angeht. Oftmals führt dasselbe CSS in zwei Browsern zu unterschiedlichen Ergebnissen, was für Entwickler ein großes Problem darstellt. Da es uns nicht möglich ist, die Browser der Benutzer auszuschließen, können wir während der Entwicklung nur unsere Syntax und Layoutmethoden anpassen. Für Div müssen wir CSS strikt unterstützen, für Tabellen ist das jedoch nicht so wichtig. Die Genauigkeit der Tabelle wird in verschiedenen Browsern gut widergespiegelt.

Nachdem wir unsere Positionierung, Funktionen und Kompatibilitätsprobleme berücksichtigt haben, sollte sich meiner Meinung nach jeder darüber im Klaren sein, wie das Layout aussehen soll und welche Architektur zu übernehmen ist. Ich möchte sagen, dass für echte Entwickler die gute Nutzung das wichtigste Konzept ist. Anstatt blind die eigenen technischen Fähigkeiten für die Entwicklungs- und Konstruktionsarbeiten zu bevorzugen bzw. unter Beweis zu stellen. Bei div können wir seine flexiblen und klaren Architekturmerkmale voll ausspielen und mit der Genauigkeit von table zusammenarbeiten, um die Anforderungen verschiedener Webseiten zu erfüllen.