HKNetLife – 港男生活部落格

Recently I wrote a post for The Web Squeeze about my essential ‘Tools of The Trade’. One of my biggest recommendations in that article was for web designers to get an extra monitor and hook it up to their computers. The TWS editors have now very kindly asked me to come back and give you a more in depth look into the world of dual-screen setups, and how you can create your own!

Although still quite a rarity outside large corporate companies and graphic design studios, dual monitor set-ups have actually been around for quite some time. Support for up to three monitors has been standard in Apple machines since 1987 with the launch of the Macintosh II, but wasn’t made a default feature of Microsoft’s flagship operating system until Windows98.

As technology advances the prices of standard monitors have inevitably dropped, making adding a second monitor to your computer a more attractive prospect than ever before.

Benefits of A Dual Monitor Setup

If you’re still unsure as to why you would need a second monitor in your life, here are some great reasons for taking the leap:

• Have your reference material for writing an article or email open on one monitor, whilst doing your writing on the other. (I’m doing this right now)
• Have your financial information open on one monitor whilst creating a spreadsheet on the other.
• Have photoshop open on one monitor, and your reference material on the other.
• Have your main photoshop area open on one monitor, and all your layers and tools windows on the other
• Have two different sets of code open side by side to compare and contrast
• Run your text editor one monitor and easily access your FTP application on the other
• Do your daily work on one monitor, and have a live twitter or RSS stream running on the other
• Keep HighRise or BaseCamp open on your spare monitor to remind you of your to-do list for the day.
• If you’re feeling lazy, have a film playing on your spare monitor while you do your work on your primary one.
• Keep your IM’s, Email, and all other things on the spare monitor and out of the way of your main work space.

Essentially, the main benefit of having more screen space is to stop having to switch between windows constantly. For Windows users this means fewer clicks on the task bar, and for Mac users it means fewer trips to Expose.

Examples of Multiple Monitor Workstations

Chris Spooner

Elliot Jay Stocks

Wolfgang Bartelme

Chris Coyier

Me

Creating Your Own Dual Monitor Setup (Mac)

As mentioned previously, Macs have had support for additional monitors built in for some time now and as a result, setting it up couldn’t be easier!

Step One

First of all, you need to identify what sort of Mac you have. If you got your Mac before October 2008, then the chances are that it has a Mini-DVI port. If you got your Mac after October 2008, then it’s most likely to have a Mini-Display port.

The one not labeled in the above photograph is the Mini-DVI port

Step Two

Next, you need to identify what sort of ports your new monitor has, the two most common options are VGA, and DVI, with DVI being the newer/better one. It may also be useful to know that universal colour is white for DVI, and blue for VGA. This means that typically both plugs and sockets on monitors and cables will be these colours. Here’s what they look like:

Step Three

And now what we need is an adaptor to link the two types of inputs/outputs together! Luckily, Apple have already thought of this, and carry a whole range of said adaptors. UK link — US link

Old and new adaptor. From the left…
Mini DisplayPort to VGA Adapter /New
Apple Mini DVI to VGA Adapter /Old
Mini DisplayPort to DVI Adapter /New
Apple Mini-DVI to DVI Adapter /Old

Step Four

Once you’ve got all your cables and adaptors connected, don’t be surprised if everything just starts working all by itself right away! Macs have a tendency to do that. However if it doesn’t all start working by itself straight away, then we need to open up the system preferences panel, and click on “displays”.

Now you should have 1 preferences window pop up on each of your monitors, each one controlling the brightness and resolution of the monitor which it’s displayed on. On your primary monitor (the one that’s built into the Mac) you should see three tabs: Display, Arrangement, and Color. We want to take a look at the ‘Arrangement’ tab.

This is where you tell your Mac how your monitors are set up on your desk. Personally I have my spare monitor mounted on the wall above my laptop, so I dragged the extra display in the menu above the primary one. Once you have your monitors lined up in the right place on screen, you want to UN-check the box at the bottom that says “mirror displays”.

Step Five

Then, finally, move your mouse off the edge of the screen in the direction of your new monitor, and it should pop up on the new screen! Job done!

Closing notes:

On all Macs since early 2006, “spanning mode” is built in by default. Spanning mode means that your desktop spans across the two monitors, as opposed to “mirror” mode, where both monitors display the exact same thing (for presentations where the laptop faces you, and the screen faces the audience).

On older consumer model Macs (aka iBooks) spanning mode is disabled, but it IS built into the operating system. In order to use an additional monitor on an iBook you need to download a very small app called Span Doctor, which should enable everything that you need.

Creating Your Own Dual Monitor Setup (PC)

Ok, so you skipped the Mac section and came straight down here to the PC section eh? First of all, you should get a Mac — but you didn’t really come here to listen to me tell you that, did you?

As you would expect, setting up dual monitors for the PC is infinitely more complicated and involves many more variables, so pay close attention as we go along!

