Geek Answers Handbook

[X] HTML Tags: Pros and Cons

I would like to use some semantic [X] HTML tags instead of <div> s: <article> , <product> , <footer> etc. Some of them are already introduced in the upcoming HTML5, however this is not fully supported.

What are the possible disadvantages that I may encounter when rendering? Using CSS, JS?

I remember that IE6 cannot clone tags that it does not know.

+7
html html5 tags custom-tag
source share
5 answers

Adding the following JavaScript fix makes custom HTML5 tags work in IE. In fact, they work in any other browser that I have tried. I created my site using HTML5, and although it does not look great in IE6 and 7, it still works. Here is the code you put in the template header:

 <!--[if IE]> <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script> <style type="text/css"> .clear { zoom: 1;display: block;} </style> <![endif]-->

Using HTML5 tags gives you advanced CSS control because of their semantic nature. In fact, it’s much easier to create sites, as they are easier to understand if you use tags correctly.

Using divs is great everywhere, because if they have the appropriate id and classes, they are still semantic, but with HTML5 tags you can quickly recognize the page structure.

+7
source share

Cloning is mentioned in this question, so no matter if IE6 can create its own element (it can), it really is not a question if the intention is to use JS to clone custom elements if IE6 cannot do this (which I I do not know).

If the idea is only to style custom elements, then every browser can do it. Because of IE6, you need a namespace for your own elements, thus <prefix: custom / "> and specify a namespace in the HTML element, thus <html xmlns: prefix =" http: // domain / path ">.

In order for everything to be correct in all browsers (and therefore Javascript selects custom elements), you also need to provide a custom DTD so that the namespace of the custom elements works sequentially, thus <! DOCTYPE html SYSTEM "http: //domain/path/custom.dtd"> and then write a DTD, which, unfortunately, is not trivial and should include a complete replacement for the HTML DTD that it replaces.

So, after applying a custom DTD, specifying your own namespace and applying custom elements, they can be written in any browser, so the style is <style> prefix \: custom {background: red;} </style>.

This works consistently in all browsers, but is relevant for discussion. This allows you to use consistent, meaningful markup with elements that are clearly denoted by a namespace and are not at risk of cascading styles and avoid div-itis.

However, this is a bit of a ghetto in website development, which involves complexity that might not be well rewarded.

+3
source share

Even if you use JS to enable IE 6 to recognize HTML5 tags, you will still have problems because IE 6 will not allow such tags to be inserted.

On the other hand, if your web page is not application-oriented, but solely for presentation, you can use plain old XML with style. It differs slightly from the traditional way of creating pages, but there are no "old" or "new" tags in XML terms.

See this page - http://feeds.feedburner.com/blogspot/MKuf (Google Blog Feed) for an example of stylized XML. JS and DOM APIs also work well.

+2
source share

This does not speak fully about your question, but <product> not semantic for computers.

A person can read it and think: “Yeah, it must be a product which, in the context of this shopping website, means something that I can buy, and therefore does not mean“ the amount obtained by multiplying the quantities as it can be on mathoverflow.com. "This is really useful for anyone reading the code, so its semantics are in that sense.

But since the computer parses your page as HTML (or a person views your HTML page in a browser rather than reading the code), its simply an unknown tag and therefore will not get any useful default style (unlike the <p> , which gets good margins to do the reading on the screen) or behavior (unlike the <a> tag, which you can click if you give it the href attribute).

Computers only get semantics when people agree on what tags mean with specifications like HTML5.

+2
source share

If you are not developing a very limited set of browsers, this sounds good. If it works at all in older browsers, this will not work; it will be years until we can expect good support for HTML 5 from all common browsers.

+1
source share

More articles:


All Articles