Which version of browsers are you targeting when you design your sites

[QuaterPan]

We all know that web browsers are not supporting all CSS features and options, or at least not interpreting them the same way.

So for which version of web browsers are you designing for ? For example, do you still mind Internet Explorer 9 and bellow?

And, is there a way to run several versions of the same web browser, for debugging purpose?

[keyplyr]

I design on a Windows 10 desktop with the Edge browser but have Chrome 67 as the default browser, so basically I design using Chrome.

Close at hand I have an Android mobile phone with Chrome mobile & Edge mobile.

Lately my 1st layout draft is for mobile. After most all that is working, I slap on right and left columns (usually ads & product links) to expand the view for desktop, so I am really designing for mobile first.

I include the standard rendering workarounds for legacy IE.

I no longer pay much attention to how things work with Safari.

[Kendo]

A better question might be "which browsers do you cater for" and which browsers are do not function well on your web site?

Many designers do realise that there is a difference in display support between for example, IE, Firefox and Chrome. But when detecting browser type from the user-agent, they only check for those browsers. Yet there are many more web browsers out there and some are quite popular.

For example one that I do know of has a support forum and frequent posts are about not being able to access some web sites. In fact I learnt of another new browser only yesterday.

Are you catering for these browsers at all?

[htmlbasictutor]

This is an age old question.

A bigger question is what fall backs are you implementing when a feature does not work.

e.g.
- feature does not work in browser
- user has scripting turned off
- user does not have Flash
- search engine bots cannot read the content

I use Firefox w/ NoScript for testing. Many sites will not function at all with NoScript on. Seems coders and programmers are not taught to implement a fall back especially when there is a known problem like we did for Flash not installed. A note "JavaScript is required" is not a fallback. (wink)

[lucy24]

I start out with the text editor’s HTML preview, which is webkit (probably most similar to Safari), and later look at things all over again in Firefox. On rare occasions I stop by caniuse dot com to make sure that some basic thing that webkit and gecko have been doing since 2007 can be handled in the last few versions of MSIE.

In general, javascript is only used for two things: Added Value on selected pages, and analytics, where the latter has a built-in <noscript> variant. I do have one site that relies on javascript for some display features--but the target audience is so micro-niche that people visiting the site are likely to personally know someone who knows me. Oh, yeah, and javascript-based games. But those don't count, since playing games is already a voluntary activity.

But I remain curious about what specific features don't work nicely in all browsers. I can't shake the suspicion that some developers are simply getting too fancy. You can use code that worked in 1998 without, well, looking like a 1998 site.

[QuaterPan]

But I remain curious about what specific features don't work nicely in all browsers.

At my other topic on the subject, I mentioned that, in my case, I wanted to be sure that the "flex" property was handled correctly.

On the CanIUse site, which I am also meticulously reading, you can check the "Known issues" - [caniuse.com...] - you can see that without trying to be fancy, there are some requirements to have it displayed correctly. So I am trying to take these issues in consideration, but, there is the theory, and the practice, I'd like to be able to visually see if it renders correctly , or not.

[QuaterPan]

There is also the grid property which is very useful (and not working with IE11)

[NickMNS]

Chrome 41. is the least common denominator. I don't worry too much about IE.
I use JS extensively now, leaning more towards ES6. But I use a hybrid approach, such that if the JS fails, the page can still be rendered server-side. This pleases Googlebot (Chrome41) allows for a simple AMP implementation. It may make certain features of the site slower than a purely static page, but I assume that users using some ancient browser aren't really overly worried about performance, otherwise they would have upgraded.

All this to say I find it absolutely abhorrent that Googlebot is using Chrome 41. Chrome is at v67 and at the leading edge of browser technology. If you build a site to take advantage of these advanced capabilities you end up having to reverse engineer everything back to v41 (or employ other tactics like server-side pre-rendering) just so that the site can be crawled. I really looking forward to the day when Googlebot is upgraded to a more recent version (hopefully ES6 compliant)

[tangor]

A note "JavaScript is required" is not a fallback. (wink)

In which case I kill the css and other stuff and read the page anyway (wink wink)

You code for what is hitting your site. Most times the stats re: popular browsers in use is a good reference point in deciding what to implement. You can't please ALL legacy versions, mostly because they aren't capable in the first place. When working with raw logs do know the UA can't be depended on: people lie. :)

[Dimitri]

When you want to support old browsers, the recurring problems are with ... Internet Explorer. A couple of years ago, I was trying to make a site to work with IE 7-8-9-10-11 . And apparently, IE 9 had huge problems in its rendering engine, there were things working as expected with IE 7-8 and 10-11 and not working with IE 9 at all. So now I no longer make efforts,as long as the text is readable, this is fine for me.

[keyplyr]

There a common block element work-around most use for IE.

[JAB Creations]

Waterfox which is stuck at Firefox 56. I rarely testing Firefox as Mozilla killed the browser. Then I'll test in Chrome because it became popular only because it automatically installed with every anti-virus ever though I rarely test older versions. I will test IE11, then Edge. I use Windows 7 so I have to load a VM to test IE12+. No, it's called IE and a rebrand is a rebrand.

I do test fairly old browsers, usually Firefox 4.0, IE9, Opera 10 and Safari 5.1 in example. Typically I ensure that even older browsers continue to work well enough to receive and view the browser upgrade page. Even if their market share was sizable a few years ago that is not where the industry is going.

John

[Martin Potter]

