Cross-browser compatibility is among the key requirements to modern websites. But there are 50+ browsers out there now. Many of them treat HTML and CSS standards differently. Therefore, cross-browser compatibility may lead to the increase of costs on design to HTML/CSS conversion (so-called PSD to HTML), as well as to the growth of loading time and complexity of the resulting markup. The new Web standards and trends such as HTML5, CSS3, the mobile Web, and responsive web design add new facets to the problem of cross-browser compatibility.
The article presents the information on some browser market tendencies and provides tips for website owners on how to wisely concentrate their efforts when converting designs into cross-browser HTML/CSS code or ordering PSD to HTML services.
Which Browsers to Take into Account When Converting Your Website Design into HTML CSS Code
The main tip is simple: you should deeply understand and feel your website audience, their needs, requirements, as well as geographical, professional and demographic profiles.
- An important source of information about the website visitors' behavior and preferences may be the analytical data for the previous website versions or other websites in your niche. You can get valuable info about demographics (countries, cities, languages), browsers, as well as screen resolutions, devices, and operating systems.
- Local preferences can be very essential. For example, the desktop version of Opera might not be taken into account in the USA but it should not be neglected for the Eastern Europe because Opera is very popular in those countries. Also, being not very popular in the USA, Microsoft Internet Explorer 6 (IE6) has 35% of users in China (October 2011).
- IE6 may be a must if the website is to be used mainly by companies utilizing legacy software or some government or scientific organizations.
- People usually visitting your website from their offices may use IE more often than those browsing your website from home or in the evenings, weekends and holidays.
- Is your target audience the Internet active people (for example, web designers)? Then you may neglect IE6 and old versions of other browsers as this target group prefers the newest software product versions.
- Once your website is intended to work in a corporate Intranet and all users there have one and the same browser then there may be no need to order support of other browsers.
- Whether a great part of your site visitors is people with special needs who use corresponding browsers and assistive technologies (screen readers, etc.) then you should take that into account too.
- If mobile users are important, mind that the mobile browser market is quite different comparing to the desktop one. For example, Opera is one of the leaders here and therefore cannot be omitted.
- BlackBerry and Windows Mobile based devices are typical for business people. If your audience is geeks or youth then you may concentrate on iPhones and Android-based mobile devices and corresponding screen resolutions.
- No special restrictions or requirements? Then try a standard set of the most popular browsers and their versions (desktop): Chrome 10+, FireFox 5+, Internet Explorer 7+, Safari 5+, and Opera 10+.
Summarizing, before converting the website design into HTML/CSS code, a WordPress or Joomla!/Drupal theme,
- Study your website target market and audience
- Consider whether it is necessary to use HTML5, e.g., audio or video features, geolocation identification, etc.
- Define whether responsive web design is important to your website. If yes, specify main devices and screen resolutions
- Bearing this information in mind, check the latest browser market statistics and trends
- Finally, select browsers and their versions to take into account in PSD to HTML conversion
Use the latest data in your research because statistics is becoming stale quickly now. Moreover it is very important to preserve common sense considering the latest buzz about new tendencies in order to make a sound decision based on a ground research.
Hope these tips would be of help when planning your website development or ordering the cross browser PSD to HTML conversion next time.
Read more in