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 5 years ago.
Improve this question
I've stumbled about the element on w3schools but as far as caniuse.com told me, the element isn't supported by IE, Opera Mini and the UC Browser for Android.
Would I be better by going with a <main> element or should I stick with a <div id="main">?
caniuse.com told me, the element isn't supported by IE, Opera Mini and the UC Browser for Android
That isn't what it says.
It says "Partial support" and:
Partial support refers to missing the default styling, as technically the elements are considered "unknown". This is easily taken care of by manually setting the default display value for each tag
So if main has the appropriate semantics, then use it. Just make sure to explicitly set display: block.
If the browser doesn't expose the semantics of using main then it will have no semantics, which is the same as a div.
From the looks of it I wouldn't worry about compatibility, unless you are trying to support IE 8 and below.. You can cover all your bases by using both <main role="main"> per MDN
The element is widely supported. For Internet Explorer 11 and
below, it is suggested that an ARIA role of "main" be added to the
element to ensure it is accessible (screen readers like JAWS,
used in combination with older versions of Internet Explorer, will be
able to understand the semantic meaning of the element once
this role attribute is included).
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 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
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
So I just remembered that people were going on about the main element and whether or not it's a good idea and whether or not we should use it or even have one to begin with. I also remember being against the idea of a main element.
But as I was typing <div id="main", I asked myself, "If I'm applying main to an id, then why not see if the main element has been standardized yet?"
So then I looked it up. HTML5 Doctor says yes we can use it. But from their article, it looks like it's still not fully supported. I know that we can use JavaScript to make things easier for late-comers (browsers not adopting the new Standards as quickly as others) - and I know that Can I use (.com) says the major browsers support it, but has anyone had any issues while using it?
Are there any reasons I'm not aware of why I shouldn't use it?
There is broad support for <main> but if you have to deal with older browsers, the following CSS rule will make it work for them
main {
display: block;
}
The CSS specification requires browsers to treat all elements they don't recognize as inline, so this rule tells them to treat it properly as block instead.
If you need to support a browser so old that it doesn't implement CSS, that's another ballgame.
Not trying to be a smart ass but to elaborate on Stephen Thomas' answer:
If you need to support IE8 or older you might want to add the latest version of the HTML5shiv (if you haven't already) or add this to the head of your page above your stylesheet(s):
<!--[if lt IE 9]>
<script>
(function (d) {
d.createElement('MAIN');
// ... more HTML5 elements
}(document));
</script>
<![endif]-->
And the CSS (as Stephen Thomas already described):
main {
display: block;
}
Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 9 years ago.
Improve this question
I am in the process of building a web-site with html and css.
Till now I viewed the code through my browser (explorer 10) and adjusted it in a way that it would look good on the browser. (Moved objects around, determine their size etc.)
Sadly, I recently discovered a bitter truth - the fact that everything look good and is in position in explorer 10 on my pc doesn't say anything about how it will look in different browsers or even different versions of the same browser.
I tried it on Chrome, explorer 11 on my laptop and tried to change the screen resolution- in all those cases the page didn't display as expected.
[Objects were misplaced, the cover photo didn't cover all the screen , etc.]
What properties in the css are responsible for compatibility in display between browsers, versions and resolution?
Those who have experience in web-developing - can you recommend a platform that makes the developing process easier? (maybe takes care of cross browsers compatibility and so on).
Something that is better than just starting from an empty html file.
You have to edit lots of css cross browsers depending on how they each render the results.
Read these two articles,
CSS Mistakes
Cross browser coding
This is the reason a great deal of web developers are using well known, mobile ready style libraries. Your question is broad, however, there is no reason why a web developer cannot point you in the right direction.
Take a look at Twitter Bootstrap. It's a mobile ready CSS/Script library which you can reference via CDN or you can install the library in your application. Not only is it mobile ready, but it is cross browser compliant. You will most likely be pleased with your results using Twitter Bootstrap styles.
http://getbootstrap.com/getting-started/
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
So say I have a website that was built using tables and specifically width tags (Awful I know). According to w3schools that website isn't using HTML5 because the width is no longer supported. My question is would I need to change that code, because it wouldn't be supported by modern day browsers? Or perhaps because it won't be supported later down the road?
That all depends on what browsers you want your site to support. However, as a practical matter most browsers are going to be backward compatible for a while. Most modern browsers still support very early versions of HTML going back to the mid 90's.
That said, it is always a good idea to make sure you are setting the doctype tag on the page appropriately so the browser knows what it is getting and can accommodate it.
There never was a width tag in HTML. For some elements, the width attribute can be used. There is no change in browser support to it; HTML5 drafts require browsers to support legacy attributes even though those drafts declare them as obsolete. W3schools is unreliable and misleading; see w3fools.
As a general rule I would say no. I haven't read the spec or anything but it sounds like the width tag is being depreciated on tables?
If this site was intended to last 6-7 years without major changes then maybe you might want to futureproof it but it seems rather unlikely that the browser venders will break support any time soon. Too much of the web would be broken.
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 designing a website which has to reach old and new browsers. With this in mind should I program in HTML5? Currently the website is only in html 5. The question is: Is it stupid in my case to use HTML5, should I use a "switch"(is this even possible) to redirect old browsers?
The question is, what aspects of html5 do you plan to use?
If your website is mostly static html & javascript, no audio and no embedded video, then I would say it use HTML4.
If your not using any tags in html5 dont rush it, no
If you're trying to reach a broad audience, I wouldn't necessarily jump into HTML 5 yet. It's still not supported widely or consistently enough to rely on it. However, there are several resources available if you want to give it a shot.
When Can I Use... should be a big help. It shows which features of HTML 5 are supported in which browsers fairly clearly. It would probably be good to research further about each tag you plan on using. Learn how the major browsers have implemented the tags, and if there's any quirks or bare-bones implementations that might be an obstacle to the average user.
I've heard Modernizr listed as a means of leveraging HTML 5 elements while maintaining backwards support for old browsers. Do note that I can't testify personally to how well it performs, having never used it before.