Let’s get started

Step One

The first thing that you need to understand is that whether or not you can run an additional screen depends on your graphics card. Your graphics card is what drives the video-output of your computer, and its power is directly related to how many monitors you can have. A more powerful graphics card can drive more pixels!

The simple way to tell if you can support multiple monitors is to check the back of you machine for VGA or DVI ports (pictured below). If you have 1 of each or 2 of either, then congratulations! You can skip down to Step 5, because your computer (probably a relatively new one) supports multiple monitors. It may also be useful to know that universal colour is white for DVI, and blue for VGA. This means that typically both plugs and sockets on monitors and cables will be these colours. Here’s what they look like:

Step Two

If you’ve only got 1 port, then we need to find out if your existing card is powerful enough to run 2 monitors with a splitter cable, so let’s find out what sort of graphics card you have. Follow these instructions:

1. Click “Start.”
2. On the “Start” menu, click “Run.”
3. In the “Open” box, type “dxdiag” (without the quotation marks) , and then click “OK.”
4. The DirectX Diagnostic Tool opens. Click the “Display” tab.
5. On the “Display” tab, information about your graphics card is shown in the “Device” section. You can see the name of your card, as well as how much video memory it has.

Now that you know what graphics card you have, it’s time to get Googling. I can’t offer much support or advice here, as all graphics cards are different, but if you can’t find anything online then give the manufacturer a call and find out from someone directly if your card can run two monitors with a splitter cable.

If it can — fantastic, go and get yourself a splitter cable (pictured below) and skip down to Step 5, if not, keep reading!

Step Three

Unfortunately, I had hoped that you wouldn’t have had to keep reading this far. There’s good new and there’s bad news. The bad news is that it’s going to cost you a little more to get your PC to work with two monitors. The good news is that the parts you need to buy will improve your whole computer.

So, your graphics card can’t handle two monitors — so now we need to get you a new one! You can google something called a “Matrox DualHead2Go” which is an external graphics card that’s pretty much plug and play, but the price really doesn’t make it an attractive option compared to the alternative. Of course if you have a laptop, then this is your only option, so skip down to Step 5! If you have a desktop, then keep reading.

Step Four

The best thing to do here is jump on eBay, because they have a lot of decent chips at decent prices. Now I should stress at this point that installing a new graphics card in your computer is EASY. I’m not one of those people that builds computers from scratch on the weekend, so if I can do it, then you can too.

Take the case off your computer and have a look inside. Incidentally, this is a great time to clean out the inevitably large quantity of dust that you’ll find inside. Dust makes your computer overheat, and overheating makes your computer run slower. So try so remove as much dust as possible with a vacuum cleaner (make sure it has a plastic tip, not metal).

It’s important to note here that you shouldn’t go touching stuff inside the PC, you only need your eyes for this step. What you want to do is establish what sort of expansion ports are available on your motherboard. There are two different types of ports that will take a new graphics card, but for the sake of not turning this article into a novel, we’ll just stick to the newer and more common one, which is the PCI Express 2.0 slot. (also known as a PCI-E slot)

On ebay, you want to look for a PCI Express graphics card, one that has 2 monitor sockets (preferably DVI). It should look something like this:

Note that the metal panel with the plugs hangs out the back of the computer, so keeping this orientation in mind, see if you have a port inside your computer which is the shape of that chip. If you do — then buy the graphics card, and put it in! Unless you suddenly want to do a whole lot of gaming, it doesn’t really matter what graphics card you get, as long as it has 2 outputs. Look for NVidia and ATI as notable brands, and look to spend around £35 ($60).

Here’s short instructional video on how to do the installation, where you’ll see both the graphics card and the slot on the computer, and how they work together.

Step Five

Now that you know you’ve got a working graphics card, you just need to hook up the monitors to it. You might need some DVI to VGA adaptors for this if the types of plugs are different (remember DVI are usually white, VGA are usually blue), but assuming that you get those off ebay too then you should be good to go.

Step Six

Now right-click on your Windows desktop and click on ‘properties’ then ’settings’. You should be able to see and adjust both of your monitors from here, as well as setting the position (where the monitors are located on your desk). Click on the second monitor and then check the box that says “Extend my Windows desktop onto this monitor.”
Once that’s done, move the mouse off the edge of your primary monitor and it should pop up on the new one!

Further Reading

How to Connect Multiple Monitors to Your Mac
Nice little tutorial that further outlines how to connect another monitor to your Mac

How to Set Up Multiple Monitors On a PC
Another tutorial for setting up multiple monitors on your PC

The Workstations of Popular Websites
Fantastic collection of multiple-monitor-workstations in use by web designers

Multiple Monitor Productivity: Fact or Fiction?
An article examining and debating the affects of multiple monitors on productivity

Multi-Display Payback Calculator
Neat little calculator to figure out how long it will take for your new monitor to pay for itself!