I'm really proud that two websites I designed and built are on that list, but especially proud of https://foodpartners.us/ which unlike a lot of the sites isn't a blog but is a full brochure style website for a business that would normally load many MB of crap if built by a normal agency.
Clean, to the point, light, crazy fast, zero bloat, no external trackers. And it looks nice.
The only thing I don't like are the banners that waste precious vertical space when seen on a 14" laptop, but can't blame you for that, given how prevalent it is nowadays.
There is one external tracker - Google Analytics. But blocked obvs if you use uBlock etc...
I also designed and built this site in 2016 - over half a decade ago and it still looks and feels modern. It's an interesting look at how web design trends have slowed down from how things went from 2000-2010 to 2014-Present.
You should be proud! That’s an excellent website. It’s clear, usable, attractive, light, fast, informative, and obvious. A wild outlier, in other words :)
I like the clean design, but the marketing copy could use work. For example, "We’re the leading southeast new business specialists" doesn't mean a lot, and also has a typo (region names should be capitalized).
I'm impressed by how 'normal'/modern some of these sites (including the Food Partners one) look for how small they are! My sites are small, but they also look like they were made in 2000.
That's definitely a snappy and clean website. My only issue is the low resolution banner image.
I would guess that increasing the resolution would bring the site over the 1MB limit though. So there's a trade off, increase the resolution for a nicer looking site, but fall off the 1MB list for free advertising.
This is probably a me problem but I read “Southeast” as Southeast Asia. Not the Southeast region of the U.S. I kept scrolling down and got confused for a second while it hit me what “Southeast” actually meant.
Edit: thinking about it a little more, it might be because I live on the west coast and think of Southeast Asia food more than Southeast US food.
As speeds get higher the amount of data that can "slip in" during the expected latency gets larger and larger. If your round-trip latency is 400 ms or whatever, why not have 1MB as your page if that comfortably fits into that latency?
For folks who started web dev in the 90s, with 9600 and 1440kbps modems, 1mb seems way too much.
Probably not always accomplishable with the high res hero imagens and videos we need these days, but we should strive for a web that’s instant. There’s no reason we should be waiting for a page to download and render with the bandwidth and hardware available today.
Or images. On pages like https://bors.tech and https://foodpartners.us the "bloat" is all images. The images are bigger than they were in the 1990's because they look better, even if you don't think they communicate more "information" people may still want them.
I suppose that most of the time the culprits are not excessively heavyweight assets.
Number one culprit is client-side rendering. Don't deploy an SPA where a statically rendered page suffices. Don't delay rendering until your whatever other JS loads. Use fewest trackers of lightest weight.
Somewhere distant second places would be asset download times (CDNs help), TLS handshake times (don't overload your server), complicated CSS that prevents fast rendering, etc.
Many media websites are now so full of cruft, the actual text of the story is barely a few Kb, and the other multi-Mb assets are videos, video adverts, trackers, javascript cruft, unoptimized css, unomptimized images, "infinite scroll", and god knows what else.
The irony is lost on these companies that if the page doesn't load quickly enough I and many other people navigate away before half the cruft that pays for the page has loaded....
You're in the minority. Apparently those types of websites generate much more revenue [0]:
I spent 3ish years making these kinds of websites (specifically those click bait-y “Can you name these Canadian snack foods??” quiz sites). They generate _a lot_ more revenue. Like more than double.
Digital publishing’s main business model is paying as little as possible for 1 click and monetizing that click as much as possible on the other end. The sales “funnel” isn’t a funnel here, its just two steps “1. Show link to article . 2. Show ads.”
Now if you’re an organic heavy site like NFL.com, you get plenty of free clicks just by reposting articles to social media. Its more important to keep your brand strong with a couple of small, highly paid ad units.
But if you’re just an average publisher, you gotta literally pay for attention. It turns into a game of spending $1.00 for an ad on Facebook/Tabola/Outbrain/Snap/etc and trying to make $1.30 when they land on the page.
Long term bet IMO is still high quality organic content makes more profit, but you can still make a lot with 3-4 engineers and average-ish content.
A page with a big image should still be able to quickly load the important parts (text and layout) and then have the big image finish loading in parallel.
The number of massive 5+ MB images I've been able to shave down tremendously by doing no more than using https://tinypng.com is absolutely frightening ...
Many were JPGs (the "site" is unfortunately named based on originally being used for PNG mainly) - but yes, many were not transparent but were deemed to need to be PNG because it is "better".
Made even more headway on some of the ones we could control by using SVG instead (images that are basically text shouldn't be PNG or JPG).
If you're designing for the future, well, already pushing 4K. Your "looks just fine on most devices" image is gonna look like an eye-squintingly tiny compressed-to-hell JPEG from 1992 in a decade or two.
Think about music. "Sounds good on most devices (earbuds at the time)" caused an entire generation of music to be mixed to shit. You expect everyone to remaster?
My own website doesn't qualify because I have gallery pages with multiple 1MB works of art. I hope my works can be appreciated in the future, on better devices. If that excludes me from a tiny ring of web designers essentially running an ad hoc demoscene competition for who can make the prettiest page in 1MB, so be it.
But (file) compression doesn't hurt the quality! At least not compared with post-production.
An entire generation of music sounds like crap BOTH before AND after compression with mp3.
e.g. Recent RHCP or Metallica records are squashed to hell if you whether you are listening to them on 1411 kbps CD or 128 kbps MP3.
I'm not as familiar with image production, but if you think 100 KB is too small, then 200 KB is likely fine, and it's still many times smaller. Or make it 500 KB -- it depends highly on the image.
I think the problem is that the way to use compression effectively is unfortunately not common knowledge and not really documented (maybe someone here has a good link)
Did you try loading https://www.digitalocean.com/blog yourself and measure it? I just did, and saw it pulled down 4.28MB worth of stuff, which is way too high for a blog, but nowhere close to 169MB. Maybe there was a bug and they fixed it quickly?
My next side project, this gave me the goal/hope to keep it under 1mb just to be in this club! The internet is too bloated these days, and I swipe away if it takes even a few seconds to load a webpage. We can all do a little better for our users
I've been making complex biz admin websites for a few years now that fit in under 20kb (uncompressed) by cheating a little bit with web sockets and js eval. Blazor server-side is a pretty good approximation for what my technique looks like today.
These websites are not the most accessible if we are factoring in network and platform concerns. But, they are by far some of the fastest (non-static) web experiences I have ever been responsible for. For employees in the same state as our datacenter, "instant" is really the best way to describe most interactions. We also use things like in-process SQLite for all of our persistence, so latency between button click & updated DOM is about as low as you could ever hope for.
I think having lightweight & fast web experiences is the key to building a successful technology business. When your customers & employees have to wait seconds for each interaction to "come back", they are going to have way more time to think about competitors and spending their time/money/attention elsewhere.
Glad to see this project grow, made my first pull request here :)
Occasionally, I would go there and checkout random peoples blogs and its surprisingly how much great it can be. Some sites look good and are surprisingly fast. I love this collection.
