Πόσοι από εσάς δοκιμάσατε τον σχεδιασμό του ιστοτόπου σας σε διαφορετικά προγράμματα περιήγησης και υπολογιστές πριν ξεκινήσετε την ιστοσελίδα; Σίγουρα μερικοί από εσάς. Ξέρετε ότι αυτό που φαίνεται καλό σε ένα λειτουργικό σύστημα (για παράδειγμα, Mac) μπορεί πραγματικά να φαίνεται κακό σε άλλο, όπως τα Windows; Ο κύριος λόγος είναι επειδή οι γραμματοσειρές που χρησιμοποιούνται στο σύστημα Mac δεν είναι διαθέσιμες στο λειτουργικό σύστημα Windows. Η υποκατάστατη γραμματοσειρά χρησιμοποιείται από τον υπολογιστή (χωρίς τη γραμματοσειρά) και αυτό μπορεί να βλάψει πραγματικά το σχεδιασμό ιστοσελίδων σας. Ένας καλός τρόπος για να ξεπεραστεί αυτό είναι να χρησιμοποιήσετε μια γραμματοσειρά Ιστού που υποστηρίζεται από τα περισσότερα προγράμματα περιήγησης, έτσι ώστε ο ιστότοπός σας να φαίνεται ουσιαστικά ο ίδιος ανεξάρτητα από το πρόγραμμα περιήγησης ή τον υπολογιστή που χρησιμοποιείτε.

Κατά τη διάρκεια της διάσκεψης προγραμματιστών I / O τον Ιούνιο του 2010, η Google παρουσίασε τη γραμματοσειρά Google - μια σειρά γραμματοσειρών ανοικτού κώδικα που μπορείτε να ενσωματώσετε και να χρησιμοποιήσετε στον ιστότοπό σας. Όλες οι γραμματοσειρές φιλοξενούνται στο διακομιστή Google, έτσι ώστε κάθε πρόγραμμα περιήγησης να το χρησιμοποιήσει χωρίς μεγάλη προσπάθεια. Προς το παρόν, υπάρχουν 18 διαφορετικές γραμματοσειρές (από αυτό το post) από τις οποίες μπορείτε να διαλέξετε και είμαι σίγουρος ότι θα προστεθούν περισσότερα στη βιβλιοθήκη στο μέλλον.

Προεπισκόπηση της γραμματοσειράς

Εκτός από τη Γραμματοσειρά Google, η Google κυκλοφόρησε επίσης την προεπισκόπηση γραμματοσειράς Google που σας επιτρέπει να κάνετε προεπισκόπηση της γραμματοσειράς πριν την ενσωμάτωσή της στον ιστότοπό σας.

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

Μόλις είστε ικανοποιημένοι με το αποτέλεσμα, απλά αρπάξτε τον κώδικα και ενσωματώστε το στο σχέδιο του site σας.

Ενσωμάτωση της γραμματοσειράς Google στον ιστότοπό σας στο WordPress

Αν χρησιμοποιείτε ιστολόγιο που λειτουργεί με WP, μπορείτε να ενσωματώσετε και να χρησιμοποιήσετε τη γραμματοσειρά Google στον ιστότοπό σας.

Μεταβείτε στο Google Font, βρείτε την αγαπημένη σας γραμματοσειρά και τραβήξτε τον κώδικα "Embed". Για παράδειγμα:

Ανοίξτε το αρχείο "header.php" στον ενεργό φάκελο θεμάτων. Εισαγάγετε τον κώδικα πριν από την ετικέτα.
Για να χρησιμοποιήσετε τη γραμματοσειρά Google σε ολόκληρο τον ιστότοπο, ανοίξτε το αρχείο "style.css" από τον ενεργό φάκελο θεμάτων και επικολλήστε τον υπόλοιπο κωδικό που τραβήξατε από τον ιστότοπο της γραμματοσειράς Google.
 σώμα {font-family: 'Cantarell', serif; μέγεθος γραμματοσειράς: 28px; γραμματοσειρά: κανονικό; γραμματοσειράς-βάρος: 400; σκιά κειμένου: κανένας; κείμενο-διακόσμηση: κανένα? κείμενο-μετασχηματισμός: κανένα? διάστιχο: 0em; απόσταση λέξης: 0em; γραμμή-ύψος: 1em; }} 
Εναλλακτικά, μπορείτε να αλλάξετε το css αν το χρησιμοποιείτε μόνο για ένα μικρό μέρος του ιστότοπού σας. Για παράδειγμα
 span.custom_font {font-family: 'Cantarell', serif; μέγεθος γραμματοσειράς: 28px; γραμματοσειρά: κανονικό; γραμματοσειράς-βάρος: 400; }} 
Αποθηκεύστε το αρχείο header.php και style.css και μεταφορτώστε τα στον server σας. Αν χρησιμοποιείτε μια προσθήκη προσωρινής μνήμης, μην ξεχάσετε να καθαρίσετε την προσωρινή μνήμη.
Αυτό είναι. Δοκιμάστε το και ενημερώστε μας αν λειτουργεί για εσάς.
Πιστοποίηση εικόνας: til01