Σε το πρώτο μέρος αυτής της σειράς καλύψαμε τις ελλείψεις που οδηγούν στα δομικά στοιχεία του HTML5, σε αυτό το δεύτερο μέρος θα δούμε λεπτομερώς τις συνέπειες αυτών των ελλείψεων.
Έχω πει αρκετές φορές ότι το HTML5 εισάγει μια νέα μέθοδο δομής μιας ιστοσελίδας και ίσως αναρωτιέστε τι πραγματικά είναι. Είναι ακριβώς εκεί στο spec, το οποίο εισάγει την έννοια του "διαχωρισμού περιεχομένου ': η διατομή περιεχομένου είναι περιεχόμενο που καθορίζει το εύρος των επικεφαλίδων και των υποσέλιδων. Κάθε στοιχείο περιεχομένου κατά τομέα έχει δυνητικά τίτλο και περίγραμμα.
Το spec τεκμηριώνει την προσέγγισή του επικεφαλίδες, τμήματα και περιγράμματα για να καταστήσει σαφή την έννοια. Λοιπόν, σαφές σε όσους πρέπει να εφαρμόσουν τη λειτουργικότητα στα προγράμματα περιήγησης. Για να κατανοήσουμε τα δομικά στοιχεία της HTML (ενότητα, άρθρο, πλοήγηση, περιθώριο και τα σχετικά στοιχεία του κεφαλίδα και το υποσέλιδο) και αυτή η σκοτεινή έννοια του "διαχωρισμού περιεχομένου" ή "περιγράφει", πρέπει να κάνουμε ένα μικρό ταξίδι μέσω του ιστορικού HTML.
Η έννοια της περιγραφής που εισήχθη στο HTML5 μπορεί να ανιχνευθεί μέχρι το 1991 και συμπεριλήφθηκε στο άσχημο XHTML 2.0 Spec, και τέλος βλέπει το φως της ημέρας στο HTML5 ... μόνο για να είναι τόσο κακώς γνωστό ότι η ιδέα είναι λίγο πολύ νεκρός κατά την άφιξη.
Πριν από την HTML5, η ιεραρχική δομή μιας σελίδας καθορίστηκε από τα στοιχεία κεφαλίδας - τους παλιούς φίλους μας h1 έως h6. Θα μπορούσαμε να δομήσουμε μια σελίδα λέγοντας ότι ο τίτλος της σελίδας είναι h1, η επικεφαλίδα του άρθρου μπορεί να είναι h2 και ίσως οι υποδιαγραφές στο άρθρο να είναι h3 και h4 και ούτω καθεξής.
Αυτό είναι καλό για ένα απλό έγγραφο, αλλά χρησιμοποιώντας τις ετικέτες τίτλου για να δημιουργήσετε μια λογική ιεραρχία ή «περίγραμμα εγγράφου» για μια σύνθετη και σύγχρονη ιστοσελίδα είναι πολύ δύσκολη. Μέρος του προβλήματος είναι η έλλειψη ενός τρόπου για να προσδιοριστεί πού ένα τμήμα σελίδας ξεκινά και σταματά. Για παράδειγμα, ας πούμε ότι είχαμε το προηγούμενο έγγραφο μας με h1 για τον τίτλο της σελίδας, h2 για τον τίτλο του άρθρου, h3 για τις υποτιτλίες, αλλά στη συνέχεια ήθελε να επισημάνει τον τίτλο για τα τμήματα της πλευρικής μπάρας με τίτλους h3 επίσης.
Το έγγραφο που περιγράφει μια τέτοια δομή θα δημιουργούσε κάτι τέτοιο:
My Old Blog
My Latest Blog Post
My Blog Post Sub Heading
My Blog Post Sub Heading
About Me
Archives
Social Links
Εδώ, τα στοιχεία h3 «ανήκουν» από το h2 πάνω τους, ακόμα κι αν δεν έχει νόημα. Φυσικά, θα τα διασπάσαμε με κάτι σαν το div για το άρθρο και το div για την πλαϊνή μπάρα, αλλά αυτά αγνοούνται από πράκτορες χρήστη (όπως αναγνώστες οθόνης) που καθορίζουν το περίγραμμα της σελίδας μόνο από τη δομή κεφαλίδας.
Με τη δέσμευση της ιεραρχίας των σελίδων απευθείας σε αυτά που συχνά παρουσιάζουν τα επίπεδα τίτλου παρουσίασης, είμαστε περιορισμένοι στο πώς μπορούμε να δομήσουμε μια σελίδα.
Σε μια προσπάθεια επίλυσης αυτού του προβλήματος, το HTML5 εισάγει την έννοια των «τμηματοποιητικών στοιχείων», δηλαδή των ειδικών στοιχείων που διαιρούν τη σελίδα προς τα πάνω σε - εσείς το μαντέψατε - ενότητες και αυτά τα τμήματα καθορίζουν το επίπεδο φωλιάσματος των κεφαλίδων και μάλιστα την ιεραρχία , ή "περίγραμμα" της σελίδας.
Δηλαδή, η ιεραρχία της σελίδας αποσυνδέεται από τα στοιχεία κεφαλίδας, και αντ 'αυτού αυτά τα νέα στοιχεία διατομής καθορίζουν τι επίπεδο είναι ένα στοιχείο κλάσης στην πραγματικότητα.
Στο πρώτο σχέδιο XHTML 2.0 προδιαγραφή , η διατομή έχει επεξεργαστεί με ένα στοιχείο διατομής και ένα στοιχείο γενικής κεφαλίδας h. Κατά τη σύνταξη HTML, τότε δεν θα διευκρινίσαμε ποιο επίπεδο επικεφαλίδας θέλαμε να χρησιμοποιήσουμε, θα αφήναμε απλώς στο πρόγραμμα περιήγησης να καθορίσει το επίπεδο φωλεοποίησης για μια δεδομένη κλάση. Θα μπορούσαμε να φωλιάζουμε βαθιά τα στοιχεία των τμημάτων 99 και ένα στοιχείο h στο 99ο επίπεδο θα ισοδυναμούσε με ένα στοιχείο h99. Με αυτόν τον τρόπο, μπορούμε να δομήσουμε τα έγγραφά μας λογικά, χωρίς να ανησυχούμε για το πώς μπορούμε να χρησιμοποιήσουμε τα περιορισμένα στοιχεία h1-h6.
(Αυτή η ιδέα πραγματικά χρονολογείται από το 1991, παρεμπιπτόντως: ως Τζέρεμι Κέιθ επεσήμανε ότι ο Tim Berners-Lee εξέφρασε την ιδέα ενός τμήματος και του στοιχείου h για να δομήσει μια σελίδα στο τέλος του αυτό το ηλεκτρονικό μήνυμα του Οκτωβρίου του 1991 .)
Ο Hickson προσπάθησε να εισαγάγει την ίδια ιδέα στην HTML5, αλλά με μια πρόσθετη δυσκολία: ήθελε να διατηρήσει την συμβατότητα προς τα πίσω και να εισαγάγει κάποια νέα σημασιολογία για να «απλοποιήσει τη συγγραφή» στην εκκίνηση. Επομένως, αντί να έχουμε μόνο ένα στοιχείο διατομής στο HTML5, έχουμε επίσης ένα στοιχείο, ένα στοιχείο πλοήγησης και ένα κατά μέρος το οποίο όλα κάνουν το ίδιο πράγμα με το τμήμα, αλλά με διαφορετικά ονόματα, για να χρησιμοποιηθούν με διαφορετικούς τρόπους.
Τι λέει το spec για αυτά τα στοιχεία; Σας ενθαρρύνω διαβάστε το spec για τον εαυτό σας , αλλά εδώ είναι μια γεύση:
Το στοιχείο διατομής είναι το θεμέλιο της τομής για να δημιουργηθεί ένα περίγραμμα εγγράφου.
Το στοιχείο ενότητας αντιπροσωπεύει ένα γενικό τμήμα ενός εγγράφου ή μιας εφαρμογής. Ένα τμήμα, στο πλαίσιο αυτό, είναι μια θεματική ομαδοποίηση περιεχομένου, συνήθως με τίτλο.
Παραδείγματα τμημάτων θα είναι τα κεφάλαια, οι διάφορες σελίδες με καρτέλες σε ένα παράθυρο διαλόγου με καρτέλες ή οι αριθμημένες ενότητες μιας διατριβής. Η αρχική σελίδα μιας ιστοσελίδας μπορεί να χωριστεί σε ενότητες για εισαγωγή, νέα και στοιχεία επικοινωνίας.
Ένα σημείωμα στο spec λέει ότι το στοιχείο δεν θα πρέπει να χρησιμοποιείται για καθαρά styling σκοπούς - ένα div θα ήταν καλύτερα εκεί, και κατά τρόπο κατανοητό, όπως τμήματα που ρίχνονται σε willy-nilly για το στυλ θα δημιουργούσε ένα πολύ σπασμένο περίγραμμα εγγράφου.
Το σημείωμα συνεχίζει να λέει «Ένας γενικός κανόνας είναι ότι το στοιχείο του τμήματος είναι κατάλληλο μόνο αν τα περιεχόμενα του στοιχείου θα αναφέρονται ρητά στο περίγραμμα του εγγράφου» και αυτή είναι η πιο ξεκάθαρη δήλωση σχετικά με το στοιχείο ενότητας στο spec.
Όταν κατανοούμε την έννοια της τομής και της περιγραφής, η συμπερίληψη του στοιχείου του τμήματος έχει νόημα. Δεν εμφανίστηκε στην κοινή κατηγορία αξιών έρευνα, αλλά εμφανίστηκε στο XHTML 2.0, και χρονολογείται από εννοιολογική άποψη το 1991.
Τα άλλα δομικά στοιχεία που εισάγει το HTML5 - αυτά που υποτίθεται ότι αντικατοπτρίζονται στην έρευνα - κάνουν ακριβώς το ίδιο με το στοιχείο του τμήματος, όσον αφορά το περίγραμμα του εγγράφου. Δημιουργούν επίσης την ιεραρχία της σελίδας και, συνεπώς, το περίγραμμα του εγγράφου.
Πάρτε για παράδειγμα το στοιχείο του άρθρου. Πολλοί άνθρωποι υποθέτουν ότι είναι απλά για άρθρα όπως αυτό. Αλλά αυτό δεν είναι καθόλου. Είναι «άρθρο» με την έννοια «ένα είδος ρούχων». Είναι καλύτερα να θεωρείται ως «στοιχείο» όπως σε «ένα είδος ρούχων», καθώς ο ορισμός του είναι τόσο ευρύς.
Όταν τα στοιχεία του αντικειμένου είναι ένθετα, τα εσωτερικά στοιχεία του αντικειμένου αντιπροσωπεύουν αντικείμενα που σχετίζονται κατ 'αρχήν με το περιεχόμενο του εξωτερικού αντικειμένου. Για παράδειγμα, μια καταχώρηση ιστολογίου σε έναν ιστότοπο που δέχεται σχόλια που υπέβαλε ο χρήστης θα μπορούσε να αντιπροσωπεύει τα σχόλια ως στοιχεία του άρθρου που έχουν ενσωματωθεί στο στοιχείο του άρθρου για την καταχώρηση του ιστολογίου.
Σε HTML5, τα σχόλια των χρηστών, το σωστό άρθρο, οι δημοσιεύσεις σε φόρουμ και ακόμη και τα 'διαδραστικά widgets και gadgets' είναι όλα τα άρθρα. Ο ορισμός είναι τόσο ευρύς ώστε να είναι άχρηστο-σημασιολογία υποτίθεται ότι μεταδίδουν νόημα, αλλά χρησιμοποιώντας έναν συλλογικό όρο για μια τέτοια ευρεία ποικιλία στοιχείων καθιστά το στοιχείο άνευ σημασίας.
Αυτό είναι ένα παράδειγμα όπου έχουμε κάνει το spec - μερικοί άνθρωποι ακολουθούν σωστά τα spec και κάνουν σχεδόν όλα ένα άρθρο (περιλήψεις blog, blog posts, σχόλια, widgets, θέσεις φόρουμ κλπ.), Ενώ άλλοι το έχουν κρατήσει μόνο για το κύριο άρθρο σε μια σελίδα, η οποία είναι μόνο ένα μέρος του ευρέος ορισμού της. Μπορεί να νομίζετε ότι δεν έχει σημασία ούτε τρόπος, και σε μεγάλο βαθμό θα έχετε δίκιο. Αλλά σκεφτείτε όλες τις υπηρεσίες ανάγνωσης που αποσκοπούν στην ανάλυση μόνο του βασικού περιεχομένου της σελίδας. Ποια εφαρμογή του spec θα ακολουθήσουν; Πρέπει να ακολουθήσουν αυτό που λέει στην πραγματικότητα το spec ή πρέπει να ακολουθήσουν την εφαρμογή της γενικής κοινότητας, όπου συνήθως υπάρχει μόνο ένα κανονικό «άρθρο» σε μια σελίδα;
Αυτή είναι μια χαμένη ευκαιρία και τι συμβαίνει όταν η προδιαγραφή αποτυγχάνει να προσδιορίσει και ο συντάκτης και, για να είμαστε δίκαιοι, η κοινότητα, δεν ανακοινώνει τι ακριβώς λέει το spec.
Φανταστείτε αν το άρθρο δεν χρησιμοποιήθηκε επίσης για σχόλια. Φανταστείτε αν τα σχόλια πήραν το δικό τους στοιχείο, για παράδειγμα, και η υιοθεσία έγινε ευρέως διαδεδομένη. Οι υπεύθυνοι του προγράμματος περιήγησης θα μπορούσαν να προσθέσουν μια λειτουργία "σίγασης σχολίων" που θα μπορούσε εύκολα να κρύψει (ή να αναλύσει άλλως) τα σχόλια στις ιστοσελίδες. Αλλά ο Hickson έχει απορρίψει συγκεκριμένα ένα αίτημα για ένα στοιχείο σχολιασμού . Στο HTML5, τα άρθρα είναι όλο κάτω.
Εκτός από ένα άλλο στοιχείο που δεν εμφανίζεται πουθενά στην έρευνα για το όνομα της κατηγορίας του Hickson και παίρνει ένα πολύ περίεργο ορισμό για την εκκίνηση:
Το στοιχείο κατά μέρος αντιπροσωπεύει ένα τμήμα μιας σελίδας που αποτελείται από περιεχόμενο που σχετίζεται εφαπτομενικά με το περιεχόμενο γύρω από το στοιχείο κατά μέρος και το οποίο μπορεί να θεωρηθεί χωριστό από αυτό το περιεχόμενο. Τέτοιου είδους τμήματα αντιπροσωπεύονται συχνά ως πλευρικές ράβδοι στην τυπωμένη τυπογραφία.
Το στοιχείο μπορεί να χρησιμοποιηθεί για τυπογραφικά εφέ όπως αποσπάσματα προσγείωσης ή πλευρικές γραμμές, για διαφήμιση, για ομάδες στοιχείων NAV και για άλλο περιεχόμενο που θεωρείται ξεχωριστό από το κύριο περιεχόμενο της σελίδας.
Ποιος ξέρει γιατί πρέπει να καλύπτει τόσο τα αποσπάσματα, τις πλευρικές γραμμές, τη διαφήμιση και τις ομάδες στοιχείων πλοήγησης, αλλά δημιουργεί και νέα τμήματα στο περίγραμμα του εγγράφου. Αυτό σημαίνει αποσπάσματα αποστέλλουν το δικό τους κουκκίδα στο περίγραμμα του εγγράφου, το οποίο φαίνεται, ας πούμε, «περίεργο». Και πάλι, η τυχαία χρήση της από καλοπροαίρετους σχεδιαστές ιστοσελίδων έχει και θα δημιουργήσει πολλά σπασμένα περιγράμματα εγγράφων.
Το στοιχείο nav φαίνεται να είναι το πιο αυτονόητο των στοιχείων διαχωρισμού και ευτυχώς ο ορισμός δεν έχει εκτεταστεί πέρα από το σπάσιμο.
Το στοιχείο nav αντιπροσωπεύει ένα τμήμα μιας σελίδας που συνδέει με άλλες σελίδες ή με τμήματα της σελίδας: μια ενότητα με συνδέσμους πλοήγησης.
Αυτό είναι καλό και θα μπορούσε να έχει οφέλη θεωρητικής προσβασιμότητας (ένας πράκτορας χρήστη θα μπορούσε να παραλείψει ή να πηδήσει στις συνδέσεις του nav - δεν το κάνουν, αλλά θα μπορούσαν).
Το πρόβλημα είναι ότι με το πνεύμα της «απλοποίησης της δημιουργίας» και της αντικατάστασης του div με το στοιχείο nav, εκτοξεύουμε το στυλ πλοήγησης για ένα άλλο υποσύνολο χρηστών. Οι χρήστες του IE6-8 με το JavaScript εκτός λειτουργίας (Σύμφωνα με την έρευνα της Yahoo Το 1-2% όλων των χρηστών έχει JavaScript εκτός λειτουργίας ) είναι θύματα αυτού του προβλήματος. Με την απενεργοποίηση του JavaScript, το HTML5 shim που βασίζεται στο JavaScript και βοηθάει την κατανόηση των στοιχείων HTML5 του IE6-8 δεν λειτουργεί, οπότε το πρόγραμμα περιήγησης δεν στυλίζει τα στοιχεία HTML5. Αυτό μπορεί να επηρεάσει μόνο έναν μικρό αριθμό χρηστών, αλλά γιατί να τους επηρεάσει καθόλου;
Τα στοιχεία κεφαλίδας και υποσέλιδου είναι μια κλασική περίπτωση λήψης κοινών όρων και δίνοντάς τους πολύ διαφορετικές χρήσεις.
Το spec δηλώνει ότι κανένα από αυτά τα στοιχεία δεν δημιουργεί νέα τμήματα στο περίγραμμα του εγγράφου, παρά το γεγονός ότι συχνά απεικονίζονται ως παρόμοια με το τμήμα, το nav, το άρθρο και το κατά μέρος. Στην πραγματικότητα, δεν κάνουν τίποτα καθόλου. Περιλαμβάνονται μόνο για να οριοθετήσουν περιοχές συγκεκριμένης ενότητας στο περίγραμμα του εγγράφου.
Εδώ είναι το τι λέει το spec για την κεφαλίδα: το στοιχείο κεφαλίδας αντιπροσωπεύει μια ομάδα εισαγωγικών ή βοηθημάτων πλοήγησης.
Σημείωση: Ένα στοιχείο κεφαλίδας προορίζεται συνήθως να περιέχει την επικεφαλίδα της ενότητας (στοιχείο h1-h6 ή στοιχείο hgroup), αλλά αυτό δεν απαιτείται. Το στοιχείο κεφαλίδας μπορεί επίσης να χρησιμοποιηθεί για την αναδίπλωση του πίνακα περιεχομένων ενός τμήματος, μιας φόρμας αναζήτησης ή οποιουδήποτε σχετικού λογότυπου.
και το υποσέλιδο: το στοιχείο υποσέλιδου αντιπροσωπεύει ένα υποσέλιδο για την πλησιέστερη τομή του περιεχομένου του προγόνου ή την τομή του στοιχείου ρίζας. Ένα υποσέλιδο περιέχει συνήθως πληροφορίες σχετικά με το τμήμα του, όπως ποιος το έγραψε, συνδέσμους σε σχετικά έγγραφα, δεδομένα πνευματικών δικαιωμάτων και τα παρόμοια.
Στο HTML5, το στοιχείο του σώματος είναι στην πραγματικότητα το στοιχείο της ριζικής διατομής, επομένως μια συνολική κεφαλίδα και υποσέλιδο προορίζεται να περιγράψει το τμήμα του ριζικού σώματος. Οποιοδήποτε τμήμα μπορεί να έχει μια κεφαλίδα και / ή ένα υποσέλιδο - δεν προορίζονται μόνο για συνολικά κεφαλίδες και υποσέλιδα, όπως ίσως έχουμε υποθέσει. Τα επιμέρους σχόλια μπορούν για παράδειγμα να έχουν μια κεφαλίδα και ένα υποσέλιδο. Στην πραγματικότητα, όπως έχουμε αγγίξει νωρίτερα, το spec δίνει πραγματικά ένα παράδειγμα υποσέλιδου που χρησιμοποιείται σε ένα σχόλιο πάνω από το πραγματικό περιεχόμενο σχόλιο. Αυτό είναι σωστό, στα σχόλια HTML5 είναι άρθρα και μπορούν να έχουν ένα υποσέλιδο για μια κεφαλίδα και αυτό είναι στην πραγματική προδιαγραφή. Θέλατε ένα στοιχείο υποσέλιδου για την κεφαλίδα των σχολίων σας; Οχι? Λοιπόν, έχετε ένα.
Και πάλι, εδώ το HTML5 παίρνει κοινούς όρους και τις χρησιμοποιεί με τρόπους που δεν αναγνωρίζονται από τον κοινό συγγραφέα ιστού.
Αλλά υπάρχει κάτι που δεν εξετάσαμε στην εφαρμογή HTML της τομής. Το το εντοπίσατε; Έχουμε τα στοιχεία διατομής, αλλά δεν έχουμε ένα γενικό στοιχείο h. Μην ανησυχείτε, η λύση είναι στο spec :
Τα τμήματα μπορεί να περιέχουν επικεφαλίδες οποιουδήποτε βαθμού, αλλά οι συγγραφείς ενθαρρύνονται έντονα να χρησιμοποιούν μόνο στοιχεία h1 ή να χρησιμοποιούν στοιχεία της κατάλληλης κατάταξης για το επίπεδο φωλεοποίησης του τμήματος.
Το HTML5 θέλει να είναι συμβατό προς τα πίσω, οπότε ο WHATWG αποφάσισε να μην εισαγάγει ένα στοιχείο h (παρά την εισαγωγή μιας δέσμης νέων στοιχείων διαχωρισμού) και θέλει να επανατοποθετήσει το στοιχείο h1 ως το γενικό στοιχείο h. Χρησιμοποιήστε h1 παντού και αφήστε τον αλγόριθμο περιγραφής HTML5 να καθορίσει το πραγματικό του επίπεδο ... ή έτσι η θεωρία πηγαίνει.
Αυτή είναι μια φοβερή ιδέα για διάφορους λόγους, οι δύο βασικοί είναι η προσβασιμότητα και το στυλ.
Η χρήση του h1 παντού είναι πολύ κακή για την προσβασιμότητα. Οι τυφλοί χρήστες βασίζονται σε μεγάλο βαθμό στη δομή τίτλου ενός ιστότοπου. Είναι σημαντικό να υπενθυμίσουμε σε όλους μας πόσο σημαντική είναι η δομή των τίτλων για λόγους προσβασιμότητας. Για παράδειγμα, ένα Δεκέμβριο 2008 έρευνα πάνω από 1000 χρήστες αναγνώστης οθόνης που πραγματοποιήθηκε από το WebAIM, διαπίστωσε ότι το 76% των τυφλών και των προβληματικών χρηστών "πάντοτε ή συχνά" πλοηγούσαν κατά τίτλους όταν ήταν διαθέσιμοι. Και μια έρευνα το Μάιο του 2012 διαπίστωσε ότι τα επίπεδα τίτλων 82,1% ήταν «πολύ χρήσιμα» ή «κάπως χρήσιμα» κατά την πλοήγηση σε μια ιστοσελίδα. (Αυτό είναι καλό, πρακτική έρευνα, οπότε λάβετε υπόψη.)
Η ύπαρξη h1s παντού θα κάνει τους ιστότοπους πιο δύσκολο να περιηγηθείτε στους τυφλούς χρήστες. Θεωρητικά, οι αναγνώστες οθόνης θα χρησιμοποιούσαν αντίγραφο του αλγόριθμου HTML και θα περιηγούσαν χρησιμοποιώντας το περίγραμμα του εγγράφου, αλλά δεδομένου του τρόπου με τον οποίο οι συγγραφείς έχουν πει να εφαρμόσουν στοιχεία διαχωρισμού, περιγράφει ένα χάος και επιχειρεί να περιηγηθεί σε περιγράμματα εγγράφων τα οποία δεν έχουν σκεφθεί καθόλου να είναι ακόμη χειρότερη για τυφλούς χρήστες.
Η προδιαγραφή HTML5 προσφέρει μια διέξοδο: συνεχίστε να χρησιμοποιείτε τα κατάλληλα επίπεδα h1-h6 για να διατηρήσετε συμβατότητα προς τα πίσω. Αλλά τώρα διατηρούμε δύο περιγράμματα εγγράφων στο ένα έγγραφο και δεδομένων των προβλημάτων που είχαν οι συγγραφείς να εξετάσουν ακόμη και το περίγραμμα του εγγράφου, η πιθανότητα ο καθένας να διατηρεί τόσο λογικό περίγραμμα h1-h6 όσο και λογικό, σωστά -το τμήμα HTML5 φαίνεται απομακρυσμένο, στην καλύτερη περίπτωση.
Αλλά χειροτερεύει. Ας υποθέσουμε ότι θέλουμε να τρέξουμε με ένα καθαρό περίγραμμα HTML5 και χρησιμοποιούμε τα h1s παντού. Θυμηθείτε, στο spec HTML5 το h1 είναι απλώς ένα γενικό στοιχείο h. το πραγματικό του επίπεδο καθορίζεται από το πόσο βαθιά είναι τα ένθετα στοιχεία διαχωρισμού.
Τόσο πώς το στυλ αυτό; Λοιπόν, μπορούμε να προσθέσουμε ονόματα τάξεων σε όλα τα στοιχεία h1 ώστε να τα διαλέξουμε, αλλά αυτό είναι αντίθετο με τον αναφερόμενο στόχο HTML5 για απλοποίηση της δημιουργίας. και μπορούμε επίσης να κολλήσουμε στο h1-h6 (όλα τα οποία αντιμετωπίζονται ως γενικά στοιχεία h σε ένα περίγραμμα HTML5).
Θα μπορούσαμε να τα δοκιμάσουμε και να τα στυλίσουμε μέσω του καταρράκτη, αλλά αυτό γίνεται γρήγορα παράλογο, όπως Η Nicole Sullivan επεσήμανε . Στην πραγματικότητα, το «παράλογο» αρχίζει μόνο να το περιγράφει. Όταν εξετάζετε τους πιθανούς συνδυασμούς των τμημάτων, του άρθρου, του πλοίου και του χώρου και θέλετε να δημιουργήσετε ένα γενικό στυλ για μια κλάση που είναι, για παράδειγμα, πέντε βαθιά βαθιά (δηλαδή το ισοδύναμο του h5), θα πρέπει να γράψετε στυλ για όλους πιθανούς συνδυασμούς, που παίρνει απολύτως γελοίο . Εδώ είναι το γενικό στυλ για ένα στοιχείο h3:
article aside nav h1, article aside section h1,article nav aside h1, article nav section h1,article section aside h1, article section nav h1, article section section h1,aside article nav h1, aside article section h1,aside nav article h1, aside nav section h1,aside section article h1, aside section nav h1, aside section section h1,nav article aside h1, nav article section h1,nav aside article h1, nav aside section h1,nav section article h1, nav section aside h1, nav section section h1,section article aside h1, section article nav h1, section article section h1,section aside article h1, section aside nav h1, section aside section h1,section nav article h1, section nav aside h1, section nav section h1,section section article h1, section section aside h1, section section nav h1, section section section h1 {font-size: 1.00em;}Ωστόσο, αυτό μας δίνει τα δομικά στοιχεία της HTML. Τι χάλι.
Πείνα για περισσότερα; Το τρίτο μέρος αυτού του άρθρου είναι πλέον διαθέσιμη και το βιβλίο του Luke "Η αλήθεια για το HTML5" διατίθεται για περιορισμένο χρονικό διάστημα μέσω της ιστοσελίδας αδελφών μας MightyDeals.com με ένα εκπληκτικό 50% έκπτωση.
Χρησιμοποιείτε στοιχεία άρθρου πολλές φορές σε ένα έγγραφο; Είναι χρήσιμα τα τμήματα ή θα πρέπει να επιμείνουμε σε διαφορές; Ας γνωρίσουμε τις σκέψεις σας στα σχόλια.
Προτεινόμενη εικόνα / μικρογραφία, χρησιμοποιεί εικόνα δομής μέσω Shutterstock.