I'm fully aware I'm a rather mediocre frontend developer so my opinion on the matter has very little value, but on the other hand I have this feeling that HTML, CSS and JS on the hindsight were probably some of the least suitable technological choices for what the current usage of the web actually needs to achieve this objective.
There was once the idea, that the web could work like other objects in programming. You would download an object and then send it messages (message passing concept). I think this was imagined to be in some kind of Smalltalk image like environment. I think Alan Kay mentioned the idea in one of his talks, or I have read about it elsewhere related to Smalltalk.
The triad of HTML, CSS, and JavaScript are actually fantastic for the web if used intelligently. Unfortunately the "used intelligently" part is skipped way more often than it should be.
Having HTML be the first resource at a URL is awesome. HTML can have lots of "invisible" metadata for a variety of user agents. Not every user agent is a graphical browser wanting to run arbitrary code. The microbrowsers that generate previews when shared by messaging apps have different needs than a graphical desktop browser which has different needs than a screen reader. The same HTML can serve all the user agents "for free".
Sticking styling and interactivity into separate resources let's the user agent figure out what it needs to load. A screen reader likely doesn't care about images, a phone might load a custom CSS based on a media tag, and a microbrowser wants the OpenGraph data in the header.
HTML also makes it trivial to point readers to different sections of itself so a user agent can jump to a relevant part of the page. So you get hyperlinks between documents and even specific sections of documents.
HTML is not perfect but it's great for documents. Even full JavaScript apps should at least provide a skeleton of HTML saying they need JavaScript to run and give non-graphical user agents pointers to appropriate resources. Much of the content of the web would work just fine as documents and does not need to be constructed on the client with megabytes of JavaScript and hundreds of calls to different resources.
> 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/18th of the book on Medium is 5.4 times the size of the entire book?
I copy-pasted the HTML source for the review in a new file and it'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't read a book review that is 1/5th of the original material or I wouldn't call it a book review but I digress.
Anyway, should we include the e-reader's viewer code to know how much information is used to display the book and compare it to the CMS's code or the code of the full page of the review to compare... what ?
It shows 124 requests, and a total weight of 1,588KB sent across the network (some of which is compressed, so I think this is the reason the browser shows more weight)
The medium article has a "(18/52)" in the title, but that rather seems to indicate that the article is number 18 in a series of 52 (weekly book reviews in a year or so).
Hum, "blogs" in the past means "web logs" or a place to publish your personal sh^wcra^wehmmmm things you want someone else to know... I think the author intend for blogs "personal websites" witch sometimes have only one topic, sometimes few. I argue how they can be called blog and their substantial purpose.
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 after 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.
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 "home-server" concept since now most of the connected users can do that, can profit from that, at a little enough price, but please let'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:
- 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/words in case of homonymy;
- 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 "inbox" by a lighter mean than an email, or perhaps not having aliases by a mean that do not demand a mail/alias to retrieve contents;
- 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.
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.
We need such tools to made a social society without social networks, but still modern.
[1] The ~1930 web based on cards and telegraphs depicted and partially made by Paul Otlet and Henry La Fontaine
The irony of it is that if Google's algorithm made sense at all (Why is a recipe being downranked for being older than one year?), people wouldn't have to do all of this stuff.
It's a vicious circle and I don't know if it's possible to escape at this point by any means other than inventing a better search algorithm and convincing a large number of people to use it.
I agree. When I started with nixCraft, the first feedback was that visitors wanted to know the last updated date. Apart from that, having comments, RSS feed and newsletter subscription is essential. Please don't say follow me on Twitter or FB. That is like giving out free advertisements to social media, which hides your content from all followers who choose to follow you because of your blog post. I have over 250k+ followers on both FB and Twitter, but as soon as they see a link to my blog post, promote this post button appears.So please encourage your RSS and email newsletter subscription. Keep independent web alive.
Not sure, but might be using a free plan, as many do. It would only load from a hot cache in your region on subsequent hits and have other such limitations to make it affordable.
I have 1 second to spare. Optimization is good, but shaving milliseconds at all costs always sounded a bit pointless to me, except for real-time audio communication.
The question is more how often rather than how long. For example, this page: https://www.gnu.org/software/emacs/manual/html_mono/elisp.ht... takes nearly 15 seconds to fully load for me, but then I can live for literally weeks without having to refresh it (ie. other than on sporadic Firefox restart). That's quite obviously different in the 1/10-of-chapter-per-page style of docs that Rust books seem to like.
"Text is small" so a website should be extremely light in resources is a really simplistic way to go about things.
Most web pages are not hand crafted page by page, they'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 "good enough" solution. Or, the website is old (true for almost all of them) and no longer under serious active maintenance.
It's not just incompetence leading to technical bloat.
The same is true for some of the "dark patterns" 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's purposefully done because it works. It serves marketing and monetary goals.
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.
Not necessarily the weight, but lots of other attributes of cars and other factory-made products are the way they are just because of the process in the factory. Sometimes to make production itself cheaper (not just material cost, but process-wise), sometimes to make it more efficient and sometimes just because automating it fully with good results is impossible, compared to making it by hand.
>Not necessarily the weight, but lots of other attributes of cars and other factory-made products are the way they are just because of the process in the factory.
Well, the magic of the digital realm is that the process doesn't dictate much, if anything at all, regarding the end result of a CMS.
My electric kettle recently broke. When I got into the guts of it, I noticed there were a lot of weird components that weren't really used, or didn't seem that useful. When I searched youtube for help, I found out those components were for kettles with a physical on/off switch. Mine didn't have the switch, but everything else on the inside was still there.
A CMS, fundamentally, is a server application that pulls things out of the database, puts them into templates, and spits the resulting HTML out to the browser. There is no inherent reason why a page that comes out of a feature-rich CMS has to be bloated.
Under that definition of a CMS I agree, however I think what you are describing is an MVP of a CMS that would require additional features and (likely) bloat to truly be useful to most publications.
Examples:
Social Media integrations
Subscriptions integration
Advertisements + trackers (which will likely pull in additional garbage)
Analytics (GA, etc.)
Comment section + moderation tools
Media: images, videos
Font(s)
Responsiveness
It CAN all add up fast unless someone is keeping track and responsible for keeping these sites lean.
Why not hate the player? I loaded an article the other day, and before I could read a single word the page had two popovers - one asking about cookies and the other asking if I wanted to join their mailing list, “So you can read more great content like this!”.
Terrible websites make me angry and then get closed. What a horrible waste of our collective human potential.
I totally agree with the sentiment of this post. Bear blog inspired me to build https://lists.sh which has been a blast to build. The goal is to foster a smaller web.
I agree with the sentiment, but "stock photos" are not a problem.
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.
Yes they can be used incorrectly, but that's true of anything.
I found it particularly ironic given he specifically used the example of Harry Potter, "a pretty thick book" being only "about 500kb of text", despite the fact that the actually book (the physical object he specifically picks as his metaphor) has pictures at the start of every chapter, not to mention the custom fonts and typesetting. You would need way more than 500kb to represent the actual book.
I won't read articles on cybersecurity if I don't see a either a bad guy in a hoodie hunched over a laptop, or (even better) a neon blue padlock in front of a Matrix style screen saver. Those are the dead give-away that an article is worth your time, otherwise it's really anybody's guess as to the content quality.
Minimalism is "subtract until it breaks" and this is reaching the breaking point.
Of course, we all hate popovers, slow websites etc, we've known this for decades.
This website has no identity other than an emoji and the fact that it's purposefully lacking design beyond basic text styling. It looks like 1000 other sites, at a glance I can't tell what this website or article are about.
And there are still elements I want to get rid of! "Toast me" button, "Like and subscribe!," the ad for the CMS, analytics script etc.
Assuming you mean the little running guy composed of unicode characters (and the bear face in the link at the bottom), the actual term is kaomoji. Emoji are specifically little images.
It'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'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.
71 comments
[ 3.6 ms ] story [ 149 ms ] threadHaving HTML be the first resource at a URL is awesome. HTML can have lots of "invisible" metadata for a variety of user agents. Not every user agent is a graphical browser wanting to run arbitrary code. The microbrowsers that generate previews when shared by messaging apps have different needs than a graphical desktop browser which has different needs than a screen reader. The same HTML can serve all the user agents "for free".
Sticking styling and interactivity into separate resources let's the user agent figure out what it needs to load. A screen reader likely doesn't care about images, a phone might load a custom CSS based on a media tag, and a microbrowser wants the OpenGraph data in the header.
HTML also makes it trivial to point readers to different sections of itself so a user agent can jump to a relevant part of the page. So you get hyperlinks between documents and even specific sections of documents.
HTML is not perfect but it's great for documents. Even full JavaScript apps should at least provide a skeleton of HTML saying they need JavaScript to run and give non-graphical user agents pointers to appropriate resources. Much of the content of the web would work just fine as documents and does not need to be constructed on the client with megabytes of JavaScript and hundreds of calls to different resources.
If my blog needs a video or dynamic content, it's not up to you to decide ;).
I copy-pasted the HTML source for the review in a new file and it'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't read a book review that is 1/5th of the original material or I wouldn't call it a book review but I digress.
Anyway, should we include the e-reader's viewer code to know how much information is used to display the book and compare it to the CMS's code or the code of the full page of the review to compare... what ?
I opened it in a browser and hit F12, viewed the network panel and hit refresh... it is 3.41 MB.
You can do this on the web with Web Page Test... here's the result for the page in question: https://www.webpagetest.org/result/220523_AiDc6H_8YW/
That page takes on average 20 seconds to display... and what it loads to show a tiny bit of text is pretty mind-blowing: https://www.webpagetest.org/result/220523_AiDc6H_8YW/1/detai...
It shows 124 requests, and a total weight of 1,588KB sent across the network (some of which is compressed, so I think this is the reason the browser shows more weight)
Now I do agree with you, Medium uses way too much data around its core content.
The medium article has a "(18/52)" in the title, but that rather seems to indicate that the article is number 18 in a series of 52 (weekly book reviews in a year or so).
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 after 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.
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 "home-server" concept since now most of the connected users can do that, can profit from that, at a little enough price, but please let'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:
- 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/words in case of homonymy;
- 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 "inbox" by a lighter mean than an email, or perhaps not having aliases by a mean that do not demand a mail/alias to retrieve contents;
- 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.
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.
We need such tools to made a social society without social networks, but still modern.
[1] The ~1930 web based on cards and telegraphs depicted and partially made by Paul Otlet and Henry La Fontaine
The idea was to fool people and bots into thinking it was fresh!
It's a vicious circle and I don't know if it's possible to escape at this point by any means other than inventing a better search algorithm and convincing a large number of people to use it.
The blog is already behind Cloudflare, and this page is static content, why don't you just add a rule to cache the page?
I found these to be great resources for drawing exercises.
Most web pages are not hand crafted page by page, they'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 "good enough" solution. Or, the website is old (true for almost all of them) and no longer under serious active maintenance.
It's not just incompetence leading to technical bloat.
The same is true for some of the "dark patterns" 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's purposefully done because it works. It serves marketing and monetary goals.
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.
Well, the magic of the digital realm is that the process doesn't dictate much, if anything at all, regarding the end result of a CMS.
Examples:
It CAN all add up fast unless someone is keeping track and responsible for keeping these sites lean.it's bad decisions after all. How would you call that? Alien invasion?
Terrible websites make me angry and then get closed. What a horrible waste of our collective human potential.
If you're depending on writing articles for income, either you do the dark patterns and scrape by, or you run out of money and close shop.
For news reports it's even worse because there's heavy incentive to use low quality sources for your posts.
I hate proposing yet another subscription service, but it would be much more bearable for everyone to have a netflix style model.
Flat rate a month in exchange for free access to quality news and content without the dark patterns.
I'm certinaly not holding my breath on that happening though.
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.
Yes they can be used incorrectly, but that's true of anything.
[0]: https://idlewords.com/talks/website_obesity.htm
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(/%5Cn/g,%22%20%3Cbr%3E%3C/br%3E%20%22),g=e.split(%22%20%22),h=0;h%3Cg.length;h++)k=a(g%5Bh%5D.length/3)+1,l=%22%3Cspan%20style='font-weight:bolder'%3E%22+g%5Bh%5D.substring(0,k)+%22%3C/span%3E%3Cspan%20style='font-weight:lighter'%3E%22+g%5Bh%5D.substring(k,g%5Bh%5D.length)+%22%3C/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='color:red'%3E%20%20%3C/span%3E%22),m+=l;n.document.write(%22%3Chtml%3E%3Cp%20style='background-color:%23EDD1B0;font-size:40;line-height:200%25;font-family:Arial'%3E%22+m+%22%3C/p%3E%3C/html%3E%22)%7D)()%7D();
And another one that doesn’t make bold text on the first third of words:
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(/%5Cn/g,%22%20%3Cbr%3E%3C/br%3E%20%22),g=e.split(%22%20%22),h=0;h%3Cg.length;h++)k=a(g%5Bh%5D.length/3)+1,l=%22%3Cspan%20style='font-weight:light'%3E%22+g%5Bh%5D.substring(0,k)+%22%3C/span%3E%3Cspan%20style='font-weight:light'%3E%22+g%5Bh%5D.substring(k,g%5Bh%5D.length)+%22%3C/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='color:red'%3E%20%20%3C/span%3E%22),m+=l;n.document.write(%22%3Chtml%3E%3Cp%20style='background-color:%23EDD1B0;font-size:40;line-height:200%25;font-family:Arial'%3E%22+m+%22%3C/p%3E%3C/html%3E%22)%7D)()%7D();
https://news.ycombinator.com/item?id=17513447
Of course, we all hate popovers, slow websites etc, we've known this for decades.
This website has no identity other than an emoji and the fact that it's purposefully lacking design beyond basic text styling. It looks like 1000 other sites, at a glance I can't tell what this website or article are about.
And there are still elements I want to get rid of! "Toast me" button, "Like and subscribe!," the ad for the CMS, analytics script etc.
Assuming you mean the little running guy composed of unicode characters (and the bear face in the link at the bottom), the actual term is kaomoji. Emoji are specifically little images.
https://en.wikipedia.org/wiki/Emoticon#Japanese_(kaomoji)
http://kaomoji.ru/en/
Yes, you have to actual read it. Oh, the humanity!