Heim >Web-Frontend >CSS-Tutorial >So verbessern Sie Ihre bestehende Website_CSS/HTML
Die meisten unserer Designer verwenden immer noch das traditionelle Tabellenlayout, die Präsentation und die Struktur, um Websites zu erstellen. Das Erlernen der Verwendung von XHTML+CSS erfordert einen Prozess, und die Anpassung einer vorhandenen Website an Website-Standards kann nicht in einem Schritt erfolgen. Der beste Ansatz besteht darin, Schritt für Schritt und in Etappen vorzugehen, um das Ziel der vollständigen Einhaltung der Website-Standards zu erreichen. Wenn Sie ein Anfänger sind oder sich mit Code nicht so gut auskennen, können Sie auch standardkonforme Bearbeitungstools verwenden, wie zum Beispiel Dreamweaver MX 2004, das derzeit umfassendste Tool, das CSS-Standards unterstützt.
1. Hauptverbesserungen
Fügen Sie der Seite den richtigen DOCTYPE hinzu
Viele Designer und Entwickler wissen nicht, was DOCTYPE ist und wofür es verwendet wird. DOCTYPE ist die Abkürzung für Dokumenttyp. Wird hauptsächlich verwendet, um anzugeben, welche Version von XHTML oder HTML Sie verwenden. Der Browser interpretiert den Seitencode gemäß der durch Ihren DOCTYPE definierten DTD (Document Type Definition). Wenn Sie also versehentlich den falschen DOCTYPE eingestellt haben, werden Sie die Ergebnisse überraschen. XHTML1.0 bietet drei DOCTYPE-Optionen:
(1) Transitional
nbsp;html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
(2) Strict
nbsp;html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
(3) Frameset
nbsp;html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
Für unsere primäre Verbesserung müssen wir nur eine Übergangserklärung verwenden. Es kann weiterhin mit Ihrem Tischlayout, Ihren Auftrittslogos usw. kompatibel sein, sodass Sie nicht das Gefühl haben, dass die Änderungen zu groß und schwer zu bewältigen sind.
Tipp: Wenn Sie zu faul sind, den obigen Übergangscode einzugeben, können Sie die Homepage der Website http://www.macromedia.com/ besuchen, sich dann den Quellcode ansehen und ihn kopieren und einfügen Gleicher Code im Kopfbereich.
Legen Sie einen Namespace fest (Namespace)
Fügen Sie den folgenden Code direkt nach der DOCTYPE-Anweisung hinzu:
Ein Namespace ist eine detaillierte Sammlung von Elementtypen und Attributnamen (DTD). Mit der Namespace-Deklaration können Sie Ihren Namespace identifizieren, indem Sie auf eine Online-Adresse verweisen. Geben Sie einfach wie gewohnt den Code ein.
Deklarieren Sie Ihre Kodierungssprache
Um von Browsern korrekt interpretiert zu werden und die Markup-Validierung zu bestehen, müssen alle XHTML-Dokumente die von ihnen verwendete Kodierungssprache deklarieren. Der Code lautet wie folgt:
Die hier deklarierte Codierungssprache ist Vereinfachtes Chinesisch GB2312. Wenn Sie Inhalte in traditionellem Chinesisch erstellen müssen, können Sie ihn als BIG5 definieren.
Schreiben Sie alle Tags in Kleinbuchstaben
XML unterscheidet zwischen Groß- und Kleinschreibung, also unterscheidet XHTML auch zwischen Groß- und Kleinschreibung. Alle XHTML-Element- und Attributnamen müssen in Kleinbuchstaben geschrieben sein. Andernfalls wird Ihr Dokument bei der W3C-Validierung als ungültig betrachtet. Beispielsweise ist der folgende Code falsch:
wird in
geändert, wird in geändert usw. Dieser Konvertierungsschritt ist einfach.
Alt-Attribut zu Bildern hinzufügen
Alt-Attribut zu allen Bildern hinzufügen. Das Alt-Attribut gibt an, dass Ersatztext angezeigt wird, wenn das Bild nicht angezeigt werden kann. Dies ist für normale Benutzer entbehrlich, für Nur-Text-Browser und Benutzer, die Bildschirmleseprogramme verwenden, ist dies jedoch von entscheidender Bedeutung. Erst wenn das Alt-Attribut hinzugefügt wird, besteht der Code die W3C-Korrektheitsprüfung. Beachten Sie, dass wir sinnvolle Alt-Attribute hinzufügen müssen. Das Schreiben wie folgt ist bedeutungslos:
Korrektes Schreiben:
Gib alle Attributwerte an
In HTML müssen Sie Attributwerte nicht in Anführungszeichen setzen, aber in XHTML müssen sie in Anführungszeichen gesetzt werden.
Beispiel: style="max-width:90%", nicht height=100.
Alle Tags schließen
In XHTML muss jedes offene Tag geschlossen werden. So:
Jeder geöffnete Tab muss geschlossen werden.
HTML kann nicht geschlossene Tags akzeptieren, XHTML jedoch nicht.kann Text groß und fett werden und