Analyse des HTML-Schreibstils und Gründe erfahrener Leute

1. Navigation: Ungeordnete Liste vs. andere Beschriftungselemente

Der Grund, warum man zum Schreiben von Navigationen die am häufigsten verwendete „ungeordnete Liste“ verwendet, liegt auf der Hand. Sie stellt eine Liste von Links dar, was an sich schon Grund genug ist, das Listen-Tag zu wählen. Wir müssen jedoch die Standardformatierung der Liste entfernen, um sie aussagekräftiger zu gestalten.
Ein weiterer Vorteil übersteigt möglicherweise Ihre Vorstellungskraft: Sie erstellen eine Liste, fügen einen Link hinzu und verwenden CSS, um eine Reihe von Elementen in der Liste zu steuern und zu definieren.

 <ul><li><a href="#">Sammeln und teilen</a></li></ul>

2. Pfad (Breadcrumbs): p Absatz-Tag vs. Liste Listen-Tag

Wir können dieses Problem gemeinsam besprechen. Wenn Sie andere, bessere Möglichkeiten kennen, lassen Sie es uns bitte wissen. Persönlich bevorzuge ich es, den Pfad (Breadcrumbs) wie folgt zu schreiben. (Ich verwende das Symbol >> jedoch nicht oft).

 <p id="breadcrumbs"><a href="#">Home</a> » <a href="#">Über uns</a> </p>

Der Website-Pfad (Breadcrumbs) hat eine hierarchische Beziehung auf einer bestimmten Seite. Logischerweise sollten Listen verschachtelt sein, um die hierarchische Beziehung anzuzeigen. Aber was denken Sie, wenn Ihre Liste nur ein Element enthält? Ich persönlich bin der Meinung, dass der Webseitenpfad (Breadcrumbs) in einer Zeile angezeigt werden sollte.

3. Taste zur Eingabe
Ich kann mich nicht erinnern, wann ich das letzte Mal input type="submit" verwendet habe, aber ich habe aus zwei Gründen schon lange damit aufgehört: Warum muss das Button-Element type="submit" haben? Der Button ist ein eigenes Element, das im Code leicht zu identifizieren und mit CSS leicht zu definieren ist (nicht alle älteren Browser unterstützen dieses Element-Tag-Attribut). Und es ermöglicht uns auch, andere Tag-Elemente hineinzuschreiben und so unsere Möglichkeiten zur Plastizität zu erweitern.

 <button type="submit">Formular absenden</button>

4. Nachricht: Geordnete Liste (ol) vs. ungeordnete Liste (ul)

Listen sind wirklich toll! Es gibt drei verschiedene Typen (geordnete, ungeordnete und Definitionslisten) und alle haben ihre eigenen Verwendungszwecke. Sie sind möglicherweise verwirrt, wann Sie geordnete Listen (ol) und wann ungeordnete Listen (ul) verwenden sollen, da es sinnvoll ist, beide zu verwenden. Die Nachrichten ähneln ein wenig den sorgfältig chronologisch angeordneten Beispielen in einem Lehrbuch, in natürlicher aufsteigender Reihenfolge. Jede Kommentarnachricht entspricht einer festen Zeit, daher sollte die Kommentarstruktur eine geordnete Liste (ol) verwenden.

 <ol>
	<li>
	<ul>
	<li><img src="Pfad zum Gravatar.gif" alt="Name des Autors" /></li>
	<li><a href="url-to-authors-homepage.html">Name des Autors</a></li>

	<li>Gepostet am: Datum hier einfügen</li>
	</ul>
	<div>Kommentartext kommt hier hin...</div>
	</li>
</ol>

5. label/input: div zu anderen Label-Elementen

Welches Beschriftungselement eignet sich am besten zum Einbetten der übergeordneten Struktur außerhalb der Beschriftung/Eingabe?

 <label for="contactName">Ihr Name</label>
<input type="text" name="kontaktname" id="kontaktname" />

Die Verwendung geeigneter Tag-Codes hätte bereits besprochen werden können, aber jetzt habe ich mich für die Verwendung von div zum Einbetten von Labels/Eingaben entschieden, wobei das Label und die zugehörigen Komponenten als Ganzes betrachtet werden. Das Div-Element verfügt über vielfältige semantische Eigenschaften und kann an jede Situation angepasst werden.

 <div>
	<label for="contactName">Ihr Name</label>
	<input type="text" name="kontaktname" id="kontaktname" />
</div>

Chinesischer Originaltext: Meine 5 HTML-Schreibvorlieben
Meine Top 5 HTML-Codierungseinstellungen