Webseiten: HTML-Programmierung und Validierung (W3C)

tipp107.htm: Letzte Änderung am 01.08.2018 / 05.11.2016 / 25.08.2011 Copyright Dr. Hans Hehl
(Bilder soweit nicht extra gekennzeichnet in Eigenanfertigung)
Impressum gem. TMG Paragraph 5/6

Startseite www.hanshehl.de - Stichwörterverzeichnis Geländewagen / Webseite
Stichwörterverzeichnis R230
Valid HTML 4.01!
Übersicht:
1. Webseitenprogrammierung:
2.1 Vorteile von Phase 5:
2.2 Hacker-Schutz:
3. Self-HTML-Tutorial:
4. Validierung nach W3C-Standard:
5. Fehleranalyse nach W3C-Standard:
6. Warum Validieren?
7. Tidy: HTML-Korrektur:
7.1 TIDY-Urversion für DOS:
8. Meta-tag content = 0: Browser anweisen:
9. Quelltext einer Webseite anzeigen:
10. www -> https:
1. Webseiten-Programmierung: top

Programmiert man Webseiten "archaisch und zu Fuß" direkt im HTML-Code (siehe Wikipedia), z.B. mit dem ausgezeichneten Freeware-HTML-Editor Phase 5 von Uli Meybohm, siehe www.phase5.info , so schleichen sich immer wieder Quellcodefehler ein.

Besonders bei längeren Webseiten mit vielen Bildern sind Fehler in der Reihenfolge der Tags unvermeidlich. So muss z.B. nach dem Tag 'table' der Codeabschnitt immer mit einem Ende-Tag '/table' abgeschlossen werden.
2.1 Vorteile von Phase 5: top

So schreibt der Autor U. Meybohm: "Interessant ist, dass man das Programm nach der Installation auf einen USB-Stick kopieren und an jedem Windows-PC benutzen kann. Das einmal installierte Programm kann ohne Installationsroutine kopiert werden und ist trotzdem lauffähig. Das Programm ist auch für Ungeübte intuitiv zu bedienen und installiert nur 2,3 MB groß. ".

Da sollte sich Bill Gates ein Beispiel nehmen.

2.2 Hacker-Schutz: top

Ein sehr wichtiger Grund ist der Schutz vor Webseiten-Hacker. Bei dem sehr einfachen, übersichtlichen und kompakten Quellcode sind zusätzliche Programm-Zeilen bzw. Veränderungen durch Hacker schnell auffindbar.

Bei den kommerziellen Webseiten, die mit fast automatischen Editoren erzeugt werden, bekommt man einen aufgeblähten und unübersichtlichen HTML-Code. Da kann man schnell ein JAVA-Script verstecken. Internetforen mit PHP-Software sind da beliebtes Ziel der Häcker, besonders wenn die Webseiten-Software auf einem eigenen Webserver ohne Provider läuft.
3. Self-HTML-Tutorial: top

Ein sehr gutes Tutorial für HTML-Programmierung ist die Anleitung Self-HTML von Stefan Münz, zu finden unter http://de.selfhtml.org/.

Damit habe ich ab dem Jahre 2002 HTML gelernt und meine website www.hanshehl.de programmiert. Ich verwende noch immer lieber die alte Phase-5-Version vom 21.01.2000, die auf allen 32- und 64-Bit-WINDOOF-Versionen läuft, auch WIN 10. Unter WIN10 kommt es zu einem Scriptfehler, wenn man nach dem Start des HTML-Editors und Laden eines Quellcodes, gleich mit F9 den Browser aufruft. Abhilfe: zuerst mit dem Editor den Quelltext etws scrollen.
4. Validierung nach W3C-Standard: top

Wikipedia erklärt die Abkürzung W3C: "Das World Wide Web Consortium (kurz: W3C) ist das Gremium zur Standardisierung der das World Wide Web betreffenden Techniken. Es wurde am 1. Oktober 1994 am MIT Laboratory for Computer Science in Cambridge (Massachusetts) gegründet."
Die W3C-Vereinigung ist unter www.w3c.org aufrufbar. Unter http://validator.w3.org/ findet man ein Tool, das Fehler im HTML-Quellcode aufspürt und die Ursachen dokumentiert. Den Aufruf zu diesem Tool kann man auch in eigene Webseiten einbinden, wie ich es nun ab 8/2011 mache, siehe Beispiel:
5. Fehleranalyse nach W3C-Standard: top

Ein großer roter Balken zeigt an, dass Fehler im HTML-Code vorhanden sind. Die Fehler-Zeilennummer im HTML-Text entspricht der Zeilennummer im HTML-Editor Phase 5.
Mit Phase 5 werden die Fehler im HTML-Code korrigiert. Die HTML-Zeilen mit Fehler sind rot markiert. Die Zeilennummer der den Fehler verursachende Zeile erscheint blau.
FTP-Programm:

