top | item 38680709

You Don't Need HTML

95 points| tomhazledine | 2 years ago |shkspr.mobi

58 comments

order

dschuessler|2 years ago

This is fun and I understand it's a joke.

But since so many people do not understand the importance of HTML for accessibility, I feel the need to stress that this page may be a horrible experience for non-sighted people.

To sighted people, obscure unicode characters may look like text in a different font, but do they for screen readers? The same goes for ASCII art and the tables on this page.

Do all the fun stuff! But please draw the right conclusions for real-world projects.

rezonant|2 years ago

I only clicked this story because I was worried someone was just using canvas and JS and ignoring the fact that it's entirely invisible to accessibility features. I heard there is ongoing work to introduce a direct accessibility tree API, but for now the DOM is required.

Instead it's much adieu about nothing since you could simply serve a text file.

That being said, <plaintext> is a nifty historical footnote I didn't know about, so that's cool.

Side note, a lot of people aren't aware that businesses in the US can be sued for violations of the Americans with Disabilities Act (ADA) for non-accessible websites.

lhamil64|2 years ago

Thanks for pointing this out. I'm visually impaired but don't tend to need a screen reader that often. But the times I do want/need to use one, I inevitably find things that are just awful. For fun, I tried turning on TalkBack on my phone and this demo site was completely inaccessible (TalkBack didn't pick up anything other than the archive.org controls). Maybe part of that is it being on archive.org, but I suspect it's due to the lack of any real HTML.

acomjean|2 years ago

To be fair, the post which tells you “you don’t need html” is html. Which either is whimsical or a little odd.

I can see ascii art being a nightmare for screen readers.

est|2 years ago

> importance of HTML for accessibility

Can we simply say, Javascript driven SPA was a bad fad

franky47|2 years ago

RFCs were originally formatted as plain-text, and render well on most browsers (as long as the viewport width can fit 70 characters).

The first time I inspected one in a modern browser devtools, I was confused: "where's the HTML? How do they do this layout?". It's done with spaces, same way as you would with a typewriter.

https://www.rfc-editor.org/rfc/rfc2324.txt

eviks|2 years ago

They don't render well even outside of the huge smartphone use case because they lack trivial formatting present even in the old printed medium (and even typewriters were richer, could retype the same char on the same spot to make it stand out or use underlines)

ikari_pl|2 years ago

You can totally add some invisible tags for semantics.

What I love about these documents is how beautiful, clean and readable they are. How do do it myself, I don't know, but would love to

chrismorgan|2 years ago

I’m puzzled by the first line, the HTML framing. Why not just serve it `content-type: text/plain; charset=utf-8`?

xjay|2 years ago

A byte-order mark (BOM) would have the highest priority. [1]

BOM > HTTP charset > HTML meta charset

Also works for local files (not served over HTTP).

> You could skip the meta encoding declaration if you have a BOM, but we recommend that you keep it, since it helps people looking at the source code to ascertain what the encoding of the page is. [1]

[1] https://www.w3.org/International/questions/qa-html-encoding-...

dexwiz|2 years ago

This reminds me of the old GameFAQs before everything was monetized blogspam. You knew you had a good guide if it had a decent ASCII art header.

8n4vidtmkvmk|2 years ago

Responsive... "In that it generates a violent response from web designers. "

Didn't know about plaintext.l element. Could have just set content-type: text/plain; charset=utf8 though. Then it really would be no html

perilunar|2 years ago

You absolutely can make a website without any HTML, not even a scrap of invalid markup.

Just use SVG. It does not need to be embedded in HTML to work.

janosdebugs|2 years ago

Why stop there? Use arbitrary XML and style it with CSS.

dschuessler|2 years ago

> <meta charset="UTF-8"> is real. Without this, text encoding sniffing takes places and some browsers just displayed rubbish.

I am curious. Which browsers do this? I thought this tag is unnecessary in HTML5 because the information that the page is UTF-8 encoded is already implicitly conveyed by the DOCTYPE. (UTF-8 is the only encoding allowed for HTML5.)

kalleboo|2 years ago

I tried rehosting this file on localhost and removing the <meta charset="UTF-8">, breaks it in the latest versions of Safari, Firefox and Chrome

I tried to fix it by replacing the fake doctype with <!DOCTYPE html>, and it fails in the same way (but the page gets slightly more padding in the top of each page, proving it's doing something to switch modes).

edent|2 years ago

As you can see, I didn't use that doctype. I experimented with a few older browsers (and one of those online virtual testers) and a few displayed weird results without it.

rado|2 years ago

Funny, but I’m saying it seriously as a countermeasure to the bloat epidemic. An SMS parking app doesn’t even need Internet and works fine. Use the simplest technology to achieve a goal and enhance.

qayxc|2 years ago

You forget the fact that bloat is driven by many stakeholders, not just developers. Bloat is the consequence of ever increasing demand for bells and whistles, the pressure to release something (case in point: github projects that don't get updates every other month are considered dead) amongst other factors.

An SMS parking app works fine as long as you limit it to the very specific use case. As soon as the "enhance"-part enters the picture, chances are simplicity leaves the scene at the same moment. Complexity can only be avoided by keeping the problem simple.

wryanzimmerman|2 years ago

As someone who travels a lot, SMS based app stuff is one of the most annoying common problems.

It’s easy to find a way to get internet anywhere, but getting an sms message at a phone number is way harder (or easy but expensive); bonus points if you restrict it to local phone numbers only. Lots of countries require ID checks to get a local number and the system breaks with foreign IDs.

xialvjun|2 years ago

Add less, ship less, worry about less. -- HTML is all you need to make a website

But if I could, I'd like to add none, ship none, worry about none. My employer made me add so many shit. I have no choice.

eternityforest|2 years ago

It would be fun to have something like Advent of code, but for arbitrary restrictions.

The grand finale could be making something without using a computer at all or buying anything (Not even for research, you have to use actual books or talk to people), and trying to use as little tech as possible.

Like, you can use a power drill, but if you use a brace and bit you get extra points. You can document with a phone camera but if you can draw you might want to illustrate instead.

cliffbuxton|2 years ago

I particularly like the Arecibo message part. Shame the OG site doesn't seem to be up, but glad there's a waybackmachine link in the post

edent|2 years ago

Sadly the domain name was from Freenom. All of the names registered with them have gone. I can't find a way to get my Mali domains back.

daemonologist|2 years ago

I was expecting this to be all JS drawing to a canvas (which, I know, is technically HTML) but this is pretty good too.

forgotmypw17|2 years ago

Thanks for the tip about <plaintext>. I think it will be very useful in some cases.

vcg3rd|2 years ago

It's been years since I saw it, but there was someone who was convinced pdf should have become the standard for web pages and did a site in pdf only.

Assuming I remember correctly.

ggm|2 years ago

We all need more EBCDIC in our lives. The flow chart is lying.

tannhaeuser|2 years ago

"We're way out of our league here.

After all, we're up against the brightest minds in the world, the scientists who invented the world wide web."

And besides, what about links?

quickthrower2|2 years ago

    You do it like this [0]

    [0] https://...