I am very new to web design and I have this current project that i am working on right now.
My task is to have the website, http://www.aljoufilaw.com, to be compatible with all browsers and platforms, i.e IE, Chrome, Firefox, Safari, including mobile devices, etc.
My problem is that the design lay-out of the website changes and varies with each browsers and screen resolutions, especially with the alignment of the menus and buttons. Is there a way that i could fix this issue without having to calibrate the website for each browsers?
I really appreciate your help and feedback on this.
As a general rule, if you use well formed code, you won’t have to worry about each browser as such, though you should test carefully as you go to spots problems as they arise. The rise of the mobile web has introduced a lot of new challenges, so you need to do a fair bit of research to understand how to deal with them. A popular approach these days is to design for “mobile first”, meaning keep the design simple enough to work well on mobile devices and then build up to desktop design. This often makes use of things like the new @media rules.
There’s no quick fix, though. It requires some study to get one’s head around all this.
It helps if you avoid cutting edge CSS that is not fully supported by all browsers and definitely not by older browsers.
Trying to be really clever often results in problems.
First, focus on writing good, clean code that follows the standards. Next, you need to decide what browsers you will support. Specifically, what versions of IE are you willing to support? Where I work, IE8 is as far back as we will go. For those few users with IE6 or 7, it just isn’t worth it for us to cater to outdated browsers, too much work, and too much compromise for the vast majority using modern browsers. IE8 is a problem. It still sucks, but it sucks less than 6 or 7, and it is still widely used.
The last thing you want to do is “calibrate for each browser”. Instead, focus on good code, and adjust if needed.
Now a days many web master facing this problem. You can solve it with various ways but as per my opinion “Responsive Website Design” is one of the best methods to build a cross browser compatible website. That means a website which is a compatible with all browsers and platform such as mobile device and all major browsers. HTML 5 and CSS 3 is latest version of website programming language which will help to build the cross browser compatible websites. It is advisable to build a different website for a mobile device with necessary content and image which will faster in loading and easy to subscribe for end user.
Sorry, no. HTML5 and CSS3 are still in development and the specs have not yet been finalised. Support for them is patchy among newer browsers and non-existent in older browsers, so for cross-browser compatibility, you’re far better off sticking to the established standards of HTML4 and CSS2.1.
