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