Τα ετικέτα γραμματοσειράς σε συνδυασμό με τα φύλλα στυλ Cascading (CSS)

Έχετε κοιτάξει μια πολύ παλιά ιστοσελίδα και είδε μια ασυνήθιστη ετικέτα μέσα στο HTML ; Πριν από πολλά χρόνια, οι σχεδιαστές ιστοσελίδων θα μπορούσαν να ορίσουν τις γραμματοσειρές των ιστοσελίδων τους μέσα στην ίδια την HTML , αλλά ο διαχωρισμός της δομής (HTML) και του στυλ (CSS) έβγαλε αυτή την πρακτική πριν από λίγο καιρό.

Στο σχεδιασμό ιστοσελίδων σήμερα, η ετικέτα έχει καταργηθεί. Αυτό σημαίνει ότι η ετικέτα δεν αποτελεί πλέον μέρος των προδιαγραφών HTML. Ενώ ορισμένα προγράμματα περιήγησης εξακολουθούσαν να υποστηρίζουν αυτήν την ετικέτα μετά την απόρριψη της, δεν υποστηρίζεται καθόλου στη HTML5, η οποία είναι η τελευταία επανάληψη της γλώσσας. Αυτό σημαίνει ότι η ετικέτα δεν θα πρέπει πλέον να βρίσκεται στα έγγραφά σας HTML.

Η εναλλακτική λύση για την ετικέτα γραμματοσειρών

Αν δεν μπορείτε να ορίσετε τη γραμματοσειρά κειμένου μέσα στη σελίδα HTML με την ετικέτα, τι θα έπρεπε να χρησιμοποιήσετε; Τα φυλλάδια στυλ Cascading (CSS) είναι ο τρόπος με τον οποίο ορίζετε στυλ γραμματοσειράς (και όλα τα οπτικά στυλ) στις ιστοσελίδες σήμερα. Το CSS μπορεί να κάνει τα ίδια πράγματα που μπορεί να κάνει η ετικέτα, καθώς και πολλά άλλα. Ας εξετάσουμε τι θα μπορούσε να κάνει η ετικέτα όταν ήταν μια επιλογή για τις σελίδες HTML (θυμηθείτε, δεν υποστηρίζεται καθόλου, επομένως δεν είναι επιλογή) και συγκρίνετε πώς να το κάνετε με το CSS.

Αλλαγή της οικογένειας γραμματοσειρών

Το πρόσωπο της γραμματοσειράς είναι το πρόσωπο ή η οικογένεια της γραμματοσειράς. Με την ετικέτα γραμματοσειράς θα χρησιμοποιούσατε το χαρακτηριστικό "πρόσωπο" και θα έπρεπε να το τοποθετήσετε σε ένα έγγραφο πολλές φορές και πολλές φορές για να ορίσετε τις μεμονωμένες γραμματοσειρές για κάθε τμήμα κειμένου. Αν χρειαζόταν να κάνετε μια σκούπιστη αλλαγή σε αυτή τη γραμματοσειρά, θα έπρεπε να αλλάξετε κάθε μία από αυτές τις ατομικές ετικέτες. Για παράδειγμα:

αυτή η γραμματοσειρά δεν είναι sans-serif

Στο CSS αντί της γραμματοσειράς "face", ονομάζεται γραμματοσειρά "family". Μπορείτε να γράψετε ένα στυλ CSS που θα ορίζει τη γραμματοσειρά. Για παράδειγμα, εάν θέλετε να ορίσετε όλο το κείμενο σε μια σελίδα στο Garamond, μπορείτε να προσθέσετε αυτό το οπτικό στυλ όπως αυτό:

σώμα {font-family: Garamond, Times, serif; }}

Αυτό το στυλ CSS θα εφαρμόζει την οικογένεια γραμματοσειρών Garamond σε όλα στην ιστοσελίδα αφού κάθε στοιχείο του εγγράφου είναι απόγονος του

Αλλαγή του χρώματος γραμματοσειράς

Όπως και με το πρόσωπο, χρησιμοποιείτε το χαρακτηριστικό "χρώμα" και δεκαεξαδικούς κωδικούς ή ονόματα χρωμάτων για να αλλάξετε το χρώμα του κειμένου σας. Πριν από χρόνια, θα θέσατε και αυτό ξεχωριστά σε στοιχεία κειμένου, όπως μια ετικέτα κεφαλίδας.

αυτή η γραμματοσειρά είναι μωβ

Σήμερα, θα γράψετε μόνο μια σειρά CSS.

Αυτό είναι πολύ πιο ευέλικτο. Εάν χρειάζεστε να αλλάξετε το

σε κάθε σελίδα του ιστότοπού σας, θα μπορούσατε να κάνετε μια αλλαγή στο αρχείο CSS και κάθε σελίδα που χρησιμοποιεί αυτό το αρχείο θα ενημερώθηκε.

Out με το παλιό

Χρησιμοποιώντας το CSS για να υπαγορεύσετε τα οπτικά στυλ είναι ένα πρότυπο του σχεδιαστή ιστοσελίδων για πολλά χρόνια, οπότε αν πραγματικά εξετάζετε μια σελίδα που εξακολουθεί να χρησιμοποιεί την ετικέτα, τότε είναι μια πολύ παλιά σελίδα και πρέπει να αναδιαμορφωθεί για να συμμορφωθεί με τον τρέχοντα ιστό Σχεδιασμός βέλτιστων πρακτικών και σύγχρονων προτύπων ιστού

Επεξεργασμένο από τον Jeremy Girard