Develop Reference

Best Way to Display "Unsupported" Browser Message [closed]

As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center for guidance.
Closed 9 years ago.
We are working on a web application which only supports "modern" browsers (basically IE9 and up, and any other browser which has roughly the same amount of modern features).
Our web application will also work on mobile devices like tablets and smartphones.
Since this is a web application (as opposed to a normal website), we are okay with some users being left out in the cold for some of the advanced features which rely on modern features (i.e., older browsers).
However, we want to at least display a message letting them know.
We want to maintain basically two lists: "supported browsers" and "unsupported browsers", with a third implicit list "not supported browsers" (i.e., browsers that are on neither least).
If the browser was on the supported list, we wouldn't show anything.
If it is on the "unsupported" list, it will always show a message which says "This browser is unsupported, please upgrade blah blah".
If the browser is not in either, it will display a message (which can be almost-permanently dismissed) which says something like "This browser isn't tested directly against our site and some features may not function as intended. If you experience any issues, please report them blah blah".
Building this and what not isn't an issue. However, I was wondering if there was some site/service out there with an API that already did this sort of thing, or at least maintained lists of browsers which I could pull from. (If not, I just plan to use manual testing combined with info from sites like "Can I use..." and Modernizr).
Any ideas?

Poking around online all the resources I've looked at say that you should essentially never use browser detect. It's better to test for features you know DO NOT exist in the browsers you can't support instead of trying to look at the user-agent string.
http://www.quirksmode.org/js/support.html (If you want to know whether the browser that views your page supports certain objects you want to use in your code, you should never EVER use a browser detect. )
http://api.jquery.com/jQuery.support/ (Rather than using $.browser to detect the current user agent and alter the page presentation based on which browser is running, it is a good practice to use feature detection.)
So I think your approach with modernizer is probably the best.

You don't need a service.
The 'supported' list contains only those browser/device/OS combinations that you actually test.
The 'unsupported' list contains those browser/device/OS combinations that you know don't work (i.e, they failed your tests)
The 'might work' list is implicit as you've mentioned.

HTML5 Boilerplate vs. HTML5 Reset [closed]

As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center for guidance.
Closed 9 years ago.
Hey everyone — HTML5 Boilerplate and HTML5 Reset are two HTML, CSS, and JavaScript templates with a lot of modern best practices built-in. Their goals are largely the same:
Fast, robust, modern Web development
HTML5 (duh!)
Cross-browser normalization (including support for IE6 and mobile browsers)
Progressive enhancement and graceful degradation
Performance optimizations
Not a framework, but the starting point for your next project
Obviously, they're very similar in function. In what ways are their implementations different (for example, perhaps IE-specific CSS fixes are achieved using different techniques)? Are they at all different in scope? It seems like HTML5 Boilerplate is a bit larger (build tools, server configuration, etc.), but it's hard to know where it goes beyond HTML5 Reset when it comes to the actual site that people will see.

In general, both projects set out to provide a solid starting point for developers working on web projects. They both get rid of a lot of the tedious, some-what error-prone boilerplate that many developers find themselves re-creating for each project. The details in how they go about it are slightly different, but for the most part, they achieve the same results.
HTML5Boilerplate has, as you noted, added in some build-script pieces to help developers follow best practices to speed up their pages in terms of server-side items, such as far-future expires headers, etc. where-as the HTML5Reset project is more focused on the semantics, content, and styling. For example, HTML5Reset has more example structure for the content of the page in HTML5 (to help show people how to use some of the new elements), whereas HTML5Boilerplate does not.
The response-time and page speed parts that HTML5Boilerplate includes get more and more important as more users find themselves on mobile platforms, and as Google increases the effect page response times have on page rank. There are lots of papers that show a small increase in the page response time has a measurable negative impact on how your site is used and perceived (especially in an eCommerce setting...often a 100ms slower page will get percentage less things sold).
On the CSS front, the majority of the reset style section for both projects is very much the same, with some minor differences in what the baseline is set to. The IE specific fixes, however, are largely the same, with HTML5Boilerplate asserting a bit more control than HTML5Reset over how IE styles some things like form elements (ie. check box / radio buttons and valid / invalid states)
Two major CSS areas that HTML5Boilerplate covers that HTML5Reset does not are common helper classes to assist with making sites more accessible, such as .hidden and .visuallyhidden, as well as some substantial adjustments to the print styles that serve to both make printing more similar across browsers, as well as some cost-savings and accessibility things like making background images transparent (to not waste toner), and adding the actual URL to links and the title to abbreviations.
I would highly suggest reading through both projects' info and how they do things in a side-by-side comparison because the similarities, and also the differences (and the reasoning behind them) is quite informative and has helped me to better decide what parts of each I wanted to use.
Ultimately, just like any "library" sort of project, you as the developer need to understand what you are doing and probably should tweak your baseline to meet the particular needs of the project.

