Μία από τις ετικέτες που θα μάθετε νωρίς σχεδιασμός ιστοσελίδων Η εκπαίδευση είναι ένα ζευγάρι ετικετών γνωστών ως «ετικέτες έμφασης». Ας ρίξουμε μια ματιά σε ποιες είναι αυτές οι ετικέτες και πώς χρησιμοποιούνται στο σχεδιασμό ιστοσελίδων σήμερα.
Επιστροφή στο XHTML
Εάν μάθατε HTML πριν από χρόνια, πολύ πριν από την άνοδο του HTML5, πιθανότατα χρησιμοποιήσατε τις έντονες και τις πλάγιες ετικέτες. Όπως θα περίμενε κανείς, αυτές οι ετικέτες μετέτρεψαν τα στοιχεία σε έντονα ή πλάγια κείμενο αντίστοιχα. Το πρόβλημα με αυτές τις ετικέτες, και γιατί παραγκωνίστηκαν υπέρ νέων στοιχείων (τα οποία θα εξετάσουμε σύντομα), είναι ότι δεν είναι σημασιολογικά στοιχεία. Αυτό οφείλεται στο γεγονός ότι ορίζουν τον τρόπο εμφάνισης του κειμένου και όχι πληροφορίες σχετικά με το κείμενο. Θυμηθείτε, το HTML (το οποίο θα γράφουν αυτές οι ετικέτες) αφορά τη δομή και όχι το οπτικό στυλ! Τα οπτικά χειρίζονται από CSS και οι βέλτιστες πρακτικές σχεδιασμού ιστοσελίδων υποστηρίζουν εδώ και πολύ καιρό ότι πρέπει να έχετε ξεκάθαρο διαχωρισμό στυλ και δομής στις ιστοσελίδες σας. Αυτό σημαίνει ότι δεν χρησιμοποιείτε στοιχεία που δεν είναι σημασιολογικά και που μοιάζουν με λεπτομέρεια και όχι δομή. Γι 'αυτό το τολμηρό και
πλάγια γραφή Οι ετικέτες έχουν γενικά αντικατασταθεί από έντονη (για έντονη γραφή) και έμφαση (για πλάγιους χαρακτήρες).και
Τα δυνατά στοιχεία και στοιχεία έμφασης προσθέτουν πληροφορίες στο κείμενό σας, αναφέροντας λεπτομερώς το περιεχόμενο που πρέπει να αντιμετωπίζεται διαφορετικά και να τονίζεται όταν μιλάει αυτό το περιεχόμενο. Χρησιμοποιείτε αυτά τα στοιχεία σχεδόν με τον ίδιο τρόπο που θα χρησιμοποιούσατε έντονα και πλάγια γράμματα στο παρελθόν. Απλώς περιβάλλετε το κείμενό σας με τις ετικέτες ανοίγματος και κλεισίματος ( και για έμφαση και και για έντονη έμφαση) και το συνημμένο κείμενο θα τονιστεί.
Μπορείτε να τοποθετήσετε αυτές τις ετικέτες και δεν έχει σημασία ποια είναι η εξωτερική ετικέτα. Να μερικά παραδείγματα.
Αυτό το κείμενο τονίζεται και τα περισσότερα προγράμματα περιήγησης θα το εμφανίζονταν με πλάγια γράμματα.
Αυτό το κείμενο τονίζεται έντονα και τα περισσότερα προγράμματα περιήγησης θα το εμφανίζονταν με έντονα γράμματα
Και στα δύο αυτά παραδείγματα, δεν υπαγορεύουμε οπτική εμφάνιση με το HTML. Ναι, η προεπιλεγμένη εμφάνιση του ετικέτα θα είναι πλάγια και το θα ήταν τολμηρό, αλλά αυτά τα βλέμματα θα μπορούσαν εύκολα να αλλάξουν στο CSS. Αυτό είναι το καλύτερο και των δύο κόσμων. Μπορείτε να αξιοποιήσετε τα προεπιλεγμένα στυλ του προγράμματος περιήγησης για να λάβετε πλάγιους χαρακτήρες ή έντονους χαρακτήρες στο έγγραφό σας χωρίς να ξεπεράσετε τη γραμμή και να συνδυάσετε τη δομή και το στυλ. Πες ότι το θέλεις Το κείμενο δεν είναι μόνο τολμηρό, αλλά και κόκκινο, μπορείτε να το προσθέσετε στο SCS.
δυνατός {
χρώμα: κόκκινο;
}
Σε αυτό το παράδειγμα, δεν χρειάζεται να προσθέσετε μια ιδιότητα για το έντονο γραμματοσειρά, καθώς αυτή είναι η προεπιλογή. Εάν δεν θέλετε να το αφήσετε στην τύχη, ωστόσο, μπορείτε πάντα να το προσθέσετε:
δυνατός {
γραμματοσειρά: έντονο;
χρώμα: κόκκινο;
}
Τώρα θα είστε όλοι εκτός από την εγγύηση ότι θα έχετε μια σελίδα με έντονο (και κόκκινο) κείμενο όπου κι αν βρίσκεστε χρησιμοποιείται ετικέτα.
Διπλασιάστε την έμφαση
Ένα πράγμα που έχουμε παρατηρήσει κατά τη διάρκεια του έτους είναι αυτό που συμβαίνει εάν προσπαθήσετε να διπλασιάσετε την έμφαση. Για παράδειγμα:
Αυτό το κείμενο πρέπει να έχει και τα δύο με έντονη γραφή και πλάγια γραφή κείμενο μέσα σε αυτό.
Θα σκεφτόσασταν ότι αυτή η γραμμή θα δημιουργούσε μια περιοχή με κείμενο με έντονη γραφή και πλάγιους χαρακτήρες. Μερικές φορές αυτό συμβαίνει όντως, αλλά έχουμε δει ότι ορισμένα προγράμματα περιήγησης τιμούν μόνο το δεύτερο από τα δύο στυλ έμφασης, αυτό που είναι πιο κοντά στο πραγματικό κείμενο, και το εμφανίζει μόνο με πλάγια γράμματα. Αυτός είναι ένας από τους λόγους για τους οποίους δεν διπλασιάζουμε τις ετικέτες με έμφαση.
Ένας άλλος λόγος για την αποφυγή αυτού του "διπλασιασμού" είναι για στιλιστικούς σκοπούς. Μια μορφή έμφασης είναι συνήθως αρκετή για να εκφράσει τον τόνο που θέλετε να ορίσετε. Δεν χρειάζεται να κάνετε έντονα γράμματα, πλάγια γραφή, χρώμα, μεγέθυνση και υπογράμμιση κειμένου για να ξεχωρίζει. Αυτό το κείμενο, όλα αυτά τα διαφορετικά είδη έμφασης, θα γινόντουσε. Επομένως, προσέξτε όταν χρησιμοποιείτε ετικέτες έμφασης ή στυλ CSS για να δώσετε έμφαση και μην το παρακάνετε.
Μια σημείωση για έντονα και πλάγια γράμματα
Μια τελική σκέψη - ενώ το τολμηρό () και πλάγιους χαρακτήρες () οι ετικέτες δεν συνιστώνται πλέον να χρησιμοποιούνται ως στοιχεία έμφασης, υπάρχουν ορισμένοι σχεδιαστές ιστοσελίδων που χρησιμοποιούν αυτές τις ετικέτες για να μορφοποιήσουν τις ενσωματωμένες περιοχές κειμένου. Βασικά, το χρησιμοποιούν σαν στοιχείο. Αυτό είναι ωραίο επειδή οι ετικέτες είναι πολύ μικρές, αλλά γενικά δεν συνιστάται η χρήση αυτών των στοιχείων. Το αναφέρουμε σε περίπτωση που το βλέπετε εκεί έξω σε ορισμένους ιστότοπους που χρησιμοποιούνται όχι για τη δημιουργία έντονων ή πλάγιων κειμένων, αλλά για τη δημιουργία ενός αγκίστρου CSS για κάποιο άλλο είδος οπτικού στυλ.