10 καλύτερες γραμματοσειρές ασφαλούς ιστού για το ιστολόγιό σας (Εργασία με HTML & CSS)

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


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

Τι είναι οι γραμματοσειρές που είναι ασφαλείς στον Ιστό?

Όλα τα λειτουργικά συστήματα (windows, mac, android, iOS, κ.λπ.) συνοδεύονται από μια συγκεκριμένη ποσότητα γραμματοσειρών. Το πρόβλημα είναι ότι διαφορετικά λειτουργικά συστήματα ενδέχεται να έχουν διαφορετικά γραμματοσειρά εγκατεστημένα στα συστήματά τους.

Εδώ μπαίνουν οι γραμματοσειρές Safe Web.

Οι γραμματοσειρές Safe Web είναι βασικά στυλ γραμματοσειρών που είναι κοινόχρηστα και ορατά σε όλες τις πλατφόρμες και διάφορα συστήματα.

Υπηρεσίες ενσωμάτωσης γραμματοσειρών Web

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

Χάρη στην Google, οι Γραμματοσειρές Ιστού Google είναι εντελώς δωρεάν και εύχρηστες. Για παράδειγμα, μπορείτε να επιλέξετε τύπους γραμματοσειρών όπως Λάτο, Άνοιγμα Sans ή Τήνος. Επικολλήστε τον δημιουργημένο κώδικα στα έγγραφά σας. Και είστε έτοιμοι να το αναφέρετε στο CSS.

Εδώ είναι το βασικό HTML για τους αρχάριους εάν θέλετε να μάθετε περισσότερα.

Γιατί είναι σημαντικές οι γραμματοσειρές που είναι ασφαλείς στον Ιστό?

“Αυτό που βλέπετε είναι αυτό που παίρνετε” όταν πρόκειται για εκτύπωση, αλλά στον Ιστό, αυτό που βλέπετε στην οθόνη σας ενδέχεται να μην είναι ακριβώς το ίδιο για την οθόνη κάποιου άλλου.

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

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

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

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

Συνιστούμε 10 καλύτερες γραμματοσειρές ασφαλούς ιστού

Τώρα που γνωρίζετε τη σημασία μιας γραμματοσειράς ασφαλούς ιστού, ήρθε η ώρα να αρχίσετε να τις χρησιμοποιείτε για τον ιστότοπό σας.

Ενώ υπάρχουν πολλές γραμματοσειρές που μπορείτε να επιλέξετε, προτείνουμε αυτές τις 10 γραμματοσειρές ασφαλείς στον ιστό να χρησιμοποιηθούν με HTML και CSS. Χρησιμοποιούνται ευρέως και φαίνονται αρκετά καλά επίσης.

1. Arial

arialΠαράδειγμα οικογένειας γραμματοσειρών Arial

Φορτώστε οποιονδήποτε ιστότοπο και πιθανότατα θα χρησιμοποιούν γραμματοσειρά Arial.

Αυτή η γραμματοσειρά sans-serif είναι η μεγαλύτερη ευρέως χρησιμοποιημένο γραμματοσειρά και θεωρείται το πρότυπο για όλες τις γραμματοσειρές που είναι ασφαλείς στον Ιστό. Συχνά χρησιμοποιείται ως υποκατάστατο για εξειδικευμένες γραμματοσειρές που δεν είναι διαθέσιμες σε συσκευές Windows.

2. Helvetica

helveticaΠαράδειγμα οικογένειας γραμματοσειρών Helvetica

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

Το Helvetica προσφέρει μια πιο στυλιζαρισμένη γραμματοσειρά sans serif που επιτρέπει πιο τολμηρά σχέδια.

3. Times New Roman

φορές-νέο-ρωμαϊκόΠαράδειγμα της οικογένειας γραμματοσειρών Times New Roman

Μια νέα παραλλαγή της παλιάς γραμματοσειράς Times.

Το Times New Roman είναι ίσως αυτό που γνωρίζουν οι περισσότεροι χρήστες των Windows, καθώς είναι η τυπική γραμματοσειρά serif στα Microsoft Words. Σε σύγκριση με την Arial, το Times New Roman είναι λίγο πιο παραδοσιακό στο σχεδιασμό του.

