HTDML: the people's convention
de-manipulate yourselves
Working draft:
Not because I múst...
But because I
It's a world-wide badly needed, completely new and innovating webdevelopment-convention with the purpose of taking away all the complications that 🤮 JaVaScRiPt 🤪 (which is executed on visitors' devices and cán do
HTDML stimulates the usage of custom HTML5-tags because they bring freedom to webdevelopers / webmasters: the freedom you
Given that: HTDML / custom-tags are tools to take back the web from corporate institutions and to give it back to the people for whom the internet has been invented.
<Annie-s-receipes>
or:<Joe-s-handy-tips>
or:<my-personal-opinion-about-all-the-taxes-I-have-to-pay-every-month>
Custom-HTDML tags-table (where the fun is)
Custom tags stylesheet (where the magic happens)
Not an advertisement, but looks like it
All languages available.
Beats searching
Recommendations:
<p-p> </p-p><br>
<section>
Your section here
</section>This way you will never break anything within the section.
The is just to give the tag some content if you don't want text there (= good practise).
<p-p>text<br>
text2<br>
another inline something</p-p>
But if you use 1 <custom-tag> with 1 standard tag, then you could just do <custom-tag><standardtag> and if you use something like that often, you can merge the CSS of the standard tag with the CSS of the custom tag
Don't over-complicate: it is wise to not mix two tags together, like <b> and <i> to make <b-i> because that will cause a lot of extra tags while <b><i> is easy enough to do.
Replace all non-semantic tags by semantic self-documenting forms, for example: <div> and <span> are the same things, but span is inline and div is block.
<part-shell><part-inner-shell><part-inner-shell2> instead of <div><div><div>. A span is <text-inner> and a span in a span is <text-inner2> etc.
Example:
<part-shell>
<part-inner-shell>
<part-inner-shell2>
<part-inner-shell3>
<text-inner>text-inner<br>
<text-inner2>Text inner2</text-inner2><br>
</text-inner>
</part-inner-shell3>
</part-inner-shell2>
</part-inner-shell>
</part-shell><div>
<div>
<div>
<div>
<span>text-inner<br>
<span>Text inner2</span><br>
</span>
</div>
</div>
</div>
</div>
Generally: I use classes almost only for exceptions, for items that really need their own specific styling, if the styling is more general, I make a custom-tag for it.
<var-colorname> and <varbg-colorname> (replace "colorname" with the name of your colorvariable) are the tag-naming conventions that i use for text-color and for background-color.
A <p> with dark background is <varbg-colorname><p> which could make a dark area inside a light-colored theme. It's best not to combine color-tags with other tags like <p-colorname>, but to always use them "stand-alone", that way the color(tag) will be available where-ever you need it.
it stands out between the other text-blocks for some reason
because it
So people keep on using <div> because there's just no good alternative. <center> was a clear way to add importance to a whole block (like a poem or a receipe), being inside an article, a section, or stand-alone. Ignoring the semantic meaning of this tag was an error and that's why we now have <div>-soup and not many usage of <article>, <section> etc.
card-tag article { then you can go crazy on that article in your styling without breaking any other <article> somewhere else on your websites, it acts like a docker-container keeping all it's goodies inside.There's a simular tag: <samp>, which can be used for the output of that code. But: this is an inline-tag, it does not permit block-level elements inside, they will not validate. Giving it a
display: block; in the CSS does not make it valid HTML5.Enter <samp-block>: this has all the same properties as <samp> but it is a block-level element, which makes it possible to give sample-outputs of block-level elements.
A custom HTDML-tag like <samp-block> is the only way to achieve this without overcomplicating things ánd at the same time give it a highly semantic value.
will not be over-written by other style-rules
because of the higher specifity they have
in relation to CSS-classes
by approximately:
So if you have many CSS-classes on one page and replace them with custom-tags
it'll bring a significant speed-gain
Why am I doing this?
I make websites since 1998 and at the moment of writing this text (may 2025), I have 446 of them and still
Social & Donate
Conclusions
HTDML is designed to give back the Web to the people, as it was promised to be. It is a set of tools and propositions to bring people, webdevelopers and companies together, to create a paradigm for the new web-standard, where privacy, authenticity, inclusivity and freedom are its most important goals. It aims to motivate people to start making their own (free or cheap) websites again and reshape the internet by doing so, in a way that it's accessible and understandable by everyone, including fresh-starting webdevelopers, disabled people and companies.
HTDML does not want to be dogmatic, see it as a proposition of online "custom-courtesy".
HTDML is valid HTML5, not valid usage will not be supported and adviced.
HTDML dóes try to be as SEO-friendly as possible, but only for accessibility and user-friendlyness, nót to please search-engines and not to achieve high-search rankings, those reasons are not important within the HTDML-philosophy.
HTDML wants to be all-inclusive and uses selfdocumenting tags for maximum visibility by screenreaders. Some browsers (like Firefox) do not explicitly follow the guidelines in the Whatwg-specifications, if you use this kind of browser or if you deliberately use a very old version of some browser, you will find that HTDML does not provide fall-backs for that, because HTDML is fully conforming to the whatwg-standards and does not accept "interpretations", because a standard is a standard and a standard should give no room for interpretations. Nowadays everyone can use a modern browser without any costs, they are easy to install, if you choose to not do so, then that's an autonomous decision on your part, HTDML does not have to adapt itself to your specific choices. If yóu want to do that: go ahead, but HTDML will not offer any support for it.
The HTDML-tags in the tag-table are all tags conforming to the elements-list in the whatwg-standards plus a few more: https://html.spec.whatwg.org/multipage/#toc-semantics. Tags with the type "Custom" are used for custom-purposes: for the functionality of my websites and only to be seen as a proposition or free-advice, you are ofcourse free to use them, if you wish to do so. These custom-tags are mentioned in the tag-table just to give you an idea of what is possible with HTDML. If you want to see all custom-tags that I use for functionality, you can have a look at the custom-tag-table.
All tags in the tag-table are made to be a hyperlink to a lexicon-page subsection (work in progress), which will give additional information about that specific tag. All standard tags have browser-added specific stylings, you can open dev-tools / inspection-tools and look on the elements-tab to see the "
HTDML does not use JavaScript, so it does not register tags and that works perfectly fine. As HTDML uses the KSS-principle (Keep it Stupid Simple) it does not want to complicate anything and: have a look around, does it work or doesn't it?
Open inspection-tool and click the performance-tab or do a Lighthouse-test, see for yourself how it works like a breeze.
Why we must take back the web
Straight answer:
because it was stolen from us, us the people.
Big Tech did it, reason: money.
To start with: SEO (Search Engine optimalisation)
In the beginning of the web, search engines just crawled the web and tried to match your search as good as they could, because the better results you get, the more likely you will come back to that search engine to look for more.
But their crawlers had trouble indexing the many non-standard (written by none-professionals) websites, so they invented rules: you can't do this and you have to do that and if you don't, your website will be on the bottom of the search results.
So companies dove into the SEO-thing and it was rewarded: all the nice personal pages dropped to the bottom and corporate-pages raised to the top of the search results and that became even worse: the more advertisements and tracking-cookies etc. you added to your website, the higher it came in the search rankings, because that´s where the money comes from: your data, your personal things. The more they know about you, the more you're worth on the market where you are being sold like cattle.
And now, look at the internet: it's all advertisements, content delivery networks, analytics tools tracking you down etc. Whenever you go to a website you have to wait to be verified as human, then you have to click the cookie-consent button and then you have to get rid of the advertisements blocking your view. And if you're finally done then what do you get? False information and boring websites that basically all look the same.
The web is not designed for people anymore, the fun is gone and all you're good for is your personal data. You're not a visitor, not even a user: you're pray for the wolves and they don't give a thing about you personally.
because it was promised to us,
to us the people.
by professional politicians;
people are motivated by mass suggestion,
their aim is producing more and consuming more,
as purposes in themselves.
Erich Fromm, The Art of Loving
Not an advertisement, but looks like it
And now for something completely different:
