How to work around HTML5?, Flying blind as usual Options

[Number1]

I manage a huge corporate site, over 1,500 pages, done entirely in hand-coded HTML(4) and JS. Recently coworkers have pointed out that the site is breaking on HTML5 browsers. In the background, the site is being completely redesigned for CMS without input from me, so there is not a high priority given to my efforts on the old site, even though it will likely be months - perhaps a year - before the new site is actually up and running. Presently, the site has an extremely high ranking, in terms of showing up on page one, often as item # 1, in a keyword search on product related terms. For the actual size of the company, it has at least 10X the ranking one might expect.

My concern is that the incompatibilities with HTML 5 is and will be killing the rankings, and, of course, the user experience is and will be suffering.

I am not allowed to download anything per company policy, so I can't get Chrome or any upgrade from IE8 or the equivalent on FF, Opera or Safari. Apparently, Chrome has the downside, from corporate, of allowing direct access to Google, which is blocked along with 90% of the other sites I need for my job, by Sonic Wall, which for example routinely blocks anything that has a "$" sign on the site content, because it must be about "shopping." Imagine trying to find product details from some competitor product when every site that has the info is blocked by your own system - to keep you from wasting company time...

So, I can't see the errors, since I can't run an HTML 5 browser. My question is then whether there is a workaround, as in forcing HTML4 compatibility in the doctype specs, for example? Most of the stuff that I've seen, such as on the homepage, has to do with object positioning, and most of that, in turn, is handled by external .js that is reused typically 50 or 100+ times. In those cases, I should be able to correct the .js and eliminate the problems.

Thanx

This post has been edited by Number1: Feb 21 2013, 01:58 PM

[pandy]

If you can't install browsers at work, do it on your private machine. I don't get how "they" think you are going to be able to fix anything at all without access to browsers though...

If you don't want Chrome (I don't), you can install Iron instead. Same engine, but without the spywork.
http://www.srware.net/en/software_srware_iron.php

What do you mean with HTML5 browsers? The latest browsers? Could be a matter of Quirks Mode maybe. Does the site use a doctype and if so which?

Please post the URL to the site. Without that it isn't much anyone can do.

[Number1]

URL is www.seco-larm.com

HTML5 browser is any browser that supports most of the new stuff in HTML5. About the only browser that is still popular that can't do HTML5 is IE8, which is what I have at work, along with old versions of Opera, FF & Safari. I think that IE8 still has 15~20% marketshare, so I don't want to break the code for IE8 quite yet, either.

If you can't install browsers at work, do it on your private machine. I don't get how "they" think you are going to be able to fix anything at all without access to browsers though...

If you don't want Chrome (I don't), you can install Iron instead. Same engine, but without the spywork.
http://www.srware.net/en/software_srware_iron.php

What do you mean with HTML5 browsers? The latest browsers? Could be a matter of Quirks Mode maybe. Does the site use a doctype and if so which?

Please post the URL to the site. Without that it isn't much anyone can do.

[Frederiek]

But that site is in HTML 4.01 Transitional. I don't see any HTML5 related tags, just many (nested) tables.

