# Μεταβλητές γραμματοσειρές με άξονα πλάτους

> Μεταβλητές οικογένειες όπου το πλάτος των γραμμάτων ρυθμίζεται όπως και το βάρος, από ελαφρό στένεμα για προσαρμογή κειμένου έως πλήρες εύρος από στενό σε πλατύ.

Μια μεταβλητή γραμματοσειρά αποθηκεύει ένα σχέδιο ως εύρος και όχι ως σύνολο σταθερών στυλ. Οι περισσότερες μεταβλητές οικογένειες προσφέρουν άξονα βάρους· λιγότερες προσθέτουν και άξονα πλάτους, καταχωρισμένο με την ετικέτα wdth, που κάνει τα γράμματα στενότερα ή πλατύτερα διατηρώντας το ύψος και τον χαρακτήρα τους. Οι τιμές του είναι ποσοστά του κανονικού πλάτους, άρα το 75 είναι στενό κόψιμο, το 100 το κανονικό και το 125 πλατύ.

Το πλάτος είναι συχνά ο πιο πρακτικός από τους δύο άξονες στη διάταξη σελίδας. Επιτρέπει να χωρέσει ένας τίτλος ακριβώς στη στήλη του, να στενέψει μια ετικέτα πλοήγησης σε μικρή οθόνη και να χαλαρώσει σε μεγάλη, ή να περάσει ένας πίνακας σε στενότερη ρύθμιση μόνο όταν τελειώνει ο χώρος των στηλών του. Στην CSS η ιδιότητα είναι font-stretch, ή font-variation-settings για λεπτότερο έλεγχο, και μπορεί να αλλάζει στα breakpoints ή να κινείται.

Συγκρίνετε τα εύρη πριν επιλέξετε. Αρκετές οικογένειες εδώ μόνο στενεύουν, από 100 έως περίπου 75, κάτι αρκετό για προσαρμογή κειμένου· δύο μόνο πλαταίνουν· άλλες διανύουν από το μισό του κανονικού πλάτους έως το διπλάσιο και είναι ουσιαστικά αρκετές γραμματοσειρές σε μία. Οι σημειώσεις παρακάτω δίνουν κάθε εύρος όπως καταγράφεται. Ένας καλοσχεδιασμένος άξονας πλάτους προσαρμόζει τα ίδια τα σχήματα των γραμμάτων, σε αντίθεση με την τεχνητή συμπίεση του κειμένου.

How these were chosen: Μεταβλητές οικογένειες των οποίων οι καταχωρίσεις αναφέρουν άξονα πλάτους (wdth) εκτός από το βάρος. Τα εύρη των αξόνων παρατίθενται από τις καταχωρίσεις.

## Fonts (17)

