This is a little trick I’ve picked up that helped me out quite a bit, especially when developing Wordpress sites where you need to get the paths and URLs right for everything to work properly.

The scenario

You’re hired to do the redesign of an existing website (example.com). Your client wants to move their website to your hosting (or new hosting) when the redesign goes live. You’ve agreed on a seamless transition from old to new on one sunny Monday morning in a months time.

So you get to work on the site in your chosen development area, demo it to the client, they’re happy and you transfer the site to the newly configured hosting space on your server, however the name servers for example.com haven’t been changed yet, it’s only Friday and the redesign isn’t going live until Monday, but you’re a contentious developer and you want to test the new design to ensure everything is working as expected in the live environment.

What do you do?

Our goal

We’re going to edit the hosts file on our Mac to make our servers IP address (e.g. 70.26.55.80) resolve to example.com, just like what a DNS server does when example.com’s name servers have been changed to point to the new hosting.

Configuring the server

All server configurations are different but the principle is generally the same, we need to find out/set our example.com to appear in the web browser when we visit our example IP of 70.26.55.80. For this example I’m going to explain the process on a Plesk driven server (from this you should be able to get an idea of how this would be achieved through other management software packages).

• Configure your web space for example.com and upload all your files to it
• Login to Plesk
• Select Server from the left-hand menu
• Go to the IP Addresses – This should present you with a list of IP addresses assigned to your server, when you configured the hosting for example.com you will have selected one of these IP addresses (you may even only have one IP address in this list)
• For each IP address there’s a column titled Hosting with a link showing the number of domains assigned to that IP address, click the link that corresponds with the IP address you selected for the web space
• Select example.com and click Set As Default - You can only select one default domain to be displayed if you visit that IP address in a browser
• Make a note of the IP address (e.g. 70.26.55.80)
• Visit 70.26.55.80 in a web browser – You should be presented with your newly uploaded site for example.com

Editing the hosts file

Mac’s have a hosts file that we can edit to make 70.26.55.80 resolve to example.com just as if the name servers for example.com had already been changed (obviously this only effects the Mac you are on).

I’m sure you’ll be able to do this on a PC as well but don’t ask me how, I’m a Mac man.

• Open a Terminal
• Enter sudo vim /etc/hosts then enter your administrator password

This will open the hosts file in the vim editor. You should see something like this:

##
# Host Database
#
# localhost is used to configure the loopback interface
# when the system is booting.  Do not change this entry.
##
127.0.0.1       localhost
255.255.255.255 broadcasthost
::1             localhost
fe80::1%lo0     localhost

To edit the file press ‘a’, cursor down to the bottom of the list and enter:

70.26.55.80       example.com

Press ‘esc’ then enter ‘:wp’ to write and quit vim.

If you now visit example.com in your web browser it should resolve to 70.26.55.80 (the new hosting) and you can test your newly designed site in its live environment.

Now all that has to be done to make the site seamless go live on Monday is change the name servers for example.com to point to your hosting and you can guarantee that everything will work.

Important note: Remember to take the entry for example.com out of your hosts file when you have finished testing, otherwise you may end up seeing a false representation of what is actually being displayed at that domain when the name servers are changed!

Final Tip: Instead of removing the line completely from your hosts file simply add a # to the beginning of the line. This “comments out” the line and stops it from being applied. If this is a process that you are going to use regularly in the future then the line is already in your hosts file and you can simply remove the # and change the domain name when you need to.

I think it’s great, Chrome isn’t the best browser out there but it is certainly an improvement over IE6 and surely it cannot be a coincidence that it has coincided with Microsoft’s announcement that IE8 is being pushed out as an automatic update.

I’m not sure if the button appears in the IE8 browser, I’ve not had chance to test yet, but if you have please feel free to enlighten me in the comments.

I think that will be an interesting test as well. If the button only appears for IE6 and 7 then Google are trying to speed up the demise of IE6 to improve the web for all, if it appears in IE8 also (which as we know IE8 has made big improvements in terms of web standards etc), then they are trying to steal some of Microsoft’s market share, in favor of Chrome…

Google homepage when viewed in Internet Explorer.

I’m not going to repeat Andy post here so read it yourself on his site. The question I asked however was this:

Okay, well IE8 is also missing a few of the other more popular CSS3 selectors that are available in other browsers, like border-radius and things like that. Is this a setback for CSS3?

And he answered:

