Related
I am in the process of updating my business website and I've decided to use HTML5/CSS3 (with some PHP) for the whole thing and it works fantastic in every new browser (IE9, FF6, O11, S5, C13) with or without JS.
Now I am not sure what I should do about every other browser version. I imagine I have a small amount of leeway with most of the browsers (atleast the previous version) except IE8 (I have the IE shiv, but it doesn't cover non-js browsers.). Most of the features degrade nicely, but there will always be issues with older browsers.
I know nonJS browsers are probably a minority, but it would be nice
to cover them as well
This list is ordered in the order of current preference to cover the
largest number of browsers(nonJS/JS) but time to implement hasn't been
considered.
Only considering web-browsers, plan is for a mobile site for mobile browsers
Here is the list:
Build a really dodge version of the site using tables^, etc. and redirect the users there if they have an old version of the browser (server-side) and have a warning on there about upgrading.
Use Javascript to fix up the bits they don't work (like the shiv). This doesn't really cover the nonJS browsers which as stated are probably a minority.
Build a static old browser page to redirect the old browser users to a page with links to upgrade download links. This is a real copout solutions, but is quick to implement
Assume the only users that have old browsers are IE users, and use conditional comments to implement one of the previous options. Assumptions are always bad
Pretend users have the most upto date browsers and make no attempt to fix the site at all. Not really a practical option
Rebuild the website for HTML4 and use it accross the site. Bit of a waste of current work. As well as it looks a bit dissappointing if a webdeveloper has a site using old technologies, which was the driving force for the upgrade
What are your thoughts/solutions to the HTML4/5 limbo? Is there anything you've done in current projects to combat this?
Cheers,
Steve.
P.S. Being a member of the 'I hate IE6 and don't care for it's existance' club, I'm pretending that IE6 (or less) never existed.
Update (to clarify)
^ - by tables, I mean are really slapped together version of the current website, using either a table/non-table based layout. But something that may not look pretty when the source is viewed, it's really just there to fill the compatibility void.
It's perfectly acceptable to have features in some browsers and no features for an older browser. See Here.
However, it should be noted that whenever a fix is doable, you should have it. Unless a website is a JavaScript based app, it should be working without JavaScript, note that working != working perfectly.
if you have a hover state with a cool transition, which Chrome 23423 will support, but IE7 won't, then you can either emulate it using Modernizr and jQuery, or leave it as is, and IE7 won't enjoy the goodness. BooHoo.
You must however, give older browser users a message to encourage them to upgrade to a better ones, especially talking about IE<=7.
You built the website in the wrong direction.
If you want to support older versions, instead of building a cutting edge website and then trying to get it to work in older browsers, you need to build a basic site that works everywhere, then use advanced CSS and Javascript feature detection to add features for the newest browsers.
This is a question to all web-developers working in the industry more than a few years.
Today the server guy at my work told me that his browser didn't render a Google font I used on a site properly, so I checked his browser - it was Firefox 3.5. (Google font Raleway).. This made me think.. I know for some of our sites its a requirement to support IE6 (larger corporate sites) but for the rest (personal sites) should I be looking at developing for all increments of Firefox, Chrome, IE and Safari?
Does your company still support IE6?
Does your company support previous versions of modern browsers or just the latest ones?
And finally, has anyone else had this problem with FF 3.5 and Google Hosted font Raleway..(the font displays extra extra thing so the font is almost unreadable)
http://fonts.googleapis.com/css?family=Raleway:100&v1' rel='stylesheet' type='text/css'>
If anyone's interested I found a working solution to my font problem here:
http://www.jshsolutions.net/google-webfonts-cross-browser-fix-howto/
Users of FF/Chrome/Safari usually keep their browsers up to date. Keeping antiques around like IE6 is a corporate thing. Some users keep IE7 and IE8 around due to their unnecessary fear of things breaking. We promise to support the current version of browsers plus one version backwards. If someone wants anything further back than that, there's an extra charge.
It depends entirely on the user base and also the size of the user base. For example , the user base for governrment sites will be substantially different to personal sites.
A site with 10,000,000 visitors per year with 1% IE6 usage should ideally cater for thoses users. But a site that gets 10,000 visitors a year with 1% IE6 usage could probably afford to ignore IE6.
You should always support the current and prior major release of Chrome, Firefox, Internet Explorer, Safari and Opera. If the client needs an older browser to be supported he should pay extra.
My company supports IE6 for our intranet website - but somewhat reluctantly. However, last quarter, they rolled out mandatory updates for XP systems (IE7 and SP3).
IMO, it is unnecessary to break your head over tweaking CSS for every version of the browser. I'd suggest creating CSS for major versions like IE7, FF3 and webkit-based browsers and have a disclaimer stating the minimum requirements for the website.
Alternatively, you can load content based on the user's browser. Nevertheless, it would be more tedious.
Importantly, check the current browser shares (http://www.netmarketshare.com/browser-market-share.aspx?spider=1&qprid=0) and decide which browsers you want to support.
Yes I am suffering from the same. We support IE 6,7,8,9 ,FF 3.6,4 and Safari. It seems to be the worst thing to write one code for all this browsers. I never understand why client use IE6. Check this http://ie6countdown.com/ will give you idea about how many are using IE6.
This question already has answers here:
Closed 11 years ago.
Possible Duplicate:
Should i be using HTML5 and CSS3?
How do you decide if you need to use html5 and css3? and what will be the pros and cons in choosing that approach.
Pros and cons I can think of:
Pros:
cleaner codes
support for #font-face
shadows and rounded corner
animations
Cons:
not all browsers supports
Can you help me decide? How do you decide if you're in my situation?
Thanks!
It won't be time to switch to "HTML5 and CSS3" for a very long time indeed.
It is time to look carefully at the features added by HTML 5 and CSS 3 and decide, on a case by case basis based on:
Browser support
Consequences of using them in browsers that don't support them
Benefits gained
Fallback options available
… which specific features it is worth using today.
A well designed site should always degrade gracefully and both HTML and CSS support this. The goal should not be to make your look fantastic in older browsers - only to make your site USEABLE in older browsers. A well designed site should be useable with CSS turned off.
I think a clear YES can come only after the target browsers are compatible. However, if my target browser supports the specific features of HTML5 and my development is limited to these supported features, HTML5 can be used.
Some people still use browsers once used by the ancient egyptians, like IE6, and they will not be able to view your pages (and specifically new styles/tags).
If you have a public website, accessable to virtually anybody, I suggest waiting for at least a couple of years before the big convert.
If, on the other hand, you have a controllable group of users, like the intranet site I'm working on, you can easily enforce the use of more modern browsers that support this, like Google Chrome, Apple Safari, Mozilla Firefox, of Internet Explorer 9 (just released).
I believe it is entirely down to who you are targeting. If you are targeting developers, Stack Overflow for example, then I think you can use the new technologies. If you really need to display a message to upgrade then I am sure developers would understand.
You should not use it for general sites for something such as a shop which has a very wide audience. This is because a lot of them would be using IE 6 - 8. The fact that no one on XP (my whole office + pretty much everyone else I know) can upgrade to IE9 which supports some features is frustrating too.
So I don't think there will be a definitive day where everyone can use it. It is just a case of looking at the market share of browsers and your target audience and deciding if it is worth giving 99% of people a better experience and ignoring the other 1%. Although I am sure those figures are completely off, it is probably a lot worse.
In conclusion, it depends on your audience and if you are willing to not support a varying number of users.
I currently work for a large company and I design for their high-traffic ecommerce website. We support tens-of-thousands of users across a variety of browsers. Our current browser stats point to most people using either Firefox 3+ and IE8. There are about 5% of users still on IE6.
Is it time to start coding for the future and impliment HTML5 across the site? Is it a responsible thing to do or should I wait a year for people to upgrade to better supporting browsers?
Thank you.
HTML5 isn't one specific thing. You can start using it even in browsers that have no idea what HTML5 is. If you just start using some of the extra tags or form types, they degrade perfectly into standard elements in older browsers. Video needs a Flash fallback anyway. The advanced scripting features all need fallbacks for non-supporting browsers anyway, or must only add non-essential functionality.
In short, sure, start using HTML5 techniques now to provide advantages for cutting-edge browsers, just make sure it all degrades nicely in older browsers.
IE8 doesnt support most of HTML5.
There are libraries you can use to make it more HTML5 aware; but for a large production site I think your better of waiting a year.
I would say that the 5% of users still on IE6 will probably remain on IE6. They either aren't interested in upgrading (perhaps they don't know about these things), or are restricted to IE6 by security policies in their workplace. In particular I've found that a number of our clients are not upgrading from IE6 because their IT teams consider it to be too big a change, or their existing software is not compatible with anything else.
Therefore, my advice is: go HTML5. With a bit of work you can work around IE6's deficiencies (look at Modernizr, CSS3PIE for ideas). And that way, the other 95% of customers get a better experience.
... what is "large"? Considering HTML5 is still considered work in progress, I'd vote no.
The name "HTML5" is tending to be used by most people at the moment to describe all the exciting new features in web browsers. Not all of these features are actually part of the HTML5 spec - for example, CSS and Javascript have new features which are being referred to under the HTML5 banner. I'm going to assume you mean all these features.
My answer would be to investigate which features you can implement, but remain backward-compatible. Many of the features of HTML5, CSS3, etc can be added to your site without making it un-usable for older browsers.
Some examples: (but do spend time researching for more)
New input types, such as <input type='date'> and <input type='number'>These give you new features in a modern browser, but old browsers will still show a normal input field.
More info: http://www.456bereastreet.com/archive/201004/html5_input_types/
Semantic HTML5 tags, such as <section>, <footer>, etc.
These give you additional semantic meaning to your HTML tags, which is good for SEO and other automated systems that look at your site. They are broadly backward-compatible, though in order to support them in IE6/7/8, you will need to include an IE hack such as HTML5Shiv. However, I would suggest using Modernizr, which includes the HTML5Shiv plus a stack of other useful functionality.
Some CSS3 features such as border-radius. IE doesn't know about this, but the result is that IE will have square corners and other browsers will have rounded corners. So nothing that breaks the site for IE users.
But if you really want to, IE can be made to support a number of CSS3 features, including border-radius, using tools such as CSS3Pie.
Instead of using SVG graphics directly, use a Javascript graphics library such as Raphael, which will draw SVG in browsers that support it, and fall back to VML for IE (which will even work in IE6).
Obviously stuff like the <video> or <canvas> tags aren't going to work in older browsers, but frankly, it'll take you long enough just implementing the features you can use straight away; by the time you're ready to take a step further, things will have moved on anyway.
Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
We don’t allow questions seeking recommendations for books, tools, software libraries, and more. You can edit the question so it can be answered with facts and citations.
Closed 3 years ago.
Improve this question
When I build a site, I'd like to have at least one browser I can show it off in without any hacks or workarounds, and yet still retain maximum functionality. Knowing that none of the browsers have perfect standards adherence, which one comes closest?
Also, are there any standards areas in which a single browser seems to specialize? Opera, for instance, seems to be bent on adhering to all voice-related CSS standards.
The way most people I know work is to run Firefox(with Firebug) and develop in that. Firebug is an invaluable tool for debugging. They will usually take what the get there and try to squeak it into IE and other browsers. Not exactly the answer to your question (Its not 100% compliant but its close), but hopefully it helps.
Safari using the latest WebKit nightly build.
Not that any browser in the world uses this yet (not even Chrome) but if all you're worried about is standards then that's your best bet - it passes Acid3, something no browser on the market can do yet.
This is an excellent question, but I find it hard to give a single answer. Traditionally, Opera has been the most standards compliant. For a long time, it was the ONLY browser to pass the ACID2 test in fact. FireFox and IE haven't been able to claim that (although supposedly IE8 is supposed to fix that, and FF is working on it all the time).
That having been said however, bear mind that IE has the largest "market share" of all the browsers right now (businesses have ties to MS, and Windows always comes with IE out of the box) followed closely by FireFox. So if your goal is to show off your app in a browser that most people will be using, it'll have to be one of those.
Purists will tell you that FF is more standards compliant than IE7 (and they are right), so that you should design for that and not IE. I can tell from many years as a designer/developer that pages taking that approach may not be a great idea. Bear in mind again - IE has the market share, and usually where it counts. So if it looks great in FF but breaks in IE, most users will be very upset, and the same vice-versa.
Best compromise - concentrate on those two. Tweak it to look right in at least FF AND IE, and now you've covered 90%+ of the people that will be using your website.
Don't get me wrong here - I'm not trying to dismiss the users of Opera, Safari, or any other browser. But if you want the most results for the least amount of work, then there ya go.
Best answer - take your time, do it right, test ALL the major browsers. The time spent working through these browser headaches ahead of time (when you can do it at your own pace) will be well rewarded. Compare that to the screaming client who wants to know why your page breaks in his favorite browser, and wants it fixed today. :)
"When I build a site, I'd like to have at least one browser I can show it off in without any hacks or workarounds, and yet still retain maximum functionality."
If you are testing your site, you would be better served to choose target browsers based on your users' needs.
Unless you are in a position where you can force your users to change to a particular browser, you need to test your site in whatever browser(s) they use.
Opera comes closest to standards compliance.
I use Firefox with IE tab and chrome. Firefox with IE tab because those are the two browsers with the most market share and chrome because it is one of the few windows browsers that use webkit, meaning it should display similarly to safari.
The way most people I know work is to
run Firefox(with Firebug) and develop
in that. Firebug is an invaluable tool
for debugging. They will usually take
what the get there and try to squeak
it into IE and other browsers. Not
exactly the answer to your question
(Its not 100% compliant but its
close), but hopefully it helps.
+1 - I prefer firefox for most browsing as I find it most stable and easiest to use, but when it comes to web development it takes the cake when combined with firebug! The others are good for testing, but I find that firefox+firebug makes everything so much easier to use
Try Google Chrome it uses the WebKit which is feature complete for the latest standards.
I used to use Opera and Firefox as my "Standards Compliant" browsers, but I've recently become much enamored with Safari. The WebKit under the hood is really solid, the javascript is really fast (or fast enough, anyway), and and the CSS support is pretty excellent. It's not perfect, but does a really solid job of doing what it's supposed to do.
Also, it has the greatest print-screen feature I've ever seen in a browser. Seriously. Whereas every other browser seems to really munge up any screen I try to print, Safari always seems to get it right. A minor thing, but worth major points in my book.
Edited to add: Chrome is coming close to taking Safari's place, but that print screen thing is still the deciding factor. Being able to just hit "print" during a meeting with a client and not have to fiddle with any settings to get it working right is a major relief.
Don't just use a standards compliant browser, use other tools such as the w3c validator.
I find that if you stick to standards compliant markup, and don't use anything too unusual, it will render fine in Firefox 2/3 and Safari/Chrome (and usually fine in IE7/8). If not, you're probably better off trying to simplify your markup, rather than introducing hacks and workarounds.
Using one browser for all your testing and then hacking it for others is how most people do it but that often leads to problems. Even though Safari may be a more standards compliant browser it is not a highly popular browser and I'd lean more toward using the browser your customer's are using most while writing 100% standard code and then adjusting for idiosyncrasies of other browsers. It's not ideal but it is more customer centered thinking.
I've seen web development companies with multiple full time employees that had bugs on their homepage because they did exactly what you seem to be thinking is your answer. They developed the webpage on a Mac and tested exclusively with Safari. The result was that over 60% of potential customers may have seen layout bugs if their browser was windowed.