Overhauling My Site Structure and Design


Return to home page.

Published: May 23, 2020

This post has been superceeded with Project Luna.

Up until recently (as in days before this article), my site used Twitter's Bootstrap. In a matter of days, the +1MB of data required for CSS and Javascript was replaced with a single CSS file requiring only 841 B of data.

That was not a typo. The site's CSS was only 841 bytes. It didn't necessarily look the best in my opinion, but some tech communities claimed to like it.

This site now uses bash, sed, and awk to generate page content as static HTML files, and properly deploy content, rather than using PHP to essentially regenerate everything with each page load.

New Structure: I checked a since-removed archive of my site's home page with its old style, and the current page, with the W3 HTML Validator. The site's old heading-level outline would've looked like

The "Links", "Resources", and "Social" sections in the footer used a somewhat hacky method for writing the sections by using an H4 tag. As a result, it's old structural outline looks like

Compared to the new site's heading-level outline

and its new structural outline

CSS: When designing the CSS for my new site, I avoided using Javascript for any features, using vanilla CSS3 functionality instead. As a result, the site styles was less than 1kb and still loaded okay on phones.


Anton McClure / anton@tilde.pw
Page last updated on: 11 August 2020 @ 23:18:15 UTC (+0000)