THE MOST BORING FILE ON YOUR WEBSITE
Every website has a sitemap.xml. It’s that XML file that search engines crawl to discover your pages. Nobody visits it. Nobody looks at it. It just… exists.
Until now.
WHAT IF SITEMAP WAS A GAME?
The sitemap on this site is fully playable Space Invaders. Navigate to /sitemap.xml and you’ll find yourself defending the web from an alien invasion - where each invader represents a page on the site.
Shoot down the BLOG invader? You’ve “discovered” the blog page. Destroy all invaders? You’ve effectively navigated the entire sitemap. It’s SEO meets arcade action.
HOW IT WORKS
The magic is XSL Transformations (XSLT). When a browser requests an XML file, it can apply an XSL stylesheet to transform that XML into something else - typically HTML.
The sitemap.xml includes this processing instruction:
<?xml-stylesheet type="text/xsl" href="sitemap.xsl"?>The XSL file then transforms the sitemap data into a complete HTML5 game, complete with:
- Canvas-based rendering - Smooth 60fps gameplay
- SVG icons as invaders - Each page has its own icon
- Point values - Higher priority pages are worth more
- Kill feed - Shows which pages you’ve “discovered”
- Victory screen - Links to all pages when you win
THE SITEMAP REMAINS VALID
Here’s the clever bit: the underlying XML is still a perfectly valid sitemap. Search engine crawlers ignore the XSL reference and parse the XML directly. Google sees a standard sitemap. Humans see a video game.
We extended the sitemap schema with custom game attributes:
<url>
<loc>https://www.wunsch.dk/blog</loc>
<game:icon><!-- SVG path data --></game:icon>
<game:name>BLOG</game:name>
<game:points>200</game:points>
<game:color>#FF1744</game:color>
</url>The game: namespace is ignored by sitemap parsers but provides all the data needed to render invaders in the game.
THE UFO BONUS
Classic Space Invaders had a mystery UFO that flew across the top of the screen. Our sitemap has one too - it links to a “secret” URL that leads to the 404 page. Sometimes the treasure is the journey, not the destination.
RESPONSIVE ARCADE
The game works on mobile too. Touch controls appear on smaller screens - left/right buttons and a big FIRE button. The CRT scanline overlay and starfield background scale appropriately. It’s a full arcade experience in your pocket.
PRACTICAL DISCOVERY
Beyond the novelty, there’s something genuinely useful here. Destroying invaders is a memorable way to explore a website’s structure. The kill feed becomes a navigation history. The victory screen provides links to every page.
It turns passive sitemap indexing into active discovery.
BUILD YOUR OWN
The approach is surprisingly portable. You need:
- A sitemap.xml with extended game metadata
- An XSL stylesheet with embedded HTML/CSS/JavaScript
- SVG icons for each page type
The XSL uses <xsl:for-each> to iterate over sitemap entries and inject them into JavaScript arrays. The game logic is vanilla JS - no frameworks required.
CREDIT 01 - PRESS START