Browser defaults for all HTML elements look "dated". The visual appearance of meter, as with all elements, is adjusted via CSS.
> . map/area - it's absolute positioning, which is unusable for the variety of devices we use today
It's relative to the image dimensions, not the page/viewport.
You don't (and didn't) need PHP for server-side includes. Apache has had them forever. A lot of cheap hosting is LAMP stack, so has PHP available, but you don't need to use it to get SSI.
Mind you, I'm talking about cheapest hosting possible, where 20 MB was a "step up" option.
SSI was commonly enabled on university web servers IIRC, but not commercial hosts.
also, CSS Flex
This was a significant dissuader, especially when you consider how you can’t transition the height (very often desirable) without added JavaScript. So <details> has really only been seeing much use in the last few years.
(The minimum possible polyfill is just under 750 bytes, supporting IE9+/Edge, requiring <summary> to be provided, and disallowing text children of <details>. The typical polyfill was more like 2–3KB.)
meter/progress can be styled consistently, but it's tricky because of the browser inconsistencies you mention. it took a lot of playing around with weird vendor-prefixed pseudos to get these looking similar across platforms.
sub/sub/abbr just need to be normalized first - normalize.css is a good reference for this. abbr can be useful for providing short "aside" info on a word/phrase in a semantic way.
styling detail/summary is relatively easy and they're pretty useful for FAQs and the like. i see web designers experimenting with more and more these days.
map/area, i don't use, but have seen it used on experimental designs to neat effect. and object is as you said, hard to predict for styling.
ps - it looks like chrome (105) will finally support mathML along with firefox and safari, so perhaps that will impact sub/sup usage in the future.
Also applies to progress, for which you need to use obscure browser-specific CSS rules.
The original use-case would have been something like: imagine you code a game physics engine in Java, and deploy it as a Java applet. You can embed that physics engine into a page as an <object> — and then consume it as a local API using JavaScript embedded on the same page.
(And yes, this is almost certainly the real reason JavaScript is called "JavaScript." When it was created, it was precisely positioned as a glue language for consuming/driving Java-applet APIs!)
Java-applet-based APIs (and their Windows-proprietary ActiveX cousins) are dead, so there's no real reason to care about <object> any more. As long as the browser knows how to render the media if you navigate directly to its URL, you can just use an <iframe>.
It's not needed anymore for audio or video — they have their own tags now — and plugins are dead.
Easier now that plugins are dead and <object> is basically equivalent to <iframe>
1. meter/progress - default style looks dated, styling works different on different browsers, the color scale options are confusing
2. sup/sub & 7. abbr - these are only useful for page content (as opposed to site design), which is usually WYSIWYG or something like Markdown. Many editors/parsers don't support it, at least by default.
4. map/area - it's absolute positioning, which is unusable for the variety of devices we use today
5. detail/summary - it's also more content than design and has basically no support in content editors, but it has been growing in popularity in things like GitHub READMEs where only basic markup is allowed.
6. object - hard to know what filetypes will be supported and little feedback when they aren't. It usually safer to either include a JS reader with your site or just download the file.