Apart from that, that page, as is, does have HTML errors (pass it through the WDG validator and you'll see) and CSS errors ( http://jigsaw.w3.org/css-validator/validat....seco-larm.com/ , which you should fix.

If yet the site would use HTML5, there are ways to support IE lower than 9, eg. modernizr and html5shiv.

[Number1]

Frederiek;

Of course it's all HTML4. I've never even had a true HTML5 browser here. That's the problem. HTML4 code that worked, whether technically correct or not, on all the HTML4 browsers that I could persuade management to let me use, is now breaking on the new HTML5 browsers. I can't very well write or rewrite to HTML5 spec without any way to test the results, so that leaves the possible option that a simple DocType fix might work to force the HTML5 browsers to act like they were still HTML4.

I'll check out the other options you suggested. OOps... Both modernizr and html5shiv require downloads.

Thanx

But that site is in HTML 4.01 Transitional. I don't see any HTML5 related tags, just many (nested) tables.

Apart from that, that page, as is, does have HTML errors (pass it through the WDG validator and you'll see) and CSS errors ( http://jigsaw.w3.org/css-validator/validat....seco-larm.com/ , which you should fix.

If yet the site would use HTML5, there are ways to support IE lower than 9, eg. modernizr and html5shiv.

This post has been edited by Number1: Feb 21 2013, 03:26 PM

[pandy]

Yeah, but do you use HTML5 features? Otherwise HTML5 doesn't have anything to do with it.

Can you give an example of something that is messed up in newer browsers? Nothing jumps out, not ot the front page anyway.

[Christian J]

the site is breaking on HTML5 browsers

Newer browsers may support HTML5 elements to varying degrees, but that doesn't mean they don't support HTML4 anymore. (BTW, HTML5 is mostly backwards compatible with HTML4 and XHTML1.0).

My concern is that the incompatibilities with HTML 5 is and will be killing the rankings

No, search engines don't care about that.

Most of the stuff that I've seen, such as on the homepage, has to do with object positioning, and most of that, in turn, is handled by external .js that is reused typically 50 or 100+ times. In those cases, I should be able to correct the .js and eliminate the problems.

Newer browsers do use different CSS interpretations compared with older ones. This includes styling created by JS.

My question is then whether there is a workaround, as in forcing HTML4 compatibility in the doctype specs, for example?

No, in practice browsers only use Doctypes to trigger "standards mode" in browsers, which in turn mostly affects CSS. If the site layout looks strange in newer browsers maybe it was adapted to the quirks of some older IE version. To make newer IE versions behave like older ones you could use META tags like this one:

CODE

<meta http-equiv="x-ua-compatible" content="IE=8">

but the results are said to vary and I don't recommend it. You can also use Conditional Comments to show different content for different IE versions: http://quirksmode.org/css/condcom.html (this is more reliable).

This doesn't help with other browser brands though. For them the best solution is to rewrite the site according to W3C specs, while testing it in the newest versions of all major brands. After that, add hacks for older IE with Conditional Comments.

[Number1]

I spent the past 30 minutes trying to get a reliable estimate of the remaining marketshare for IE8, which is effectively the last remaining HTML4 browser, so that I would at least have something to say about moving to something more modern. I couldn't find such a site that wasn't blocked by the filters here, and the remaining such sites lump all the IEs together. Turns out, however, that XP only goes as high as IE8. IE9 requires a move to Vista or later, (hopefully, as Vista is a nightmare) Windows 7, but that requires essentially clearing and backing up the entire system. There is no easy path from XP to anything later, is what I'm reading.

Meanwhile, it's kind of hard for me to show examples of the breakdown of my code going from an HTML4 to HTML5 browser at the moment, as I still don't have access to IE9, or Chrome, which is where I'm told that trouble starts appearing. I'll try again tomorrow, as all the people involved are at a trade show today.

[pandy]

Yeah, get them to point out some of the failures. I browsed around a bit and I didn't see anything odd at all.

I think you've got the HTML5 thing a little wrong. As Christian said, just because a browser supports HTML5 features it doesn't stop supporting HTML 4.01 - or older versions of HTML.

What can happen when a new browser comes along is that it a) comes with bugs of its own and b) actually supports web standards better than previous versions. Meaning that an interpretation of CSS that we used to think was correct can turn out not to be all that and the new browser actually does it more correct, but breaks pages in the process. HTML5 has nothing to do with this. The only time it has is if you actually use the features that are unique to HTML5 and then it's older browsers that don't play along. Browsers don't understand doctypes. They use them for switching between rendering modes, but that's another story.

[Christian J]

