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

Avec GPT-4o, le puissant outil de génération d’images de ChatGPT s'améliore 🆕

09:20

• 58


Control est maintenant disponible sur le Mac App Store (et bientôt Steam) pour 40 € 🆕

07:48

• 29


Plongez au cœur de l’actualité Apple et bien plus encore grâce au Club iGen

26/03/2025 à 23:55

• 19


La bourde Signal, ou quand les principes de base ne sont pas respectés

26/03/2025 à 23:00

• 24


Kernel Panic : Antennagate, Siri… Comment Apple gère-t-elle ses crises ?

26/03/2025 à 18:55

• 4


Les Porsche de 2026 n’auront pas droit au nouveau CarPlay

26/03/2025 à 17:00

• 40


Vos données personnelles sont revendues en ligne : voici comment les faire disparaître 📍

26/03/2025 à 16:09


Le Mac mini M4 à 589 € de retour sur le refurb

26/03/2025 à 13:38

• 26


Apple commanderait à Nvidia pour 1 milliard en serveurs pour l'IA

26/03/2025 à 10:30

• 42


Une lueur d'espoir pour l'arrivée de Recopie de l'iPhone en France ?

26/03/2025 à 09:34

• 47


Que faut-il deviner dans les visuels de la WWDC 2025 ?

25/03/2025 à 20:46

• 71


La WWDC 2025 se tiendra du 9 au 13 juin 2025

25/03/2025 à 18:16

• 27


Promos du printemps : des chargeurs Qi2, des hubs Thunderbolt ou des pavés numériques Bluetooth chez Satechi

25/03/2025 à 17:30

• 8


Bouygues Telecom abandonne le Wi-Fi 5

25/03/2025 à 17:00

• 24


Promos du printemps : quelques réductions sur des SSD externes, jusqu'à 4 To

25/03/2025 à 14:45

• 28


Carte cadeau Apple : 10 € retournés sur son compte Amazon pour une carte à 100 €

25/03/2025 à 13:30

• 13