Concept notes

What changed, and why

A concept redesign of the helix.ceps.eu landing page: the same story, told better. Eight fixes, each backed by a fact from the site study.

  1. Before No h1, main or skip link on the page; the first line that says what Helix is sits below the hero as an h2.

    After The hero h1 says what Helix is, in the site's own words, above the fold.

  2. Before The three tools appear only as helix node labels and menu entries; only HERA gets a promo block.

    After A "Three tools" section names each tool, gives one sentence and a link.

  3. Before The helix is 22 CSS rotateX bars with 9–10 px labels (7 px on phone), no text alternative and no prefers-reduced-motion query.

    After Rebuilt on one canvas: readable labels on hover and focus, fifteen keyboard links, drag to turn, still when the OS asks for less motion.

  4. Before Contrast fails: teal on white 2.19:1, white on teal 2.23:1, the red "12" on teal 1.83:1, footer links 3.73:1.

    After Palette tuned; 38 colour pairs measured, every text pair at 4.5:1 or better.

  5. Before The Menu trigger is a div with an onClick, so it cannot be focused or opened from the keyboard; no h1, no skip link, no focus styles.

    After A real menu button on phones, one h1, a skip link and visible focus rings.

  6. Before The "Explore more" cards render empty summaries: the code reads content, a field none of the 196 API entries has (the field is abstract).

    After Summaries show, taken from abstract, as a snapshot dated on the page.

  7. Before About 4.5 MB over 41 requests, including a 1.6 MB photo shown in a 300 px circle.

    After Under 1.5 MB: one font file, three SVG logos, no photos.

  8. Before Two taglines — "EU global HEalth poLicy IndeX" on the page, "Health Legislation International X" on the share image — and three font families loaded (Montserrat, Geist, Geist Mono).

    After One tagline, one font family, one share image drawn from the same helix.

Palette: found beside tuned

Hex values are the ones in design.md. Left, the colour on helix.ceps.eu; right, the colour used here.

  • #171B4D#171B4Dnavy kept for text and buttons; hero moved one step deeper
  • #171B4D#111445hero ground, so the helix and the page navy differ
  • #72BAB7#46aeaateal fill for the hero button, dark text on it
  • #72BAB7#aae3e0lighter teal for nodes, links and focus on navy
  • #005854#005854deep teal kept, now used for links on light grounds only
  • #FAF7F5#FAF7F5warm off-white kept for text on navy and for cards
  • #FDFDFF#FDFDFFpage ground kept
  • #FFFFFF#FAF7F5pure white dropped; the warm off-white takes its place
  • #8A8CA6#5C5F82muted text darkened to 4.5:1 on paper; the old grey stays for icons and borders
  • #E5413E#E5413Ered kept for errors only; the quiz answer no longer uses it
  • #ECCAAB#f3ceadapricot brightened for the helix strand on navy
  • #ECCAAB#fbf2e9apricot tint as the quiz ground
  • #C4D8D8#d4d6e6slider rail joins the slate ramp
  • #213E5A#005854slider value label uses the link teal
  • #1D7164#1D7164CEPS green kept, inside the CEPS logo only

Concept by Luca Di Cunto, September 2026. Not affiliated with CEPS.

EU global HEalth poLicy IndeX

A platform dedicated to the intersection of the EU and global health.

Reports, data and interactive tools on the EU's role in global health, from a team of CEPS health policy experts and researchers in Brussels.

Three tools

Reports, data and interactive tools

With a rich repository of reports, data, and interactive tools, Helix provides unparalleled insights into how the EU is shaping global health responses.

Quiz

How many million Euros do you think HERA allocated to its international initiatives in its budget in 2025?

10 million

Reports

Explore more

The three latest reports on health security in the repository, as of 15 September 2026.