You can use either one...
Like #murtaugh said (http://5by5.tv/bigwebshow/45) you don't need to learn anything when u first start with Reset. In my experience, working in an R&D department, when you need to demo or do quick iterations you can use the Reset (or Boiler if u already know it). When I need to build the product for deployment I turn to Boiler just because has more stuff.
Works for me but now because I know both I can easily use either one.

I actually almost want to say using the traditional reset.css is the best... I find no problems with compatibility in my mobile apps. However, I am developing these apps using the jQuery mobile framework.
So I guess it's really conditional as to what kind of tools you are using. Phonegap doesn't seem to have any problems compiling my code into all OS. And viewing my source code in emulators looks perfectly fine...
So I really don't see the point of a boilerplate unless you are trying to achieve polyfills.

I work in an environment where previous developers roped the company into using both JQuery and Prototype...and it's a mess. Not only do we have to work out of compatibility mode, but just think of the extra overhead that it causes. When debugging, Prototype "hijacks" debug messages in Firebug, which leads to even more work. And the maddening part is that I've been undoing this mess for months and am just starting to get close to being done with it....and just when I'm about to pull the plug on Prototype I always seem to find another section that relies on it...
It's for this reason that I argue every time against combinations of frameworks that have similar purposes. For example, no matter how cool you might think YUI Grids is, if you load the entire YUI Framework you best not be doing Jquery, Moo, or Prototype. You'd be just needlessly bogging yourself down. It kills the load time (which wrecks the user experience) and just gives developers headaches and needless work.
Look at this phase of your site like building the foundation. You have the opportunity to use anything you want to use, but you have to be careful not to "paint yourself into a corner" so to speak. So, use purpose-built and best in class tools that are available based on your resources. Don't just use something to be cute! We're lucky in that many very high quality tools are free, so we have a choice. But know that you're steering the direction of your site for the future, and you might be the person like me who has to deal with the consequences if your decisions are hastily made.
So, unless you're NEVER going to use another framework, I endorse Reset...or even just doing top quality standards compliant CSS.

Should we consider Flash as a last resort? [closed]

As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center for guidance.
Closed 12 years ago.
When we make a website with some interactivity (not whole flash site). should we always find a way JavaScript way before to use Flash? Should we consider Flash a last resort, if possible?
It is true Flash will not be indexed by Search engine. and it will not run on apple devices.
Will javascript also perform better than flash, in terms of speed?
Edit:
And how to know , the effect which we want to achieve and possible in Flash , can be possible in javascript?

Flash has it's advantages. I personally love JavaScript and are always surprised what is possible without Flash. But on todays browsers you can do a lot more with Flash and it ill perform a lot faster.
In the bright future, you might be able to do almost everything you can do with Flash using JavaScript and the canvas element. But until the majority of all browsers will support that, there are some things you can only do with Flash.
I don't use flash on any of my projects anymore and I also have a lot of fance stuff on them. But I also have a fallback for non-JS users and you should also have that for non-Flash users. and because a JavaScript application/widget is build using HTML and CSS, such a fallback is much easier to realize than doing it with flash.
I don't say, that you should not use flash at all, but you should make yourself a list of things you want to have on your website and than search for JavaScript libraries or plugins that can do that.