The interesting thing, though, and this is the wider issue, is that there’s no strategic plan, either from the browser makers or, most importantly, from the CSS working group, where they plan in a timetable implementation of these new features. Now we’re not talking about the big design of CSS, and when are we going to get new layout features and things like that, but simple things like for example CSS columns? Webkit implements CSS columns, Mozilla implements CSS columns, but they do it independently, they do it when they want to on their own timetable, and what I’d really like to see is for these browser makers to get together and say “You know what in September, we’re going to introduce these columns across the board, and in October, or in our next release, we’re going to implement this across the board.”

This really got me thinking…

It wouldn’t just be nice if browser manufacturers collaborated more, it’s vital!

The web is evolving at an unprecedented rate, and users expectations of the web are evolving too. Unfortunately we as developers are hindered by the restrictions of the browsers that these users utilize and I’m not just talking about Microsoft.

The simple fact of the matter is, unless all browsers introduce, for example, the same CSS style at relatively the same time, we as developers can not implement them.

In some cases we can employ progressive enhancement, like with the border-radius style available in Firefox & Safari, but background layers? No way. Not until all browser support the style consistently will us as developers begin to implement it to any great effect.

The CSS3 specification has been in working draft since May 2001. Only now with the release of IE8 have Microsoft got the rendering of CSS2 (recommendation May 1998) working properly (fingers crossed). It’s about time browser manufacturers got the fingers out and started working together to improve the web for all.

As a developer I find this industry an exciting one to work in, there’s always something new to play with and improve, but imagine were we would be today if say five years ago, browser manufacturers had all got together, said to each other “OK, lets make all our browsers render in the same way and support the same things” and started focusing on their individual browser interfaces and browser features, which to the average user is all the market upon anyway.

We designers/developers would be much further along at build the beautiful web that Andy advocates.

Hands up if you’re sick of hearing people say “IE6 is used by 25% of the market; not supporting it is “freezing” out 25% of your customer base and basically telling them to stick it.”?

I certainly am and whenever I hear this I think to myself how can you use that as your main case for supporting IE6?

In a recent post I read the author argued that when looking at these two static pages:

• Marketshare
• W3C

IE6 has a 25% share, it’s true that each site reports that but compare the other browsers. Allegedly IE7 has 47% share on one chart and a 26% on the other, Firefox has a 43% share on one and a 17% on the other. We’re not talking marginal difference in percentages here; we’re talking so completely different they’re beyond comparison.

I wonder to myself, is it beyond the realms of possibility that IE6’s share of the market could actually be much smaller? Say 15%? Than what we think it is, and instead of comparing individual browsers, for example “Safari has a small share but we still support that”, compare standard compliant browsers to non-standard compliant ones. In which case, according to our completely unreliable static charts we have 75-85% compliant and 25-15% non-compliant. IE6 is the minority!

But I don’t want this blog to turn into a rant. The title after all is Help Accelerate the Demise of IE6. So how can we achieve this?

People Still Using IE6

There are two main groups of people still using IE6. These are people with no other choice, who have no other option but to use IE6 in there work place, and then there are the un-educated, people who don’t even know that there are other browsers out there. The first step to IE6’s demise will begin with educating these poor, poor souls.

Passive Blows

There are things happening right now that are helping us achieve this without any direct intervention from us as Web Designers.

• Release of Google Chrome – Paul Boag has speculated that maybe Google Chrome can topple IE6. I think Chrome could be the first wake up. Even though Google aren’t actively promoting Chrome to the consumer market, they have added a nice, prominent link to the Google homepage (ed – link appears to have been removed now which is a shame.) that might just convert a few IE6 users.
• Major companies are dropping support for IE6 – Facebook, MobileMe (which also doesn’t fully support IE7!) and 37signals are all dropping support for IE6. I think the most prominent to convert the average IE6 user is Facebook. Everyone’s on face book these days and when something stops working for them in IE6 they’ll upgrade.
• Upcoming release of IE8 – When IE8 comes out there will be even less excuse to not upgrade, especially when it becomes a mandatory update.

Do Your Bit!

If you visit a site that uses Flash and you don’t have it, or you need to upgrade your plugin, you’re given a link and you install/upgrade without even thinking about it. Same goes for Quicktime, you get prompted to upgrade if your version isn’t up to scratch. Let’s all (and I know some people are doing this already) do the same thing for IE6!

Provide a minimal site layout with an upgrade message or simply an upgrade your browser page. And enough of this “freezing” out IE6 users non-sense, we’re not, we’re just encouraging them to move with the times and provide them with a better experience.

Also, educate your clients, ask them what browser they’re using and why? Explain the benefits of upgrading and emphasis the list of things that can now be achieved in new browsers over IE6.

The end of IE6 is inevitable. Let’s help it get here faster.