Πώς να εγκαταστήσετε τη γραμματοσειρά Google Roboto σε Windows, Mac και Linux

Η γραμματοσειρά Roboto είναι μια γραμματοσειρά τύπου sans-serif που δημιουργήθηκε από την Google. Αυτή η γραμματοσειρά εμφανίστηκε από τις πρώτες μέρες της κυκλοφορίας του Android 4.0 (Ice Cream Sandwich) με το πλεονέκτημα της κομψότητας και της καλής ορατότητας σε οθόνες υψηλής ανάλυσης όπως τα τηλέφωνα Android .

Το Roboto έχει μια πλήρη γκάμα γραμματοσειρών (συμπεριλαμβανομένης της κανονικής, έντονης, πλάγιας, πλάγιας και έντονης γραφής) και χρησιμοποιείται κυρίως σε εφαρμογές συστήματος και σε όλες τις εφαρμογές Google .

Υπάρχουν καλά νέα για αυτούς τους λάτρεις της γραμματοσειράς, ότι οι προγραμματιστές της Google έχουν κυκλοφορήσει τη γραμματοσειρά Roboto δωρεάν και μπορείτε να τη χρησιμοποιήσετε χωρίς περιορισμούς (με την άδεια λογισμικού Apache). Έτσι τώρα μπορείτε να το χρησιμοποιήσετε σε Windows , MAC , Linux ή ακόμα και στον ιστότοπό σας .

Ακολουθεί ο τρόπος εγκατάστασης της γραμματοσειράς Google Roboto σε όλες τις παραπάνω πλατφόρμες λειτουργικού συστήματος.

Κατεβάστε το Google Roboto

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

Επισκεφτείτε την τοποθεσία γραμματοσειράς Roboto και κατεβάστε τη γραμματοσειρά (συμπιεσμένο αρχείο). Πρέπει να κάνετε κλικ στο «Επιλέξτε αυτήν τη γραμματοσειρά» και, στη συνέχεια, στο κάτω μέρος της οθόνης, κάντε κλικ στη σκοτεινή καρτέλα που λέει «Επιλέχτηκε 1 οικογένεια».

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

Εξαγάγετε το αρχείο zip που μόλις κατεβάσατε σε έναν αυθαίρετο φάκελο. Ανοίξτε αυτόν τον φάκελο και θα δείτε όλες τις γραμματοσειρές Roboto μέσα.

Εγκαταστήστε το Roboto Font στα Windows 10

Ανοίξτε το φάκελο γραμματοσειράς Roboto. Επιλέξτε όλες τις γραμματοσειρές, κάντε δεξί κλικ και επιλέξτε «Εγκατάσταση».

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

Εγκαταστήστε το Roboto Font σε Linux

Ανοίξτε τον αρχικό σας φάκελο και, στη συνέχεια, ενεργοποιήστε τα κρυφά αρχεία/φακέλους. Βρείτε το φάκελο ".fonts". Εάν δεν υπάρχει, δημιουργήστε έναν νέο φάκελο με την επέκταση ".fonts". Στη συνέχεια, μετακινήστε το φάκελο που περιέχει τη γραμματοσειρά Roboto στον φάκελο ".fonts" που μόλις δημιουργήσατε.

Στη συνέχεια, επανεκκινήστε το LibreOffice, το GIMP, το Photoshop ή οποιαδήποτε άλλη εφαρμογή χρησιμοποιείτε. Θα δείτε τη γραμματοσειρά Roboto να εμφανίζεται για επιλογή.

Εγκαταστήστε το Roboto Font σε MAC

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

Εγκαταστήστε το Roboto Font για τον ιστότοπο

Εάν θέλετε να χρησιμοποιήσετε τη γραμματοσειρά Roboto στον ιστότοπό σας, μπορείτε να χρησιμοποιήσετε τη σύνταξη CSS3 "@font-face" . Αυτή είναι η μέθοδος για την ενσωμάτωση εξωτερικών γραμματοσειρών στον ιστότοπο.

Μεταβείτε στη σελίδα γραμματοσειράς FontSquirrel Roboto , κάντε κλικ στο "Webfont Kit" και, στη συνέχεια, επιλέξτε τις μορφές γραμματοσειράς που σας αρέσουν και κάντε κλικ στο "Λήψη @Font-Face Kit".

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

