Browser Compatibility

Browser compatibility refers to how adaptable your website is to different browsers and devices. This is an important component of web design as compatibility ensures that all of your website’s features are intact for users across devices. These features include clickable buttons and formatting that helps to make your website aesthetically pleasing and user friendly.

There are many websites that offer some sort of browser compatibility testing. In order to write this post, I have employed the use of Microsoft Edge, as well as mobiletest.me in order to generate simulations of what the home page of this website will look like using a few different browsers, operating systems and devices.

Windows XP, Firefox 2.6

This operating system and browser displayed the most altered version of my website. The banned height is markedly decreased and the follow buttons normally displayed to the right of each blog post preview are missing. This is a problem because this functionality is lost when the site is viewed using this particular browser.

OS X Mavricks, Chrome 36

Viewing the website on Chrome using OS X Mavricks, the “follow” button and its functionality are restored. This display also appears less pixelated and the banner at the top of the page is in its original form.

OS X Yosemite, Safari 8

In safari, the website’s functionalities appear to be intact. However, the quality of the page looks somewhat degraded, perhaps because Safari 8 is an older version of Safari for Mac.

Apple iPad 2010, Safari 4.0

On a tablet, the website’s vertical margins are a bit more condensed and the “continue reading” button located at the bottom of each post preview is larger. The “follow” button on the upper right of each post preview is missing when viewing the site on this device.

iPhone 6, iOS 8.0, Safari 8.0

Mobile devices are commonly used to access web content, so it is important to evaluate how a website will appear on a mobile device. On the device above, the small 2 item menu bar is further condensed into a drop down menu button.

Leave a comment

This site uses Akismet to reduce spam. Learn how your comment data is processed.