Web Design Is Dead! Long Live Design!
For quite a while I've seen web design stagnate, deteriorate, and ultimately turn into something more resource hungry than early 90's video games--and often, early 00's video games too! This is simply unacceptable. Your average news website loads as much tracking code as the entirety of DOOM multiple times over into RAM in the form of advertising, jquery/resources, fonts, external APIs and all sorts of ridiculous client-side junk--meanwhile, the content is a total of maybe 16K-32KB excluding code and resources at most... I would like a return to taking care and effort in making something functional and minimal, and yet at the same time provide something useful and straightforward.
This website itself is an attempt at web design golfing towards a raw minimalism, and other websites will be featured here if they meet *any* of the following requirements. I'm considering making some flair too, which I have some ideas on making extremely minimal flair for sites... Update on that when possible.
The core idea is this: make a website as minimal as you can while still remaining usable and looking good, which is obviously subjective, you won't be judged by the looks, only the rules.
There will be some flair at one point, please be patient...
Awards/Achievements
- Award for front page under or equal to 16KB award for gold, 32KB for silver, 64KB for bronze. This includes content, HTML, CSS, JS and that's it. If you have a landing page it will not be considered your index.
- Award for entire site including images equal to or under 4MB for gold, 8MB for silver, and 16MB for bronze. This is counting HTML, JS, CSS, images. I'll try my best to avoid counting anything that isn't actually loaded into the browser.
- Award for entire site excluding images equal to or under 512KB, 1MB for silver, 2MB for gold. This is counting HTML, JS, CSS, but not media or images.
- Award if your css rules are equal to or under 1KB for gold, 2KB for silver, 48KB for bronze.
- Award for pure CSS+HTML--no JS
- Award if it renders within reason in NetSurf, or a standards-compliant browser--any is fine. It doesn't have to look the same as Firefox/Chrome and its derivatives, but simply not broken in any obvious way. Margins/paddings and whitespace are handled differently, that's okay, this is within reason.
- Award for having no external, off-site resources--host it all yourself! Those added HTTP requests to other domains add up and waste time and effort, plus I don't see why you'd want to tell google (or anyone else) who is visiting your site just so you can let them host a font that you could always simply download and add in a font query.
- Award for mobile-friendly and reactive websites. If some text overflows or something is kinda funny, it's okay, you still get the award.
- Award for screen-reader-friendly websites--i.e. using semantic markup and a sane HTML layout. I'm not blind and don't know anyone who uses a screen reader so this is measured on a best-effort basis.
- Doesn't matter if you use HTML4, XHTML 1.0 Transitional/Strict, or HTML5, there is an award for standards-compliant wesbite--CSS+HTML is what is checked.
Added Restrictions and Considerations
- Please use *some* CSS to make your site more readable and usable. If it's using only the built in browser defaults then it will not be featured here.
- Please don't use an unedited stock template. Stock templates are fine as long as they are customized within reason. Just changing colors alone is enough.
- There will be a tolerance of 5% for rule 1, 2, 3, and 4--so if you're a bit over, you're still going to make the cut.
- Most of all this is for fun. Have fun. Learn something. Please be kind :)
This page meets all 10 of the requirements.
This single page is ~5.6KB in total, 98 LOC including content, and only 24 CSS properties. It's standards-compliant, reactive, and lightweight, and still looks good--it's readable to boot. Simplicity and elegance doesn't mean ugliness--just like healthy food can be delicious, and so on.