[HN Gopher] Ask HN: What are solid examples of well written HTML...
___________________________________________________________________
Ask HN: What are solid examples of well written HTML and CSS
websites?
Recently I started analyzing much more the documents and
stylesheets I produce as well as reading more the official CSS and
HTML specs. While catering to implementers of user agents, they are
generally a goldmine of solid information. I'd like also to get
inspired by quality work on the web, but inspecting websites pretty
much never yields anything that resembles a readable document, HTML
semantics and CSS quality are generally in a disastrous state.
Thus my question, can you suggest websites who's html and css can
be considered of extremely high standards? I can't list many safe
for MDN and wikipedia.
Author : epolanski
Score : 15 points
Date : 2022-03-26 20:48 UTC (2 hours ago)
| tannhaeuser wrote:
| > _HTML semantics and CSS quality are generally in a disastrous
| state_
|
| I believe many people have tried hard to do the right thing. But
| the truth of the matter is that HTML as a markup vocabulary is
| stuck at a 80's core language with a 90's vision for casual
| academic publishing mixed in, and then since mid/late 90's, CSS
| (and a gazillion of divs and spans) has been kludged on top to
| make up for HTML's lack of evolution and inappropriateness to
| describe digital content in this millenium. Yes we can kindof
| make it work, but it cannot be said that today's web stack is
| even remotely usable by actual content creators like even Flash
| used to be. Instead, we're churning through complex JavaScript
| frameworks, new languages, and entire new runtimes to exercise
| browsers into a workable platform for web apps with a laughable
| power budget.
|
| What's left of grand visions for "semantic" HTML and
| structure/presentation separation, invented to lend credit to the
| HTML/CSS/JS trifecta after the fact more than anything else IMO,
| is maybe accessibility to some degree (which is at least
| something) and a hope for well-meant, bona fide SEO; and even the
| latter isn't helping anyone, and hasn't for a long time.
|
| The fundamental flaw of the proposed structure/presentation
| dichotomy is that a piece of digital content should be captured
| close to the "intent" of its author, which in the majority of
| cases is very different from an 80's idea of an academic paper
| with section, subsections, and paragraphs.
|
| This despite HTML being based on SGML which had always all means
| necessary to evolve markup in a highly structured fashion, and
| even encourages using your own vocabulary to map into an
| output/presentation vocabulary. For example, to model a sub-
| vocabulary for capturing a discussion thread like the one we're
| having here, which seems quite a natural use case for HTML - but
| nope, we must use hierarchical text and then pile a shit-tonne of
| CSS over it. Is that really "semantic", or rather a case of
| eternal September and embarrassing self-delusion?
| MatthiasPortzel wrote:
| Unfortunately I feel like there are too many different
| philosophies behind web design right now to point you to any
| given site. Mostly because any popular and complex site is going
| to use some levels of abstraction, i.e. React or Elm or similar.
| And so a lot of well-programmed websites don't have readable
| user-facing code. Or, on the other side of the spectrum, there
| are plenty of sites that value simplicity to the point that they
| have no-JS, minimal CSS, and super readable HTML. But that's not
| exactly hard to do.
|
| One of the ways that I learn is by picking out a given HTML tag,
| for example, from the soup of a website's source code. And then
| reading the MDN page for that tag, which has information on the
| idiomatic ways to use it.
| epolanski wrote:
| > And so a lot of well-programmed websites don't have readable
| user-facing code.
|
| What does it means "well-programmed" if the end product isn't:
|
| - accessible
|
| - semantically correct
|
| - light (no unnecessary javascript bloat, no unnecessary chains
| of dozens of divs, no cascading !important, very good
| performance)
|
| ?
|
| I don't buy much the "well-programmed" fable of applications
| that don't show that in the end result.
| MatthiasPortzel wrote:
| I'm arguing that at a certain scale, writing HTML by hand is
| unmaintainable, and so the best option is to use a framework
| like Elm. Elm is going to compile and minify into unreadable
| JS that then generates likely-unreadable HTML. (I'm using Elm
| as an example since its syntax is so different, but the same
| applies for Reactor whatever the kids are using these days.)
|
| I'm not disagreeing with you so much as giving my own
| tangential perspective.
| lgrebe wrote:
| Maybe https://whimsical.club/ is what you are looking for?
| jitl wrote:
| http://www.csszengarden.com/ has been preaching separate content
| & presentation for as long as I've been writing HTML.
| vehemenz wrote:
| I'm not sure I buy the premise of the question.
|
| Professional web developers don't have time to create elaborate
| abstractions for the sake of making their code "semantic" and
| easily understood by visitors reading their website's source.
|
| Websites are ultimately for the user agent. "Semantic" HTML and
| CSS were never really so. They were guidelines to create code
| that was way more abstract than necessary and smuggled in a lot
| of terminology and concepts from print media, all of which were
| somewhat important before there were things like Firebug and
| proper dev tools.
| epolanski wrote:
| Semantic html isn't important for visitors reading the source
| code but for web crawlers, seo and for accessibility.
|
| > They were guidelines to create code that was way more
| abstract than necessary and smuggled in a lot of terminology
| and concepts from print media
|
| This is historically very wrong. Also, printing of html
| documents is still one of its major uses (e.g. any time you
| download a pdf of a ticket you buy).
|
| I'm honestly baffled at how little care there is for well
| written html.
|
| If you don't care about your applications being html, don't
| bother putting them into browsers at all, just go native.
|
| Or if you really need the browser base, put everything in a
| canvas, why bother with xml?
|
| > Professional web developers don't have time to create
| elaborate abstractions for the sake of making their code
| "semantic"
|
| This attitude is how I end up having to decipher that a loop of
| divs is just a simple list, or have to decipher that some other
| weird div with complex onClick events was just an anchor (a
| link).
|
| There's plenty of benefits from writing semantically meaningful
| html and "professional web developers" should care about those
| if they want to write maintainable quality products rather than
| the next overbloated 5 MB JS broken e-commerce.
___________________________________________________________________
(page generated 2022-03-26 23:01 UTC)