Υποσύνολο γραμματοσειράς (Font Subsetter)

Πώς να δημιουργήσετε υποσύνολο γραμματοσειράς

1. Ελέγξτε την άδεια. Η δημιουργία υποσυνόλου παράγει ένα τροποποιημένο αντίγραφο της γραμματοσειράς. Οι ανοιχτές άδειες όπως η SIL Open Font License (OFL) και η Apache 2.0 το επιτρέπουν· πολλές εμπορικές άδειες για υπολογιστές και ιστό δεν το επιτρέπουν ή το επιτρέπουν μόνο υπό προϋποθέσεις. Διαβάστε πρώτα την άδεια της γραμματοσειράς σας.
2. Αφήστε ένα αρχείο TTF, OTF ή WOFF στην περιοχή απόθεσης ή κάντε κλικ σε αυτήν για να επιλέξετε ένα. Ο πίνακας Αρχική γραμματοσειρά δείχνει την οικογένεια, τη μορφή, το μέγεθος αρχείου, τον αριθμό των γλύφων και τον αριθμό των χαρακτήρων που αντιστοιχίζει η γραμματοσειρά.
3. Επιλέξτε τους Χαρακτήρες προς διατήρηση: Βασικά λατινικά, Latin-1, Λατινικά, όπως στο Google Fonts, Γαλλικά και Ψηφία και σύμβολα αριθμών μπορούν να συνδυαστούν. Προσθέστε δικούς σας χαρακτήρες στο Χαρακτήρες από ένα κείμενο (διατηρείται κάθε διαφορετικός χαρακτήρας του κειμένου) ή στα Εύρη Unicode, γραμμένα όπως στο CSS: U+0020-007E, U+2013, U+04??. Για ελληνικό κείμενο, επικολλήστε το κείμενό σας στο Χαρακτήρες από ένα κείμενο ή προσθέστε το εύρος U+0370-03FF, U+1F00-1FFF.
4. Επιλέξτε Αφαίρεση hinting αν θέλετε το μικρότερο δυνατό αρχείο.
5. Πατήστε Δημιουργία υποσυνόλου. Η μηχανή (περίπου 650 KB) φορτώνεται την πρώτη φορά και μετά η γραμματοσειρά επεξεργάζεται στη συσκευή σας.
6. Συγκρίνετε τα μεγέθη στο Αποτέλεσμα, δείτε την Προεπισκόπηση του υποσυνόλου και μετά χρησιμοποιήστε τα Λήψη TTF (ή OTF) και Λήψη WOFF και αντιγράψτε τον κανόνα CSS @font-face.

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

Τι κάνει η δημιουργία υποσυνόλου

Μια γραμματοσειρά περιέχει συχνά εκατοντάδες ή χιλιάδες γλύφους: κυριλλικά, ελληνικά, βιετναμέζικα, σύμβολα, εναλλακτικές μορφές. Μια σελίδα γραμμένη στα αγγλικά ή στα γαλλικά χρησιμοποιεί μόνο ένα κλάσμα τους. Αυτό το εργαλείο εκτελεί το hb-subset, τον δημιουργό υποσυνόλων της μηχανής κειμένου HarfBuzz (τον ίδιο κώδικα που χρησιμοποιούν το Google Fonts και πολλά εργαλεία build), μεταγλωττισμένο σε WebAssembly. Διατηρεί τους γλύφους για τους χαρακτήρες που επιλέξατε, μαζί με τους γλύφους που χρειάζονται τα χαρακτηριστικά OpenType για να τους εμφανίσουν (συνδέσεις όπως το «fi», μικρά κεφαλαία και τονισμένες μορφές όταν είναι προσβάσιμα από τους χαρακτήρες σας), και αφαιρεί τα υπόλοιπα. Οι πίνακες kerning και οι άλλοι πίνακες διάταξης κόβονται αναλόγως.

Τυπικά αποτελέσματα: μια πλήρης γραμματοσειρά λατινικών, κυριλλικών και ελληνικών 300 KB μπορεί να πέσει στα 20 ή 30 KB για γαλλικό κείμενο και μια γραμματοσειρά λογοτύπου με υποσύνολο τα γράμματα μίας λέξης συχνά ζυγίζει λίγα kilobyte.

Η γραμμή Δεν υπάρχουν στη γραμματοσειρά απαριθμεί χαρακτήρες που ζητήσατε και δεν έχει η γραμματοσειρά. Τα προγράμματα περιήγησης θα τους σχεδιάσουν με εφεδρική γραμματοσειρά.

Μορφές εξόδου και unicode-range

• TTF/OTF: το υποσύνολο διατηρεί τον τύπο περιγράμματος του πρωτοτύπου (TrueType ή CFF).
• WOFF: η ίδια γραμματοσειρά με κάθε πίνακα συμπιεσμένο με zlib. Το διαβάζουν όλα τα σύγχρονα προγράμματα περιήγησης. Μια είσοδος WOFF αποσυμπιέζεται πρώτα.
• Το WOFF2 δεν είναι διαθέσιμο: η συμπίεση Brotli και οι μετασχηματισμοί πινάκων δεν έχουν κωδικοποιητή στο πρόγραμμα περιήγησης και τα αρχεία WOFF2 δεν μπορούν να διαβαστούν ούτε εδώ. Μετατρέψτε πρώτα το WOFF2 σε TTF (για παράδειγμα με το fontTools). Ο διακομιστής σας μπορεί επίσης να συμπιέσει το TTF/OTF με gzip ή Brotli εν κινήσει.

Ο κανόνας CSS @font-face απαριθμεί πρώτα το αρχείο WOFF, ορίζει font-display: swap και προσθέτει ένα unicode-range φτιαγμένο από τους χαρακτήρες που υπάρχουν πραγματικά στο υποσύνολο. Με το unicode-range, το πρόγραμμα περιήγησης κατεβάζει το αρχείο μόνο όταν η σελίδα χρησιμοποιεί κάποιον από αυτούς τους χαρακτήρες, οπότε μπορείτε να χωρίσετε μια οικογένεια σε πολλά αρχεία (για παράδειγμα λατινικά και ελληνικά) και να αφήσετε κάθε επισκέπτη να φορτώσει μόνο όσα χρειάζεται. Επεξεργαστείτε το Όνομα font-family ώστε να ταιριάζει με το όνομα που χρησιμοποιείται στο φύλλο στυλ σας.