I spent the past 30 minutes trying to get a reliable estimate of the remaining marketshare for IE8, which is effectively the last remaining HTML4 browser, so that I would at least have something to say about moving to something more modern. I couldn't find such a site that wasn't blocked by the filters here, and the remaining such sites lump all the IEs together.

Can you view any of these:

http://w3schools.com/browsers/browsers_explorer.asp (all IE: 14.7%; IE8: 6.4%)
http://www.upsdell.com/BrowserNews/stat.htm (all IE: 30-64%; IE8: 5.8-24%)

Apparently figures vary wildly (maybe due to incorrect browser sniffing, or maybe because users of different browsers frequent different sites), so in the end it's only your own site's
IE8 share that counts.

I'll try again tomorrow, as all the people involved are at a trade show today.

If it's just single individuals that complain, make sure that they're not running ad blocking extensions or other atypical configurations, since that can sometimes mess up pages.

[Number1]

http://w3schools.com/browsers/browsers_explorer.asp (all IE: 14.7%; IE8: 6.4%) Loaded with no problem

http://www.upsdell.com/BrowserNews/stat.htm (all IE: 30-64%; IE8: 5.8-24%) Blocked on account of being a "religious" site.... ROFL

As it now seems, the problems are not as bad as represented, like IE9 centers list items with bullet, where the other browsers align left the same list items. Originally I was told that the problems were occuring on everything but IE. Now they can't replicate the problems on anything but IE9. ???

Meanwhile, here is a beta of the proposed CMS replacement for the site I've handled since 1998. So far, it has glitched in Safari and is completely non-functional in IE8, altho it looks fine in IE9, except that the new design requires on average twice as many clicks to do the same tasks and manages to take up ~21% more minimum horizontal screen space while offering about 50% less content. And it's only going to cost them ~$100k to populate it with the data from the existing 1500 pages.

NEW!!! CMS site: http://www.devimagine.info/

Old hand-coded HTML site: http://www.seco-larm.com/

[Christian J]

IE9:


Firefox18:


Iron (not sure know which Chrome version it corresponds to):


In FF the black section is too large and too far down, and the top right search menu looks strange. Same goes for Opera12, but I didn't make screenshot of that.

As it now seems, the problems are not as bad as represented, like IE9 centers list items with bullet, where the other browsers align left the same list items.

Same in Opera. Seems one (or more) of the CENTER elements make the LI text centered. The table layout is hard to overview, with CSS you could remove much of that and simply the HTML a lot.

There are also many validator errors: http://www.htmlhelp.com/cgi-bin/validate.c....seco-larm.com/

[Number1]

I'm not convinced that those validator errors are really all that valid. Usually, they are only errors in a technical sense - W3C spec violations like closing tags that none of the browsers pay any attention to. There's something weird going on though on the web in general. I typically use the local OC CA public library computers, something I've been doing for the past 15 years.

These computers, which allegedly have a professional IT dept. behind them, have been slowing down from the time of installation of the XP systems about seven years ago. The first major slowdown occurred within a year of installation. We were told that the problems were due to insufficient bandwidth, which they were going to correct. I told them that it wouldn't work more than 6 months, which turned out to be all too true. Invariably the demand expands to fill the bandwidth as people try to download 5 movies, meaning that everything slows down proportionately.

Over the past year, however, the library computers have been slowing to a dead crawl. On top of that, however, there is something new that started about two weeks ago. All the major public access email sites - Yahoo, Google, FaceBook, etc., have been glitching to the point of being virtually useless.

Typically, if you try to go to Yahoo, you first get either a blank screen or a text-only screen. Refreshing usually gets you to the normal Yahoo screen, but accessing email brings similar problems, requiring repeated refreshes, each taking a minute or more to complete. On top of that, the left mouse button only works part of the time, while the right mouse, which IT disabled for no good reason, is suddenly working again.