Isn't anyone bored with this question yet? There are tons of answers/non answers on the internet. One could write a book about Flash advantages & disadvantages, actually many books :) I personally don't think there's a rule you can apply to every project that will let you know if you should or shouldn't use Flash. This is a personal choice , based on the type of project you're dealing with , the languages you're comfortable with and the objective you're trying to achieve.
Some clients won't care about not being able to be accessible on Ipads, some others will. You don't tackle a business site the way you would tackle an artist portfolio. Keep your options opened and , more to the point, master as many languages as you can and when you do, I have no doubt you won't bother with this question again.
so:
should we always find a JavaScript way before to use Flash?
why not? if JS can do it with similar quality & performance, why go Flash?
It is true Flash will not be indexed by Search engine.
Google has made a lot of progress in indexing Flash content so it's not entirely true
and it will not run on apple devices.
False. It will run on most apple devices, of course not the Ipad!
Will javascript also perform better than flash, in terms of speed?
that would depend on what you're trying to do
And how to know , the effect which we want to achieve and possible in Flash , can be possible in javascript?
Some level of understanding of both languages would help

I'd say no, but then again I might be bias.
Flash is good for its own certain points and needs. I think that it has received bad press as it has been misused a lot, it is not a replacement to other languages but has been used that way for quite a while. It should be used when needed, rather than an instant fix to make things look "cool" or "modern".
Flash is good for application based design, multimedia and complex animations. This admittedly is rather fuzzy, but it's hard to define nowadays closer than that. Javascript on the whole is a very powerful tool, and the new HTML <canvas> tags allow a great flexibility on what can be accomplished with JS, CSS and HTML, but requires specific support that isn't guaranteed on all browsers (10% of people still use IE6 supposedly) so it's very much a gamble on who your target market is to what you should be doing.
On the whole if you know what you are doing it is possible to do nearly all that flash does in javascript/css/back end technologies, but it is less encapsulated than a flash example, and as far as I know flash is more efficient in its resource allocation and can take advantage of CPU enhancement, where javascript can't as of yet. It all depends on specifically what you are trying to put together and how complex/portable you want the code to be. If you are putting together a 3d shooter, use flash, if you are trying to move a <div> 5 pix to the right, use javascript.
Flash in itself will run on "apple devices" except for the iPhone and offshoots of this technology (iPad for example) but will still run in safari etc. on macs. and is constantly getting better at being indexed on search browsers, and there are get-arounds for that anyway, so that shouldn't be the reason for stopping you.
Have a look at jquery examples like this page to see some of the fun things you can do, and maybe some inspiration.

Do we still need backup code for people who have javascript disabled? [closed]

Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 6 years ago.
Improve this question
I hear about it a bit in tutorials that I watch, that certain things won't work if javascript is disabled. Occasionally I see workarounds.
The question is, are these relevent? I can't imagine anyone not having a javascript enabled browser nowadays, except the most ancient of phones, and chances are your page won't render on them properly anyway.
Do people still bother to write backup code for javascript being disabled?
Edit: As a test, I turned javascript off. Facebook doesn't work.
Edit: I understand about visually impaired users, but do people care (harsh, yes) if their experience is buggy? Not to sound disrespectful, but not sticking to strict standards will alienate people using Internet Explorer 4 and 5 too, but we don't seem to care about them...?
Edit: Saying that people should do it seems like a very automatic response, considering how many people use JQuery and other groovy addon libraries.
Edit: I tried a bunch of fortune 500 sites, and so far about 70% of the ones I tried have broken
Dell
Walmart
Fedex
Intel
Coca Cola

