Ouvrir le menu principal

MacGeneration

Recherche

Astuce : faire en sorte que son site s'accorde avec la « Taille du texte » d’iOS et iPadOS

Félix Cattafesta

lundi 08 juillet 2024 à 12:30 • 7

macOS

Apple permet de changer la taille de la police système sur iOS et iPadOS, ce qui est bien pratique mais assez inconstant. Cela ne change rien sur la plupart des sites web par exemple, à moins que les développeurs aient fait en sorte de prendre en charge la fonction. Craig Hockenberry a récemment sauté le pas et mis à jour son blog pour le rendre compatible avec « Dynamic Type », une fonction de WebKit présente depuis des années. Sa prise en charge peut se faire avec quelques lignes de CSS.

Le code peut ressembler à cela :

html {
	font-size: 0.9em;
	font: -apple-system-body;
	font-family: "Avenir Next", "Helvetica Neue", sans-serif;
}

Ici, il a ajouté la ligne font: -apple-system-body; qui va remplacer la taille de la police définie dans la ligne au-dessus. Malheureusement, cet élément impose également la police système qui ne sera pas forcément au goût de tout le monde. C’est ici qu’intervient font-family, qui permet d’adapter la famille de la police au système sans toucher au style choisi par le designer.

C’est une petite astuce qui permet de rendre un site plus accessible. Craig Hockenberry déplore cependant le fait que la fonction ne soit pas disponible sur macOS et que la taille de la police ne soit pas fixe. Les explications détaillées sont données sur son blog pour les curieux.

Rejoignez le Club iGen

Soutenez le travail d'une rédaction indépendante.

Rejoignez la plus grande communauté Apple francophone !

S'abonner

À contre-courant : pourquoi Félix pense que le Mac est une bonne machine de jeu

02/08/2025 à 10:00

• 26


Tim Cook revient sur l’IA, Siri et les futurs produits devant les employés de l’Apple Park

02/08/2025 à 07:52

• 79


Pourquoi une IA devient malsaine, et comment y remédier ? Anthropic invente le psy pour IA

01/08/2025 à 22:15

• 46


OpenAI a laissé Google indexer des conversations, avant de vite faire machine arrière

01/08/2025 à 21:30

• 17


Redonnez vie à vos vidéos : Aiarty Video Enhancer débarque sur Mac et Windows (et c’est bluffant) 📍

01/08/2025 à 20:33

• 0


Fin de partie pour Windows 11 SE, l’équivalent à Chrome OS de Microsoft

01/08/2025 à 16:11

• 23


Tim Cook a été plus longtemps à la tête d'Apple que Steve Jobs

01/08/2025 à 15:23

• 38


Quatre ans après macOS, Adobe Premiere Pro et After Effects arrivent en bêta pour les PC Windows ARM

01/08/2025 à 13:15

• 15


Promo : l’iPhone 15 Plus à 789 €, une bonne affaire (-19 %)

01/08/2025 à 11:53

• 10


OpenAI lance un nouveau mode plus pédagogique pour ChatGPT à destination des étudiants

01/08/2025 à 11:05

• 4


Linus Torvalds a visiblement abandonné son MacBook Air M2

01/08/2025 à 10:35

• 24


Zuckerberg : « le développement d’une superintelligence est à portée de main »

01/08/2025 à 09:10

• 52


3 milliards d’iPhone écoulés depuis 2007 : le produit high-tech le plus vendu de l’histoire ?

01/08/2025 à 07:22

• 36


Promo : la station d'accueil Ugreen pour le Mac mini M4 à 70 € (-30 €)

31/07/2025 à 23:38

• 14


Résultats T3 25 : et la guerre commerciale profita à Apple !

31/07/2025 à 23:00

• 48


Ollama propose une nouvelle app pour le Mac qui permet de se passer entièrement du terminal

31/07/2025 à 20:05

• 20