Βέλτιστες Πρακτικές: Εργασία με CSS
Βάλτε Stylesheets στο Top
Αν θέλετε μια σελίδα να φορτώσει σταδιακά? Που, θέλουμε το πρόγραμμα περιήγησης να εμφανίζει ό, τι περιεχόμενο έχει το συντομότερο δυνατό, να θέσει το CSS στην κορυφή της σελίδας μέσα στο κεφάλι έγγραφο. Αυτό καθιστά τις σελίδες φαίνεται να φορτώνει πιο γρήγορα, καθώς αυτό διευκολύνει την προοδευτική απεικόνιση της σελίδας. Αυτό είναι ιδιαίτερα σημαντικό για τις σελίδες με πολύ περιεχόμενο και για τους χρήστες με αργές συνδέσεις στο Διαδίκτυο.
Είναι ένα τεκμηριωμένο γεγονός ότι για να ενισχυθεί η συνολική εμπειρία του χρήστη, είναι σημαντικό να παρέχουν οι δείκτες προόδου και οπτική ανατροφοδοτήσεις. Για να αποφύγετε να αναδιατυπώσει τα στοιχεία της σελίδας, στην περίπτωση κατά την αλλαγή του στυλ τους, ορισμένα προγράμματα περιήγησης, συμπεριλαμβανομένων των IE, μπλοκ απεικόνιση της σελίδας μέχρι το CSS είναι πλήρως φορτωμένο. Εξαιτίας αυτού, ο χρήστης μπορεί να δει μια κενή λευκή σελίδα.
Οι προδιαγραφές HTML W3 »αναφέρει επίσης ότι το CSS μου πρέπει να περιλαμβάνει στο τμήμα HEAD της σελίδας HTML. at the bottom of the page, so it's best not to use it. Επίσης, σημειώστε ότι, Σε IE @import συμπεριφέρεται το ίδιο με τη χρήση <link> στο κάτω μέρος της σελίδας, έτσι δεν είναι καλύτερο να το χρησιμοποιήσετε.
Αποφύγετε τη χρήση προγράμματος περιήγησης Ιδιαιτερότητες
Φίλτρα: Χρήση του φίλτρου αυξάνει την κατανάλωση μνήμης και εφαρμόζεται ανά στοιχείο, όχι ανά εικόνα, οπότε το πρόβλημα πολλαπλασιάζεται. Επίσης, τα φίλτρα IE ιδιοσκευασμάτων, ως εκ τούτου δεν θα λειτουργήσει όπως προβλέπεται σε άλλα προγράμματα περιήγησης. Αν θέλετε διαφάνεια ή το ντεγκραντέ φόντο, χρησιμοποιήστε 1Pixel με εικόνες.
Εκφράσεις: CSS εκφράσεις είναι ένα καλό χαρακτηριστικό γνώρισμα για να έχουν σε CSS, αλλά εξακολουθεί να είναι IE ιδιαίτερο χαρακτηριστικό. Επίσης, είναι σημαντικό να σημειωθεί ότι, αυτές οι εκφράσεις αξιολογούνται όταν η απόδοση της σελίδας και αλλαγή μεγέθους, κύλιση, ακόμα και όταν ο χρήστης μετακινεί το ποντίκι πάνω στη σελίδα. Περιττό να πούμε ότι αυτό θα μπορούσε να επηρεάσει την απόδοση της σελίδας σας. Ως εκ τούτου, με απλά λόγια, Αποφύγετε τη χρήση CSS εκφράσεις, εκτός εάν αισθάνεστε υπέρ της «ζυγίζει περισσότερα από τα μειονεκτήματά της»
Εξωτερικούς σας CSS
Χρήση εξωτερικών CSS θα οδηγήσει σε ταχύτερη φόρτωση των σελίδες επειδή τα αρχεία JavaScript και CSS είναι αποθηκευτεί προσωρινά από το πρόγραμμα περιήγησης. Inline CSS σε HTML έγγραφα πάρει κατεβάσει κάθε φορά που το έγγραφο HTML ζητείται. Αυτό ενδέχεται να μειώσει ουσιαστικά τον αριθμό των αιτήσεων HTTP έκανε, αλλά στη συνέχεια αυξάνει το μέγεθος του εγγράφου HTML. Εξωτερικό CSS αποθηκεύονται προσωρινά από το πρόγραμμα περιήγησης? Το μέγεθος του εγγράφου HTML, χωρίς να μειώνεται η αύξηση του αριθμού των αιτήσεων HTTP.
Σημειώστε ότι, εάν οι χρήστες στο site σας έχει πολλαπλές προβολές σελίδων ανά συνεδρία και πολλές από τις σελίδες σας επαναχρησιμοποιήσει τα ίδια scripts και των stylesheets, υπάρχει μια μεγαλύτερη δυνατότητα να επωφεληθούν από εξωτερικά αρχεία αποθηκεύονται προσωρινά.
Πακέτο CSS αρχείου σας
Συσκευασίας ή τραγάνισμα CSS σας είναι η πρακτική της αφαίρεσης περιττών χαρακτήρων από τον κωδικό για να μειώσετε το μέγεθος του βελτιώνοντας έτσι τους χρόνους φόρτωσης.
Η CSS μπορεί να μου ανησυχείτε, καταργώντας όλες τις παρατηρήσεις και τυχόν ανεπιθύμητους χαρακτήρες, όπως λευκά διαστήματα, οι νέες γραμμές κλπ.
