1 Thing A Week 1 Thing
A Week

Launching SITEJOY, a gallery of fast & responsive websites Finding somewhere to obsess over fast & responsive websites

Week 138.0 — 15th June '20

If you haven't seen it already, head over to SITEJOY and have a look at the fast & responsive websites that have been featured.


Responsible web development

In my time as a web developer, I've built a number of websites and a lot of them from scratch. There's initial hit in the time it takes to put something together, but for the most part that's worth the trade off at the end which is a website that is fast. Rapid development isn't always the answer and that goes for the shiniest new thing too. I have two main principles for personal projects and websites I build:

  1. I'm responsible for running the logic, not the person visiting my site
  2. Whatever is delivered to the browser is the bare minimum required

Progressive Enhancement is the way the web should be done for the most part. Web applications is a different ball game, but for web sites there's really no excuse for pumping lots of data to users. Firstly, it's pretty bad to be doing that in 2020 when modern browsers already cater for a lot of the things libraries were invented for and secondly, if you send something across to users that they never see, what was the point?

There there's the fact that a lot of sites are just built poorly.

I'd already subscribed to a lot of the thinking in an article called The Website Obesity Crisis even before I read it and it was comforting to know I'm not the only one. Around the same time, I came across the service whatdoesmysitecost.com:

This is the cost of the site based on data from the ITU, without any adjustment for purchasing power or relative affordability. Prices were collected from the operator with the largest marketshare in the country, using the least expensive plan with a (minimum) data allowance of 500 MB over (a minimum of) 30 days. Prices include taxes. Because these numbers are based on the least expensive plan, they are best case scenarios.

Here are some results:

So as you can see, my portfolio, 1 Thing A Week and SITEJOY aren't just built with performance, but also the load time and the cost to a end user. I'm not here to waste your time waiting for some content.

What is SITEJOY?

So all of the above, has been the driving force behind wanting to build what I hope becomes a gallery that is the home of fast & responsive websites: SITEJOY.

The goal of SITEJOY is to highlight great websites that are fast and responsive. That means that they're lightweight, they load quickly, and they work at any screen size (mobile, tablet or desktop). You'd think this would be easy criteria to fill, but I'd estimate that less than a third of websites I come across make it to the review stage and it's only around 60% of them that meet the submission criteria.

By the time this is published there will be 50 sites already on the site with almost 100 more scheduled and another hundred or so that require a final review.

Finally getting started on SITEJOY

As with a lot of things, I never knew what to call it but finally settled on a name and from there on it was pretty easy going. A few hours a week over the course of a month and the site was launched.

Like 1 Thing A Week, I built a custom CMS but had to spend quite a bit of time on handling images. I'm not 100% happy with how thumbnails are being produced so I'll revisit at some point and see if I can get a better result when downscaling the screenshot.

The layout was done from scratch and uses as much CSS as possible. I've tried to avoid images for the site itself so that the only assets that are loaded are the screenshots being shown off. Plenty of inspiration from Steve Schoger and Adam Wathan's Refactoring UI book which really helped me get to a place where I was very happy with how it all turned out.

The rules of SITEJOY

  • 3MB PAGE SIZE ON INITIAL LOAD — Keeping page sizes as small as possible.
  • 80+ PAGESPEED SCORE — Are the recommendations for delivering content being followed? Is the site considered fast?
  • WORKS WITHOUT JAVASCRIPT — This is the holy grail, interactive sites that work without the user's browser having to do any work. If this isn't possible, then there's a 200kb on the amount of JavaScript that can be delivered.

As I said, a lot of sites are rejected based on this fairly simple criteria. Given modern browsers give us lots of tools to make our sites load as fast as possible, it's crazy to see how often no attention is given.

SITEJOY itself does meet the criteria, but it's PageSpeed score could be better so that's something I need to look at.

The future of SITEJOY

Search is a key feature that's missing at the moment. There are a few ways it can be done, so I want to take some time to find the best one. I've also got more methods of discovering content to flesh out and lastly, adding my own commentary to websites. Right now, they all have a brief summary of what the website is there to promote, but I really need to give some input into what it is that got me to feature it beyond it just meeting the criteria.

More from 1 Thing A Week
« 5 CodePens that show what can be achieved with just CSS Pharrell's signature four-count start Experimenting with linked data »

Advertisement

Notable

Quick links and commentary on interesting articles, videos and more throughout the week.

  1. 138.1 – Monday
    1. Lockdown! The Game. James Veitch on kickstarter.com
    2. Jazz Keys jazzkeys.plan8.co
  2. 138.2 – Tuesday
    1. "CROSSING SWORDS" trailer Sony Pictures Entertainment on youtube.com.
  3. 138.3 – Wednesday
    1. Magnetic streamlines of the Milky Way ESA & Planck on apod.nasa.gov
    2. The eclipse photo that made Einstein famous Vox on youtube.com.
  4. 138.4 – Thursday
    1. "Palm Springs" trailer Hulu on youtube.com.
    2. The Atlantic slave trade in two minutes Slate on youtube.com
  5. 138.5 – Friday
    1. What's taboo in your country Cut on youtube.com
    2. Full rotation of the moon @buitengebieden_ on twitter.com

Jump to notable items for Week #137, Week #139 , view the notable archive or my favourites.

About 1 Thing A Week

A website curated by @cchana bringing you 1 Thing A Week, delivered every Monday morning.

You can find a list of all articles in the archive, or read the most popular.

Find out more about 1 Thing A Week or read the privacy policy.

Market

Visit the market and support 1 Thing A Week.

You can find 1 Thing A Week on Twitter, Facebook, Instagram & Reddit

Basic Analytics