- [Roboto](https://trendhub.net/el/fonts/roboto.markdown) (Sans serif, 18 στυλ · μεταβλητή, OFL): Άξονας πλάτους από 75 έως 100 στενεύει το σχέδιο προς στενό κόψιμο, δίπλα σε βάρος από 100 έως 900 με πλάγια.
- [Open Sans](https://trendhub.net/el/fonts/open-sans.markdown) (Sans serif, 12 στυλ · μεταβλητή, OFL): Το πλάτος στενεύει από 100 σε 75 για προσαρμογή κειμένου, σε ανθρωπιστική sans με έξι βάρη και πλάγια.
- [Archivo](https://trendhub.net/el/fonts/archivo.markdown) (Sans serif, 18 στυλ · μεταβλητή, OFL): Πλάτος από 62 έως 125, από πολύ στενό έως πλατύ, μαζί με βάρος από Thin έως Black με πλάγια.
- [Saira](https://trendhub.net/el/fonts/saira.markdown) (Sans serif, 18 στυλ · μεταβλητή, OFL): Πλάτος από 50 έως 125 και βάρος από 100 έως 900 σε sans με τετράγωνες φόρμες, μαζί με πλάγια.
- [IBM Plex Sans](https://trendhub.net/el/fonts/ibm-plex-sans.markdown) (Sans serif, 14 στυλ · μεταβλητή, OFL): Άξονας πλάτους που στενεύει τα γράμματα έως 75, με επτά βάρη και πλάγια.
- [Inconsolata](https://trendhub.net/el/fonts/inconsolata.markdown) (Monospace, 8 στυλ · μεταβλητή, OFL): Monospace με άξονα πλάτους από 50 έως 200, από το μισό του κανονικού πλάτους έως το διπλάσιο, δίπλα σε βάρος από 200 έως 900.
- [Noto Serif](https://trendhub.net/el/fonts/noto-serif.markdown) (Serif, 18 στυλ · μεταβλητή, OFL): Serif κειμένου με άξονα πλάτους που στενεύει από 100 έως 62,5, με εννέα βάρη και πλάγια.
- [Merriweather](https://trendhub.net/el/fonts/merriweather.markdown) (Serif, 14 στυλ · μεταβλητή, OFL): Serif κειμένου με μέτριο εύρος πλάτους, 87 έως 112, δίπλα σε άξονες βάρους και οπτικού μεγέθους.
- [Asap](https://trendhub.net/el/fonts/asap.markdown) (Sans serif, 18 στυλ · μεταβλητή, OFL): Βάρος από 100 έως 900 και πλάτος από 75 έως 125, με πλάγια.
- [Georama](https://trendhub.net/el/fonts/georama.markdown) (Sans serif, 18 στυλ · μεταβλητή, OFL): Άξονας πλάτους από 62,5 έως 150, από στενό έως διευρυμένο, και εννέα βάρη με πλάγια.
- [Zalando Sans](https://trendhub.net/el/fonts/zalando-sans.markdown) (Sans serif, 16 στυλ · μεταβλητή, OFL): Πλάτος από 75 έως 125 και βάρος από 200 έως 900 σε ένα απλό grotesque, μαζί με πλάγια.
- [Science Gothic](https://trendhub.net/el/fonts/science-gothic.markdown) (Sans serif, 18 στυλ · μεταβλητή, OFL): Τέσσερις άξονες: βάρος 100–900, πλάτος 50–200, κλίση και αντίθεση.
- [Advent Pro](https://trendhub.net/el/fonts/advent-pro.markdown) (Sans serif, 18 στυλ · μεταβλητή, OFL): Το πλάτος εδώ μόνο διευρύνεται, από 100 έως 200, δίπλα σε βάρος από 100 έως 900.
- [Mozilla Headline](https://trendhub.net/el/fonts/mozilla-headline.markdown) (Sans serif, 6 στυλ · μεταβλητή, OFL): Βάρος από 200 έως 700 και πλάτος από 75 έως 125 σε μια sans επικεφαλίδων.
- [Anek Latin](https://trendhub.net/el/fonts/anek-latin.markdown) (Sans serif, 8 στυλ · μεταβλητή, OFL): Πλάτος από 75 έως 125 σε οκτώ όρθια βάρη από Thin έως ExtraBold.
- [Pliant](https://trendhub.net/el/fonts/pliant.markdown) (Sans serif, 18 στυλ · μεταβλητή, OFL): Το πλάτος μόνο αυξάνεται, από 100 έως 125, με εννέα βάρη, πλάγια, κυριλλικό και ελληνικό αλφάβητο.
- [Ubuntu Sans](https://trendhub.net/el/fonts/ubuntu-sans.markdown) (Sans serif, 16 στυλ · μεταβλητή, UFL): Άξονας πλάτους που στενεύει από 100 έως 75 σε μια sans φτιαγμένη για μενού, κουμπιά και παράθυρα διαλόγου, με οκτώ βάρη και πλάγια.

## FAQs

### Πώς ορίζω το πλάτος γραμματοσειράς στην CSS;

Χρησιμοποιήστε το font-stretch με ποσοστό, για παράδειγμα font-stretch: 85%, ή το font-variation-settings: "wdth" 85. Η τιμή πρέπει να βρίσκεται μέσα στο εύρος που υποστηρίζει η γραμματοσειρά· οι τιμές εκτός εύρους περιορίζονται στο πλησιέστερο άκρο.

### Είναι ο άξονας πλάτους το ίδιο με την οριζόντια κλιμάκωση του κειμένου;

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

### Λειτουργούν οι μεταβλητές γραμματοσειρές σε όλα τα προγράμματα περιήγησης και τις εφαρμογές;

Τα σημερινά προγράμματα περιήγησης και οι βασικές εφαρμογές σχεδίασης τις υποστηρίζουν. Το παλαιότερο λογισμικό μπορεί να δείχνει μόνο το προεπιλεγμένο στυλ, γι' αυτό κρατήστε στατικά αρχεία ως εφεδρικά όπου αυτό μετράει.

### Μπορώ να χρησιμοποιήσω εμπορικά αυτές τις μεταβλητές γραμματοσειρές;

Ναι. Όλες εκτός από μία διατίθενται με την SIL Open Font License, που επιτρέπει εμπορική χρήση, ενσωμάτωση και αυτόνομη φιλοξενία· η Ubuntu Sans χρησιμοποιεί την Ubuntu Font License, που επιτρέπει επίσης εμπορική χρήση. Κάθε σελίδα γραμματοσειράς αναφέρει την άδειά της.

## Related collections

- [Μεταβλητές γραμματοσειρές με άξονα οπτικού μεγέθους](https://trendhub.net/el/fonts/for/variable-fonts-with-optical-size.markdown)
- [Μεταβλητές γραμματοσειρές με ασυνήθιστους άξονες](https://trendhub.net/el/fonts/for/variable-fonts-with-unusual-axes.markdown)
- [Στενές sans serif γραμματοσειρές για πίνακες και στριμωγμένες σελιδοποιήσεις](https://trendhub.net/el/fonts/for/narrow-fonts-for-tight-layouts.markdown)
- [Στενές γραμματοσειρές για τίτλους](https://trendhub.net/el/fonts/for/condensed-headline-fonts.markdown)
- [Πλατιές και extended γραμματοσειρές για τίτλους και λογότυπα](https://trendhub.net/el/fonts/for/wide-and-extended-fonts.markdown)
- [Οικογένειες γραμματοσειρών με εννέα βάρη και πλάγια](https://trendhub.net/el/fonts/for/font-families-with-nine-weights.markdown)

---

Source: https://trendhub.net/el/fonts/for/variable-fonts-with-a-width-axis (trendhub)