Yes, we still need backup code for people who have JavaScript disabled.
JavaScript is often used to do things that break in screen readers (so many screen reader users disable it) or to cause changes to appear out of sight of a screen magnifier.
JavaScript is still one of the biggest attack vectors to exploit security holes in browsers.
Add-ons such as No-Script are increasing in popularity.
Search engines tend not to execute it (so you don't want to hide your content behind it)
I prefer to think of it as a foundation rather than backup.
I understand about visually impaired users, but do people care (harsh, yes) if their experience is buggy?
Nasty people don't.
The law (in many jurisdictions) does.
Not to sound disrespectful, but not sticking to strict standards will alienate people using Internet Explorer 4 and 5 too, but we don't seem to care about them...?
IE 4/5 have:
a smaller market share than users without JS
many security holes
no support from their own publisher

As a developer I no longer worry about 1% of users who turn off Javascript. It is too time consuming and development time is too expensive to waste on such nonsense. AJAX saves an incredible amount of bandwidth which turns directly into $$$ savings, which makes profits higher. If I lose one or two potential users of the site for every 100 users, those one or two lost users will cost a lot more in development than the potential income of they could ever bring in.
Try turning off Javascript and logging into Facebook, it becomes a very broken website after that. If it's good enough for Facebook, its good enough for me.

Support for JavaScript-disabled web sites a nice thought, but not of much help, and of questionable value, IMHO
It is almost impossible to design a robust website without java script, and those that disable JS, for whatever reason, probably don't expect much of a user experience. So if you are coding for that 1% of the population, you have no choice. But for the majority of us, it is a given that JS is there. Accessibility is a different issue, with its own challenges. When I was doing web sites for Hewlett-Packard, they had to meet strict accessibility standards, and it was tough to create anything more than very basic web pages. I wouldn't wish that on anybody.

I have a different opinion to many here. I don't think you necessarily should care in some scenarios, especially if your website is targeting a particular group of people or that it is going to mean a lot of work.
if you refer to:
http://visualrevenue.com/blog/2007/08/eu-and-us-javascript-disabled-index.html
(source: visualrevenue.com)
You can see that year on year more browsers than ever have Javascript enabled, contrary to the other answers' claims. It was at 96.9% in 2007.
So you lose 3% of potential viewers, so what, your advertising campaign will do a lot more damage than that!

Yes. Especially when it comes to 508 and WCAG compliance. While the technologies to create accessible JavaScript are coming out of their infancy (see ARIA), developer's should still be coding sites in a way the does not require JavaScript.
http://www.w3.org/WAI/aria/faq
http://www.w3.org/TR/WCAG10/

All the other questions got most of the points covered, but I'll chime in with this: it's not a big deal to have your page(s) degrade gracefully in the absence of javascript. If you've got some super-whizzy ajax-infested real-time comet style app that really isn't going to work without javascript, you should at least render a nice message to the effect that javascript is required.

It depends on your audience and type of website.
For instance, a graphic artist portfolio will not be visited by blind people or people using text browsers. So in that case it's not so important to build nice degradable JS, expecially because it will most probably be used for graphic effects.
If, on the other hand you're developing a news website and you decide (for whatever reason) to dynamically load your news with JS then you should definitely make it degradable. Also, remember that the spiders of indexing engines may have difficulties in indexing content loaded with JS in your page.
At the end of the day, in most cases it's not so difficult to program the site so that it works without JS. If you're retrieving content dynamically you already have the server-side code to load the content, you just need to accomodate how the page is called.
Same thing for forms, you can send the content via AJAX or via a normal POST, the backend will be pretty much the same, so it's again easy to implement.
Of course, the problem is not even posed for JS code that is purely graphical.

My recent experience:
My former supervisor claimed, in earnest, that because Google Analytics told us that "87% of our users have Java enabled and less than 3% are using IE6," that we didn't have to worry about supporting older browsers or users with JavaScript disabled.
Problem 1: Java is not JavaScript.
Problem 2: In order for Google Analytics to track a hit, the browser must have JavaScript enabled because the GA interface is a JS include. GA is not, and can not, be aware of users with JS disabled, which can potentially severely skew its reports.
Problem 3: one of our biggest customers requires that all engineers use IE6 with JS disabled.
Problem 4: The boss (at the time) didn't know how to read analytics reports.
If you want to know how important this support is to your business, a good place to start is the IIS logs. Just about everything related to the browser caps is stored by IIS. I regularly import the logs into SQL Server and run some basic reports from my admin site, which come in handy every time someone starts suggesting that we go crazy with the jQuery BS.
If you decide to start building complicated, script-dependent interfaces, be sure that your interface degrades gracefully and doesn't remove required functionality if JS is disabled.

It is not merely a question of whether a browser is capable of executing javascript, but if a user has disabled it for some reason.
For example, you need to be aware of vison-impaired users. Such users might disable javascript, because the effects are confusing their screen reader software.

Greasemonkey: love it or hate it? [closed]

As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center for guidance.
Closed 10 years ago.
As users, we love the power of Greasemonkey. As developers, it can complicate things.
Some people advocate defensively disabling user scripts; others are willing to die to defend them.
Is there a middle ground? How can we reduce the threat of an evolutionary arms race between users and unscrupulous advertisers?

Any control you think you have over which user agents your site visitors use is illusory. However, the vast majority will be using vanilla IE/Firefox/Safari. But, if you've a site where the audience has adopted a Greasemonkey script en masse, then treat that as a strong vote from your users that the site needs to change!

If your users are using a Greasemonkey script and coming back, take it as good fortune: there's something they need that you're not giving them, and they haven't left yet.
If they didn't have Greasemonkey, they'd be gone. What can you do to keep them?

If someone uses a browser plugin or modification of any kind, you shouldn't attempt to block them or disable it- that's just likely to result in more problems.
On the other hand, you shouldn't support them either; if it works, let it work, if it breaks, let it break.
Lots of people use dodgy browser add-ons, sometimes unintentionally and occasionally without any choice (Corporate IT imposes some dodgy IE modification on them). Try to play nicely with everyone.

I agree with MarkR (+1, by the way).
The application is on the client side...
So whatever web designers will try to do to stop some feature, they will either anger their users, have them hack away another solution, or move away to friendlier sites.
(I hate it when some broken down site needs me opening my Firefox debugger to enable me to complete my correct for just because some braindead developer forgot to declare his i loop variable and thus, making it a global... And I did it again less than two days ago)
As online apps should never rely on client-side controls and protections (i.e. testing the date value on client is a cool bonus, but testing it anyway and always on the server is the thing to do).
To the worst thing that could happen would be for the app to break on the GM user because of some faulty script. But from the server viewpoint, it should remain pristine.
... Thus, the client should be held responsible...
That means that whatever hack the user adds to his browser, the user is then on his own. At the very best, he/she could discover some hidden bug and report it. On the worst side, the site won't work properly
...Now, does it means client/server cooperation, too?
Most people using GM or whatever to enhance a site is showing that the site does not suit exactly is tastes. The good thing, like Rich wrote down, is that they are still on your site, and not elsewhere.
Either the "enhancement" is for his/her own very personal taste, and, hey, what's the problem if he/she wants to see your black-on-white web page with yellow-on-blue? Or perhaps the "enhancement" adds a lot of value to your site. In this case, I guess that what you want is to either offer the same features for everyone (thanking the author of the GM for his idea could be a good idea), or perhaps support it as an optional feature ("click here for advanced experience") or... an GreaseMonkey script?

I don't see why developers should hate it?
Advertisers? Nowadays, I doubt people write GM scripts to get rid of ads, they use AdBlock [Plus] instead...
In general, I write GM scripts to improve something lacking in the sites where I go frequently, so if you try and take measures to disable GM, I would be very upset and might boycott the site.
Beside, I guess that the number of people knowledgeable enough to install GM (even those using pre-made scripts) is quite small with regard to total number of visitors.

We've got accept the reality of our platform: once your website is in the (computer) memory of the viewer, they're able to do whatever they want with it, without your permission. Popular sites that try to dictate their own viewing terms to their audience often suffer immediate and angry backlash - instead of trying to do it your way, let the users do what they want, embrace it, and you'll end up providing a better service, which your users will appreciate and reward.