Einführung in semantische XHTML-Tags
|
Der erste Punkt ist, dass Menschen die Semantik von Inhalten durch visuelle Unterteilung beurteilen können, während Suchmaschinen nur Code sehen. Suchmaschinen können die Semantik von Inhalten nur über Tags ermitteln. Früher habe ich Suchmaschinen nicht viel Aufmerksamkeit geschenkt, aber jetzt merke ich langsam etwas darüber, denn ein großer Teil des Seitenverkehrs kommt von Suchmaschinen. Um die Seite so suchmaschinenfreundlich wie möglich zu gestalten, müssen wir die Tags so semantisch wie möglich gestalten. In der Vergangenheit dachte ich aufgrund meiner oberflächlichen Kenntnisse der Webentwicklung, dass man zum Schreiben einer guten, standardkonformen Seite nur Struktur und Präsentation trennen und keine Tags wie Tabelle und Schriftart verwenden müsse. Was die Verwendung von Divs auf der gesamten Seite angeht, dachte ich, dass es kein Problem darstellt, da CSS sehr leistungsfähig ist. Allerdings haben alle Tags ihre eigene Semantik. Die Semantik einiger Tags ist unten aufgeführt: div-Semantik: Division (Trennung) Span-Semantik: Span (Bereich) ol Semantik: Sortierte Liste ul-Semantik: Ungeordnete Liste (ungeordnete Liste) li-Semantik: Listenelement ………… Wenn Sie die Tag-Semantik und Standardstile ignorieren und div für alle Tags verwenden, können Sie tatsächlich Seiten mit guten visuellen Effekten schreiben, solange Sie CSS flexibel verwenden. In diesem Fall werden zwar die visuellen Anforderungen erfüllt, die gesamte Seite weist jedoch keinerlei Semantik auf und kann von Suchmaschinen dennoch nicht verstanden werden. Denken Sie also daran: Der Schlüssel liegt in der Struktur (HTML), und der Stil (CSS) wird verwendet, um die Struktur zu ändern. Daher müssen Sie zuerst das HTML festlegen, die Tags bestimmen und dann das entsprechende CSS auswählen. Im Allgemeinen verfügen alle Tags über einen Standardstil. Eine einfache Möglichkeit, zu beurteilen, ob die Semantik eines Webseiten-Tags gut ist, besteht darin, den Stil zu entfernen und zu prüfen, ob die Struktur der Webseite gut organisiert und geordnet ist und ob sie noch lesbar ist. Darüber hinaus ist das h-Tag erwähnenswert. Die Semantik des h-Tags ist Titel, und Suchmaschinen reagieren sensibler auf dieses Tag, insbesondere auf h1 und h2. Für eine semantisch einwandfreie Seite sollten die h-Tags vollständig, ordentlich und ohne Lücken sein. Mit anderen Worten müssen wir h1, h2, h3, h4 folgendermaßen nach unten drücken, anstatt h1, h3, h4 und h2 auslassen. Für eine gut strukturierte Webseite kann das h-Tag die Gliederung einer Webseite organisieren. |
<<: Eine kurze Einführung in MySQL InnoDB ReplicaSet
>>: Zusammenfassung der Methode von React zum Erstellen von Komponenten
Artikel empfehlen
Lösung für die Ausnahmen 1449 und 1045 bei der Verbindung mit MySQL
Lösung für die Ausnahmen 1449 und 1045 bei der Ve...
So verwenden Sie „Explain“, um den SQL-Ausführungsplan in MySql abzufragen
Der Befehl „Explain“ ist die primäre Möglichkeit,...
Docker erstellt die Codeerkennungsplattform SonarQube und erkennt den Prozess von Maven-Projekten
1 Einleitung Ein guter Programmierer sollte über ...
Detaillierte Diskussion zum Thema mysqldump-Datenexport
1. Bei der Verwendung von mysqldump wird ein Fehl...
Der Implementierungsprozess des langen Drückens zum Identifizieren des QR-Codes im WeChat-Applet
Vorwort Wir alle wissen, dass man QR-Codes in off...
Linux-System zum Anzeigen von CPU, Maschinenmodell, Speicher und anderen Informationen
Während der Systemwartung müssen Sie möglicherwei...
So ändern Sie die Standardspeicher-Engine in MySQL
MySQL-Speicher-Engine: Der MySQL-Server verwendet...
Implementierung von Wasserfall-Layout + dynamischem Rendering
Inhaltsverzeichnis Typische Wasserfall-Website Wa...
Beispiel für utf8mb4-Sortierung in MySQL
Allgemeine utf8mb4-Sortierregeln in MySQL sind: u...
Beispielcode für die Codevorlage für die Linux C-Protokollausgabe
Vorwort Dieser Artikel stellt hauptsächlich den r...
So führen Sie eine reibungslose if-Beurteilung in js durch
Inhaltsverzeichnis Vorwort Code-Implementierung I...
Informationen zur Verarbeitung des adaptiven Layouts (mit Float und negativem Rand)
Adaptives Layout wird in praktischen Anwendungen i...
HTML-Grundlagen - CSS-Stylesheets, Style-Attribute, Format- und Layoutdetails
1. Position : fest Gesperrte Position (relativ zu...
Detaillierte Analyse der Auswahl des MySQL-Gemeinschaftsindex und des eindeutigen Index
Nehmen wir ein Benutzerverwaltungssystem an, bei ...
10 Tipps zur Website-Benutzerfreundlichkeit, die jeder kennen sollte
Lassen Sie uns keine weitere Zeit verschwenden un...