25 Gorgeous Web Ασφαλής Γραμματοσειρές για την ιστοσελίδα σας

Ενημερώθηκε: 25 Μαρ 2021 / Άρθρο από: Azreen Azmi

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

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

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

Αλλά αυτό που είναι πιο σημαντικό είναι να είναι γραμματοσειρές ασφαλείς στον ιστό.

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

Οι γραμματοσειρές που είναι ασφαλείς στον Ιστό είναι στυλ γραμματοσειράς που είναι συνήθως προεγκατεστημένα και ορατά στις περισσότερες συσκευές - υπολογιστές, κινητά τηλέφωνα, έξυπνες τηλεοράσεις και tablet.

Γιατί η ασφάλεια των γραμματοσειρών είναι ασφαλής;

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

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

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

Σε άλλες για να αποφευχθεί αυτό, οι σχεδιαστές ιστοσελίδων έχουν χρησιμοποιήσει το Βασικές γραμματοσειρές για τον Ιστό που η Microsoft κυκλοφόρησε στο 1996 ως το πρότυπο για τις περισσότερες γραμματοσειρές ιστοσελίδων. Αυτά τα σετ γραμματοσειρών έγιναν τελικά "γραμματοσειρές ασφαλείς στο web", διότι ανεξάρτητα από τον υπολογιστή, οι γραμματοσειρές θα εμφανίζονται με ασφάλεια στον ιστότοπό σας.

Πρέπει να χρησιμοποιήσω τις ασφαλείς γραμματοσειρές Web για την ιστοσελίδα μου;

Σύντομη απάντηση: Απολύτως.

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

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

Πώς μπορώ να προσθέσω αυτές τις ασφαλείς γραμματοσειρές Web;

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

Αν εξακολουθείτε να είστε βέβαιοι, ακολουθήστε αυτά τα λίγα απλά βήματα:

  1. Τοποθετήστε το αρχείο header.php
  2. Αντιγράψτε τον πηγαίο κώδικα / τον τυπικό κωδικό (βλ. Αναφορά 1)
  3. Επικολλήστε τον κώδικα στην κορυφή του αρχείου κεφαλίδας.
  4. Φορτώστε το style.css σας, βάλτε τον κωδικό γραμματοσειράς για να αλλάξετε το κείμενο γραμματοσειράς της επιλογής σας. (βλ. αναφορά 2)

Αναφορά 1

Αναφορά 2

body {font-family: 'Abel'; font-size: 22 εικονοστοιχεία;}

Το 25 Gorgeous Web Safe Γραμματοσειρές για την ιστοσελίδα σας

1. Arial

Web Safe Fonts - Arial

Σύνδεσμοι / Πηγή: Fonts.com / Γραμματοσειρά CSS

2. Calibri

Web Safe Fonts - Calibri

Σύνδεσμοι / Πηγή: Fonts.com / Γραμματοσειρά CSS 

3. Helvetica

Web Safe Fonts - Helvetica

Σύνδεσμοι / Πηγή: Fonts.com / Γραμματοσειρά CSS

4. Segoe UI

Web Safe Fonts -  Segoe UI

Σύνδεσμοι / Πηγή: Fonts.com / Γραμματοσειρά CSS

5. Trebuchet MS

Web Safe Fonts - Trebuchet

Σύνδεσμοι / Πηγή: Fonts.com / Γραμματοσειρά CSS 

6. Cambria

Web Safe Fonts - Cambria

Σύνδεσμοι / Πηγή: Fonts.com / Γραμματοσειρά CSS 

7. Palatino

Web Safe Fonts - Palatino

Σύνδεσμοι / Πηγή: Fonts.com / Γραμματοσειρά CSS

8. Perpetua

Web Safe Fonts - Perpetua

Σύνδεσμοι / Πηγή: Fonts.com / Γραμματοσειρά CSS

9. Γεωργία

Web Safe Fonts - Georgia

Σύνδεσμοι / Πηγή: Fonts.com / Γραμματοσειρά CSS 

10. Consolas

Web Safe Fonts - Consolas

Σύνδεσμοι / Πηγή: Fonts.com / Γραμματοσειρά CSS

11. Νέο κουτί

Web Safe Fonts - Courier New

Σύνδεσμοι / Πηγή: Fonts.com / Γραμματοσειρά CSS 

12. Tahoma

Web Safe Fonts - Tahoma

Σύνδεσμοι / Πηγή: Fonts.com / Γραμματοσειρά CSS

13. Verdana

Web Safe Fonts - Verdana

Σύνδεσμοι / Πηγή: Fonts.com / Γραμματοσειρά CSS

