How do I find HTML5/CSS3 support for my users browser? Solution: FindMeByIP.com

Let’s say you are preparing to do a redesign to your site and want to implement HTML5 & CSS3 features to beef up your site.  Major issue comes to mind:

• Do my users use HTML5 & CSS3 supported browsers?
• Will this HTML5/CSS3 feature work on this browser?
• I need information regarding the support of major browsers overall.

The solution for these major issues is FindMeByIP.com.

What is FindMeByIP.com?

This free web app was built and constructed by Deep Blue Sky.  The purpose of the project was to find out what are the varying support and features of the many different browsers; specifically in regards to HTML5 & CSS3.  The tool will analyze and provide you the information regarding the browsers’ support.

For further explanation about the web app, read these Deep Blue Sky blog post:

• Quickly find your clients’ IP address and HTML5 and CSS3 browser support
• FindMeByIP.com – our latest afternoon project

Benefits

• Confirming browser support check for HTML5/CSS3
• Get data that compares HTML5 & CSS3 support against major browsers
• Great information to determine cross-browser support for re-design projects
• IP Address, Geo Location information, etc.
• The app is continuously improving and releasing quality features
• Oh yeah, it is FREE

So how do I use it?

Step 1: Go to FindMeByIP.com

Once you enter the site, you’ve already gotten your browser analyzed by the web app and it will show you right there and then a breakdown of its support and features for HTML5 & CSS3.

Step 2: Look at 6 Sections of Information

So the page you have just loaded is now populated with rich information about the browser.  Each section provides a list of features and indicates whether a feature is supported for the browser.

There are 5 sections of information on the page:

• Browser – Quick detail of the browser and OS
  
• CSS3 – A list of CSS3 features and whether the browser supports it
• HTML5 – A list of HTML5 features and whether the browser supports it
  
• Forms 2.0 – A list of Forms 2.0 features and whether the browser supports it
  
• CSS3 Selectors – A list of the CSS3 Selectors and whether the browser supports it
  
• IP Address & GeoLocation – Extra information about visiting user IP and location
  

Step 3: Check out the Web Design Checklist

First, you will need to click on the “Web Design” link at the top of the page.
This checklist is a compilation of all data the web app tool has accumulated about each browser.  The results are broken down into 5 sections:

• CSS3 Properties
• CSS3 Selectors
• Web Applications
• Embedded Content
• Web Forms 2.0

Each section provides a table which is divided by MAC or Windows OS followed by each major browser that are supported for the OS: Chrome, Firefox, Internet Explorer (6-8), Opera, and Safari. The table will provide information that will help determine which features go across each of the browsers.  This will in turn help clarify your doubts about which HTML5 & CSS3 features you are going to implement and if it will work across these major browsers.

Step 4: (Optional) Sign up for the reporting

You will first need to sign-up for an account.

Benefits:

• By having this account it will provide you the added service of filtering data for your users.
• The service will first provide you a unique url address based on your account username: FindMeByIP.com/youracctname.
• You provide this link to your users, which will send their browser information to you about their browser and creates a report for you.  The report is essentially the 6 Sections of Information (from Step 2).
• You also have an option to add a tag to better filter the users by adding a tag to the url: FindMeByIP.com/youracctname/yourtag.
• Also FREE

Conclusion

Your doubts are now at ease.  This is a must have tool that will be essential due to its rich information that you will need to make sure your site runs great when you implement HTML5 & CSS3 features on your site.

Extra Resources

SEO Experts; your robots revealed!