I am probably better at making video games for a living but I love web dev.

Developing this whole website for fun, aiming at making it compliant with web accessibility standards, responsive and mobile friendly, service-worker compliant and very performant (means green scoring in all google tests), using no high level framework (coders like to code) except my own server-side php html components library (work in progres)! Using modern CSS features, and implementing as many features as I can!!

Lighthouse showing a 100% score!

Yeeeehaa!

More info on my daily web tinkering on my blog.

Selected bits 

My takes at Weird Web October 2025

Some kind of 'web-art'

Personnal stuff

neonsmondrianspace-battlephoto

Tools 

A few web tools I am working on

APCA Contrasted colors checker 

Check if you text is contrasted enough, depending on color, background color, font size and font weight

Also suggests a few diffent valid colors to use instead

Why ?

I personaly found that APCA's maths are way closer to my perception of color accessibility than WCAG ('AAA' score for black on #EA7439, really ?)

At least it takes font size & weight into account, and differenciates front color from background color.

Find the tool here!

CSS Ipsum 

A CSS sandbox / showcase

This is a fake/test page meant to test CSS frameworks and styles.

It aggregates several showcase pages (some well known, others that come from the past) presenting all html components into one single page where you can

  • Toggle preset CSS frameworks (normalize & co)
  • Add a link to an external stylesheet
  • Edit existing CSS
  • Switch between dark and light modes

Also note that ALL CSS of this page can be live edited to see what happens!

Also serves as a Styleguide for this site!

Experiment here!

Masonry layout 

My take at applying a masonry style to your existing layout.

So let say you have a collection of components. First, if not already done,

  • apply a grid pattern to it (just setting grid display, gap, and columns template). Then
  • simply apply this tiny javascript function to your component parent,

and done!

I did a codepen to showcase it: https://codepen.io/villepreux/pen/XWmoOrG

Codepen experiments 

DOM Framework 

DOM.PHP 

Web Document PHP Markup & Components Framework
Build modern, semantic, ultra-fast web pages using declarative PHP. Zero dependencies required. Multi-format output by design.

PHP Version License Source Code GitHub Mirror justforfunnoreally.dev badge


Overview 

DOM.PHP is a declarative, component-driven framework that treats PHP as a complete domain-specific language (DSL) for web documents. It eliminates templating friction by letting you compose HTML5, modern responsive CSS, client-side AJAX interactions, and static assets in pure PHP — with zero build steps and zero dependencies.

<?php
include "dom.php";
use function dom\{init, main, h1, p, this};

init()->output(main(
    h1("Hello World!").
    p("This is a 'Hello World' example").
    this()
));

Philosophy & Core Features 

  • Declarative Markup DSL: Compose clean, valid HTML5 trees using functional PHP elements.
  • High Performance & Natural Syntax: Direct evaluation into optimized string buffers without heavy in-memory AST overhead, preserving PHP's natural concatenation (.) and comma chaining.
  • State of the art HTML and CSS: Opinionated best CSS and HTML defaults.
  • Transparent AJAX & Asynchronous Components: Turn any component asynchronous without writing separate API routes. The same file serves both full pages and partial components.
  • Multi-Format by Design: Output HTML5, RSS 2.0, JSON Feed, Gemini, SW or PWA manifests from a single codebase.
  • ...

Project Structure 

dom/            # DOM folder
├── dom.php     # Master entry point (the single file to include)
├── plugins/    # Modular extensions & third-party providers
├── examples/   # Ready-to-run examples (hello-world, complete, templating, info)
└── README.md   # This file
index.php       # Your codebase
...

License & Credits 

DOM is provided for free (like free beer). Use at your own risk

This site 

I love my website!

I love my website! Digital garden is the right description

That includes all my webdev experiements. Some of the features:

  • Uses DOM homemade framework (See this page source code below to see how it looks like)
  • Web-mentions support
  • Commenting (via mastodon) support
  • 'Level 3' IndieWeb'ified
  • RelMeAuth support
  • JSON-RPC is automatically generated
  • RSS is automatically generated
  • Dark mode support with toogle button (in the footer)
  • No-JS support (with toogle in the footer to test it)
  • No-CSS support (with toogle in the footer to test it)
  • More on the kanban features' list

Some stuff

  • Some web-art (I use those as my living room TV 'screen-savers')
  • Bookmarks section that is automatically augmented with followed site RSS feeds. As this triggers some ethical questions I wrote a blogpost about it.
  • And since web should be more open, your can find the source code of each page just before the footer! (the real source code, the backend one, before static site compilation! Read more here)

Misc. tests 

⌂

Cached copy (2026-11-09 21:45 UTC)