FB is worse. Typically several long refreshes are required to get to one's home page. Then, the problem with the non-workling left mouse button - which I replicated on several different machines at two separate libraries - blocks any ability to comment or respond. Many other sites have similar problems, rendering the system virtually useless for any serious work.

Of course, they could install LINUX or just run FireFox and that would likely take care of most of the problems. XP is one stumbling block, as it cannot handle past IE8. Instead, they are awaiting approval to spend big bucks to "upgrade" to Win7. They project that the problem may be solved within two months.

But just bandwidth or HTML5 issues cannot easilly be held accountable for things like a mouse button failing to function, or the other one suddenly learning how to function after 15 years of being turned off within the OS. What is going on here?

[pandy]

You can't let go of those HTML5 issues, can you?

I'm on XP and I don't have the problems you describe.

[Number1]

Pandy "I'm on XP and I don't have the problems you describe"

But you're not running IE, I take it. If you were, then you would be running IE8, at best, unless you know how to make IE9 work under XP... When I go to the new CMS site - http://www.devimagine.info/
- I get mostly garbage with IE8, while everything looks fine with FireFox, the only difference being, so far as I know, that FF supports HTML5, while IE8 does not.

[pandy]

IE7. Some sites break in it, but remarkably few. FB is a mess in almost everything, but I don't have any problems with Yahoo!. Don't know about their web mail though.

It still has nothing to do with HTML5, unless the site uses HTML5 features. That they slap a HTML doctype on doesn't affect anything. Browsers don't understand doctypes.

If you use a library computer it's probably in kiosk mode. Things can be disabled at the firewall too. They may filter JavaScript for instance.

[pandy]

I'm not convinced that those validator errors are really all that valid. Usually, they are only errors in a technical sense - W3C spec violations like closing tags that none of the browsers pay any attention to.

Really? So your problems are all gone now?

[Christian J]

I'm not convinced that those validator errors are really all that valid. Usually, they are only errors in a technical sense - W3C spec violations

Finding technical errors is the purpose of a validator, not to warn us about such spec violations that browsers can't recover from. The reason you should validate is because valid syntax generally means less problems, both today and in the future.

like closing tags that none of the browsers pay any attention to.

It's not about paying attention, rather the browser manages to recover from that case of invalid syntax.

How do you know your own site's problems are not due to such syntax errors? Some errors might be harmless, others not. For example, I don't think any browser can fix this (from line 94 on your page):

CODE

<td><tr><table ...>

Browser problems don't have to be caused by invalid HTML though, they can also be caused by syntactically correct HTML and CSS that uses e.g. length values adapted to the quirks of a browser. When the quirks are fixed in newer versions of the browser the "adapted" CSS no longer fits.

I can understand your reluctance to manually fix a huge site, though.

There's something weird going on though on the web in general.

The last few years it seems javascript bloat has exploded on the web. There's a huge amount of advertizing/tracking scripts, jQuery and Ajax calls on more or less every major site. Even newer browsers may choke on all the resulting HTTP requests and JS processing.

But you should try more computers than just your local library, maybe it's full of malware as well. Never trust a professional IT department to do anything right.

[Christian J]

Pandy "I'm on XP and I don't have the problems you describe"

But you're not running IE, I take it.

A relative is using IE8/XP with no problems at all. She's not using Facebook, though.

[Number1]

No, I'm not saying that. But I've tried the validator and run into the situation that code relying on OnFocus, for example, is not supposed to be correct, according to the validator, but that OnFocus event is critical to a major function of most of the pages on the site, and has worked just fine on every browser so far. But something is telling the validator that that usage of OnFocus is wrong! I don't have a clue as to why nor do I have an alternative function to replace it. It was quite an effort to work out how to avoid leaving popup windows hanging around, hidden behind other stuff.

<body style="FONT-FAMILY: Tahoma, Verdana, Arial;" bgcolor=white topmargin=0 leftmargin=0 marginwidth=0 marginheight=0 onfocus="closesrchwin()">