15 Εργαλεία Τυπογραφίας Online Όλοι οι σχεδιαστές πρέπει να ξέρουν
Η τυπογραφία είναι το θεμέλιο κάθε σχεδίου, επειδή η ανάγνωση είναι ένα από τα πιο βασικά πράγματα που κάνουμε στο διαδίκτυο. Η τυπογραφία που επιλέγετε έχει επιπτώσεις σε πολλές πτυχές ενός ιστότοπου, συμπεριλαμβανομένων των την αναγνωσιμότητα, τη διάθεση και τη συνολική εμπειρία του χρήστη. Είναι απαραίτητο για τους σχεδιαστές και τους προγραμματιστές γνωρίζουν τις βασικές αρχές της τυπογραφίας προς το δημιουργήστε ευχάριστα σχέδια ευχάριστα.
Έχουμε μιλήσει για εργαλεία αντιστοίχισης γραμματοσειρών πριν και σήμερα πρόκειται να μοιραστούμε μαζί σας τα εργαλεία τύπου που μπορείτε να επιτύχετε μια καλύτερη εμπειρία ανάγνωσης στις ιστοσελίδες που σχεδιάζετε ή / και σχεδιάζετε.
Εδώ είναι τα plugins, τα ηλεκτρονικά εργαλεία και τα σενάρια που θα σας βοηθήσουν δημιουργήστε υπέροχα πρωτοσέλιδα και καθαρό, ευανάγνωστο κείμενο.
Πινακίδα τύπου
Δεν θα κάνει επιλογές σχεδιασμού για εσάς, αλλά θα καθορίσει τη σωστή σήμανση με στυλ για κοινά τυπογραφικά πρότυπα. Μπορεί επίσης να σας δώσει συμβουλές για το πώς να επεξεργαστείτε σωστά το κείμενο.
Ολοκλήρωση αγοράς: Επίδειξη | Απόδειξη με έγγραφα
Gutenberg
Το Gutenberg είναι ένα ευέλικτο και εύχρηστο τυπογραφικό κιτ εκκίνησης για προγραμματιστές και σχεδιαστές. Θα σας βοηθήσει να ορίσετε το μέγεθος του τύπου βάσης, το ύψος γραμμής και το μέγιστο πλάτος. Το Gutenberg είναι ένα έργο ανοιχτού κώδικα, οπότε μπορείτε να το συμβάλλετε, να το προσαρμόσετε και να το τροποποιήσετε.
Ολοκλήρωση αγοράς: Επίδειξη | Απόδειξη με έγγραφα
Lettering.js
Το Lettering.js είναι ένα plugin jQuery που σας δίνει τον έλεγχο του τύπου kerning. Σας δίνει τη δυνατότητα να αποκτήσετε συντακτικό σχεδιασμό με ευκολία και να διαχειριστείτε τον κώδικα. Ο ιστότοπος διαθέτει εκπληκτικά παραδείγματα τυπογραφίας που έγιναν με αυτό το plugin για έμπνευση.
Ολοκλήρωση αγοράς: Επίδειξη | Απόδειξη με έγγραφα
Typebase.css
Το Typebase.css είναι ένα προσαρμόσιμο φύλλο τυπογραφίας. Περιέχει τόσο saas όσο και λιγότερες εκδόσεις και τροποποιείται εύκολα σε σύγχρονα έργα web.
Ολοκλήρωση αγοράς: Επίδειξη | Απόδειξη με έγγραφα
FitText
Το FitText είναι ένα πρόσθετο που θα κάνει τα μεγέθη γραμματοσειρών της ιστοσελίδας σας ευέλικτα. Θα σας βοηθήσει να επιτύχετε κλιμακωτούς τίτλους για διάφορες αναλύσεις οθόνης. με άλλα λόγια, να κάνετε την τυπογραφική σας απόκριση. Είναι κατασκευασμένο για την εμφάνιση τεράστιου κειμένου μόνο.
Ολοκλήρωση αγοράς: Επίδειξη | Απόδειξη με έγγραφα
Kerning.js
Το Kerning.js σας βοηθάει να μετασχηματίσετε, να κλιμακώσετε και να τροποποιήσετε αυτόματα την τυπογραφία σας με το CSS. Είναι εύκολο να ξεκινήσετε με το Kerning.js.
Ολοκλήρωση αγοράς: Επίδειξη | Απόδειξη με έγγραφα
Typesettings.css
Το typesettings.css είναι η παιδική χαρά σας για τη δημιουργία μινιμαλιστικών σχεδίων ιστού ή blogs. Όλα τα τυπογραφικά στυλ που χρησιμοποιούνται εδώ είναι εμπνευσμένα από τα βασικά γραφικά.
Ολοκλήρωση αγοράς: Επίδειξη | Απόδειξη με έγγραφα
Σακίδιο
Με το Rucksack μπορείτε να παράγετε εκπληκτική τυπογραφία υγρών χάρη σε μια νέα, ανταποκρινόμενη ιδιότητα στο μέγεθος της γραμματοσειράς. Η δημιουργία απαντητικής τυπογραφίας γίνεται εξαιρετικά εύκολη.
Ολοκλήρωση αγοράς: Επίδειξη | Απόδειξη με έγγραφα
FlowType.JS
Η πιο ευανάγνωστη τυπογραφία περιέχει μεταξύ 45 και 75 χαρακτήρες ανά γραμμή, αλλά για να βρεθεί ότι η ισορροπία είναι ένα δύσκολο έργο για τους προγραμματιστές. Το FlowType.JS αλλάζει το μέγεθος της γραμματοσειράς και στη συνέχεια το ύψος της γραμμής με βάση το πλάτος συγκεκριμένου στοιχείου.
Ολοκλήρωση αγοράς: Επίδειξη | Απόδειξη με έγγραφα
Blast.js
Το Blast.js θα σας βοηθήσει να διαχωρίσετε κείμενα για να διευκολύνετε τον χειρισμό της τυπογραφίας. Περιέχει 4 ενσωματωμένους οριοθέτες: χαρακτήρα, λέξη, πρόταση και στοιχείο. Μπορεί επίσης να ταιριάζει με προσαρμοσμένες εκφράσεις και φράσεις.
Ολοκλήρωση αγοράς: Επίδειξη | Απόδειξη με έγγραφα
slabText
Το slabText είναι ένα απλό σενάριο που χωρίζει τους τίτλους σε σειρές για να γεμίσει τέλεια τον διαθέσιμο οριζόντιο χώρο. Η δέσμη ενεργειών υπολογίζει έναν ιδανικό αριθμό χαρακτήρων που θα οριστεί σε κάθε σειρά διαιρώντας το διαθέσιμο πλάτος κατά μέγεθος γραμματοσειράς pixel.
Ολοκλήρωση αγοράς: Επίδειξη | Απόδειξη με έγγραφα
Πληκτρολογήστε κλίμακα
Με την Κλίμακα Τύπου μπορείτε να κάνετε προεπισκόπηση και να επιλέξετε την κλίμακα σωστού τύπου για το έργο σας. Δεν υπάρχουν κανόνες - παίζετε μόνο με μέγεθος γραμματοσειράς, κλίμακα και διαφορετικές γραμματοσειρές web.
Ολοκλήρωση αγοράς: Επίδειξη | Απόδειξη με έγγραφα
Τυπογραφικός
Το τυπογραφικό σάς βοηθά να κάνετε την τυπογραφική απόκριση. Το μόνο που χρειάζεται να κάνετε είναι απλά να επιλέξετε μερικές γραμματοσειρές, να ορίσετε μερικές ρυθμίσεις και θα πάρετε ωραία ανταποκρινόμενη τυπογραφία.
Ολοκλήρωση αγοράς: Επίδειξη | Απόδειξη με έγγραφα
Τύπο
Το Typi είναι ένα μίγμα saas που μπορείτε να χρησιμοποιήσετε για να κάνετε ευχάριστη τυπογραφία με ευκολία. Δημιουργεί μέγεθος γραμματοσειράς και ύψη γραμμής για HTML και άλλα στοιχεία. Επίσης, ο Typi έχει μια λειτουργία κάθετου ρυθμού για να υπολογίσει τα ύψη των γραμμών.
Ολοκλήρωση αγοράς: Τεκμηρίωση
Lining.js
Με το plugin Lining.js, θα έχετε πλήρη έλεγχο της τυπογραφίας του ιστού. Υποστηρίζεται από τα πιο δημοφιλή προγράμματα περιήγησης όπως το Safari, το Google Chrome, το Opera και το Mozilla Firefox.
Ολοκλήρωση αγοράς: Επίδειξη | Απόδειξη με έγγραφα
Μπόνους: 2 Περισσότερα εργαλεία!
Κατάσταση του τύπου ιστού
Η κατάσταση του τύπου ιστού είναι ένας ιστότοπος που παρέχει ενημερωμένα δεδομένα σχετικά με την υποστήριξη για τον τύπο και τις δυνατότητες του ιστού. Μπορείτε να χρησιμοποιήσετε την αναζήτηση ή τις κατηγορίες, όπως η διεύρυνση κεφαλών, η απόσταση μεταξύ κεφαλαίων, η φόρτωση γραμματοσειρών CSS και πολλά άλλα για να βρείτε ακριβώς αυτό που χρειάζεστε.
Τύπος
Το τυπογραφικό είναι ένα τρομερό plugin ιστού και σκίτσου το οποίο σας επιτρέπει να τοποθετήσετε μη διαχωριστικά κενά μετά από λέξεις ενός γράμματος, συνδέστε τον αριθμό και τη μονάδα. Αφαιρεί επίσης διπλούς χώρους, εισάγει, κουκκίδες και άλλα τυπογραφικά λάθη, ώστε να μπορείτε να επιτύχετε καθαρή όμορφη τυπογραφία που είναι εύκολη στην ανάγνωση.
Ολοκλήρωση αγοράς: Τεκμηρίωση
