Big Fat Websites (2021)

&quot;Text is small&quot; so a website should be extremely light in resources is a really simplistic way to go about things.<p>Most web pages are not hand crafted page by page, they&#x27;re part of a CMS with a million other capabilities. Or, the team creating the website was under cost pressure and went for some performance-compromised &quot;good enough&quot; solution. Or, the website is old (true for almost all of them) and no longer under serious active maintenance.<p>It&#x27;s not just incompetence leading to technical bloat.<p>The same is true for some of the &quot;dark patterns&quot; like auto-playing videos and pop-ups. We should stop with the narrative that this is due to publication truly hating users or being completely tone-deaf. It&#x27;s purposefully done because it works. It serves marketing and monetary goals.<p>Yes, this comes at the expense of usability. You should see it as an act of desperation that is existential. It keeps the lights on. The terrible state of web usability is due to it not having any reliable business model other than the current status quo.

And they have to have a publish date. (You wouldn&#x27;t believe the number of blog posts that do not have one)

Minimalism is &quot;subtract until it breaks&quot; and this is reaching the breaking point.<p>Of course, we all hate popovers, slow websites etc, we&#x27;ve known this for decades.<p>This website has <i>no</i> identity other than an emoji and the fact that it&#x27;s purposefully lacking design beyond basic text styling. It looks like 1000 other sites, at a glance I can&#x27;t tell what this website or article are about.<p>And there are <i>still</i> elements I want to get rid of! &quot;Toast me&quot; button, &quot;Like and subscribe!,&quot; the ad for the CMS, analytics script etc.

And this blog actually loads fast and does not require me to trust random third-party scripts to be able to see text. Good job!

If you are on wordpress, there&#x27;s ton of &quot;minimal&quot; themes to choose from, here&#x27;s a HN discussion of one minimal theme (susty wp):<p><a href="https:&#x2F;&#x2F;news.ycombinator.com&#x2F;item?id=17513447" rel="nofollow">https:&#x2F;&#x2F;news.ycombinator.com&#x2F;item?id=17513447</a>

This bookmarklet is one way to cut out the cruft:<p>javascript:void%20function()%7Bjavascript:(function()%7Bvar%20a=Math.floor,b=document.querySelectorAll(%22p,%20title%22),c=%5B%5D,e=%22%22,f=%22%22,g=%22%22,h=0,k=0,l=%22%22,m=%22%22,n=window.open(%22%22,%22_blank%22);for(var%20d%20in%20b)%7Bvar%20i=b%5Bd%5D.textContent;i%26%26(c=c+%22%5Cn%22+i)%7Dfor(f=c,e=f.replace(&#x2F;%5Cn&#x2F;g,%22%20%3Cbr%3E%3C&#x2F;br%3E%20%22),g=e.split(%22%20%22),h=0;h%3Cg.length;h++)k=a(g%5Bh%5D.length&#x2F;3)+1,l=%22%3Cspan%20style=&#x27;font-weight:bolder&#x27;%3E%22+g%5Bh%5D.substring(0,k)+%22%3C&#x2F;span%3E%3Cspan%20style=&#x27;font-weight:lighter&#x27;%3E%22+g%5Bh%5D.substring(k,g%5Bh%5D.length)+%22%3C&#x2F;span%3E%20%22,%22.%22==g%5Bh%5D.substring(g%5Bh%5D.length-1,g%5Bh%5D.length)%26%26(l+=%22%3Cspan%20style=&#x27;color:red&#x27;%3E%20<i>%20%3C&#x2F;span%3E%22),m+=l;n.document.write(%22%3Chtml%3E%3Cp%20style=&#x27;background-color:%23EDD1B0;font-size:40;line-height:200%25;font-family:Arial&#x27;%3E%22+m+%22%3C&#x2F;p%3E%3C&#x2F;html%3E%22)%7D)()%7D();<p>And another one that doesn’t make bold text on the first third of words:<p>javascript:void%20function()%7Bjavascript:(function()%7Bvar%20a=Math.floor,b=document.querySelectorAll(%22p,%20title%22),c=%5B%5D,e=%22%22,f=%22%22,g=%22%22,h=0,k=0,l=%22%22,m=%22%22,n=window.open(%22%22,%22_blank%22);for(var%20d%20in%20b)%7Bvar%20i=b%5Bd%5D.textContent;i%26%26(c=c+%22%5Cn%22+i)%7Dfor(f=c,e=f.replace(&#x2F;%5Cn&#x2F;g,%22%20%3Cbr%3E%3C&#x2F;br%3E%20%22),g=e.split(%22%20%22),h=0;h%3Cg.length;h++)k=a(g%5Bh%5D.length&#x2F;3)+1,l=%22%3Cspan%20style=&#x27;font-weight:light&#x27;%3E%22+g%5Bh%5D.substring(0,k)+%22%3C&#x2F;span%3E%3Cspan%20style=&#x27;font-weight:light&#x27;%3E%22+g%5Bh%5D.substring(k,g%5Bh%5D.length)+%22%3C&#x2F;span%3E%20%22,%22.%22==g%5Bh%5D.substring(g%5Bh%5D.length-1,g%5Bh%5D.length)%26%26(l+=%22%3Cspan%20style=&#x27;color:red&#x27;%3E%20</i>%20%3C&#x2F;span%3E%22),m+=l;n.document.write(%22%3Chtml%3E%3Cp%20style=&#x27;background-color:%23EDD1B0;font-size:40;line-height:200%25;font-family:Arial&#x27;%3E%22+m+%22%3C&#x2F;p%3E%3C&#x2F;html%3E%22)%7D)()%7D();

I agree with the sentiment, but &quot;stock photos&quot; are not a problem.<p>They add visual interest and allow the reader to quickly see what the article is about. Having a good stock photo with a blog post drastically increases the number of clicks.<p>Yes they can be used incorrectly, but that&#x27;s true of anything.

I totally agree with the sentiment of this post. Bear blog inspired me to build <a href="https:&#x2F;&#x2F;lists.sh" rel="nofollow">https:&#x2F;&#x2F;lists.sh</a> which has been a blast to build. The goal is to foster a smaller web.

I was pleasantly surprised to find out that the author created <a href="https:&#x2F;&#x2F;justsketch.me&#x2F;" rel="nofollow">https:&#x2F;&#x2F;justsketch.me&#x2F;</a>, which sponsors <a href="http:&#x2F;&#x2F;reference.sketchdaily.net&#x2F;" rel="nofollow">http:&#x2F;&#x2F;reference.sketchdaily.net&#x2F;</a><p>I found these to be great resources for drawing exercises.

It&#x27;s a daily fight for me. The underlying issue is that everyone is chasing profits and larger sites have multiple teams working on them (dev, seo, marketing, sales, etc). So while devs might be trying to optimize as much as they can, other teams can come and put 3 google analytics-like trackers, affiliate trackers, heatmap analytics, live chats, 3rd party popup services that collects emails, etc. And don&#x27;t get me started on oversized images with 0 compression... And the worst part, those poorly written affiliate trackers, popups and live chats actually bringing revenue so there is always a push for more.

I believe the author had intended to link to this[0] page instead.<p>[0]: <a href="https:&#x2F;&#x2F;idlewords.com&#x2F;talks&#x2F;website_obesity.htm" rel="nofollow">https:&#x2F;&#x2F;idlewords.com&#x2F;talks&#x2F;website_obesity.htm</a>

Lol the irony of this. Very slow TTFB from Australia.. over 1 second<p>The blog is already behind Cloudflare, and this page is static content, why don&#x27;t you just add a rule to cache the page?

<i>every website</i> should load fast. If they should be clean is something that&#x27;s too subjective IMO.

Most of the JS on a blog site will be analytics, don&#x27;t hate the playa ...

financial incentives.

Hum, &quot;blogs&quot; in the past means &quot;web logs&quot; or a place to publish your personal sh^wcra^wehmmmm things you want someone else to know... I think the author intend for blogs &quot;personal websites&quot; witch sometimes have only one topic, sometimes few. I argue how they can be called blog and their substantial purpose.<p>In the past, usenet pre-web era, there was a problem: some posts are just noise so there were not much reasons to pin them in some way, some are valuable and might be useful in the future to anyone including those who join a group <i>after</i> that post(s). So websites was seen as a way to keep useful contents for the posterity. Than someone observe the old mundaneum dream [1] can be real with web tech and a new revolution start ending up not so well, composition is still manual and have many issues, accessing contents was a problem, directory-website prove to be nor effective nor maintainable. Than search engines arrives. Another revolution with another loss of the original web idea ... finally blogs arrives as a way to collect data about people letting them spit some mostly irrelevant content to nearly anyone on the web.<p>I favor rediscovering the classic idea, perhaps the mid-classic one: personal websites with domain names, perhaps hosted at home and mirrored on ZeroNet for all who can, perhaps offering a local YaCy instance to contribute to an open web search to reduce hyper-power of corporate backed search engines, perhaps hosting something else for individual users usage from mail+webmail, VoIP services etc i.e. pushing the classic &quot;home-server&quot; concept since now most of the connected users can do that, can profit from that, at a little enough price, but please let&#x27;s agree not only to simple script-less fast-loading without CDNs etc contents, also to kind of publishing. To avoid create another niche we new old web must be useful like:<p>- some personal information made public, why a phone directory? If I have phone numbers to be published I put them on my website because accessing it must be just looking for my name and surname + eventual other tag&#x2F;words in case of homonymy;<p>- some topics I want to publish, with proper RSS feeds because 99% of the reader are mildly interested in a small percentage of the content so will not came back frequently to discover something new, they might just get it in their own &quot;inbox&quot; by a lighter mean than an email, or perhaps not having aliases by a mean that do not demand a mail&#x2F;alias to retrieve contents;<p>- support for various media, not only desktop and mobile but also scrapers, screen readers, terminals etc, a website must be used ok-ish with w3m.<p>Long story short instead of a crapload of contents lets makes personal websites like our public face to the web, with all non-web hooks of the case, like RSS.<p>We need such tools to made a social society without social networks, but still modern.<p>[1] The ~1930 web based on cards and telegraphs depicted and partially made by Paul Otlet and Henry La Fontaine

&gt; One thing we need to understand when building websites optimised for reading is that text is small. Harry Potter and the Deathly Hallows is a pretty thick book by most measures, and only clocks in at about 500kb of text. How is it that this review of 1&#x2F;18th of the book on Medium is 5.4 times the size of the entire book?<p>I copy-pasted the HTML source for the review in a new file and it&#x27;s 20kb. So if it was a full review it would be a 360kb file. Uncompressed, unlike epub files. Once compressed it is ~6kb. 6kb*18 = 108kb. I wouldn&#x27;t read a book review that is 1&#x2F;5th of the original material or I wouldn&#x27;t call it a book review but I digress.<p>Anyway, should we include the e-reader&#x27;s viewer code to know how much information is used to display the book and compare it to the CMS&#x27;s code or the code of the full page of the review to compare... what ?