Skip to content

Logos : texte converti en tracés pour un rendu identique partout - #12

Merged
PhilippeVienne merged 1 commit into
mainfrom
feat/logos-traces
Sep 27, 2026
Merged

PhilippeVienne merged 1 commit into
mainfrom
feat/logos-traces

Conversation

@PhilippeVienne

Copy link
Copy Markdown
Contributor

Contexte

Chargé par <img>, un SVG n'a pas accès aux polices de la page. Le texte des logos (« OTSPI » et « OPEN TRUSTED SERVICE PROVIDER INITIATIVE », en Ubuntu Sans) était rendu avec la police installée sur le poste du visiteur (Ubuntu Sans, sinon Liberation Sans, sinon la police système) : largeur et graisse variaient d'un système à l'autre. C'est l'autre moitié du « léger décalage selon le renderer » corrigé en partie dans #6.

Changements

  • scripts/logos/ : sources des quatre logos, inchangées (texte SVG).
  • scripts/build_logos.py : génère assets/logo-horizontal*.svg et assets/logo-vertical*.svg en remplaçant chaque <text> par les tracés des glyphes. La police variable est instanciée à la graisse demandée, et le positionnement (crénage, letter-spacing, text-anchor) est calculé par HarfBuzz, un <tspan> à la fois comme dans Chrome.
  • Les logos générés portent role="img", aria-label et <title>.
  • README : section « Logos ».

Le kit presse, les images de partage (build_og.py) et la plaquette utilisent les mêmes fichiers et en profitent sans changement.

Vérifications

Comparaison au pixel près des sources (Chrome, avec Ubuntu Sans installée) et des logos générés, à l'échelle ×3 :

Logo Pixels différant de plus de 32 Écart max
horizontal 1 385 / 583 200 73
vertical 1 412 / 810 000 88
horizontal sombre 3 748 / 583 200 211 (bords des lettres, lissage du texte clair sur fond sombre)
vertical sombre 3 491 / 810 000 237 (idem)

Positions des lettres identiques au pixel près. Les écarts restants sont dus au lissage des bords : Chrome lisse différemment un texte et un tracé.

Chargé par <img>, un SVG n'a pas accès aux polices de la page : le texte
des logos (« OTSPI » et le sous-titre, en Ubuntu Sans) était rendu avec
la police installée sur le poste, Liberation Sans ou celle du système à
défaut, et changeait de largeur d'un navigateur à l'autre.

Les sources restent en texte dans scripts/logos/ ; scripts/build_logos.py
génère les logos de assets/ en convertissant chaque <text> en tracés,
positionnés par HarfBuzz segment par segment comme dans Chrome. Rendu
comparé au pixel près sur un poste disposant de la police : seuls les
bords des lettres diffèrent (lissage). Les logos portent un <title>.

Co-authored-by: Claude <noreply@anthropic.com>
@PhilippeVienne
PhilippeVienne merged commit 92ff706 into main Sep 27, 2026
2 checks passed
@PhilippeVienne
PhilippeVienne deleted the feat/logos-traces branch September 27, 2026 10:48
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant