Information can save lives. For a long time, such important information was withheld from pregnant people due to Paragraph 219a. This law prohibited gynecologists from “advertising” abortion services on their websites. A problematic phrasing that, as a result, also prohibited them from sharing educational information online.

The Birth of Gynformation

The debate surrounding Paragraphs 218 and 219a has resurfaced repeatedly over the years. In 2019, a collective formed around gynformation with the aim of providing educational resources about abortions on their website. Over time, this initiative developed into today’s offer: a database of gynecological practices serving diverse communities with specific needs.

Shared Experiences Can Protect Against Discrimination

Marginalized groups – such as trans people or migrants – often face discrimination, even in spaces that should be safe. At gynformation, patients can search for non-discriminatory gynecologists and other healthcare professionals in their area. Only providers recommended by other patients are listed.

The Requirements: More Content, More Focus, and Absolutely No Data Loss

However, after about five years, the website had become outdated, wasn’t suitable for mobile use, and above all, was not accessible.

Visitors should quickly understand the site’s purpose and benefits. Anyone wanting to recommend a gynecologist and other healthcare professionals shouldn’t have to navigate endless forms. And those evaluating the forms should be able to do so more quickly and efficiently.

The Design

The logo, existing colors, and illustrations were to be retained.That was our starting point. In order to still evoke a sense of rebranding, we chose a new typeface and expanded the color palette – not just for aesthetic reasons, but also to improve accessibility.
We also revised and redesigned the homepage structure: Our goal was to address visitors directly, demonstrating that this website is seeking to be a safer space. The card layout provides a quick overview of all key information, and the glossary helps reduce potential barriers, seeing that plain language is a form of accessibility.

The Technology

As mentioned above, preserving the existing data was one of the most important goals. When setting up the new database schema, we paid close attention to ensure compatibility with the structures of the existing questionnaires and profiles. As in the old version, we use a Postgres database to store this data and Prisma to retrieve or submit it. For content management, we use DatoCMS, which works especially well with our frontend stack–Next.js, React, and Tailwind – ensuring excellent performance and user experience.
Before going live, we used a script to migrate all questionnaires, profiles, and associated metadata to the new site.

Accessibility Is Also a Technical Matter

Accessibility was a priority not just during the concept phase, but also throughout development. We use the Eslint plugin jsx-a11y to check our static pages – for example, to identify missing alt texts for images or click events that aren’t assigned to buttons. To further analyze the rendered DOM, we also use @axe-core/react, which flags accessibility issues in the console during runtime – such as low contrast levels or improper heading order. It also checks key requirements for screen reader compatibility, including whether each HTML tag has a clearly defined role.
We haven’t fixed all the issues yet, but we’re committed to making the site fully accessible.

The Goal? Transparency, Security, and Shared Knowledge Through Open Source

Gynformation is a collective project – and that collaborative spirit  should extend beyond the website itself. That’s why we’re going fully open source. First, to ensure transparency and security by allowing people to inspect the code for vulnerabilities or backdoors. But also to share our knowledge so that other groups or collectives can build similar projects.
To do this, we’ll first choose a suitable license, draft a Code of Conduct to ensure a respectful tone, and carefully document the code so that other developers can easily navigate it.

Realized thanks to Farbenmeer Friday

More than just a catchy alliteration, “Farbenmeer Friday” is the day of the week when we’re free to choose how we spend our time. We use this day for learning opportunities that interest us, for diving into topics we’ve long wanted to explore, or for working on projects that are not part of our paid client work. It’s basically our version of volunteering as an agency. Social projects are often run by volunteers – and that’s precisely why they often lack financial resources to afford  professional support. Gynformation is one such pro bono project. Their commitment to fighting social injustice is something we’re determined to support.