Show content if <noscript> OR <! - [if lte IE 7]> does conditional comment run without duplicate content?

I am developing an interactive Javascript-driven tool that does not support IE6 or IE7.

If someone appears using old IE or using a browser with Javascript disabled, we provide them with simple static content as a backup: simple images and text.

I could just do this by duplicating this static content, one copy in the <noscript> block and one copy in the conditional comment, like this ...

 <!--[if lte IE 7]> <div id="some-id"> <p> Some content </p> <img src="url.com" alt="Screenshot of awesome tool" title="This is what you're missing" /> <p> Some more content </p> <div id="some-more"> ... etc ... </div> </div> <![endif]--> <noscript><![if !(lte IE 7)]> <div id="some-id"> <p> Some content </p> <img src="url.com" alt="Screenshot of awesome tool" title="This is what you're missing" /> <p> Some more content </p> <div id="some-more"> ... etc ... </div> </div> <![endif]></noscript> 

... but, if possible, it is better to avoid duplication of content like this. There is no excess weight, it’s easier to update, there is no risk for any search engine robot that interprets hidden duplicate content as spamming keywords, etc. Plus, avoiding duplication is just a good practice.

(Also, we could lose the terrible <![if !(lte IE7)]> in the <noscript> ... it is there if someone has IE6 or IE7 with Javascript disabled, so they don't see the content twice ... I heard about some enterprise systems that have legacy systems tied to older versions of IE, making this a terrible way to make old IE a bit more secure ...)

If I wrap conditional content in <noscript> , or vice versa, it will be the logic β€œAND” - it is displayed only if both conditions are met (IE6 / 7 with Javascript disabled).

Is there a way to make it work with OR logic, so there is one block of content and one block of content is displayed if there is no Javascript, or if IE is less than version 7? Or is there some smart, simple, reliable way to use Javascript to switch <noscript> to if the browser is turned on Javascript and is an old version of IE (ideally, without waiting for the document to be ready)?

Since I already use conditional comments, strict adherence to standards is not a big deal, for example. if a script was involved in the <noscript> tag attribute, that would be nice. The jQuery syntax is great too.

A simple, clean way to offer one block of fallback content for older IE or noscript browsers would be a very useful thing.

+4
source share
1 answer

I think I hacked it without having to use javascript (and using only valid HTML!), After viewing this question in view mode, which has an answer demonstrating <!--[if !(IE)]><!--> Anyone but IE <!--<![endif]--> trick:

 <!--[if gt IE 7)]><!--> <noscript> <!--<![endif]--> <div> Content here </div> <!--[if gt IE 7)]><!--> </noscript> <!--<![endif]--> 

Noscript tags, so the noscript condition, are only read if it is not an old IE. Thus, the old IE shows the content regardless of whether javscript is active, and non-old-IE shows the content only if the noscript condition is met.


To clarify...

Non-IE browsers skip comments by reading them as:

 <!-- blah blah --> <noscript> <!-- blah blah --> <div> Content here </div> <!-- blah blah --> </noscript> <!-- blah blah --> 

IE 8 + sees conditional comments, meets the criteria, and reads everything. This immediately closes the comments and shows the <noscript> tags:

 <!-- --> <noscript> <!-- --> <div> Content here </div> <!-- --> </noscript> <!-- --> 

Old IE sees conditional comments, does not meet the criteria, and thus skips everything until it reaches [endif]. Without the <noscipt> it always shows fallback content:

 <!--[STOP READING]...[START READING]--> <div> Content here </div> <!--[STOP READING]...[START READING]--> 
+6
source

Source: https://habr.com/ru/post/1442597/


All Articles