Un outil pour convertir des polices d'écriture en différents formats (dont WOFF et WOFF2) et qui génère le code CSS pour les inclure facilement dans vos projets.
Une police d'écriture conçue spécifiquement pour les personnes malvoyantes. Visuellement elle n'est pas vilaine en plus.
Via https://korben.info/luciole-police-caracteres-accessible-malvoyants.html
Une police d'écriture variable. Un seul fichier woff2 et pas mal de variations possibles.
Une police d'écriture à graisse variable, gratuite et garantie sans serif 🙃
Au passage, j'adore l'effet produit par le header de la page. Ce n'est pas une vidéo contrairement à ce qu'on pourrait croire, c'est juste une image au dessus de laquelle l'auteur à ajouté un filtre SVG qui donne cette impression de vagues qui bougent. C'est brillant.
Une collection de packages npm qui permettent d'ajouter de nouvelles polices d'écriture à vos applications web sans vous prendre la tête.
C'est aussi simple que :
npm install --save @fontsource/open-sans
puis dans votre index.js
:
import '@fontsource/open-sans/400.css';
Une alternative a priori privacy-safe (pas de tracking, pas de logging) à Google Fonts. Il suffit de changer le nom de domaine dans le script à ajouter à vos pages. Le reste de l'URL reste identique à celle de Google.
Des polices d'écriture libres.
Via https://sebsauvage.net/links/?aCjhvw
Un super outil pour manipuler les icon-fonts (par exemple en extraire les glyphes en SVG) et vice-versa.
Using IcoMoon you can easily search and download vector icons or generate fonts (icon fonts). This tool can also be used for icon set management. It can generate icon fonts, SVGs, PDFs, PNGs and sprites.
Des alternatives gratuites à des polices d'écriture payantes bien connues.
Plein de super polices d'écriture gratuites !
Convertir un fichier de police de caractères dans d'autres format (dont SVG !).
Via: https://www.lambdatest.com/blog/its-2019-lets-end-the-debate-on-icon-fonts-vs-svg-icons/
A strong, neutral typeface for text or display.
Des polices d'écritures populaires.
J'avais parlé de cette propriété il y a un peu plus d'un an. Elle permet de déterminer comment le navigateur doit charger les polices et quoi afficher pendant le chargement.
Styliser votre texte en utilisant des caractères unicode. Pratique pour que votre pseudo Twitter se distingue un peu des autres par exemple :)
Une nouvelle police très sympa créée par l'INRIA.
Une police géométrique sans serif assez sexy :)
Un fork de Font Awesome par des gens qui ne sont pas totalement en accord avec la direction prise par ce dernier dans sa version 5.
Des plugins de post-processing CSS pour éviter les problèmes liés au chargement des webfonts (par exemple le texte qui est invisible tant que la font n'a pas été chargée).
L'idée est d'appliquer une classe à l’élément <html>
via Javascript seulement une fois que la page est chargée. Et c'est cette classe qui déclenchera le téléchargement des webfonts. Le faire à la main nécessite pas mal d'organisation. Ces plugins rendent ça transparent.
Plein de packs d'icônes sous licence libre.
La propriété font-display
(pour laquelle on devrait plutôt parler de "descripteur pour font-face" comme mentionné dans l'article) permet d'indiquer au browser quoi afficher le temps qu'il télécharge les webfonts de la page.
Une font très lisible pour interface graphique.
Un très bon article très détaillé sur l'optimisation des polices web. Il y notamment l'attribut rel="preload"
qui peut offrir d'excellents résultats et qui est très simple à ajouter.
Un outil pour uploaded une police d'écriture et en générer version optimisée pour le web.
De chouettes inspirations en terme de mariage de polices d'écriture.
Télécharger les Google Web Fonts.
Via http://sebsauvage.net/links/?3qLwEQ
Merci Seb !
Des polices d'écriture pour développeur.
Moult polices d'écriture monospace pour coder.
Une bonne pratique : pour éviter le téléchargement inutiles de polices, essayer de trouver les polices natives qui ressemblent le plus à ce que vous cherchez.
Un site qui permet de vérifier quelles polices d'écriture sont dispo sur chaque système et quelle police sera utilisée si celle que vous spécifiez n'est pas incluse.
Un article intéressant sur les polices d'écriture.
Un article intéressant qui remet en question l'adoption de l'unité "em" ou "rem" partout.
Une police d'écriture qui contient les icônes Material Design, fournie par Google. Le tout est assez bien documenté.
Plein de ressources pour designers et intégrateurs.
Via https://blog.stephaniewalter.fr/la-semaine-en-pixels-13-mai-2016/
Une nouvelle police d'écriture pour développeurs. Elle a l'air plutôt propre et semble être parfaitement utilisable sur les appareils à faible résolution.
Des fonts gratuites :)
Générer une iconfont custom à partir des icônes que vous voulez.
Un moyen de voir et tester différentes fonts pour codeur.
Toutes les Google Fonts sont dispo dans un unique fichier zip ici : https://github.com/google/fonts/archive/master.zip
Un gestionnaire de polices d'écriture pour Windows.
Via http://www.creativejuiz.fr/blog/ressources-telechargements/les-ressources-du-web-21
Un bon point à savoir pour récupérer prioritairement les polices depuis l'appareil de l'utilisateur si elles sont déjà installées, avant de décider de les télécharger.
Comment voir la majorité des emojis sous Linux.
L'une des polices d'écriture très utilisée dans GTA. Je me note ça au cas où ça puisse me servir.
Des alternatives libres à pas mal de polices d'écriture communément utilisées. Finalement il y en a beaucoup que je ne connaissais pas et qui sont très sympa.
Les différentes fonts intégrées à Android et le moyen de les utiliser.
Pour mémo :
android:fontFamily="sans-serif" // roboto regular
android:fontFamily="sans-serif-light" // roboto light
android:fontFamily="sans-serif-condensed" // roboto condensed
android:fontFamily="sans-serif-thin" // roboto thin (android 4.2)
in combination with
android:textStyle="normal|bold|italic"
this 12 variants are possible:
Regular
Italic
Bold
Bold-italic
Light
Light-italic
Thin
Thin-italic
Condensed regular
Condensed italic
Condensed bold
Condensed bold-italic
Tout est dans le titre :)
Un outil pour récupérer automatiquement les webfonts de Google en local.
via : http://sebsauvage.net/links/?Uu1VQQ