Originally published at: https://boingboing.net/2019/08/23/the-one-html-page-challenge.html
…
5 Likes
I think a lot of people minify for performance, but then never post the source maps and/or the un-minified source, so their minification becomes obfuscation. And many of these people learned their trade in a world where no code was minified, and they could view source anywhere and everywhere. I think they just haven’t considered this implication, and could do better if this was brought to their attention.
4 Likes
In the 90s we viewed source because there was no other option. Browsers didn’t have developer tools to inspect the dom, browse styling rules or debug javascript. There was no stack overflow and the only way to learn was to know someone else who knew, or to buy a book.
I find it hard to believe that today, with top notch developer tools and thousands of free tutorial videos on every aspect of programming, it’s harder to learn web development than it was in the 90s.
Get off my lawn, is all I’m saying
18 Likes
That’s discounting the power of curiosity and discovery on a career trajectory. Seeing something neat and being able to access the source that makes it work is a powerful thing. Also, just the act of discovering that you can see how something works at all, and that it is in language you can kind of understand, is also powerful. There’s a huge difference for a young person who sees navBox.addClass('active') versus seeing x.y(b.a)
The web is incredibly radical in the fact that it is open standards and open source code. Nothing else works that way. It’s tragic when people who benefitted from that for so long are now racing towards a closed source web, whether it is actually or just effectively closed.
4 Likes
A lot of those free tutorials are teaching people to do things wrong, making use of glitches and bad coding practices that only work in one browser or another. A great example of this is the “ant colony” page linked in the article. It’s full of bad coding practices (script tags outside of the body and head, as an example), and flat out coding errors that cause it to crash in several browsers (line 42, firefox and chrome both die and won’t run it - works fine on mobile, but nowhere else I’ve got access to).
And then of course, because the tutorial they found on youtube (why does anyone ever go to youtube for coding lessons? It makes no sense…) said that it works, and it worked in the only browser they ever tested it on, they declare it perfect and don’t bother testing anywhere else.
Grumble grumble lawn grumble… kids these days.
9 Likes
There is a (long lost?) theory in web development and information theory called graceful degradation: “the practice of building your web functionality so that it provides a certain level of user experience in more modern browsers, but it will also degrade gracefully to a lower level of user in experience in older browsers. This lower level is not as nice to use for your site visitors, but it does still provide them with the basic functionality that they came to your site to use; things do not break for them.”
For example, turn off JavaScript in your browser and visit https://99percentinvisible.org/ or https://www.apple.com/ . The link for the ASCII ant colony, on the other hand, does nothing because it’s just a JavaScript generator.
7 Likes
its like taking apart an analog clock as a kid, then having kids and saying, lets take apart a clock and see how it works, and you crack it open and its a circuit board and a bunch of IC’s…and the kids is like “daddy, how does it work?” and all you can tell her is…“i have no F-ing clue”.
10 Likes
I also get quite grumpy when people say “you can’t just ‘view source’ like in the good old days”. Not only is that false, modern DOM inspectors are one billion times better for doing the same thing, letting you view generated code, make live changes, directly see what code corresponds to which element, and see all the CSS rules affecting an element and where they come from. And you have a js console, HTTP inspector, debugger and what all else. It is much easier to learn HTML, CSS and JavaScript through experimentation on the modern web.
It’s true that obfuscated code and gratuitous libraries are a barrier to understanding, but then, what would you be trying to understand – how to write bloated code that depends on a ton of crusty libraries to emulate every other crappy site? It was never the case that you could learn programming just by reading the source, except on pages created specifically for didactic purposes (where it is still possible and, again, much easier now).
IMO the one thing that has changed for the worse is that, while there’s much better documentation now, a lot of it is blind-leading-the-blind groupthink. In particular, Stack Overflow answers lean heavily toward the use of gratuitous libraries; jQuery is basically assumed to be a W3C standard at this point. My top tip for anyone trying to learn 90s-style lone-wolf web development would be to use MDN as your authoritative source of information.
4 Likes
I miss HyperCard.
5 Likes
When I was a boy we had to chisel our code out of raw bits and bytes, using crude stone tools on a rough sawn wooden bench.
6 Likes
When I was a boy we had to chisel our code out of raw bits and bytes, using crude stone tools on a rough sawn wooden bench
Pffft…look at this guy and his fancy wooden bench. 
9 Likes
I once created a tower of hanoi solver in one index file. I since broke it up into 3: html, css, and js, but it doesn’t use any frameworks or non-standard magic. Wrote it years ago to help my son understand the Tower of Hanoi problem. And it still works!
https://ganchrow.com/andrew/towerofhanoi/
ETA: It’s kind of a pain to use, but it was fun to write.
3 Likes
One self-contained file:
3 Likes
My browser refused to load any of the one HTML page challenge entries because they had no embedded trackers.
All the best!
-Slant, from just a few years in the future.
1 Like
I love this idea; been there, done that.
It’s easy to forget how terrible things looked, though. As much as I hate (and at times bitterly resent) CSS, it has helped slightly. Though I would much rather things been done differently.
Yeah. It’s not really a clock any more, it’s a computer designed to rotate a motor in a simulacrum of one.
That has absolutely not been my experience. Just using the tools you mention requires more training than just looking at html text files.
I remember using a browser and a text editor on a desktop machine—without any access to the net, and a paper book filled with human-readable instructions. Today? If I forget anything (which I frequently do), I have to find one of the W3C pages and then putz with stuff until I can get 90% the way towards what I want (mostly with CSS). And then there’s ancillary matters like encryption &c.
I just think the web used to be a lot more accessible/easier to learn and do, before a bunch of programmers ran with it.
4 Likes
You may not like it, but this is what peak Web looks like:
3 Likes
Ah, HyperCard… I could teach a course called Designing Computer-based Learning Environments to non-programmer education students and they’d come up with some beautiful little projects (in 10 weeks, including learning HC and about different types of learning environments).
2 Likes
Not beautiful to look at, but lots of information in a little space, ran on all browsers, and mainly ADA compliant.
1 Like
Either from the future, or you are a current Chrome user!
1 Like
Confusing, jumbled, and often hard to read.
I was there, Gandalf, when the design of men failed.
1 Like