14. Optima

Web Safe Fonts - Optima

Σύνδεσμοι / Πηγή: Fonts.com / Γραμματοσειρά CSS

15. Gill Sans

Web Safe Fonts - Gill Sans

Σύνδεσμοι / Πηγή: Fonts.com / Γραμματοσειρά CSS

16. Γωνιά του Αιώνα

Web Safe Fonts - Century Gothic

Σύνδεσμοι / Πηγή: Fonts.com / Γραμματοσειρά CSS 

17. Candara

Web Safe Fonts - Candara

Σύνδεσμοι / Πηγή: Fonts.com / Γραμματοσειρά CSS

18. Andale Mono

Web Safe Fonts -  Andale Mono

Σύνδεσμοι / Πηγή: Fonts.com / Γραμματοσειρά CSS 

19. Didot

Web Safe Fonts - Didot

Σύνδεσμοι / Πηγή: Fonts.com / Γραμματοσειρά CSS

20. Γοτθική πλάκα

Web Safe Fonts - Copperplate

Σύνδεσμοι / Πηγή: Fonts.com / Γραμματοσειρά CSS 

21. Rockwell

Web Safe Fonts - Rockwell

Σύνδεσμοι / Πηγή: Fonts.com / Γραμματοσειρά CSS 

22. Bodoni

Web Safe Fonts - Bodoni

Σύνδεσμοι / Πηγή: Fonts.com / Γραμματοσειρά CSS

23. Franklin Gothic

Web Safe Fonts - franklin Gothic

Σύνδεσμοι / Πηγή: Fonts.com / Γραμματοσειρά CSS 

24. Επίπτωση

Web Safe Fonts - Impact

Σύνδεσμοι / Πηγή: Fonts.com / Γραμματοσειρά CSS 

25. Calisto MT

Web Safe Fonts - Calisto

Σύνδεσμοι / Πηγή: Fonts.com / Γραμματοσειρά CSS

Εργαλεία γραμματοσειρών για έλεγχο

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

Ζεύγος γραμματοσειρών

Ζεύγος γραμματοσειρών προσφέρει έναν τόνο πόρων, plugins, eBooks, οδηγούς, βίντεο και ακόμη και εμπνεύσεις για οτιδήποτε και ό, τι αφορά την τυπογραφία. Έχουν ακόμη και μια ενότητα που σας δίνει τις πιο δημοφιλείς γραμματοσειρές που είναι διαθέσιμες στις Γραμματοσειρές Google και ποιες γραμματοσειρές μπορούν να συνδυαστούν καλύτερα μεταξύ τους.

Wordmark.it

Εάν θέλετε μια γρήγορη προεπισκόπηση του τι θα έμοιαζε το κείμενό σας με μια συγκεκριμένη γραμματοσειρά, Wordmark.it σας δίνει μια στιγμιαία προεπισκόπηση του τρόπου εμφάνισης του κειμένου σας σε πολλές γραμματοσειρές ταυτόχρονα. Απλώς πληκτρολογήστε μια λέξη ή φράση στην μπάρα της πρώτης σελίδας, πατήστε enter και θα σας εμφανίσει το κείμενό σας με διαφορετικές γραμματοσειρές όπως Candara ή Lucida Console.

ΤιTheFont

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

Είναι όλα σχετικά με την αναπαραγωγή γραμματοσειράς

Use WHSR tool to check website font script
Το ενσωματωμένο εργαλείο μας μπορεί να ελέγξει τα σενάρια γραμματοσειρών που χρησιμοποιεί ο ιστότοπος (δείτε - Εργαλείο WHSR).

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

Όταν χρησιμοποιείτε γραμματοσειρές ασφαλείς στον ιστό που είναι ευχάριστες για τα μάτια, οι χρήστες σας θα είναι ευγνώμονες και πιο πρόθυμοι να επιστρέψουν και να καταναλώσουν περισσότερο από το περιεχόμενό σας. Λοιπόν, τι περιμένετε; Αρχίστε να χρησιμοποιείτε αυτές τις γραμματοσειρές και Κάνετε μια φοβερή ιστοσελίδα για την επιχείρησή σας!

Διαβάστε περισσότερα:

Σχετικά με την Azreen Azmi

Η Azreen Azmi είναι συγγραφέας που έχει την τάση να γράφει για το μάρκετινγκ περιεχομένου και την τεχνολογία. Από το YouTube στο Twitch, προσπαθεί να διατηρεί επαφή με την πιο πρόσφατη δημιουργία περιεχομένου και να βρει τον καλύτερο τρόπο για την εμπορία της μάρκας σας.