Frage von Frost209, 52

Welche CSS (bsp. Reset) und JavaScript (bsp Modernizr) "Tools" sind für eine Website wirklich wichtig?

Hallo, ich denke die Überschrift sagt schon alles? Welche CSS bzw. JavaScript tools usw. sind für eine professionelle Website wirklich wichtig? Ich lese immer wieder was von CSS Reset Dateien, von Modernizr und co. Aber brauche ich das wirklich alles?

Antwort
von medmonk, 5

Ein Reset sollte per se gemacht werden. Wie, womit und in welchem Ausmaß hängt ganz vom Projekt ab. Ich selber arbeite mit Preprozessoren (Jade, Sass, Coffee) und verwende Gulp als Taskrunner. Normalize wird mit allen anderen Komponenten in ein Stylesheet geschrieben. 

Frameworks wie Bootstrap, Foundation und Co. benutze ich kaum noch. Mich stört vor allem das aufgeblähte Markup mit unzähligen Verschachtelungen und Klassen. Daher entweder auf eigene (schlankere) Entwicklungen zurückgreife oder Bourbon mit Neat verwende. 

Als Output habe ich so jeweils ein Stylesheet, eine Script samt schlanken Markup. Hinzukommen noch jQuery und Modernizr, die separat via CDN eingebunden werden. Einmal direkt über Google, sowie auf dem eigenen Server/Space.

Für eigene CDN habe ich auf meinen Server ein eigenes Verzeichnis, in dem die jeweiligen Scripten liegen. Auch Themes (Templates) werden dort teilweise ausgelagert, um die Performance zu verbessern. Wenn ich beispielsweise mit WordPress arbeite, alle nötigen Dateien über die functions.php hole. 

Falls Googles CDN nicht abgerufen werden können, greife ich auf meine eigene Sammlung zu. Gibt es auch damit Probleme, sorgt ein Fallback fürs laden aus dem Theme Verzeichnis. Hat zwar alles nicht direkt etwas mit deiner Ausgangsfrage zutun, trotzdem mal erwähnt habe. 

Was jetzt die Resets angeht, sollten sie wie gesagt nicht fehlen. Allein weil es es doch deutliche Unterschiede in den einzelnen Browsern gibt und/oder geben kann. Auch ist die Entwicklung einer Website deutlich leichter, wenn man »alle« Browser auf einen Nenner gebracht hat. 

Wenn es lediglich für den IE gedacht ist, sollte Modernizr lediglich über Conditional Comments eingebunden werden. So landet das Script auch nur bei den Browsern, für die man es vorgesehen hat. 

LG medmonk 

Antwort
von missproduced, 15

Generell solltest du immer möglichst alles selbst machen - außer eine leichtgewichtige Bibliothek, welche ausschließlich dein Anliegen behandelt, erfüllt diese.

Sei auf der Hut vor jQuery, ein riesiger, träger und Syntax misshandelnder Brocken aus der Steinzeit. Es spricht nichts gegen Bibliotheken, welche dir beispielsweise das Arbeiten mit der DOM erleichtern. Allerdings immer darauf achten, dass die Bibliothek wirklich nur diesen Zweck erfüllt, sauber geschrieben, täglich oder wöchentlich aktualisiert wird und deinen eigentlichen Code nicht, oder kaum ausbremst.

Allgemein werden Bibliotheken nur benötigt (Beispiel Modernizer), wenn du die zu erstellende Webseite mit den meist genutzten Browsern inkl. älteren Versionen kompatibel machen willst.

Die grobe Funktionalität von Modernizer lässt sich auch in wenigen Zeilen Code nachbauen. Allerdings läuft dieser Code dann z.B. einzig unter Chrome, nicht auf dem IE, nur halb unter Firefox und unter Safari freezt das Bild -> gerade diese populären Bibliotheken nehmen dir diese Nerven Arbeit, bei dem es darum geht, Code möglichst Cross-Browser kompatibel lauffähig zu machen.

Ein anderes Beispiel wäre Fastclick.js - die gesamte Funktionalität habe ich vor kurzem in 7-10 Zeilen nachbauen können. Allerdings funktioniert es dann nur unter den aktuellsten Browser Versionen und selbst da ist nie nahezu vollkommene Sicherheit garantiert.

Antwort
von Limearts, 37

Wirklich wichtig? Kein einziges Zusatzskript / Tool / Bibliothek. Jedes nicht unbedingt notwendige Skript bläht die Webseite weiter auf. Gerade im professionellen Bereich (erst recht bei Online-Shops und anderen Verkaufsplattformen) spielt Geschwindigkeit und Performance eine nicht unerhebliche Rolle.

Die Frage ist somit eher welche Skripte und Lösungen Sinn machen, weil sie die Arbeit erleichtern, benötigte Funktionen bereit stellen oder die Benutzererfahrung verbessern. Und das ist wieder eine individual-Frage, die sich nach dem jeweiligen Projekt richtet und nicht pauschal allgemeingültig beantwortet werden kann.

Kommentar von Frost209 ,

Und gibt es eventuell auch eine Seite wo man sich zu diesen Dingen informieren kann oder eine Übersicht bietet?

Modernizr ist ja glaube ich beispielsweise um HTML5 und CSS3 zu vereinheitlichen? Ist das dann nicht generell wichtig?

Mir würde es hier speziell um einen Firmenauftritt gehen. Mit Wordpress als CMS. Die Seite bietet dann eigentlich nur Informationen, Beiträge, eine Galerie...

Antwort
von RedKungFuMastr, 10

Boilerplate liefert alles für eine gute Webseite.

https://html5boilerplate.com/

Jedoch was du brauchst ist immer noch in deinem Ermessen...
Zu Modernizr: falls du noch alte Browser unterstützen willst, kannst du das nutzen, ansonsten kannst du es auch sein lassen, falls du kein Bock hast für den zB IE8 zu optimieren xD

Antwort
von fluffiknuffi, 12

Denke normalize.css ist der Standard was das Normalisieren/Resetten angeht: https://github.com/necolas/normalize.css/

Ist ja sehr klein und kann man ja problemlos in die Haupt-CSS-Datei einbinden.

Sagt dir Post CSS was? Da gibt's Lösungen die dir genau die Vendor-Prefixes hinzufügen die du benötigst. Habe es selber noch nicht probiert aber das zusammen mit normalize.css sollte wohl eine ausreichende Grundlage bieten und "Geschwindigkeit und Performance" nicht stark belasten.

Keine passende Antwort gefunden?

Fragen Sie die Community