Grow your CSS skills. Land your dream job.

Web Developer Economics: Hardware Costs

Published by Chris Coyier

This will be the last part of this mini series about Web Developer Economics before we wrap it up and look at the numbers together. We already looked at:

Now we need to consider the hardware itself. I think this one is pretty simple: you need a computer.

I think you need either a laptop or a desktop. Maybe someday in the future the tools will be there to build websites on tablets or other futuristic devices, but I don't think we're there yet. Laptops these days are so powerful that it's hard to imagine going any other way. You can plug in an external monitor to get a desktop experience, or take them with you. Unless you're like a school computer lab or office where nobody works from home ever, it's hard to imagine going with anything other than a laptop.

I know this site is pretty Mac-focused. That's what I like and use. But I promise you: I really don't care what you use. I'm way more concerned that you are writing maintainable CSS that I am about what kind of computer you are using. If you're happy on your PC running Ubutunu (or whatever) and you're making good websites, you're A-OK in my book.

That said, if you're buying a computer right now to be a part of your web design/development life/business and you ask me what I think you should buy, you should buy a ...

MacBook Pro (Retina, 15", $2,199)

As I've written, this is the best computer I've ever owned. It's worked extremely well for me. I feel very productive on it. It runs all the best software for web development (that I know of). This retina display screen looks great, but as a developer allows us to be ahead of the curve in designing for devices of this pixel density (technically you could write code and build graphics to support it without owning one, but you need to have one to care).

Alternatives: Any other laptop or desktop computer that works for you.

Microsoft Natural Ergonomic Keyboard 4000 ($49.95)

I use this and like it when I'm at home and at my desk. I have RSI (repetitive strain injury) problems when I'm away from it (using laptop keyboard only) for too long.

Alternatives: Use built-in laptop keyboard / some other external keyboard

Kensington Expert Mouse Trackball ($99)

Also helps my RSI but also I think is just a very efficient mouse in that you never need to pick it up or do awkward motions with it. I miss the trackpad when I'm in desktop mode though, with its gestures and wicked fast scrolling.

Alternatives: Use built-in trackpad / some other external mouse

Brother HL-2280DW ($199)

This is a very nice and efficient printer. Wireless, laser printer (cheap ink), and does stuff like automatically print both sides of documents to conserve paper.

Alternatives: Go totally paperless / some other printer


None of these accessories are vital to my job but I consider them business expenses. I bet most of us have a few accessories like this. They might not be these, but you have some, so we'll include these in the final calculations to keep it even.

Office space might be considered a "hardware" expense of sorts. I'm not going to consider that here because it's optional. I don't have an office. If you work somewhere that does, that's factored into the cost of running a business there either by you or the owners of that business.

Service Cost
MacBook Pro $2,199
External Keyboard $49.99
External Mouse $99.99
Printer $199.99
Total $2,548.97

With these numbers and the ones gathered from other posts, I think a wrapup is in order looking at them all together and see what we see. Look for that soon.

Comments

  1. Nice choice on the trackball. I have several of the Logitech Trackman Marble devices and they’re great.

  2. Permalink to comment#

    You forgot to mention the hardware you use to record your screencast. Webcam? Mic?

    • Indeed I did forget that. I think I’ll leave it off the final calculations though as we have enough of those optional accessories in here already and a microphone certainly isn’t required to be a web developer.

      I use the Rode Podcaster though, which comes in at $229. Very mid-range in cost. It has lasted me about 5 years now through many moves and it has never flinched. I put it in a shock mount and a little desktop boom stand.

    • Permalink to comment#

      Thanks for sharing Chris

  3. Permalink to comment#

    The only real problem I have with macs is I have yet to find something which can write and run ASP.NET/C#.

  4. You mentioned the option of using an external monitor, but you didn’t include it in your costs. Having used twin-monitors for years, I find it difficult at best to use a single screen for development, let alone any graphic-related work.

    Also, I highly recommend the Evoluent VerticalMouse 4. It’s been wonderful at reducing my own pain and discomfort, and well worth the investment.

  5. Covarr
    Permalink to comment#

    I would say that screen real estate is a worthy investment. If you’ve got a laptop, consider buying an extra monitor. If you’re buying a desktop, consider buying something that comes with a big screen (such as a 27″ iMac) or an extra monitor in addition to what you get. Being able to see your site and your code at the same time can be a HUGE plus.

    One mouse that I really like is the Logitech M570. It’s a trackball, but you control it with your thumb. Fairly unique, as trackballs go. If I could only have one mouse, I’d probably choose something more traditional since I use my computer both for work and for gaming and I don’t really like this one in games, but for sheer productivity it’s quite nice.

  6. John Louros
    Permalink to comment#

    I have a MacBook Pro 15′ 2009, it’s a very good PC, but to be honest I regret the purchase. At first I was in love with the Mac eco-system, since the best web development apps were built for Mac OS. The machine body is great, durable with a cool design. But still, $2k for it, is way too much. Worst of all, now that Microsoft really have the best tools for Web Dev. (VS 2012, or even Web Matrix), doesn’t make any sense to buy a Mac again. You can buy a similar quality product from Dell, for much less.

    Just saying this because I think Web Devs today haven’t tried the latest development tools from MS, or they are stuck in time and coupled with their Mac OS environments. Plus, the money arguments doesn’t even make sense, from what we see from Chris’s previous posts…

    Just give it a try, I was also a MS-hated (which lead me to buy a Mac), but in this days the bad guy on the street is clearly Apple. Remember, if it doesn’t work, you are holding it wrong…

    • West
      Permalink to comment#

      It really depends on what tools you are using and what you are developing with as to which platform is best suited to you.

      Windows is fine for many things but once you start doing things that aren’t inherently important on Windows you’ll find yourself in trouble.

      Things that just work better in Linux and Mac environments:

      Ruby/Rails for web development
      Python web development
      Things like nodejs and nodejs based tools like LESS
      git
      Many more

      These things work better because they were built by people who use unix-like platforms and are used to using those things, but when it comes to Windows these tools start to act differently or are harder to use.

      Now there are alternatives to these things and Microsoft has many C# frameworks and so on that you could use instead, and PHP works well on Windows so that isn’t a problem either but because so many designers and developers use macs you’ll find many tools on that platform that you won’t find on Windows (like codekit and others).

      So it really comes down to what you are developing as to which platform works best for you.

    • While I am with you on the VS2012 and all… (I would consider my self an experienced .NET developer by now, and that is the ecosystem I am working in)…

      Ultimately, there is not a single Laptop that can compete with the MacBook mentioned in the topic… Because of one simple little thing… 2880×1800… Which is a completely different experience than the 2009 you mention…

      I Am no Apple lover at all, it pained me at first that I had to go with a Macbook this timer after years of owning Lenovo’s… But I have yet to regret that I switched to my MacBook Pro 15″ Retina…

      It runs Windows 7 and VS2012 just fine BTW… And considering how easy it is to install windows in bootcamp, it’s almost like Apple encourages you to do so…

      (I Opted for 16GB RAM, 512GB SSD and care plan, so mine ended at $3.350, so I guess that is beyond way to much?)

      I can’t live without my workstation with 3 x 24″ Dell U2410 monitors on the side though…
      But all in all I spent way to much on hardware alltogethe…

  7. Louis Cloutier
    Permalink to comment#

    Looks like your link at the top of the article to your client site personal earnings is broken ;-)

  8. Jackie
    Permalink to comment#

    A few years ago I started noticing that my right arm was hurting a lot from using a mouse all day at work. I had a Wacom Intuos3 laying around from when I used to draw comics and I decided to start using it as a mouse and I’ve been using one ever since. My arm never hurts now and I always get a lot of people at the office that stop by and ask me about it. Most people are completely puzzled as to how I “draw” code!

    The latest Intuos5 can be pretty pricey (starts at $230) but the lower end Bamboos are also very nice and start at $80. If you don’t like using a trackball, a tablet could be a good alternative!

    • Tom
      Permalink to comment#

      I too am using an Intuos3 for the last 5 years or so on my desktop and couldn’t imagine going back to a mouse.

    • Permalink to comment#

      I bought a bamboo fun a few years back, and it’s great.

      However, my favorite pointing device ever is my logitech m310. comfortable, smooth, accurate beyond belief (plus it came with a really nice keyboard).

  9. MaxArt
    Permalink to comment#

    I’d never buy a Mac because I developed a hatred from my guts for Apple in the last years, but I admit I’d really love a high-density display. Hopefully, Samsung and other makers will follow soon, so there won’t be the need to buy Apple.

    Anyway, I can still use a full-HD display – two displays being the best for me. This can actually save some money. I don’t really need to travel with my PC that much.

    Plus, IE and Chrome are the weapons of choice for my company, so there’s at most the need for a Windows system. And I’ll still stick to desktop computer for a while too.

    I’d really love an SSD, anyway. Can be really useful with Eclipse (and derivates) or dealing with large images.

    I “worked” (actually played, for the first part) with mouse and keyboard for the last 25 years, with crappy hardware and all, and my wrists are still perfect. Am I special or just lucky? Or very big hands may help?

  10. Sumit
    Permalink to comment#

    Great article Chris!
    You made a typo there. It’s not “Ubutunu”. It’s Ubuntu. I am guessing that’s what you wanted to write.

    • cnwtx
      Permalink to comment#

      Yeah, I think it is misspelled. Oh, and it’s AMAZING! Way better than Mac in my opinion.

  11. I’m personally a fan of the old-school clickety style (IBM Model M based) keyboards… currently using a Unicomp Customizer 104-key. It’s actually better to have a mechanical keyboard than the “natural” keyboards for the most part, since you aren’t bottoming out to type… also if you aren’t rough with it, your cube-neighbors usually don’t mind.

  12. Permalink to comment#

    Macbook Pro Retina at work, with 27″ Thunderbolt display. (512gb, 16gb ram, 2.7GHz model.) Rain stand, apple keyboard and mouse.

    Macbook Pro 2011 at home, 15″ with 8GB ram, 2.4GHz (I think), replaced the internal drive with a OCZ Vertex 3 128gb (http://www.newegg.com/Product/Product.aspx?Item=N82E16820227706). Rain stand, 21.5″ Acer monitor.

    Mouse: best mouse I’ve ever owned, Logitech MX Revolution. Owned it for several years now. http://www.amazon.com/Logitech-Revolution-Cordless-Laser-Mouse/dp/B000HCT12O

    Keyboard: wonderfully clacky Corsair Vengeance K60 (review at http://www.overclock.net/products/corsair-vengeance-k60-performance-fps-mechanical-gaming-keyboard-ch-9000004-na/reviews/5435.) http://www.amazon.com/Corsair-Vengeance-Performance-Mechanical-CH-9000004-NA/dp/B005QUQP80

    Keyboard 100, mouse was 100, Macbook Pro was 2000ish, monitor was 150ish.

  13. Permalink to comment#

    you’re privileged in the US to be able to buy the latest and greatest hardware at those prices. Here in Brazil, the new mac book pro is the equivalent of 6500 dollars (13000 brl), making it a non option for me. Or I might as well take a trip to the US and buy one while I’m there, at least I’d have had a holiday :)

  14. Bert de Vries
    Permalink to comment#

    Hardware is one thing, software another. I think we all agree that software is even more expensive then hardware. Chris, maybe you could do a wrap up on this… That would really be interesting.

    • Bert de Vries
      Permalink to comment#

      Sorry. Missed the previous post. Shame on me….

    • Permalink to comment#

      hehehe… if you look at my software list in that article, you’ll see that it is actually much, much cheaper (plus, I run linux).

  15. I have used PC’s since the 8088 in the early 80′s…with a brief foray into the world of Macs when I studied Multi-Media in the mid nineties…I have worked in some part of the media industry for the better part of 16 years and Macs have always been there as designers and artists seem to love them…..and Ad and creative agencies seem to love them more…personally I have tried them many times…but the window management and the file management on a mac has never worked for me. I stress the “for me” part…To each their own…

    With that out of the way…I use a Windows 7 64-bit machine with 8gigs or RAM with a Q6600 Quad core…this machine has worked well for awhile…I will upgrade to an SSD and Windows 8 shortly…I like to try the new stuff…

    As for Keyboard and mouse…though sometimes finicky…I use the Logitech MX5500 bluetooth keyboard and mouse combo…as I love having no cords in my way…Best feature of the keyboard is the built in calculator…I use that a lot…I know Calculator is always a few keystrokes away in Windows…but being able to just do a calculation right on the keyboard (the keyboard has a small lcd display to display the calculator inputs and outputs…) is very useful…

    • Forgot to mention monitors…I have two matching monitors…they are a little different and hard to find nowadays…the model is Samsung SyncMaster 2343BWX …I like them because of their unique resolution which is 2048px x 1152px …2048px is exactly double 1024px which is a handy resolution to test web sites at…as it is sort of a base resolution (at least it used to be)…and with Windows 7 you can easily snap windows to half the monitor which works really well with these monitors…

  16. Permalink to comment#

    I’d say one thing you missed off your list that I would consider essential is a good external drive for backups.

  17. click, click, click …. the most important device for a developer is the keyboard.

    There is nothing better than a mechanical keyboard. I’m very happy with the Razer BlackWidow, because it is the only mechanical keyboard i know with keyboard lighting.

  18. Permalink to comment#

    Now that I have a Surface, it would be super cool if you could add in the code required for IE10′s snap view to keep your design responsive.

    Thanks as always Chris. You’re site is a tremendous resource to us.

  19. Aaron Clayton
    Permalink to comment#

    I totally agree with the Retina MacBook Pro. Now that the 13-inch is out, and a little more affordable, it would be stupid not to get the machine to stay ahead of the curve. Plus, when Apple continues to push these products, the industry will follow, and soon we’ll all have to develop for retina display.

    The only thing I would disagree with is the printer. With things like CageApp, Basecamp, Proworkflow, and others, it’s so much easier for clients to see their changes via email or web-app—especially if you’re developing a “web” site.

    Love the site Chris!

  20. Great to hear that you are so content with you MacBook Pro. I do prefer working on Windows 7 but a lot of designers love Apple. I might give it a shot…

  21. I mainly use my MacBook Pro 13″ (early 2011) that I love, but learnt on an old Windows machine running XP; I’ve used everything from Mac to Ubuntu from new to old.

    I don’t think the hardware is important. All you want is a good screen, a comfortable keyboard/trackpad/mouse and a fast enough computer to run photoshop. And a good internet connection.

  22. The best computer I’ve ever bought is my 2011 13″ MacBook Air. I upgraded it to an i7 with 4GB of RAM and I’ve never looked back, I think it cost me about $1800? It’s powerful enough to run everything I need at once, including Parallels Desktop for Visual Studio development, but extremely light and portable for whenever I want to use it away from my desk.

    I’ve found though that the thing that slows me down the most is a lack of a good internet connection. It cripples my productivity, as all of my tracking tools are online and so is Stack Overflow!

  23. Permalink to comment#

    I would definitely buy a MacBook with Retina display as there is no such piece of good HW from other manufacturers. But here in Czech republic the minimum cost (depending on the HW parts) is about $3.400 which compared to US prices is a total price piracy!

    Though would love to have a laptop there is not one that meets my criteria (CPU vs. RAM, VGA vs. display resolution) or the price is so high it could be considered as a escroquerie.

    Yep, I can configure a laptop of my own at manufacturers eshops but they are not sending outside the US and the ones very similar in parameters are twice the price here in CZ.

    So I have to be happy with my desktop. The price here could be calculated precisely using the components prices but I would just round the price to circa $1.400 for the desktop, 24″ full HD monitor and an ink multifunctional printer (will never ever buy an ink printer!) with additional $280 for my Logitech MX 5000 mouse and keyboard set. There could also be considered a $180 value headphones I use every now and then when working on my PC.

  24. Permalink to comment#

    Alternatives to the Macbook Pro: Basically any Windows PC or the Mac Min or Mac Pro.

    I say this because Sublime Text 2, Brackets, Adobe products, and many others are available for PC. As I am sure, Mac only has Coda?

  25. Permalink to comment#

    Thanks for this series of posts, Chris.

    Do you think it would be valuable to also add in the cost for things like a good chair or desk? Good choices of these could be the difference of many hours of productivity.

  26. Permalink to comment#

    Ideally you’d also need to buy a few mobile devices, tablets, etc.. for responsive design testing

  27. Permalink to comment#

    I somewhat have the best of both worlds currently (to an extent) because I have a nice desktop for work, and an [aging] iMac at home. The one thing I missed the most here recently, was CodeKit. I started using this a lot once I started watching Chris’ videos in the lodge. One of my favorite programs out there right now.

    Home Setup:
    2008 20″ iMac – 4GB RAM, 320GB hard-drive, Logitech Performance Mouse MX, Apple Wireless Keyboard. RDP in to my work computer if I need to use a Windows environment for some SharePoint related stuff.

    Work Setup: Dell Optiplex 990 – Dual 24″ 1080p Dell Monitors, 16GB RAM, 256GB SSD, Logitech MK710 Keyboard, Logitech Performance Mouse MX, Windows 7 Professional (64-bit). 8GB VM of OSX Lion [only to really use CodeKit + I like the OSX UI a little more]

    This setup works out pretty well for me being that I split my time at work doing either 1)Network Administration – [we're in a 99% Windows environment] and 2)SharePoint Development [I find the branding portions to be a TON easier on my Mac]

This comment thread is closed. If you have important information to share, you can always contact me.

*May or may not contain any actual "CSS" or "Tricks".