So, wie in einem anderen Thread versprochen, ein paar Tipps, wie man eine schöne, moderne Seite angehen kann.
Der Start
Am Anfang war die Struktur. Und dafür kann ich nur die HTML5 Boilerplate empfehlen.
Was ist das?
Das ist ein FrontEnd Template für valide, schnelle, weitreichend kompatible Webseiten, welches von mehreren internationalen Webprogrammier und -designgrößen (unter anderem von Google) über Jahre hinweg erstellt und verbessert wurde und wird (ich hab nen Hinweis gefunden, dass es das schon 2005 gab)
Was macht das?
Kurz: Das liefert einem eine saubere Verzeichnisstruktur und Codebasis.
Lang: In diesem Template wurden mehrere hilfreiche Tipps, Tricks und Kniffe in einem Template zusammengefasst. Dies beinhaltet: Einen Code, der auf schnelle Weise (via Browserweichen) die Klassen austauscht, um zB verschiedene Styles für verschiedene Browser zu liefern; modernizr.js eine JavaScript Klasse, welche dafür sorgt, dass die neuen TAGs auch auf alten Browsern (IE 7 zB) sauber angezigt und angesprochen werden; jQuery. Was muss man da noch sagen?; Verschiedene CSS Tricks, zB direkt ein mitgelieferter CSS Bereich fürs Drucken...
Was ist jetzt dieses ANT aus dem Titel?
Ant ist grundsätzlich für Apache, also Linux entworfen worden. Allerdings klappt es nach erfolgreichem Einrichten auch auf Windoof.
Im Grunde ist es ein Tool, welches automatisiert deine Ordner durchgeht und alles komprimiert was ihm zwischen den Quellcode kommt: CSS, JS, HTML, sogar Bilder werden enorm komprimiert und das mit keinem bis kaum (letzteres nur bei Bildern ^^) Qualitätsverlust (klappt laut Ant Angaben mit jp(e)g, png, gif)
Wie richtet man das unter Linux ein?
Keine Ahnung, ich nutze Windoof 7 und kann auch nur dafür zeigen, wie es geht.
Wie richtet man Ant unter Windows ein?
- Zuerst lädt man sich die Distribution herunter: Binary Distributions. Hier ein bisschen scrollen, und das passende Archiv wählen
- Für das Installieren unter Win7 gibt es eine schöne Videoanleitung How to install Ant on Win7.
Ist zwar Englisch, es wird aber nicht gesprochen, also keine Angst. Und man versteht es trotzdem.
Nun zum H5BP Ant Build Script
Das ist noch einfacher einzurichten: Man geht auf die Seite H5BP Ant Build, lädt rechts das zip herunter entpackt es und schiebt den ganzen Krempel in einen "build" Ordner im H5BP Ordner (siehe Screens). Dann nur noch die "runbuildscript.bat" ausführen und sich über den neuen Ordner "publish" im H5BP Main-Verzeichnis freuen.
Rechtliches
Dat is ja so ne Sache, ne... Da ich eine Seite erstellt habe, die eine öffentliche Gruppe repräsentieren soll (meinen Pfadfinderstamm) habe ich mir zu Rechtlichem natürlich nochmal extra Gedanken und mich schlau gemacht. Hier meine Ergebnisse.
Boilerplate ist schon supi...
...aber eine kleine Änderung muss noch vorgenommen werden, damit die Seite in Deutschland wirklich erlaubt ist. WENN man man das Google Analytics Script am Ende der "index.htm" drinlässt und nutzt (und das würde ich empfehlen, ist nützlich ^^), MUSS es ein wenig geändert werden. Und zwar so:
// Letzte Zeile des Skripts:
ga('create','UA-XXXXX-X');ga('send','pageview');
// Gegen Folgendes tauschen:
ga('create','UA-XXXXX-X');ga('set','anonymizeIp',1);ga('send','pageview');
Dadurch werden die IP-Adessen der Nutzer anonymisiert, was nötig ist, da sie aus der EU zu den Google Servern (ua) in den USA gesendet werden.
EDIT: Zusätzlich braucht man, wenn man Google Analytics in Deutschland nutzen will, einen Vertrag zur Auftragsdatenverarbeitung (pdf) nach § 11 BDSG (danke Phip ^^) Eine kurze Anleitung, wie vorzugehen ist, liefert der Vertrag selbst.
Diese Seiten im Footer...
Jede Seite MUSS ein Impressum und eine Datenschutzerklärung haben. Zudem ist es DRINGEND zu EMPFEHLEN auch noch einen Haftungsausschluss (=Disclaimer) hinzuzufügen. Für diese Dinge gelten folgende Regeln:
- Das Impressum muss Folgendes beinhalten: Name, Anschrift, Kontaktmöglichkeit (E-Mailadresse); Link zum Kontaktformular reicht NICHT
- Der Disclaimer KANN auf die Seite des Impressums (sollte dann kenntlich sein, zB Link zu "Impressum & Disclaimer")
- Die Datenschutzerklärung MUSS auf einer eigenen Seite liegen
- Alle Dateien MÜSSEN über einen permanenten Link auf der Seite zu erreichen sein (Tipp: Link im Footer ^^)
Und was kommt da jetzt rein?
Beim Impressum kommt es auf die Form des Betriebs an, der die Seite nutzt. E Recht 24 bietet hierfür einen hervorragenden Impressum Generator an.
Bei den Nutzungsbedingungen ist es wichtig, auf was für eine Art von Seite das kommt. Für eine allgemeine Vorstellungssite oder einen Blog sind aber die Formulierungen, die E Recht 24 liefert, völlig ausreichend.
Will man sich aber eine Community, am besten auch noch mit Forum, aufbauen, müssen die Teile etwas anders aussehen, und man SOLLTE noch eine Seite mit Nutzungsbedingungen (rechtlich sind das AGB) hinzufügen, zB diese von Kluge Recht
Zuletzt gibt es noch die Datenschutzerklärung. Hier wiederum ist es wichtig, was alles auf der Seite integriert wurde. Es muss nämlich relativ genau aufgeschlüsselt werden, welcher Service welche Daten speichert. Aber auch hierfür gibt es glücklicherweise ein umfangreiches Hilfetool, nämlich den Datenschutz Generator der Schwenke Anwaltskanzlei.
Und jetzt?
Jetzt solltest du eine weitreichend kompatible, HTML 5 valide, rechtlich (einigermaßen) sichere, schlanke Seite haben. Nun fehlt nur noch der eigentliche Inhalt. Da kann ich dir aber nicht mehr helfen!
So, und um mich hier jetzt auch abzusichern: Alles oben Beschriebene und genannte bietet keine Garantie auf Erfolg oder komplette rechtliche Sicherheit. Das sind nur Dinge, die ich auf anderen Seiten erfahren habe und hier zusammentrug.
Also, nochmal: Keine Garantie auf irgendwas, was man da oben findet!