Live data from Hacker News

Entire website in a single HTML file

css-tricks.com

81–90 of 333 posts

Re: Entire website in a single HTML file

#81
post #65

Earlier quoted context omitted.

Nobody else is really doing this, or was doing this. But you can't tell that it's different, that's what's neat about it. It works just like a multi-page site but there's not even any JS requirement.

A decade ago we have this niche vBulletin forum where members would self-publish news article regarding the hobby. vBulletin BBCode is pretty limited, but then the admin started to add more and more styling support via custom BBCode. At one point we were able to create "interactive" content entirely in our heavily customized BBCode without a single line of JS, and this #target is one of the more used tricks.

That sounds like a pretty cool BBCode hack (and ultra-permissive by the admin considering...admins), I'd like to see it in action in 10-years-ago form.

Re: Entire website in a single HTML file

#82
post #8

This is something I've always wanted for virtual textbooks. A single .html file with all the JS, CSS, images as inline data blobs, etc. For most physics, math, CS, etc books, this should be possible. It would make it trivial to download the book for offline use and share it with others. Other than the raster images, the entire content of these types of books would probably fit in a couple MB of text. The use of #anch…

I don't see why you couldn't handle images with base64 data urls...

Re: Entire website in a single HTML file

#83
post #42

Anyone here absolutely godsmacked that this is the top news on HN? The hell happened? Did I get cryogenically frozen and just woke up?

I had the same reaction.

It would be like telling someone who has been using an IDE: did you know you can compile your code from the command line? And having that person genuinely be blown away.

Re: Entire website in a single HTML file

#84
HTML and CSS alone are really powerful. I decided not to use any JS on my personal site, but you can still have:

+ collapsible sections with `details` and `summary`[0]

+ footnotes, with navigation to/from with anchor tags. You can even apply CSS on the currently selected footnote.[1]

+ Semantic web that is compatible with everything and has sensible defaults so you can focus on what you're actually doing!

+ Tiny deploys and page loads. Single KBs (with brotli compression) for long blog posts. Just `scp` and Nginx keeps serving.

I can't think of anything else I want. And when I think of it, I can probably build it on top.

[0]: https://maddo.xxx

[1]: https://maddo.xxx/thoughts/an-introduction-to-product-strate...

Re: Entire website in a single HTML file

#86
post #8

This is something I've always wanted for virtual textbooks. A single .html file with all the JS, CSS, images as inline data blobs, etc. For most physics, math, CS, etc books, this should be possible. It would make it trivial to download the book for offline use and share it with others. Other than the raster images, the entire content of these types of books would probably fit in a couple MB of text. The use of #anch…

You're describing PDF files, but unfortunately Adobe didn't invest much time or money into making them interactive with a scripting language.

Emphatically no.

HTML can be responsive, like an electronic document should.

PDF was designed to faithfully represent paper, and it has all the fluidity and customizability of a stack of printed paper. It's also completely anti-semantic: it has no document structure beside pages, and each page just describes how to put ink onto paper.

I think that the principal application area of PDF is just that: to represent paper, for printing purposes. For everything else, it's not exactly great.

Re: Entire website in a single HTML file

#87
post #84

HTML and CSS alone are really powerful. I decided not to use any JS on my personal site, but you can still have: + collapsible sections with `details` and `summary`[0] + footnotes, with navigation to/from with anchor tags. You can even apply CSS on the currently selected footnote.[1] + Semantic web that is compatible with everything and has sensible defaults so you can focus on what you're actually doing! + Tiny depl…

> HTML and CSS alone are really powerful

https://html.energy/

Re: Entire website in a single HTML file

#88

Earlier quoted context omitted.

You're describing PDF files, but unfortunately Adobe didn't invest much time or money into making them interactive with a scripting language.

PDF has a limitation: it defines page size and the layout of everything fixed to this page, and thus can't do responsive layout like HTML can (reorganizing stuff in the page to match the screen size)

Feature.

The dimensioning problem isn't PDFs. The dimensioning problem is computer displays.

Get yourself an e-ink display of 10" or 13" (standard dimensions offered by the patent-monopoly vendor across multiple OEMs), and discover that online reading of PDFs is 1) quite pleasant (so long as the underlying PDF formatting itself is sane) and 2) vastly preferable to either HTML or "fluid" ePub or Mobi file formats.

Book formats developed over about 500 years largely guided by the capabilities and limitations of human eyes and hands. Typical mass-market books range in size from roughly 6" to 12" diagonal measure. Yes, there are smaller and larger formats, these are deviations from the norm and impose compromises for other concerns (portability for smaller formats, resolution for larger ones, typically pictoral or graphical in nature).

A 5" or 6" mobile device presents less display area than an index card. Laptop displays are too short to display a portrait-mode document one page at a time, and in almost all cases too small to present a 2-page up display.

(You can verify this yourself trivially at the Internet Archive using its BookReader, e.g., https://archive.org/details/UnderstandingPhotoTypesetting/pa...)

When wedding PDFs with an appropriate display technology, the frustrations fixed-proportion PDF display disappear.

This does rely on the PDF being dimensioned for a typical book size, though there's considerable flexibility here, and any dimensions from ~6" to well over 12" will tend to be readable, there's no need for precisely matching device to document size.

I'm saying this as someone who's long railed against PDFs for documentation. My mind's been changed.

Re: Entire website in a single HTML file

#89
post #8

This is something I've always wanted for virtual textbooks. A single .html file with all the JS, CSS, images as inline data blobs, etc. For most physics, math, CS, etc books, this should be possible. It would make it trivial to download the book for offline use and share it with others. Other than the raster images, the entire content of these types of books would probably fit in a couple MB of text. The use of #anch…

I think you've just described an EPUB?

I thought epub files were basically zip archives of all the required files

Re: Entire website in a single HTML file

#90
post #5

Normal websites used to be one file way back in the day. It was a "pro tip" to split out the JS & CSS into a separate files.

Web pages used to be a single file.

This is a web site as a single file, using CSS only.

It's a CSS equivalent to a single-page application (SPA), except that this is a single-page site. SPS, perhaps, or maybe a multi-paged file (MPF).

Strictly, it requires CSS features which weren't originally present in HTML, though the concept's likely been possible since the early 2000s, if not late 1990s.

It does rely on CSS support within the browser, and some simple browsers (mostly terminal-mode clients) won't present the multi-page aspect. The site / page itself remains useful.

Post reply on HN