7 days of PS Actions, graphics, templates & fonts - for free!* Unlimited asset downloads! Start 7-Day Free Trial
Advertisement
  1. Design & Illustration
  2. Web Typography

Γραμματοσειρές Web σε 60 δευτερόλεπτα

Read Time: 2 mins

Greek (ελληνικά) translation by Iris Diakoumi (you can also view the original English article)

Οι γραμματοσειρές για χρήση σε μια ιστοσελίδα απαιτούν αρχεία που φορτώνονται από ένα από δύο τοποθεσίες. Το σύστημα του ίδιου του επισκέπτη, ή ένα διακομιστή web. Ας ρίξουμε μια γρήγορη ματιά στις γραμματοσειρές web σε εξήντα δευτερόλεπτα!

Thumbnail image taken from Auther web font by Seniors StudioThumbnail image taken from Auther web font by Seniors StudioThumbnail image taken from Auther web font by Seniors Studio
Εικόνα μικρογραφίας: «Auther», γραμματοσειρά web από το Seniors Studio

Κατανοώντας τις γραμματοσειρές Web

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

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

Οι γραμματοσειρές Web μπορούν να σερβιριστούν είτε μέσω του hosting του δικού σας site, είτε από εξωτερικό πάροχο όπως οι Google γραμματοσειρές. Για να σερβίρετε τις δικές σας γραμματοσειρές web, πρώτον βεβαιωθείτε ότι έχετε άδεια να χρησιμοποιήσετε τα αρχεία,και έπειτα τοποθετήστε τα στο Host σας και χρήσιμοποιήστε @font-face στο CSS σας για να τα φορτώσετε.

  • Κατανοώντας το @font-face

Για να χρησιμοποιήσετε γραμματοσειρές web τρίτων είτε θα προσθέσετε ένα στοιχείο συνδέσμου στην ενότητα head σας, ή κάποια κώδικα JavaScript. Και σε κάθε περίπτωση, πρέπει πάντα να καθορίσετε κάποιες γραμματοσειρές συστήματος στη στοίβα γραμματοσειρών σας για να χρησιμοποιήσετε ως εναλλακτική.

Και αυτές είναι οι γραμματοσειρές web, σε εξήντα δευτερόλεπτα!

Γραμματοσειρές Web από Envato Elements

Μια συνδρομή για Envato Elements θα σας δώσει πρόσβαση σε πάνω από 700 web γραμματοσειρές.. ένας αριθμός που αυξάνεται με κάθε μήνα που περνάει! Εάν είστε ένας λάτρης του τύπου, θα πρέπει να ρίξετε μια ματιά:

web fonts on Envato Elementsweb fonts on Envato Elementsweb fonts on Envato Elements
Γραμματοσειρές Web στο Envato Elemets
Advertisement
Did you find this post useful?
Want a weekly email summary?
Subscribe below and we’ll send you a weekly email summary of all new Design & Illustration tutorials. Never miss out on learning about the next big thing.
Scroll to top
Start your 7-day free trial*
Start free trial
*All Individual plans include a 7-day free trial for new customers; then chosen plan price applies. Cancel any time.