@font-face { font-family : 'Robot'; src: url('Roboto-Regular-webfont.eot'); src: url('Roboto-Regular-webfont.eot?#iefix') format('embedded-opentype'), url('Roboto-Regular-webfont.woff') format('woff'), url('Roboto- Regular-webfont.ttf') format('truetype'), url('Roboto-Regular-webfont.svg#RobotoRegular') format('svg'); βάρος γραμματοσειράς : κανονικό; στυλ γραμματοσειράς : κανονικό; } @font-face { font-family : 'Robot'; src: url('Roboto-Italic-webfont.eot'); src: url('Roboto-Italic-webfont.eot?#iefix') format('embedded-opentype'), url('Roboto-Italic-webfont.woff') format('woff'), url('Roboto- Italic-webfont.ttf') format('truetype'), url('Roboto-Italic-webfont.svg#RobotoItalic') format('svg'); βάρος γραμματοσειράς : κανονικό; στυλ γραμματοσειράς : πλάγια; } @font-face { font-family : 'Robot'; src: url('Roboto-Bold-webfont.eot'); src: url('Roboto-Bold-webfont.eot?#iefix') format('embedded-opentype'), url('Roboto-Bold-webfont.woff') format('woff'), url('Roboto- Bold-webfont.ttf') format('truetype'), url('Roboto-Bold-webfont.svg#RobotoBold') format('svg'); βάρος γραμματοσειράς : έντονη γραφή; στυλ γραμματοσειράς : κανονικό; } @font-face { font-family : 'Robot'; src: url('Roboto-BoldItalic-webfont.eot'); src: url('Roboto-BoldItalic-webfont.eot?#iefix') format('embedded-opentype'), url('Roboto-BoldItalic-webfont.woff') format('woff'), url('Roboto- BoldItalic-webfont.ttf') format('truetype'), url('Roboto-BoldItalic-webfont.svg#RobotoBoldItalic') format('svg'); βάρος γραμματοσειράς : έντονη γραφή; στυλ γραμματοσειράς : πλάγια; } @font-face { font-family : 'Robot'; src: url('Roboto-Thin-webfont.eot'); src: url('Roboto-Thin-webfont.eot?#iefix') format('embedded-opentype'), url('Roboto-Thin-webfont.woff') format('woff'), url('Roboto- Thin-webfont.ttf') format('truetype'), url('Roboto-Thin-webfont.svg#RobotoThin') format('svg'); βάρος γραμματοσειράς : 200; στυλ γραμματοσειράς : κανονικό; } @font-face { font-family : 'Robot'; src: url('Roboto-ThinItalic-webfont.eot'); src: url('Roboto-ThinItalic-webfont.eot?#iefix') format('embedded-opentype'), url('Roboto-ThinItalic-webfont.woff') format('woff'), url('Roboto- ThinItalic-webfont.ttf') μορφή ('truetype'), url ('Roboto-ThinItalic-webfont.svg#RobotoThinItalic') format('svg'); (με την άδεια λογισμικού Apache). βάρος γραμματοσειράς : 200; στυλ γραμματοσειράς : πλάγια; } @font-face { font-family: 'Ρομπότ'; src: url('Roboto-Light-webfont.eot'); src: url('Roboto-Light-webfont.eot?#iefix') format('embedded-opentype'), url('Roboto-Light-webfont.woff') format('woff'), url('Roboto- Light-webfont.ttf') format('truetype'), url('Roboto-Light-webfont.svg#RobotoLight') format('svg'); βάρος γραμματοσειράς : 100; στυλ γραμματοσειράς : κανονικό; } @font-face { font-family : 'Robot'; src: url('Roboto-LightItalic-webfont.eot'); src: url('Roboto-LightItalic-webfont.eot?#iefix') format('embedded-opentype'), url('Roboto-LightItalic-webfont.woff') format('woff'), url('Roboto- LightItalic-webfont.ttf') μορφή('truetype'), url('Roboto-LightItalic-webfont.svg#RobotoLightItalic') μορφή('svg'); βάρος γραμματοσειράς : 100; στυλ γραμματοσειράς : πλάγια; } @font-face { font-family : 'Robot'; src: url('Roboto-Medium-webfont.eot'); src: url('Roboto-Medium-webfont.eot?#iefix') format('embedded-opentype'), url('Roboto-Medium-webfont.woff') format('woff'), url('Roboto- Medium-webfont.ttf') format('truetype'), url('Roboto-Medium-webfont.svg#RobotoMedium') format('svg'); βάρος γραμματοσειράς : 300; στυλ γραμματοσειράς : κανονικό; } @font-face { font-family : 'Robot'; src: url('Roboto-MediumItalic-webfont.eot'); src: url('Roboto-MediumItalic-webfont.eot?#iefix') format('embedded-opentype'), url('Roboto-MediumItalic-webfont.woff') format('woff'), url('Roboto- MediumItalic-webfont.ttf') format('truetype'), url('Roboto-MediumItalic-webfont.svg#RobotoMediumItalic') format('svg'); βάρος γραμματοσειράς : 300; στυλ γραμματοσειράς : πλάγια;

Βεβαιωθείτε ότι έχετε αλλάξει το "src" στη διαδρομή του φακέλου γραμματοσειράς.

Στη συνέχεια, χρησιμοποιείτε την ακόλουθη σύνταξη για να εμφανίσετε τη γραμματοσειρά Roboto στον ιστότοπό σας:

font-family :"Robot";

Ελπίζω να μπορείτε να εγκαταστήσετε τις γραμματοσειρές που σας αρέσουν.

Δείτε περισσότερα:

• Ο ιστότοπος σάς βοηθά να διαχειριστείτε όλες τις γραμματοσειρές που είναι εγκατεστημένες στον υπολογιστή σας
• 5 ιστότοποι για να βρείτε και να κατεβάσετε δωρεάν γραμματοσειρές
• Οδηγίες για τη λήψη ενός τεράστιου δωρεάν συνόλου γραμματοσειρών από την Google, που υποστηρίζει βιετναμέζικα
• 8 εργαλεία για την «αναγνώριση» γραμματοσειρών που χρησιμοποιούνται σε εφαρμογές ή ιστότοπους