Comment by Theodores | Hacker News Reader

Comment by Theodores | Hacker News Reader

Serious suggestion - semantic HTML5 with the tags in a decent IDE.

You may laugh but I am serious. Language has moved on and it has been moving on for as long as there has been recorded history.

With HTML5 you get the extra markup for 'section', 'article', 'aside' and there are other semantic elements that already exist - 'em' is not the same as 'i', it infers emphasis rather than making the letters italic.

See the elements as punctuation. Yep, that means writing 'p' tags around sentences. An IDE autocompletes the tags but it is gentle about spelling mistakes and grammar is unknown to it.

You can fully typeset a book in HTML, if you want to comment bits out then you can. With an IDE you can close sections between tags up.

Then there is good old version control. Compare your changes.

The medium has other creative opportunities. I might not finish my book that starts out with 'In 2019 we should be...' until 2021. I could just code that in so the year is correct.

So long as you have some fluency in HTML5 and know the tag vocabulary then the markup in the original document does no harm. Screenplays and plenty of other written forms have a format, tidy HTML5 is now mine.

The semantic tags and the 'outline friendly' structure also help writing. No longer does text just have to be text.

We are so used to 'div soup' style HTML churned out by a machine that we have forgotten what real HTML5 looks like. There is no need for the div, span and other coder-only elements, there is also no need for classes and ids if writing actual content in neat HTML5. With CSS Grid one's copy can be styled with a few basic rules on 'section', 'aside', 'figure' and other top level elements.

Proof reading is pretty good too - refresh the page in the browser. Plus, in text nowadays one does need to cite sources. Links are easy in HTML5, not so easy in other things.

Try it, you will be surprised. Plus, if you should be coding and you are working on your novel, most people will just see a programmer IDE on screen...

I like this idea, but maybe there should be (or maybe there is) a writing-specific subset of XML, like there is with music. The HTML elements come close to encompassing a lot of functionality, but I think there ought to be an expanded set of tags for doing ... stranger? .. things. For example, how would you render "House of Leaves" in HTML? I'm thinking of modern music composition and how it's really pushed music notation, and I think MusicXML handles it... so I imagine a WriteXML can cover traditional forms of writing and adapt to more experimental forms as itt developed.

Love the idea! In my teenage youth, I had two interests: writing fan-fics and coding up websites in HTML. Somehow I felt that the only way I can "trust" my writing to look correct is by live-coding it in HTML as I composed it.

Nowadays, I still write, and I use Markdown like you are "supposed to"… But it does never feel quite right.

The TEI (Text Encoding Initiative) XML format is a writing-specific XML vocabulary.

https://teibyexample.org/ https://en.wikipedia.org/wiki/Text_Encoding_Initiative

The whole set is enormous as it can encode all kinds of modern and ancient forms of literature with many kinds of annotations, even parallel versions of the same text as often happens with old works for which there is no known “original”. You can encode scribal variations etc.

There have been several attempts to create a simplified subset that would be useful for what we could call a normal modern book, but they haven’t got very far because it is still cumbersome and the tooling needed to work effectively with it is not freely available. I’m working on such tooling in my spare time, more focused on DocBook as the vast majority of what I write is technical documentation.

The simplified subset from TEI themselves is called TEI Lite: https://tei-c.org/guidelines/customization/lite/

If TEI sounds interesting to you, there is an application called TEI Publisher, Free Software under the GPLv3, that you might use: https://teipublisher.com/

Actually, looking at it again it now looks quite good. I’ll give it a try later.

Edit 24 minutes later: tried to install TEI Publisher, it works on top of the eXist XML DB, and after installing it, starting it gives me an “Exception in thread "AWT-EventQueue-0" java.lang.NullPointerException”. Ah well...

Well you can't just leave us hanging, what is a good ide for authoring good semantic html5?

Emacs.

I say that seriously, as a VIM user.

I am no expert on IDEs - I just use PHPstorm as it has uses for authoring SVG files that you don't get with Inkscape or other proper programs for SVG. I do put my docs on a Apache server that is localhost but the built in server of PHPstorm is pretty good. You get green squiggles under spelling mishtakes rather than angry red lines, you also get proper red squiggles for errors in HTML.

I don't need to use extensive facilities when writing HTML, the 'reformat code' button does come in handy and that is about it.

I think you get this in all IDEs. So my advice is to stick with what you know or go with VSCode. VSCode moght fall over with huge code bases but it 'War and Peace' is small compared to a codebase.

There is some vagueness about writing semantic HTML5, for instance, do articles go in sections or vice versa?

This does not help. I go with a main inside the body tag with that containing articles. Then in each article I put sections, asides and figures.

To keep my writing succinct I find that the html5 details/summary elements are really handy. You can write an article that has a paragraph of text and some bullet list of things then hide the waffle in a details/summary element rather than have it linked to on a separate page.

You can put sections, articles, more details/summary disclosure elements in a details/summary combo.

This is a world away from writing templates where everything is a div with classes and ids.

What I also recommend is a basic CSS stylesheet that loads a font with the font being variable width. Use that for the document, then use CSS grid to put some margins in so put header, footer, main in column 2 with the grid-template-columns set to something like 5vw 1fr 5vw. There is no need for 'reset.css' or other stuff, you have something pleasant to work with that can then be tinkered with over time, responsive out the box.

This is basically what I've been doing except I use all custom tags with custom written stylesheets. You can have a lot more flexibility that way.

Can you post an example?

Well, the novel is not finished. However, here is one of my early efforts at trying to write clean HTML5.

https://www.maggie-shaw.co.uk/

If you go straight to 'view source' you can see what I have tried to do in constructing 'human editable' HTML. The 'sections' do not have 'titles' and could be divs as I just need some wrapper to get the full width banner images in the middle of each 'article'.

I had started this page with 'details/summary' disclosure elements but ended up mimicking that interface with the headers at the top of each 'article' and some scripting.

I also tried to use 'form' as a container for all calls to actions, even if this was not a real 'form', but just a way to show an image full screen.

I was trying to do a few new things so maybe the 'nav' container was what I needed. But I wanted buttons for accessibility. The burger menu should be a 'button' for accessibility too.

The code and use of elements on this page only has class attributes for things that change, not as general styling hooks. A lot is contrived and could be improved, but I think I got the general idea of 'separation of concerns'.

Reply on news.ycombinator.com