4 φορές

φορέςΠαράδειγμα οικογένειας γραμματοσειρών Times

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

Το Times θεωρείται η πιο παραδοσιακή γραμματοσειρά που υπάρχει και χρησιμοποιείται σπάνια εκτός εκτύπωσης και εφημερίδων.

5. Trebuchet MS

trebuchet-msΠαράδειγμα οικογένειας γραμματοσειρών Trebuchet MS

Αρχικά σχεδιάστηκε από τη Microsoft στη δεκαετία του ’90, το Trebuchet MS ήταν εμπνευσμένος από παλιές γραμματοσειρές μεσαιωνικού στιλ.

Χρησιμοποιήθηκε εμφανώς ως η κύρια γραμματοσειρά για τα Windows XP και ως γραμματοσειρές αντιγραφής σώματος στον Ιστό για κάποιο χρονικό διάστημα.

6. Verdana

γουρντάναΠαράδειγμα οικογένειας γραμματοσειρών Verdana

Μία από τις ασφαλέστερες επιλογές για μια γραμματοσειρά Ιστού, η Verdana χρησιμοποιεί απλές γραμμές serif και εξαιρετικά μεγάλα γράμματα για το σχεδιασμό της.

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

7. Arial Black

arial-μαύροΠαράδειγμα οικογένειας γραμματοσειρών Arial Black

Αν σας άρεσε η γραμματοσειρά Arial, αλλά θέλετε κάτι πιο τολμηρό και μεγαλύτερο, τότε δεν μπορείτε να κάνετε λάθος με την Arial Black. Η γραμματοσειρά δημιουργήθηκε όταν οι άνθρωποι ήθελαν να χρησιμοποιήσουν μια έντονη γραμματοσειρά τύπου Helvetica, αλλά δεν ήθελαν να πληρώσουν για την άδεια της.

8. Κούριερ

μεταφορέαςΠαράδειγμα οικογένειας γραμματοσειρών Courier

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

Δεν είναι η πιο κομψή γραμματοσειρά, αλλά είναι πολύ ευανάγνωστη και καθαρά σχεδιασμένη.

9. Courier New

αγγελιαφόρος-νέαΠαράδειγμα οικογένειας γραμματοσειρών Courier New

Όπως και οι Times, ο Courier είχε επίσης έναν επανασχεδιασμό που εκσυγχρονίζει το κλασικό του στυλ.

Το Courier New θεωρείται γραμματοσειρά μονόχωρου και διατίθεται και στις περισσότερες συσκευές και λειτουργικά συστήματα.

10. Γεωργία

ΓεωργίαΠαράδειγμα οικογένειας γραμματοσειρών της Γεωργίας

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

Αν και πρέπει να σημειωθεί, η γραμματοσειρά λειτουργεί σε ορισμένες περιπτώσεις και δεν λειτουργεί καλά με άλλες γραμματοσειρές serif (φαίνονται μικροσκοπικές δίπλα στο Times New Roman).

Απολύτως μη χρησιμοποιείτε: Comic Sans MS

Σίγουρα, φαίνεται διασκεδαστικό και κάπως περίεργο, ωστόσο, απολύτως μην χρησιμοποιείτε το Comic Sans MS εάν θέλετε να λαμβάνετε σοβαρά υπόψη τον ιστότοπό σας.

κόμικςΠαράδειγμα γραμματοσειράς Comic Sans MS

Η γραμματοσειρά sans-serif είναι μια απλή λήψη των γραμμάτων κόμικς και χρησιμοποιείται γενικά για ανεπίσημα έγγραφα και παιδικό υλικό. Εκτός αν γράφετε για παιδικό βιβλίο ή κόμικ, μην χρησιμοποιείτε το Comic Sans MS!

Τύλιξε

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

Απλά υποσχεθείτε ότι δεν θα χρησιμοποιήσετε το Comic Sans MS σε καμία περίπτωση.

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map