TL;DR
Web pages can include made-up HTML tag names; browsers will treat unknown tags as generic elements and you can style them with CSS. Using hyphenated names prevents future conflicts with official HTML element names and can improve markup readability compared with many nested <div> elements.
What happened
A simple technique demonstrated on a programming blog shows that developers can use arbitrary tag names in HTML instead of relying only on generic containers like <div> and <span>. Browsers do not crash or ignore these tags; they render unrecognized tags as generic elements and apply whatever styling the CSS specifies. The post recommends preferring native semantic elements when available but notes that inventing descriptive tag names can make deeply nested structures easier to read and manipulate. It also highlights a practical rule: include a hyphen in custom tag names to avoid potential name collisions with future HTML revisions. The example includes corresponding CSS that sets display and visual styles for a made-up tag, showing that custom tags can be selected and styled like ordinary elements.
Why it matters
- Improves code readability by replacing chains of generic containers with descriptive element names.
- Hyphenated custom names reduce the risk of clashing with future official HTML element names.
- Unknown tags are still controllable via CSS, so visual layout and styling remain under the developer’s control.
- Encourages careful use of semantic built-in tags while offering a pragmatic alternative for complex nested markup.
Key facts
- Browsers treat unrecognized HTML tags as generic elements and apply CSS rules to them.
- You can write arbitrary tag names instead of using only <div> or <span>.
- Including a hyphen in a custom tag name helps guarantee it won’t be used by future HTML specifications.
- CSS selectors can target made-up tags the same way they target standard elements (example shown styling a <cool-thing> tag).
- The author advises using descriptive built-in tags when they already exist rather than inventing new ones.
- Replacing nested <div> structures with descriptive tags can simplify locating insertion points in markup.
What to watch next
- How custom, made-up tags interact with accessibility tools and assistive technologies: not confirmed in the source.
- Whether validators or linters flag nonstandard tag names in development pipelines: not confirmed in the source.
- Compatibility or behavioral differences across older browsers and user agents: not confirmed in the source.
Quick glossary
- HTML element: A building block of web pages represented by tags such as <div>, <p>, and <section>, which the browser parses and renders.
- CSS selector: A pattern used in CSS to select and apply styles to HTML elements.
- Semantic tag: An HTML element that conveys meaning about its content (for example, <header>, <article>, <nav>), helping readability and accessibility.
- Hyphenated name: An element name that includes a hyphen character; in this context it’s recommended to reduce the chance of future specification name collisions.
Reader FAQ
Will browsers render made-up HTML tags?
Yes. Browsers handle unrecognized tags as generic elements and will apply CSS rules to them.
Should I include a hyphen in a custom tag name?
Yes. The source advises using a hyphen so the tag name won’t appear in future HTML versions.
Is it better to invent tags than to use <div> everywhere?
The source recommends using descriptive built-in tags when available, but notes invented tags can improve readability compared with many nested <div>s.
Do custom tags affect accessibility or SEO?
not confirmed in the source
You can make up HTML tags: Aug 2, 2025 (Programming) Instead of writing HTML like this: Hello, World! … you can write HTML like this: Hello, World! … and CSS…
Sources
- You can make up HTML tags
- Is there a way to create your own html tag in HTML5?
- Custom HTML Tags (18 Things To Know Before Using Them)
- What is the most efficient way to write HTML markup?
Related posts
- Slaughtering Competition Problems Using Quantifier Elimination in SageMath
- How to Complain (2024): Practical Advice for Clear, Constructive Criticism
- No, it’s not a battleship: Trump plan more like a large missile cruiser