Nach Transfer des HTML-Quellcodes mit einem FTP-Programm zum Webserver des Providers erscheint nach erneuter Validierung ein grüner Balken im Textanfang.

Ich verwende seit einiger Zeit für WIN7 /WIN10 / 64 bit das sichere Filezilla-FTP-Programm Vers. 3.14.1 https://filezilla-project.org.
6. Warum Validieren? top

Warum man seinen HTML-Quellcode validieren soll, steht in der FAQ von W3C:

" Why should I validate my HTML pages?

One of the important maxims of computer programming is: "Be conservative in what you produce; be liberal in what you accept."

Browsers follow the second half of this maxim by accepting Web pages and trying to display them even if they're not legal HTML. Usually this means that the browser will try to make educated guesses about what you probably meant. The problem is that different browsers (or even different versions of the same browser) will make different guesses about the same illegal construct; worse, if your HTML is really pathological, the browser could get hopelessly confused and produce a mangled mess, or even crash.

That's why you want to follow the first half of the maxim by making sure your pages are legal HTML. The best way to do that is by running your documents through one or more HTML validators. "
7. Tidy: HTML-Korrektur: top

Während der W3C-Validator nur die Fehler im HTML-Quelltext anzeigt, gibt es von W3C auch ein ein HTML-Korrekturprogramm Tidy (siehe Wikipedia: http://de.wikipedia.org/wiki/HTML_Tidy ):
7.1 TIDY-Urversion für DOS:

Die Grundversion läuft im Eingabefenster CMD:\ von Windows. Dabei werden die Fehler im HTML-Quelltext automatisch korrigiert. Das Protokoll dazu wird in der Datei ERR.TXT abgelegt, die mit Notepad oder dem besseren EDITPAD angezeigt wird. Unter www.tidy.com findet man einen DOS-HTML-Analysator, der z.B. unter WIN2000 im CMD-Fenster läuft.

Mit einer Stapeldatei T.BAT startet man Tidy und die zu korrigierende HTML-Datei z.B. mit dem Aufruf T TIPP107.HTM . Der Texteditor, z.B. EDITPAD.EXE muss im gleichen Verzeichnis sein.

rem tidy-Analysator
tidy -f err.txt -m %1
editpad err.txt

Es wird die Datei ERR.TXT angezeigt:
8. Metatag content = 0: Browseranweisung: webseite neu laden.

siehe https://wiki.selfhtml.org/wiki/HTML/Kopfdaten/meta

Wird eine Webseite aufgerufen, werden die Daten aus einem Browser- oder Proxy-Server-Cache geladen. Ein Webseitenbetreiber kann mit dem meta-Tag erreichen, dass seine Webseite immer neu und somit aktuell geladen wird. Ansonsten müsste der Webseitenleser die Taste F5 drücken.

In den Kopfzeilen der Webseite setzt man in Spitzklammern die Zeile meta http-equiv="expires" content="0"
9. Quellcode einer Webseite anzeigen:

HTML lernt man auch, wenn man den Quelltext einer Webseite anschaut, z.B. von www.hanshehl.de. Diese Seite besitzt eine sehr einfache Codestruktur.

Funktioniert bei den meisten Browsern: Nach dem Aufruf einer Webseite den Cursor auf eine bild- und textfreie Stelle setzen. Mit der rechten Maustaste öffnet ein neues Fenster: Seitenquelltext anzeigen, siehe auch z.B. Praxistipps Chip.de.
10. www.hanshehl.de -> https://hanshehl.de:

Wird eine Webseite wie www.hanshehl.com SSL zertifiziert und dann aufgerufen, wird bei modernen Browsern ein Sicherheitshinweis ausgegeben oder die Seite startet nicht. Von Jörg bekam ich folgendes script für meine Webseite, Dank!

Das script wird in eine bestehende htaccess-Datei eingefügt oder als htacces-Datei auf dem Server abgelegt (z.B. mit Filezilla., die auf dem Server liegt.

Jörg Philipp, [23.05.18 16:39]
RewriteEngine On
RewriteBase /
RewriteCond %{HTTPS} !=on [NC,OR]
RewriteCond %{HTTP_HOST} !=www.lunalink.de [NC]
RewriteRule ^(.*)$ https://www.lunalink.de/$1 [R=301,L]


Die Anleitung dazu findet mann z.B. hier : https://pixelbar.be/blog/htaccess-schnippsel-https-erzwingen/

meine dothtacceess.datei:
RewriteEngine On
RewriteBase /
RewriteCond %{HTTPS} !=on [NC,OR]
RewriteCond %{HTTP_HOST} !=www.hanshehl.de [NC]
RewriteRule ^(.*)$ https://www.hanshehl.de/$1 [R=301,L]

Valid HTML 4.01! Validation für HTML 4.01 - diese Seite validieren:

zurück zum Anfang top