v1.11.0 — Directory filters, mentorship, and a smoother mobile directory
This is the big pre-conference directory release, gathering everything merged since v1.10.0. Visitors can now narrow The Network by research theme, by research region and by mentorship, and the mobile filter experience that drives those choices was rebuilt so it behaves properly on a phone. Around it sit lighter photos, new ways to reach the Action, and the usual housekeeping. Three themes follow, then a single canonical index at the bottom.
Finding people by what they work on
The directory's filter used to turn on free-text keywords, which almost never matched between members, so the chip row rarely clustered anyone. Two curated facets replace that. Research themes group each member's keywords into a small set of broad areas (foreign policy and diplomacy, security and defence, economic security and geoeconomics, intelligence, information and influence, and so on, modelled on how peer bodies such as the EU Institute for Security Studies organise the field). Research regions add a second, geographic axis (Europe and its neighbourhoods, the Middle East and North Africa, Africa, Asia, the Americas, and global or cross-regional work). The two axes combine, so "cyber and Russia" is a single query. Member cards still show each person's own keyword pills. Clicking one selects its theme, and exact-keyword lookup stays in the search box.
A third facet, mentorship, lets a member flag in the join form that they are available to mentor early-career researchers or are looking for a mentor. It shows as a badge on the card and as a filter beside the themes and regions. All three facets stay hidden until at least one member opts in, so nothing appears before the form question is live. Theme and region names are hand-translated for FR and DE.
A mobile filter experience built to last
On phones the filters now open in a bottom sheet instead of filling the screen with controls before the member list. Getting that sheet to behave on iOS turned into a small saga, and this release settles it: the sheet is a native <dialog> opened with showModal(), which renders in the browser top layer and is therefore out of reach of the containing-block, scroll and soft-keyboard quirks that used to strand a position:fixed sheet in the middle of the page. It pins to the bottom on both iOS Safari and Chrome, keeps its Apply button above the Safari toolbar (dvh), dismisses on the first tap, and closes without the half-second lag that the backdrop blur and the scroll-lock used to cost on Safari. It also brings a native focus trap and Escape-to-close. Desktop is untouched: the same controls render inline in the toolbar.
Around the site
Beyond the directory, the footer now links the Action's LinkedIn and Bluesky, every shared page carries a hand-designed social card (the directory gets its own), and headshots serve a WebP first, so photos download at roughly half the bytes with no visible change. The directory wears an Early Access Preview banner inviting contributions, the About-page deliverables timeline shows what has shipped rather than only what is planned, and each Working Group now lists the COST deliverables it leads alongside its related publications. A new FAQ entry is honest about why the bio intake runs on a Google Form.
Index of changes
Added
- New FAQ entry (all three locales) explaining why the directory intake runs on a Google Form rather than an open-source or European tool. It is honest about the trade-off (the tool is neither European nor open-source, and the sign-in asks something of researchers who would rather not hand Google a login) while laying out the practical reasons (spam barrier, an edit link, photo upload, and a spreadsheet the weekly sync reads with no server to run), and it points anyone who would rather not use the form to the contact form, noting the hand-entry delay.
- The directory's research-interest filter now clusters members by broad research theme instead of by individual keyword, in all three locales. Free-text keywords fragment (almost every one is unique, so a per-keyword filter rarely groups anyone), so a curated set of eight themes (Foreign policy and diplomacy, Security and defence, Economic security and geoeconomics, Intelligence, information and influence, and so on, modelled on how peer bodies such as the EU Institute for Security Studies organise the field) groups related work so people in the same area surface together. Member cards still show each person's specific keyword pills. Clicking a pill now selects that keyword's theme, and exact-keyword lookup stays available through the search box. The theme chips, their counts, and the URL hash (
#themes=…) all follow, and theme names are hand-translated for FR and DE. - The directory (
/people.html, all three locales) gains a second, geographic filter axis: research regions. Alongside the topical themes, a visitor can now narrow to people who work on a region (Europe, Europe - Western Balkans, Europe - Eastern neighbours / Russia, Middle East and North Africa, Africa, Asia, The Americas, or Global and cross-regional), and the two axes combine, so "cyber and Russia" is one query. Member cards carry their regions as clickable pills, and selecting one filters the grid. The eight-region vocabulary follows the EU Institute for Security Studies' lean regional taxonomy, kept short on purpose so members cluster rather than fragment. Like the mentorship facet, the region row stays hidden until at least one member opts in through a new optional form question, so nothing appears while the question is still being added. Region names are hand-translated for FR and DE. (Closes #555.) - A second promotional poster on the press kit: a directory poster that invites scholars to add their bio, with the headline question, a QR code to the add-your-bio form, and the three reasons to join (be findable, connect across borders, mentor and be mentored). The press kit's poster section now holds both the general poster and the directory poster, each downloadable as a print file and a small preview, in all three locales. The directory poster ships as a print-ready PDF (vector) plus PNG renders.
- Directory and ESSC headshots now serve a WebP first, with the original JPEG or PNG kept as the fallback for browsers that need it, so photos download at roughly half the bytes with no visible change. The sync writes a
.webpnext to each headshot (both committed to the repository), and every place a photo appears (the directory cards, the ESSC speaker popovers, the About and Working Group leadership avatars) now wraps it in a<picture>element so the browser picks the format it supports. (Closes #269.) - Shipped releases on the public roadmap now show how many tracked issues they closed, beside the release-notes link (a small "N tasks done" with a check mark). It reads the same per-milestone data the in-flight progress bars already use, and derives each card's version from its release-notes link, so every shipped release gets the tally with no per-card markup. The count is shown from v1.8.1 onward, the first release with full milestone tagging. Earlier releases used milestones too lightly for the figure to be representative, so they omit it.
- The directory (
/people.html, all three locales) can now surface mentorship. A member who offers mentoring shows a green Available to mentor badge on their card, and one looking for a mentor shows a Seeking mentorship badge. A new Mentorship filter sits alongside the Working Group and country filters, letting visitors narrow the directory to people offering or seeking mentorship. The badge and filter stay invisible until at least one member opts in through the form, so nothing appears while the question is still being added. (Tracked in #498.) - New hand-designed social cards (the image that appears when a page is shared on LinkedIn, Bluesky, or anywhere reading Open Graph tags). The directory (
/people.html, all locales) gets its own card showing the searchable directory, and every other page uses a refreshed general card.inject-seo.pypicks the right one per page, and the brand-asset script no longer regenerates the old auto-composed card over the top. - The site footer now links the Action's two social channels, in every page and locale: LinkedIn (
costnetsec) and Bluesky (netsec-cost.eu), alongside the existing repository link. They sit as small circular icon buttons in the footer's social row, the same place the placeholder links lived, so they stay out of the way of page content. The unused X / Twitter placeholder is gone. Both channels are also declared as the organisation'ssameAsprofiles in the home-page structured data, which helps search engines connect the site to the accounts. - The directory (
/people.html) now carries an Early Access Preview banner at the top, in all three locales, inviting visitors to contribute. The "adding your bio" link jumps straight to the join card at the foot of the page. The banner uses the same accent-gradient language as the What's New banner but sits in the page rather than as a dismissible top bar. - The About-page deliverables timeline now shows which deliverables have shipped, not only what is planned, in all three locales. A shipped milestone gains a check mark, and one delivered ahead of plan shows in green with a faded marker left at its originally planned month and a dotted lead-line between the two. The first to land is the NetSec directory (D1). Each status carries a screen-reader description, so the meaning never rests on colour alone.
- Gave each Working Group on
/working-groups.htmltwo more sections, in all three locales: a Working towards list of the COST deliverables that group leads (with target months, each row linking to its entry in the About-page deliverables timeline) and a Related publications section. Publications are tagged by Working Group in a newdata/publications.jsonand surface automatically as outputs land. Until the first ones arrive (October 2026), each group shows a short placeholder linking to the Publications page.
Changed
- Reworked the directory's filter card into two clear tiers, in all three locales. The primary row pairs the search box with a now-labelled Working-Group facet, and below a divider the mentorship, research-theme and research-region facets form a consistent second tier (mentorship moved down to join the themes and regions instead of floating between the rows). On desktop the applied filters now appear as a row of removable chips below the card, mirroring the mobile pattern, so the current selection and the per-filter remove sit together with the result count and the global Clear all.
- The directory's "Clear all filters" control now reads as an actionable link (a soft underline) when filters are active, rather than as static text.
- The directory's research-themes filter now carries a one-line explanation under its heading, in all three locales: themes automatically group people working in the same area based on their individual keywords, which stay visible on each card. It removes the apparent mismatch between the broad theme chips and the specific keyword pills on the cards.
- Tidied the directory's research-interest keywords. A standalone
&in a keyword now reads as "and" (R&D and other acronyms are left intact), and two phrase-like entries were curated into tighter tags: Policy evaluation & lessons learned (Afghanistan) became Policy evaluation, and Germany security policy became the grammatical German security policy. The sync now also flags over-long or parenthetical keywords so they get curated rather than shipped as one-off tags. - The directory's Join-the-Network card (and the matching guided-tour step) now say the bio form takes about 3 minutes rather than 5, in all three locales, to better reflect how long it actually takes.
- The directory's "First time here?" orientation card now includes the mentorship dimension, in all three locales: a new tip explains that a member's card can carry an Available to mentor or Seeking mentorship badge once they opt in, and that the directory can be filtered to either.
- The homepage event and news cards are now clickable across their whole surface, not just on the small link at the foot, matching how the homepage Working-Group cards already behave. (Grant cards keep their single prominent Apply button, since they are large and a whole-card target there would be easy to mis-click.) The card's existing link stays the one real link (so a screen reader still announces "View live programme", not the whole paragraph, and middle-click or open-in-new-tab keep working). A transparent overlay simply extends its hit area over the card. Cards that have no destination, or that already do something on click (the directory cards that expand, the conference speaker cards that open a profile), are deliberately left alone, and only cards that lead somewhere get the hover lift.
- Refreshed the promotional poster on the press kit with the new design: an eight-feature layout, the directory's running numbers, a searchable-directory mock, the four Working Groups with their leads, and the COST / EU funding strip at the foot. The source HTML, the print PNG, and the card PNG are all regenerated, and the download-size labels follow in all three locales.
- Clarified in the FAQ (all three locales) that the confirmation-email edit link can change text fields but cannot replace your photo, so a fresh form submission is the way to swap a headshot.
- Refreshed the accessibility statement (EN, FR, DE) to v1.3 for the 2 June 2026 re-assessment. It records the broader all-pages re-confirmation of WCAG 2.1 AA, corrects the now-resolved render-blocking-font note (the fonts are self-hosted), and bumps the version footer.
- Tagged three more events with their Working Groups, so they now show under the relevant sections on
/working-groups.htmland carry WG pills on the home Events cards: the NetSec ITC Conference (WG2, WG4), the MC Plenary (WG1) and the NetSec Policy Workshop (WG2). - Swept prose semicolons out of every page in all three locales, rewriting them as full stops or commas to follow the house voice rules. The one semicolon in the ITC Conference calendar description got the same treatment.
- The public roadmap now shows only the most recent shipped release by default and tucks the earlier ones behind a "Show N earlier releases" toggle, so the shipped history no longer dominates the page as it grows. With JavaScript off, the full list stays visible.
- The roadmap's In progress dot now carries a steady accent halo for visitors who have reduced motion turned on, so the status still reads as live without the blink that reduced motion correctly suppresses.
- The directory got a filter rework, in all three locales. The research-themes and research-regions facets each became a compact collapsible row in the filter card (chevron, collapsed by default, opening automatically when a theme or region is selected from a card or a deep-link), while the mentorship row stays inline. The whole filter card was tightened so it leads with people rather than filter chrome. The result count ("N / M members") sits beside the "directory last updated" date just above the grid, after all the filters, with a global "Clear all filters" button on the right that stays in place, muted until a filter is active, so the number reflects what is on screen. The density toggle, guided tour and add-your-bio buttons live in a pinned bar at the corner of the directory, so they stay reachable while scrolling. The Working-Group, MC-members and country controls read with more contrast in light mode, as does the search box, whose placeholder is shortened so it no longer visually truncates. The research-regions heading carries a one-line note that it means where a member focuses their research, not where they are based. The guided-tour engine now scrolls each step into view, so the tour works correctly even when launched from the pinned tools bar after scrolling down, and its filter step covers both research themes and regions.
- On phones the directory filters now open in a bottom sheet, following the standard mobile pattern, so the member list leads instead of a screen of filter chrome. The toolbar collapses to a search field plus a Filters button badged with the number of active filters. Tapping it slides up a sheet holding the working-group, research-theme, research-region and mentorship controls, with a Reset and a primary button that shows the live count ("Show N members") and closes the sheet. Active filters appear as a row of removable chips under the search, and the density toggle (which does nothing on a single-column grid) is hidden. The desktop layout is unchanged. All three locales.
- Dropped the directory's country dropdown (the free-text search already matches country) and moved the mentorship filter up into its place in the primary toolbar row, rendered inline rather than as a tinted band. The research-themes and research-regions facets now sit on their own below a divider, and the gap above them was trimmed. All three locales.
- The directory's card density now follows the viewport with a desktop opt-out. Phones always use compact cards (a single column of full photo-and-bio cards ran too long to scroll past), while desktop defaults to detailed but keeps a density toggle in the pinned tools bar, and the choice persists in the browser. The toggle is hidden on phones, where the single-column grid makes it meaningless. All three locales.
- The directory's mentorship filter dropped its redundant "All" chip. "Available to mentor" and "Seeking mentorship" are now toggle chips, the same as the research-theme and research-region rows: tap to apply, tap again to clear, and select both to see everyone who has opted into mentoring either way. Neither selected means no mentorship filter, which is what "All" stood for. The global "Clear all filters" button and the removable filter chips still reset it. All three locales.
- Tightened the space above the directory's Early Access Preview banner on desktop and phones, and shortened the banner wording on phones so it sits on a couple of lines rather than filling the card. All three locales.
Fixed
- Made closing the mobile filter sheet markedly snappier on iOS Safari, where it had lagged behind Chrome. Two costs were removed from the close path: the dialog's
::backdropcarried abackdrop-filter: blur, and blurring a full viewport of the directory grid is GPU-expensive on iOS Safari (the 50% dim alone now carries the modal weight, the blur was imperceptible under it). The other was the page scroll-lock togglinghtml { overflow: hidden }, which on iOS Safari forces a reflow and scroll reconciliation on release (the modal dialog's own inertness, the backdrop'stouch-action: noneand the sheet'soverscroll-behavior: containhold back the background scroll without it). - Tightened a few directory overlay edges on phones, all three locales. Starting the guided tour while the filter sheet is open now closes the sheet first (the tour overlay would otherwise mount behind the top-layer modal). Pressing Escape with the tour open over an expanded card now closes only the tour and leaves the card open, rather than both reacting to one keypress. And the sheet is closed on
pagehide, so a back-forward-cache restore can no longer bring back a scroll-locked page sitting under a stranded open sheet. - Dismissing the mobile filter sheet now responds to the first tap. Tapping the dimmed background read as a scroll gesture (the dialog's
::backdropcarried the defaulttouch-action), so the slightest finger drift swallowed the tap and it took two or three tries. The backdrop now setstouch-action:noneso a tap lands immediately. The close (×) button's hit target also grew from 36px to the 44px minimum, since at 36px it sat right at the backdrop edge and a slightly-high tap missed it. Both apply on iOS Safari and Chrome. - The mobile directory filter sheet is now a native
<dialog>opened withshowModal, which fixes the sheet rendering mid-page on iOS Safari (most visible after a search, when the soft keyboard had been up). A modal dialog renders in the browser top layer, positioned against the viewport, so it is immune to the toolbar's containing block, to page scroll, and to the keyboard viewport offset that previously stranded theposition:fixedsheet over the cards with the background bleeding through. The dialog also brings a native focus trap, Escape-to-close and a::backdropdim, replacing the hand-rolledinert, move-to-body and scroll-lock code. On desktop the same element staysdisplay:contentsand the filters render inline as before. All three locales. - Directory filter chips and the compact-card chevron no longer keep their hover styling stuck after a tap on iOS WebKit. The hover rules (the working-group, research-theme, research-region and active-filter chips, and the compact-card chevron emphasis) are now gated behind
@media (hover: hover), so they apply only to real pointers. A touch leaves no lingering highlight, while the desktop hover feel is unchanged. - The mobile directory filter sheet now keeps its footer and Apply button above the browser toolbar on iOS Safari. The sheet's height cap was
85vh, and iOS resolvesvhagainst the large viewport (toolbar hidden), so once the Safari toolbar was showing the bottom of the sheet sat behind it and the primary button could be unreachable. The cap is now85dvh(the dynamic viewport, which tracks the toolbar), withvhkept first as a fallback for engines withoutdvh. All three locales. - Removing a directory filter from the active-filter chip row now keeps keyboard and VoiceOver focus in a sensible place instead of dropping it to the page top. After a chip's remove button rebuilds the row, focus moves to the chip that took its place (or the last one), and to the Filters button when the row empties. All three locales.
- Directory taps feel immediate on phones. The interactive filter controls and compact cards now carry
touch-action:manipulation, which drops the iOS double-tap-zoom wait (a ~300ms delay that read as a sticky tap), and a transparent tap highlight removes the grey press-flash. Panning still works over a chip or card, so scrolling is unaffected. - The directory's active-filter chip for a research region showed the raw URL slug (e.g. "eastern-europe") instead of the region's display name. It now resolves the slug back to the proper name like the research-theme chips already did. All three locales.
- The directory's result line no longer leaves a stray middot at the start of a wrapped line on narrow screens. The count and the "directory last updated" date now stack on phones instead of wrapping inline with the separator orphaned.
- The directory's filter controls now meet the contrast bar in dark mode. The unselected Working-Group and mentorship chips, and the collapsed research-theme and research-region rows, carried borders too faint to see against the dark card (a 10% white edge). Their boundaries are lifted to a visible level so each reads as a control. The selectable chip borders in light mode were nudged up to the same bar.
- The directory's guided tour now adapts to the viewport. On phones the filters live in a bottom sheet that is closed at tour time, so the steps pointing at each in-sheet facet were spotlighting an off-screen rectangle. The mobile tour now has a single step pointing at the Filters button that opens the sheet, while the desktop tour keeps a step per facet (and regains its card-density step). All three locales.
- The directory's "First time here?" orientation card no longer lists country as a filter dimension. The country dropdown was dropped earlier (the free-text search already matches country), but the tip still said "filter by working group, MC role, country, or mentorship status". All three locales.
- The site's structured-data logo (the
Organization.logothat Google and social crawlers read) now points at the official NetSec mark rather than a pre-brand placeholder.scripts/inject-seo.pyhad hardcoded the oldlogo.pngfrom before the v1.8.0 brand launch, so every page emitted the placeholder. It now emits the real mark on all pages. Two stray EU-blue hexes in the stylesheet were also folded back onto the--accenttoken. - The roadmap timeline markers (the status dots and milestone diamonds) now sit centred on the vertical connector line. The markers were vertically aligned to the status pill but their horizontal position never accounted for the line. The dots are content-box (the global box-sizing reset does not reach pseudo-elements), so their border sits outside the declared width, and the offsets are now computed from the rendered border-box centre at every breakpoint.
- Directory research keywords now keep country and region names capitalised wherever they sit in a phrase, not only as the first word. Previously the canonicaliser lowercased a proper noun in the middle of a keyword, so Policy evaluation & lessons learned (Afghanistan) rendered with a lowercase afghanistan and Russia-Ukraine war lost the capital on Ukraine. A curated list of countries and regions is now preserved through normalisation.
- Directory affiliations now read uniformly. The same employer was being written several ways depending on punctuation, so an institution and its named centre now use a comma (ETH Zurich, Center for Security Studies) and two separate affiliations use a slash (Ghent University / Egmont Institute), applied automatically on every sync.
- The Early Access Preview banner on the directory now keeps its white text readable in light mode. A global paragraph-colour rule was overriding the banner's intended white with a dark slate, which happened to read fine on the blue gradient in dark mode (where the same colour variable is light) but left dark-on-blue text in light mode.
- Stylesheet and script files now carry a content-hash cache-bust token (
site.css?v=…), so a returning visitor renders new markup against the matching CSS rather than a stale cached copy after a release. A new check stops a CSS or JS change from merging without the hashes being refreshed. - Gave the v1.10.0 roadmap card a proper description in all three locales. It had landed with the generic "maintenance release" auto-summary and an untranslated FR/DE body, which undersold a feature release.
- Clicking a Working Group card on the home page now lands on the exact section of
/working-groups.html. The page builds its content from the directory after load, which shifted the target after the browser's initial jump, so the deep-link is re-applied once the section has rendered.
🤖 Authored with help from Claude Code.