An interesting question under discussion here. Not wanting to be a troll, but, seriously, if your pages are all W3C-compliant for HTML5 and CSS3, does one need to worry anymore about which browser a visitor might use?

Disclaimer -- My 33-page website is fairly simple and I have avoided the use of any scripts (except a bit of php on the Contact page), and any Flash, frames, or applets, etc. Mind you, I am not selling anything (though the site is still SSL) and the most complicated thing a visitor can do is to send me an e-mail. And, my visitors are mostly technophiles using reasonably up to date browsers. So several years ago I stopped worrying about "browsers". Am I deluding myself?

[marekar]

Chrome and Firefox, the rest is not importent.

[justpassing]

Chrome and Firefox, the rest is not importent.

I guess it depends of your niche. Personally, across my sites, Safari represents 20% and Edge/IE11: 15%. So, I wouldn't ignore them. A significant amount of people use the default browser of their OS....

[topr8]

i design in two channels i guess ...

1 ... i use boostrap 3 which has very wide support with browsers... i barely bother checking this as i assume it is well tested.

2. my own homegrown 'framework' - which is super simple and most likely works in ie5+ (i don't test that far back though)

in both 1 & 2 i use very little javascript - none where i can and if i do there is generally (not always i admit) a fallback that works without.

... total aside: i just reviewed a site for a friend of mine built with a popular site builder (wix) ... the home page is 1.2megs in code, that doesn't include the size of external css, external js and image files! there were at least 16 external calls for js ... including jquery, i also lost the interest in counting after more than 50 calls to fonts.gstatic.com
long may this continue! it makes life/ranking for me a whoile lot easier!

[lucy24]

i also lost the interest in counting after more than 50 calls to fonts.gstatic.com

I used to amuse myself by counting how many stylesheets a page called. But I too lost interest the first time the count passed thirty, at which point it just isn't fun any more. My personal no-exceptions ceiling is three; for most pages it's two. Absolutely no third-party fonts ever ever, and only rarely a locally hosted embedded font for special purposes. I mean, honestly, webmasters. People are not running around recommending your site because it's got such pretty text, you could gaze upon it all day.

1.2megs in code

You mean the HTML alone?! Holy ###. Not surprised, but still stunned.

the rest is not import[a]nt.

There will always be those who are content with reaching 2/3 of any given potential audience.

[justpassing]

There will always be those who are content with reaching 2/3 of any given potential audience.

Same for those which are exclusively concentrating on Google, and not the other search engines.

About Google, do not neglect older version of Chrome, if I don't make mistake Googlebot uses Chrome 41's engine or something like that. If you can't test your site with older version of Chrome, you can still check [caniuse.com...] to see what is supported or not.

[zipzapzoo]

The lastest Chrome and the latest Firefox are my "targets" but I check it in a variety of browsers, even Edge. It should at least load fine in everything.

[lucy24]

even Edge

Is this the new “even MSIE”?

[Hoople]

Having an opinion as to version is one thing but has anybody turned this question upside down and looked at the browser statistics for your sites?

Very telling (on the human side) as to who is actually benefiting from all your fine work <G> And yes, the niche is very important as the age of the device viewing has niche dependencies.

Example: a site for teen topics vs a site about retirement. The teens won't be likely using a PC with Windows XP on it; except when visiting grandma and grandpa.

[justpassing]

looked at the browser statistics for your sites?

Indeed. But for example, it's not because that 5% of the traffic comes from "old" browser, that you should neglect them. This is still potential buyers / contributors / etc...

Example: a site for teen topics vs a site about retirement. The teens won't be likely using a PC with Windows XP on it; except when visiting grandma and grandpa.

Example, Grandma visits a teen site to buy something for her grand daughter.

I have two desktop computers. Sometime my main computer is "busy", so I use my older computer for basic things like browsing the internet , and because it's old hardware, it can run only Windows XP (which by the way is the windows I liked the most). So I have to use old browsers.

So I wouldn't make it a priority to handle old browsers in a web dev, but nowadays, I think that nothing is a "little detail", and it can be a good idea, to invest some times trying to make sites "readable" / "usable" on older browsers. Also, this exercise can teach you a lot about HTML / CSS and eventually JS, and you'll discover that you can do the same thing, in a simpler way...

[tangor]

it can be a good idea, to invest some times trying to make sites "readable" / "usable" on older browsers. Also, this exercise can teach you a lot about HTML / CSS and eventually JS, and you'll discover that you can do the same thing, in a simpler way...

As I remarked earlier ... look at your logs and see what browser(s) are hitting the site ... meanwhile, code simple, clean, what works, and avoid everything else... unless the intent is to live on the bleeding edge of tech (just remember that "bleeding" sometimes means self-inflicted wounds!)

[keyplyr]

Personally I think it's a waste of my time to concern myself with older browsers or non-major browsers who likely don't support TLS v1.3. Most HTML & CSS are backward compatible, at least for several versions, anyway.

We're in the mobile-index. Just how many of those odd browsers are used on phones?

[justpassing]

who likely don't support TLS v1.3.

(May be I misunderstood you)
Only Firefox and Chrome supports TLSv1.3: [caniuse.com...]

IE/Edge, Safari, Opera do not.

[NickMNS]

Just how many of those odd browsers are used on phones?

Chrome 41 is used by Googlebot for both mobile and desktop.

[justpassing]

And other crawlers might also not be on cutting edge of HTML / CSS / JS rendering.