Usability-Vergleich von div und table auf Websites

Im Seitenlayout werden häufig Div und Tabelle verwendet. Welche Eigenschaften haben sie auf der Seite? In diesem Artikel erfahren Sie mehr über den Vergleich der Benutzerfreundlichkeit von Div und Tabelle auf der Website. Werfen Sie einen Blick darauf.

DIV und TABLE haben an sich keine Vor- oder Nachteile. Die sogenannten Webstandards empfehlen beispielsweise nur die korrekte Verwendung von Tags, während TABLE ursprünglich zur Konvertierung von zwei verwendet wird -dimensionale Daten. TABLE tun zu lassen, was es tun soll, bedeutet nicht, dass TABLE so großartig ist, wenn es nicht auf der Seite erscheint.

Der Vorteil der Verwendung von DIV für den Schriftsatz besteht darin, dass ich es nicht erklären werde, aber jeder sollte sich darüber im Klaren sein. DIV ist ein Standard und ein allgemeiner Trend, bedeutet aber nicht, dass alle Seiten für den Einsatz geeignet sind.

Es gibt einen großen Unterschied zwischen chinesischen Portalen und ausländischen Portalen. Wenn YAHOO in China ankommt, ist der Inhalt der Seite viel größer Eine prägnante Seite. Später gingen die Besuchszahlen so stark zurück, dass sie innerhalb weniger Tage wieder geändert wurde. Offiziell sind es die nationalen Verhältnisse Chinas, die Portale wie Sohu und Sina hervorgebracht haben.

Warum ist DIV für sie nicht geeignet? Lassen Sie mich nacheinander aus mehreren Aspekten erklären:

Vereinfachter Code:

Jeder sagt, dass das Layout von DIV ist optimierter Code, aber der durch die Verwendung von DIV anstelle von TABLE gespeicherte Code wird von CSS (Stil) belegt, und die meisten dieser Stile werden zur Steuerung des DIV-Layouts verwendet. Dann werden Sie sagen, dass CSS extern wiederverwendet werden kann. Wenn Sie die Antwort auf diese Frage erhalten möchten, lesen Sie bitte unten.

Wiederverwendbarkeit und Downloadvolumen:

Durch die einheitliche Verwendung einer CSS-Stylesheet-Datei kann der Effekt einer einmaligen Änderung und einer Änderung der gesamten Website erzielt werden, wodurch die Wartungskosten gesenkt werden . Aber denken Sie bitte aus einer anderen Perspektive darüber nach. Wenn alle Seiten beim Laden auf eine Datei zugreifen müssen, wird die Anzahl der täglichen Downloads dieser Datei, insbesondere auf den Website-Plattformen Sohu und Sina, eine Menge erreichen Der Front-End-Webserver bietet Unterstützung und auch die Kosten für das Backend sind stark gestiegen. Wenn die Hintergrundunterstützung nicht gut gemacht ist, erscheint die Seite unscharf und die bisherige Arbeit ist umsonst. Viele Leute werden fragen, die Wahrscheinlichkeit dafür sei zu gering. Unsere Arbeit besteht darin, diese beiden Unfälle zu vermeiden. Sollte es zu einem Unfall kommen, wären die Folgen für das Portal katastrophal.

HTTP-Kommunikation:

Die einheitliche Stylesheet-Datei übernimmt die Form eines externen Aufrufs, sodass jedes Mal, wenn eine einzelne Seite geladen wird, eine weitere HTTP-Anfrage erfolgt Antwort: Dies wird eine Menge Geld auf dem Front-End-Webserver verschlingen. Es stellt sich heraus, dass CSS und JS lange Zeit am vorderen Ende der Seite geschrieben wurden (Sie können sich die Seiten von Sohu und Sina ansehen, die meisten verwenden diese Form) und nicht in Form von externen Aufrufen. um zu vermeiden, dass zusätzlicher Code zum Serververbrauch hinzugefügt wird.

Seiten-Cache:

Jedes Mal, wenn ein Benutzer eine Seite besucht, wird diese für einen bestimmten Zeitraum im Browser-Cache gespeichert, um sicherzustellen, dass der Benutzer darauf zugreifen kann Verbessern Sie die Geschwindigkeit der Seitenanzeige beim nächsten Mal. Bei jeder Änderung wird die Seite erneut heruntergeladen, und das Gleiche gilt für jede extern importierte Stildatei. Wenn die CSS-Datei geändert wird, wird jede auf der Website besuchte Seite erneut heruntergeladen Die Seite ist nur geändert. Seiten müssen erneut heruntergeladen werden.

Kompatibilität:

Nicht alle Browser und Versionen von CSS (Stylesheets) unterstützen CSS sehr gut. Beispielsweise unterstützen Browser vor IE5 CSS sehr gut nicht sehr gut. Heutzutage verwenden nicht wenige Benutzer Browser vor IE5. Dies erfordert das Testen verschiedener Browserversionen während des Seitenerstellungsprozesses, um die Kompatibilität sicherzustellen, was auch die Arbeitsbelastung erhöht (zumindest für die Entwickler, die ich kontaktiere). eine div-Seite ist länger als die einer Tabellenseite).

Crosscutting und Duktilität:

Crosscutting – die traditionelle Layoutmethode unterteilt die Seite in mehrere Blöcke von oben nach unten, um das Herunterladen der Seite zu beschleunigen Diese Situation tritt häufig bei Seiten auf, die DIV für das Layout verwenden. Da die Anzahl der Inhaltselemente in der mittleren Spalte oder anderen Spalten jedes Blocks nicht festgelegt ist, passen sich die Spalten auf beiden Seiten nicht gleichzeitig an und es erscheinen Leerzeichen.

Im Vergleich dazu ist die traditionelle Tischmethode einfacher, solche Situationen zu vermeiden.

Wir diskutieren nur die Verwendbarkeit einer bestimmten Technologie in einem bestimmten Bereich, nicht die Technologie selbst.

Dies alles bedeutet jedoch nicht, dass die Layoutmethode von DIV nicht gut ist, sondern dass wir die Rolle von Table in großen inhaltsbasierten Portalen richtig sehen sollten, anstatt den Aussagen anderer zu folgen. Der Grund, warum die DIV-Layoutmethode auf großen Websites nicht verwendet wird, bedeutet nicht, dass das Portal DIV nicht verwendet, weil die Technologie rückständig ist, sondern weil die darin enthaltenen Personen nicht zukunftsorientiert sind, sondern wird durch verschiedene Gründe bestimmt. Der Grund, warum NetEase ausschließlich DIV verwendet, liegt darin, dass Inhalte nicht ihr Hauptaugenmerk sind. Bei anderen Portalen hängen solche Entscheidungen von der Zeit zur Überprüfung ab. Es ist nur so, dass die Zeit jetzt noch nicht reif ist. ?

Das obige ist der detaillierte Inhalt vonUsability-Vergleich von div und table auf Websites. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!