OWASP Case Study

Project Background:

OWASP (Open Worldwide Application Security Project) is a nonprofit, community-led cornerstone of application security, founded in 2001 and now spanning hundreds of chapters worldwide (342 active chapters listed as of Jan 9, 2026). It is best known for the OWASP Top 10 security risks (current: 2025), plus widely used resources like the Vulnerable Web Applications Directory, and training projects like OWASP Juice Shop.

OWASP's ecosystem is also structurally "many repos, shared theme": projects and chapters commonly live in separate www-project-* / www-chapter-* repos that publish under owasp.org using a shared site theme, reflecting decades of community-scale growth rather than a single monorepo.

OWASP Site Theme Mobile Rescue:

The shared Jekyll site theme used across the owasp.org ecosystem had systemic issues in key elements that caused sitewide breakage — every page was affected, including the homepage. The cookie bar was not fully visible and could not be dismissed because the close icon was off-screen. On mobile load, large sections of the page were hidden by overflow, forcing awkward panning and hurting navigation and accessibility.

Rito diagnosed the root causes and applied a cohesive set of fixes across mobile and tablet breakpoints while preserving the original design intent. He opened an issue and shipped a pull request, and maintainers merged the changes after review.

Impact was immediate and broad: the shared theme stopped breaking layouts across the OWASP ecosystem, and the homepage experience became reliable on mobile and tablet.

&
Before
OWASP site theme mobile layout before responsive fixes
After
OWASP site theme mobile layout after responsive fixes

VWAD Table Rescue (Phase 1 — Foundation):

The VWAD table is the flagship product of the project, cataloging vulnerable testing projects by category, but it was not configured for reliable mobile responsiveness. On small screens, the layout aggressively condensed: words wrapped into essentially vertical text, and icons and badges shrank to microscopic sizes, leaving much of the content unreadable and difficult to interact with.

Rito opened an issue and shipped a pull request that restructured the table's core display behaviors for usability across breakpoints.

The fix stabilized column sizing, introduced a dedicated scroll container so the table can pan horizontally on small screens without causing page-level overflow, added a max-height so long lists scroll inside the table (keeping the tab controls quickly accessible), and enabled sticky headers so users keep context while scanning large directories.

&
Before
After

VWAD Advanced Search (Phase 2 — Feature Expansion):

After the table became reliably usable across devices, the next bottleneck was discoverability: VWAD is a large directory, and "scroll and scan" is not enough once the dataset grows.

Rito implemented an Advanced Search experience that turns the table into a queryable directory — enabling users to compose multi-parameter filters (keyword, technologies, references, GitHub stars, and contributed-year ranges), manage active filters via selected-parameter pills, and apply or clear the full query as a single action.

Advanced Search Modal - Empty
Advanced search modal empty state for the VWAD directory

Here is the opened advanced search modal with multiple configurable parameters

Advanced Search Modal - Filled
Advanced search modal filled state with parameters and pills

Here the modal is filled out with search parameters and the pill buttons begin to populate. Pressing "accept" is needed to apply the query to the table.

Advanced Search applied
Advanced search applied with filter pills and result count

Here there is an "Advanced Search" button used to open the modal, and the current search params are applied as seen in the pill buttons and the text describing the total search results currently present

This feature is designed to be additive (not a redesign of the content model): it preserves the existing table structure while introducing a higher-leverage navigation workflow for real users of the directory.

Links: Live VWAD page Advanced Search pull request Canonical tech label normalization pull request

VWAD Tech Label Normalization (Phase 3 — Durability):

Once Advanced Search was live, a predictable scaling issue emerged: real-world datasets rarely follow strict naming conventions. Technology values can appear with different casing, punctuation, or shorthand (for example, variations like "NodeJS" vs "Node.js"), which can fragment filtering UX and degrade table readability over time.

Rito introduced a canonical normalization layer that maps common aliases to a single preferred label. This improves user experience by preventing duplicate or near-duplicate options in filter controls, and improves developer experience by relaxing naming constraints as the dataset evolves. The normalization approach is also designed to be extensible, so new aliases can be added without reworking the filtering architecture.

Link: Canonical tech label normalization pull request

OWASP Top 10 RC Mobile:

The 2025 OWASP Top 10 was in pre-release as a Release Candidate on the live, publicly viewable production site, with a watermark on every page to signal the draft status. On mobile, that watermark was not configured correctly and ended up breaking layout, hiding the navigation menu and impacting normal scroll behavior while also adding whitespace more than twice the size of the page content itself.

Rito opened an issue and shipped a pull request that corrected the watermark layout and restored normal layout and scroll behavior across breakpoints. He also alerted maintainers in the OWASP Slack with the issue and fix, and it was promptly merged while the release candidate phase was still active.

&
Before
OWASP Top 10 release candidate mobile layout before watermark fix
After
OWASP Top 10 release candidate mobile layout after watermark fix