Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 7 years ago.
Improve this question
I generally think generally think of div as a generic structural block, and my mental designation for a generic presentational block is different. In practice I use <div class='flair'></div> with a media query to hide most 'flair' on small screens. My use of the flair class seems more suited to its own tag (as opposed to a class), but there's nothing in the HTML element reference that fits this description, and the HTML spec in general seems to be moving away from presentational tags. I'm wondering if other people have considered a tag like this, or if the fact that I'm asking this question at all implies that I think of HTML elements differently than most.
For clarity, I think of a 'generic presentational block' as one that meets most of this criteria:
is not required to understand the content of the page
contains no text, anchors, buttons
is not flow content
So, I have some questions:
Do other people use a specific class to denote generic presentational blocks?
Do you feel like an existence of such a tag would improve the HTML that most developers write? (context: I generally consider div soup to be a negative)
How would you feel about browsers having a builtin feature that disables this tag. This feature would be a superset of tools like adblock and noscript
Regardless of whether the question is relevant or not - I understand what you mean about "div soup," but since your flairs are semantically meaningless I think it's technically fine.
I work with a developer who uses the <i> tag with a role="presentation" attribute added. Honestly, I haven't really looked into the use of <i> but using role="presentation" for accessibility purposes may be something to look into if you haven't already? And can be used to hide presentational flairs on mobile.
https://w3c.github.io/aria-in-html/#presentation
Related
Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed last month.
Improve this question
I'm trying to find ways to customize a website where I can only edit the content (text and image) via Contentful’s content management interface (the company that developed the website refuses to integrate the corporate identity and style guide and says it "might" be for future versions).
What do you think about adding HTML elements, inline CSS, or even adding style and loading fonts via style elements directly into the text fields? Given that these elements will obviously be in the middle of the body, is this really bad practice in terms of security and SEO (or other)?
Thank you a lot for your time.
I wouldn't say it's bad for security since it's just style (meaning how the users see the website).
Have you thought about linking the style file? It would maybe be a cleaner solution (don't forget you will have to maintain it later, and having it in a clear way will save you a lot of time reading and wondering what you did, so it's better to be clean) than adding everything inline inside body
As for SEO I believe it's more affected by the use of the elements than having the elements. I mean, if you want some content use instead of a tag that resembles by style to a heading.
Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 2 years ago.
Improve this question
Why do I need those tags ? :
Footer
Main
Article
Section
Form
Even if I don’t use those tags, I can get the same result, so what's the point of using these tags at all?
From MDN:
The HTML5 specification introduced several semantic sectioning elements to help organize the structure of documents. Semantic sectioning elements are specifically designed to communicate structural meaning to browsers and other technologies interpreting the document on behalf of users, such as screen readers and voice assistants.
Semantic sectioning elements clarify the larger-scale structures within a document. They are intended to enhance the limited semantics of earlier versions of HTML, which included only the tag as a generic mechanism for grouping related content
To mention also:
Important: There are no implementations of the proposed outline algorithm in web browsers nor assistive technology; it was never part of a final W3C specification. Therefore the outline algorithm should not be used to convey document structure to users. Authors are advised to use heading rank (h1-h6) to convey document structure.
and this is why you can't find any resources, because it is not standardized, and so it hasn't a common significance
Originally, HTML was all about formatting. That's why you have tags like b and i. Those tags tell you how the page is supposed to look, but they tell you nothing about what the data actually means. Over time, there's been a movement towards separating meaning and the appearance (especially with the advent of HTML5). That's why those tags exist.
With regards to your list, note that the form tag is different than the other ones you list - that particular one means that all of the input tags inside the form are intended to be sent to a server.
Yes, you can definitely do all such things without all these tags but it helps the browser to understand your code better and it will help you when you make big/complex website to understand edit your code easily.
Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 8 years ago.
Improve this question
I've been working on updating the coding standards for my web development organization. One aspect of this that has proven contentious among my co-workers is the ordering of HTML attributes. One co-worker, and many sources I have found online, suggest that class or id should come first, followed by others in order of importance.
<a class="foo" href="/bar/baz.html">Link</a>
Supposedly, this aids in readability. I'm not so sure in this case. Sometimes, when people say something is more readable, what they mean is that they have become accustomed to a certain pattern, and can't browse as easily without the pattern. Which is really more subjective than readability. Another co-worker suggests (and I happen to agree with him) that the defining attribute of the element should come first, and then any presentational or organizational attributes should follow. The essence of the anchor tag is the href attribute.
Link
This might be trivial on an anchor tag, so what about an input tag?
When scrolling through a form, I want to know right away what the input's type is: text, radio, button, etc. Class can come later.
How do the rest of you feel about this topic? I'm interested in hearing any arguments for both sides. Maybe we shouldn't even be worrying about this particular bit of syntax?
Technically, it doesn't matter at all. In terms of personal preferences, all that matters are the personal preferences of those on your team.
My personal preference is that this is minutia and overhead that no one really should be dwelling on.
Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 9 years ago.
Improve this question
I am writing a simple webapp and I need a status bar. Something that updates often to reflect what JavaScript is doing. It will only contain text, short complete sentences, but in the future it might have small informational images. Like, "An error occured" or "Please wait, loading..." or "Player 2 has disconnected". Now, I know how to make one, but my question is:
What is the most semantically correct HTML element to use for this?
Or will I have to resort to a <div> or <span>? If so, which one? I generally avoid those because they seem like a last resort.
Also, the statusbar may be anywhere on the page. Don't base your answer on its location on the page, that's not what semantics is about.
Please support your answer with some sort of official resource (w3, anything) if you can.
Being unable to find any source of information, I'll answer all by myself and defend my position. My answer is: it depends. The direct answer to your question is that there's no element specific for the status.
However, when this happen the solution normally chosen is to use a generic element as <div> or <span> and assign it some semantics. This can be achieved with class and id, as you are well aware. We cannot expect html to be perfectly semantic and cover every case possible. They are trying their best to cover the most common uses.
A very similar case is the <nav>. It was really common to see <div class = "nav"> or similar code in old html. w3 realized of this and changed it to make it more semantic. Maybe/hopefully they'll do the same for all those class = "status" for a <status>, it just hasn't happened yet.
For solving your problem right now: I'd recommend using a <p class = "status"> actually if your code is going to contain only a paragraph, as it seems. It's slightly more semantic than <div> and <span>.
Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 8 years ago.
Improve this question
I'm following a tutorial series on web development. While I already have a basic understanding of HTML and how to use it to structure a page, I'm indulging myself and watching the very beginner tutorials. The funny thing is, in these tutorials the author is using tags like address and cite. When he describes why one should use these tags, he explains it only as "semtantics."
While I feel like these tags may have been more prevalent ten years ago, I never run across anyone using them besides this guy. Given he is professional, I'm now conflicted on whether or not its really necessary to use them. What is the benefit?
According to the current HTML5.1 specification nightly (as modern as it gets):
The address element is valid perfectly fine to use and so is the cite element. While a lot of sites tend to mostly use tags like div and span you can feel safe to use both address and cite .
I think it's good practice that will help you later when you have to read your HTML again to insert changes. It improves accessibility of your document as well as lets parsers other than browsers understand it better.
(Note, address and cite are legal in the old HTML specification too)
The benefit of semantic tags is that they give your html some structure - by using them you are encoding meaning into your html that can be useful in all kinds of areas. Search engines often use semantic tags to assist in ranking pages, to use a simple example. Whilst it might not always seem necessary, it is good to get into the habit of using them wherever possible.