Discovering Browsers and Tools You Can Use with WordPress - dummies

Discovering Browsers and Tools You Can Use with WordPress

By Lisa Sabin-Wilson

A multitude of browser systems are available on the web. Here, you discover five major browsers that you can use with WordPress and that are the most popular among Internet users. Additionally, you find some helpful tools, add-ons, and extensions that assist you with your web design efforts in the different browser systems.

As far as the design and development communities are concerned, the choice over which web browser to use typically falls on how compliant the browser is with open web standards developed by the World Wide Web Consortium (W3C), an international community that develops web standards to ensure long-term web growth. As a designer, you should at least have a working knowledge of what the W3C is and the standards it supports and promotes. Check here to read about the W3C vision and mission statement.

Google Chrome

Google Chrome is the most popular web browser today, according to a W3Schools report on browser statistics and trends. Chrome was developed and released by Internet search giant, Google. Chrome has an active development community and has add-ons, or extensions, that you can install easily on your computer on a Mac, Windows, or Linux. Check here to find web development–related extensions for Google Chrome.

Internet Explorer

Internet Explorer (IE) is currently distributed with all Microsoft Windows operating systems. Over the years, IE has struggled with its reputation of not keeping up or being compliant with web standards and CSS rendering that the development and design communities have come to love and expect from other browser systems. This is largely because of the layout engine in use at the foundation of IE.

One of the challenges that designers come across is the different versions of Internet Explorer that are widely used across the web. With each new version, Microsoft’s flagship browser comes closer and closer to compliance with open web standards, however.

But because IE is the browser present with millions of operating systems across the world, not every individual user or company is quick to adopt the new versions as they are released. This results in several versions of IE in use across the world, and designers generally make an effort to ensure that their designs render correctly on, at least, the last two to three recent versions of IE.

Currently, the versions of Internet Explorer that are supported by the majority of designers are versions 10 and 11, with most designers gradually dropping support for versions 6–9.

Trying to test designs on different versions of Internet Explorer is difficult because attempting to install different versions on your computer can cause some big headaches if you don’t know exactly what you’re doing. A tool called IETester comes in handy for specifically testing different IE versions. Go here to download IETester.

The buttons across the top are labeled for specific IE versions: IE5.5, IE6, IE7, IE8, IE9, and IE10. This WordPress website is displayed in IE7. IETester is currently only available for Windows.

Test different IE versions with IETester.
Test different IE versions with IETester.

Mozilla Firefox

Firefox is the second most popular web browser and has emerged over the years as a solid IE competitor. Designers and developers tend to prefer Firefox over IE because Mozilla (the makers of Firefox) uses a solid layout engine that adheres closely to open web standards and better supports and renders CSS. Firefox is available for download and use on Windows, Mac, and Linux operating systems and in more than 70 languages. You can download it from the Mozilla website.

One of the main reasons Firefox is a great choice goes beyond the fact that it adheres to open web standards and renders CSS as it was meant to be rendered. Firefox is also an open-source software project with a vibrant development community that releases very helpful add-ons and tools, which extend its capabilities beyond just a web browser, turning it into a web development tool, in many cases.

You can find Firefox add-ons for just about everything from the appearance of your Firefox browser to browser-based games.

And the rest

A couple other web browsers are used regularly but aren’t quite as popular as Chrome, IE, or Firefox. However, they’re worth checking out:

  • Opera: Opera is available for Windows, Mac, and Linux, and markets itself as fast, secure, and completely in line with open web standards, including cutting-edge development languages like HTML5 and CSS3. Opera has add-ons available as well.

  • Safari: Safari is installed on every Mac, from large iMacs to MacBook laptops to iPads and iPhones. In short, Safari is an Apple product; however, it can also be installed on Windows. Instead of a bunch of add-ons that you can download and install for web development, Safari has built-in web developer tools, such as

    • A developer toolbar with tools for website manipulation, testing, and debugging

    • A web Inspector with a wealth of web development tools, including an Element pane where you can inspect CSS markup

    • A Resources pane that displays a website’s resources by date, size, and speed

    • A JavaScript Debugger that displays any problems your site is experiencing due to JavaScript that is in use

    • A Timeline pane that analyzes a website’s behavior over time

    • A JavaScript Profiler that lists the performance characteristics of scripts that run on a website

    • A Console pane for debugging

    • A Snippet Editor to test HTML markup