Grundstein für eine solide Seite; HTML5 Boilerplate, ANT Build Skript, Rechtliche Grundlagen

  • 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:

    JavaScript
    1. // Letzte Zeile des Skripts:
    2. ga('create','UA-XXXXX-X');ga('send','pageview');
    3. // Gegen Folgendes tauschen:
    4. 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!

    Dateien

    • screen1.png

      (92,92 kB, 1.114 Mal heruntergeladen, zuletzt: )
    • screen2.png

      (72,82 kB, 924 Mal heruntergeladen, zuletzt: )

    Dieser Beitrag wurde bereits 6 Mal editiert, zuletzt von The Scout () aus folgendem Grund: Hinweis zum Vertrag zur Auftragsdatenverarbeitung eingefügt!

  • Ich danke dir für deine super ausführliche Beschreibung, werde das auf jedenfall in Zukunft für alle Projekte nutzen...
    :D:thumbsup::thumbup:8o

  • Wirklich cool. Eine Frage habe ich aber noch. Es gibt doch jetzt diese neuen Domainendungen. Hier bei 1und1 habe ich zum Beispiel eine nrw domain gefunden, die für mein Geschäft ganz gut passen würde. Meinst du es macht Sinn diese neuen Endungen zu nutzen? Oder verwirrt das die Nutzer und Kunden nur? Ich finde den zusätzlichen Informationseffekt eigentlich ganz cool. So wissen alle gleich, dass mein Geschäft in Nordrhein Westfahlen ist.

  • Naja, das muss man selber wissen, allerdings ist das mit diesen Landesendungen immer so ne Sache: Berlin hat geklagt und Recht bekommen, damit eine URL mit .berlin wieder freigegeben und vom Land selbst genutzt werden kann.
    kA ob da NRW auch so ein Gejaule veranstalten würde, aber vielleicht suchst du dir lieber eine TLD die eher dein Geschäft als das Gebiet beschreibt.