I created the Arndis skin for PmWiki in the spring of 2004. I was running PmWiki v 0.6 or 1.x at the time. It’s been through a few rewrites since then, but the visual design is much the same as the original.
Like my other web designs, it’s standards-compliant, semantic, accessible, etc., etc. It’s a simple liquid two-column affair, with a brighter content area floating in a sea of background and sidebar. I made several colour variations:
Going beyond the pretty looks, I did some things to suit myself with this skin. There is a breadcrumb trail to show the reader her location in the site. The sidebar contains some auto-updating sections that use javascript snippets to work their magic. The editing command tabs are an unordered list, for the reasons given in A List Apart. This particular unordered list began life as an example from Listamatic, but I tweaked the heck out of it over several generations.
The hardest thing to do to it was the you-are-here marker, which highlights the current tab. I needed a CSS selector for it and only it, which meant I needed a hook in the HTML PmWiki generated. Happily, the creator of PmWiki is very good at answering questions or helping out with small things like this, and he pointed out a hook that already existed in the code.
Arndis Skin for PmWiki
Skillsweb design
DateMarch 14, 2004
Like my other web designs, it’s standards-compliant, semantic, accessible, etc., etc. It’s a simple liquid two-column affair, with a brighter content area floating in a sea of background and sidebar. I made several colour variations:
Going beyond the pretty looks, I did some things to suit myself with this skin. There is a breadcrumb trail to show the reader her location in the site. The sidebar contains some auto-updating sections that use javascript snippets to work their magic. The editing command tabs are an unordered list, for the reasons given in A List Apart. This particular unordered list began life as an example from Listamatic, but I tweaked the heck out of it over several generations.
The hardest thing to do to it was the you-are-here marker, which highlights the current tab. I needed a CSS selector for it and only it, which meant I needed a hook in the HTML PmWiki generated. Happily, the creator of PmWiki is very good at answering questions or helping out with small things like this, and he pointed out a hook that already existed in the code.