6 Best Laptops for Web Development And Design in 2020

Web Development & Design is an insanely broad topic and I haven’t had the chance to work through all of it.

No one has really…

I only know the stacks I’ve worked with, and since I’m relatively old, that means quite a handful but I certainly don’t know what kind of applications you’re building in your system.

But let me tell you one thing I know and I am sure of …

You can use any old crappy computer for all of it. It will powerful enough to start you up building amazing websites.

Why? Think about it, web design is largely about writing code—this is just text and even your old 2008 iPhone can write lots of text!

I am not saying you should be building websites on your iPhone (though is already possible with a few apps out there) nor using a cheap 200$ laptop from wallmart.

Why?

Well you’re going to be typing your eyes out on this thing while staring at code for several hours non-stop.

So you might as well invest on a laptop with the best workspace you can afford. Of course, a decent performance is essential too because it will allow you to save few seconds here and there by loading stuff a bit faster (seconds add to minutes and minutes add to hours which means less time working on a project).

The formula goes like this:

OKAYish speed + a awesome display + a kick ass keyboard = Crazy fast and happy Web Developer with a lot of money to spare.

Recommended Specs for Web Development

To make sure everyone reading this is happy regardless of kind of web development they do and regardless how much they know about computers, this is what we’ll do:

We’ll go through the best laptops for web development for those who are just happy to be told what to buy, we’ll mention what you can expect from each laptop and whose this laptop is specifically for (front or back end developer, someone just starting,etc).

And for those with a bit more time in their hands we’ll go through everything there is to know to find out the exact hardware you are going to need for your specific purposes.

Since the latter can be a very long & boring topic, it’s been placed at the end of this post. You can choose to read it later if you desire.

For now we’ll try to summarize that section as much as possible:

Display
Since most web development can be done with minimal specs, your main concern should be display and keyboard:
Full HD as a minimum , Matte over Glossy preferred. IPS optional.

Keyboard
If you are staying in laptopville, you’ve got to make sure you end up with a decent keyboard. Unlike desktoptown you can’t replace a keyboard in laptopville. While it’s easy to pick up a decent display, finding a decent keyboard is a nightmare. I’ll teach you how to do it at the end of this section for now I’ll just list laptops with totally awesome keyboards.

RAM
8GB is plenty for both Back and Front End-Web Development. There may be a few instances Back-End Developers may need 16GB but this is super rare.

CPU
Any CPU with +3GHz for clock speed. (I’m throwing out this number just to make sure you have a modern CPU – older models are slow even for web development). Core i3 or Core i5 with U labels prefered(more battery, less unnecessary power).

Ex: Core i5-8250 or Core i3-8130U. Core i7 are useless even for back-end developers using VMs and much worse if they have an H and HK or HQ label next to it.

Storage
256GB will be plenty even for the heaviest IDEs. Opt for an SSD though, this will save you a lot of time when opening/closing/looking for files, opening libraries and launching IDEs.
 
Portable
The most useful laptop is the one you can take with you anywhere and will not just  sit around at a table back home.

3lb is portable.
Anything above 3.5lb will feel like you are carrying a toddler with you.
 
 

GPU
There’s no need for a GPU unless you are a heavy and I mean heavy PhotoShop User. If so, any “dedicated GPU” released within the past 5 years will go.


Top 5 Best Laptops For Web Development

These 5 laptops listed here should cover the entire spectrum of “web developers” from a student running Visual Studio or DreamWeaver to a complete web designer and web developer running VMs and everything in between.

Just keep scrolling down and read the descriptions until you think you’ve found your pick.


1. Acer Aspire E15 E5-575

Best Cheap Laptop For Web Development & Design

  Core i3-8145U up to 3.9GHz

  6GB RAM DDR4

   Intel HD 620

  128GB PCIe NVMe SSD

  15” IPS full HD 1080p

  5.3lb

  10 hours

If you are just beginning your journey into Web Development, that is you are experimenting with bit of  both back and front end development, using Lynda.com then there’s no need to pay an arm and a leg. If I were you I’d just go with this model.

It’s currently the best deal you’ll get for a laptop under 400$. As I explained in the last section into more detail, Display is extremely crucial to improve your workflow. This laptop is the only model I am aware of that offers you a full HD resolution for ~350$. That’s not all, the new version has a freakin’ IPS display for less than 380$ ! That’s nutz !

Don’t forget the 15” size which is essential if you want to have at least two panes open to each other: an IDE on the left and the web broswer on the right (to test your code/read tutorials).

Like I said before, CPU , is not so crucial, since most modern CPUs (such as this 8th generation Intel Core i3) have insane clock speeds.

While I’ll admit I haven’t had the opportunity to test this computer myself I did inherit a very low end MacBook from 2008 which I went onto upgrading with an 8GB RAM and SSD and let me tell you that I never ran out of resources.

On the other hand, this machine has an 8th generation which is miles more powerful than the 4th generation CPU I had, it’s a dual core with +3GHz.

Note that this is an 8th generation processor and there’s a similar model with a 10th generation, the difference is enormous is terms of clock speed although both might even sufficient even for full stack developers. For 30 more bucks you’d get a 10th generation CPU but this is way too much just for Web Development and Design, if you have other applications in mind like video editing & light gaming it might be worth the investment.

Upgradeability:

The only issue that you might encounter in the future is the lack of RAM. Although 4GB is quite decent, there may be a few times when you go insane when multitasking but nothing a nice and quick upgrade can fix.

This model especially is very easy to upgrade, a simple removal of a screw, will expose the RAM slots for a quick upgrade. This new version doesn’t need you to upgrade the hard drive, it already comes with an ultra fast PCIe NVMe. Pair it up with an 8GB to make this thing fly under the heaviest loads of web development and design.

Recommended for pretty much any Web Developer on a budget

Buy Now


2. MacBook Air

Best Mac Laptop For Web Development and Design

  Intel Core i5 2.9GHz

  8GB RAM LPDDR3

   Intel HD

  256GB SSD

  13” 1440×900 TN

  ~3lb

  +13 hours

If you actually have the cash , you should seriously consider buying a MacBook Air. I mean, in my opinion, it is still the best laptop for web development especially if you are constantly on the go.

There’s a huge blog post you can refer to if you don’t believe me. The author being a full stack developer has zero complaints with it.

There’s one problem though, the author bought the old MacBook Air, which isn’t available anymore.  The New MacBook Air, although far more powerful and even thinner, has discarded the best keyboard ever designed in laptop history for a more thinner version with less travel. However on the plus, side the New MacBook Air, has a retina display instead of the HD+ resolution of the Air.

So your choice becomes:What is more important?

A high resolution display or having the best keyboard ever produced. The Old MacBook air’s display isn’t so bad though, it still meets the bare minimum requirements for Web Development which in fact has worked for me for several years, from the moment I started web development using the wikipedia engine (modify it through wiki-plugins/add ons) to the point where I started dealing with wordpress themes and launching web sites with SQL servers + Apache from the bottom up.

I assure you won’t notice the Old MacBook Air (linked in this review) to be any slower than the new MacBook Air unless you end up with a version havinly only 4GB RAM . Why? The New MacBook Air’s CPU is only a tad relatively faster than other 8th generation Core i5 processors.

By the way, you can find hundreds of nearly new (refurbished) MacBook Air’s on amazon (the old model) on this link. I’ve bought one for me and another one for my sis  several months ago still running like a champ. Note that the old macbook airs are silver colored as opposed to the goldish reddish new ones.

Let me tell you one little tip:

Never ever buy a refurbishied laptop (especially from HP or Dell). However, if we are talking about Apple, that’s a whole different story.

You’ll find their refurbished products have zero defects (save for a few instances where you’ll see a scratch). In the Macbook world, refurbished means new but cheaper.

Note that most web developers today are sticking with MacBook Pros and MacBook Airs. People who do the change (usually they make the jump from “a window straight to the Air” xD) find the whole web development experience so much better since the world of web development is moving towards command line utilities and interfaces : GIT, Composer, NPM, Artisan, Ember,etc.

And if they ever need any extra power they simply resort to a VPS/VM to run their server/backend stuff.

As for the battery life….well I recently took a 15-hour trip to Japan and I easily managed to use the MacBook for half the flight.

I fell asleep before my laptop, so that’s a good thing…

Recommended for both Back and Front End, Web Development with an inclination towards the latter

Buy Now


3. ASUS ZenBook

Budget PC Laptop For Web Development and Design

  Core i5-8265U 3.9GHz

  8GB RAM DDR3

   Intel HD 620

  512GB PCIe NVMe SSD

  13” full HD IPS

  2.5lb

  11 hours

I know there’s a ton of you out there not willing to do the switch to the MacBook Line perhaps because you develop with .NET or use Visual Studio (which is far better on a Windows Laptop).

Well the recent ZenBook is almost a carbon copy of the Old MacBook Air, has about the same thinness and even less weight but a more powerful processor and a full HD display.

The only real difference is the keyboard quality, which you can’t blame it on the ZenBook, since there only a few handful devices out there can match the legendary Old MacBook Air’s keyboard.

Also the battery is about 9-10 hours as opposed to The Air’s 13-15 hours, this is expected, since the ZenBook has a more powerful CPU and a full HD which sucks more energy than the Core i5 and HD resolution of the old MacBook Air.

Performance?

Well since this model has an 8th generation Core i5 CPU + 8gb RAM , it should be able to handle far more layers in PhotoShop and VMs with more ease than the Air. Here, the Core i5 has 4 cores as opposed to the Air’s (New And Old) dual core CPU.

Recommended for full Stack Developers

 

Buy Now


4. MacBook Pro

Best Laptop For Web Application Development

  Intel Core i7 3.3GHz

  16GB RAM DDR4

  Radeon Pro 560 4GB vRAM

  512GB PCIe SSD

  13” Retina 

  3.1lb

  10 hours

If you want to stay in LaptopVille, more specifically, in MacStreet and your development environment really needs more horsepower, the obvious next choice is the MacBook Pro.

The increase in power (mostly the processor) will definitely help with photoshop especially if you pack way too many  layers into a PSD.

One of the best aspects of the new MacBook Pros even without the touchbar is that it’s very compact and light despite the power. This gives you the ability to move around a workhorse during the day say take it to a coffee shop to chat with other developers, designers, business folks or just the barista. This experience would totally suck with a huge brick to carry on.

Another huge plus of the MacBook is the fact that they are the most versatile platform, you can run OS X (which runs on Unix), Windows and even Linux if you really wanted to. You can also develop for iOS AND Android.

If you are not sure what you will be working on, this is probably the most flexibility option you will find. I don’t personally use a Macbook Pro now but I know many web developers who do. Definitely the top choice for any Full Stack WebDeveloper.

Recommended for full Stack Developers

Buy Now

 


5. Lenovo ThinkPad Edge E580

Best Lenovo Laptop For Web Development

  Core i7 8564U 4.6 GHz

 8-32GB DDR4 RAM 

   Intel HD 620

  256GB SSD to 1TB SSD (PCIe NVMe)

  15” Full HD UPS

  4.68lb

  10 hours

There’s no way to sugarcoat it Visual Studio for a MacBook totally sucks which probably would limit your workflow tremendously. So If you are tied to a Windows Environment with .NET/C# development or just simply don’t like the price tags of the Mac, the most closest thing to the quality of both the keyboards & portability of the MacBook are the ThinkPads.

I personally have an Acer Windows laptop only because I didn’t have enough money to look into other options. When I wanna work in PHP, Java or j I switch to my MacBook otherwiseI jump on my Acer especially when I’m working back home because mine has a 17” display.

If you want a Lenovo Laptop with enough horse power to do both back and front end development, don’t even look at an i3 processor. Stay in the core i5 family (core i7 is a bit too much but there are no other models worth mentioning at this point with Core i5s).

Another great option is to have a full blown Linux environment on a windows laptop. That way you can have control of Adobe Creative Suite with Windows plus being able to work on ASP/.NET stuff while  running Apache in Ubuntu’s bash.

Recommended for full Stack Developers


6. New MacBook

  Intel Core M-5Y31 1.1GHz up to 2.4GHz

  8GB RAM DDR4

  Intel HD 5300

  256GB SSD

  12” Retina IPS 

  2lb

  10 hours

You may think Im an Apple fan boy by listing three apple laptops but matter of fact is I get zero comissions when people buy MacBooks  from Apple’s website. Still I have to be brutally honest in my reviews, otherwise I’d get zero comissions from any other product bought from this website.

If you don’t care much about screen size and want the most portable machine ever, I’d suggest to take a look either the 11 inch MacBook Air or the New MacBook, the latter has been discontinued but you can still find dozens of refurbished ones on Amazon.

The smaller MacBooks (11” Air and New 12” MacBook) are a good choice if you are constantly on the move and simply rely on a text editor for coding when traveling.

Yeah, you don’t need a full IDE like Xcode to run an emulator or anything like.Even if you did  the New MacBook can do that, it has just about the same power as the Air.

Their screen sizes are the only real let down. It may only be 1 inch smaller in size (or 2 inches smaller for the 11 inch MacBook Air) but it still makes a huge difference. This is possibly the only most deciding factor. So if you work a lot with graphics and enjoy slightly more space (using PhotoShop and other image editors for user interface design) then think about this con really hard.

For all other purposes, there are a few tweaks for you to make your MacBook as productive as a 17 inch laptop:

How?

By using “Spaces” which comes by default with OS X. It allows you to change your desktop environment and switch between different instances of the screen called “desktops” by using a command just as you would between apps on an iPhone. For example:

Desktop 1: browser
Desktop 2: Atom (split the panes horizontally instead of vertically)
Desktop 3: 4 terminal windows
Desktop 4: SourceTree
Desktop 5: Second browser
Desktop 6: Affinity Designer
Desktop 7: Mail and Slack
Desktop 8: Other apps such as Byword

If you are always using the same apps.You can set up keyboard shortcuts mapped to access them quickly.

And if you are really in need of more space, the excellent Duet Display app can turn an iPad into an external second screen, in case you may want to have two desktops open at the same time next to each other.

I’ve used it only once, just to see how it works (quite good!) and it definitely like meets the needs for a second screen.

Why go through all of this with MacBooks?

The Unix command line… is also far better than the one used on windows, I’ve got a Windows machine at home and a mac at work and doing things like installing Node, Ruby and so forth is far easier on my mac than my windows machine.

I’ll pay you if you can find a big name developer at a conference who isn’t using a mac. (Provided they don’t work for MS).

There is also a lot of  cool development software that isn’t available on Windows, like codeKit.

This article does better job of explaining the advantages http://code.tutsplus.com/articles/one-developers-switch-from-pc-to-mac–net-11831 (I can’t agree with the great hardware especially for gaming/3D modeling but the stuff about the shell is what I’m talking about).

Also if you’ve ever seen a video tutorial or read a blog post walking you through something, you’ll notice the vast majority of the time the presenters themselves are mac users!

Recommended for full front-end web development though it can be used for back-end development as well

Buy Now

Last Words:

Well that’s it folks if you are constantly on the go, I’d recommend you really consider portable devices (even the Surface Pro might work for web development). Otherwise, it’ll feel like your carrying a toddle everywhere you go. If you are mostly staying at one place, you can also consider the Acer Aspire E5 with a dGPU (the one I use at home right now).

At the end of the day, laptops are laptops regardless of their OS. They all have keyboards, they all have means of allowing you to develop. Although OSX is better imo, you should pick the OS you enjoy and know best.


How To Buy a Laptop for Web Development

Like I said without knowing more about the particular scenario, it will be very hard to land the right laptop for web development. Besides throwing money at the problem, there a few things you should try though:

Upgrading an Old Machine

Before you throw down $1000 on a new laptop, ask yourself  if perhaps any of the current problems you are facing can be solved economically. That is , by upgrading your current machine.

Web Development isn’t hardware demanding at all. Perhaps a nice SSD drive or a new RAM stick might do the trick, provided of course, you have a decent display and keyboard even the last two can be fixed (by buying an external monitor + external keyboard).

Before you do any upgrades find out what’s eating your system resources:

1. Do the good ol’ CTRL+ALT+DEL. Is it just that your application is resource-intensive, or is it competing with three dozen open browser tabs and a heavy IDE? 

2, Give my How to Upgrade your Laptop RAM or Storage device a nice read.

Downgrading OS/Quitting an IDE

Also note that things can be slowed down by upgrading to a new OS version.

I started using a mid 2010MPB stock for the past 4 years and it started to get slow as I kept updating the OS (Windows 10 currently takes 4GB ). What really got my software sluggish (mostly PS CS6) and which made buy another whole MacBook Pro was the upgrade to Mavericks.

Note that Dreamweaver and PS at the same time also take around 4GB. If you quite using Dreamweaver (I did and there are several other options) you might free up your system from a huge amount of resources. It will even entirely replace the need to upgrade your system.

Uninstalling Software

Another thing to to keep in mind is what you have installed on your laptop (besides web dev software). My laptops have been pretty solid over the years except when I start installing games on them. Might just be a coincidence but I’m just saying that I noticed a pattern. As long as I keep games off my laptop, I very rarely seem to have problems with it.

So be concious of what you install on your laptop. If you just want to try trial software out, do it in a virtual machine and only install it on your computer’s operating system when you feel confident with it.

That’s what trial software is for… to try it anyways.


Web Developers

With that out of the way, before we discuss the hardware for web development, we have to talk about web developers, especially what software they use and the type of workflow.

Why am I even bothering with this? Well I’m aware that there’s a huge percentage of people reading this that are just starting to get into the field.

It really comes down to what kind of web development do you plan on doing? Front-end? Back-end? Full Stack? What tools are you planning on using?

Front End Web Developer

If you are a front-end developer, you’ll mostly be concerned with how the site looks and feels. This is just basic coding with CSS, HTML, Javascript and perhaps JQuery (although this is going out of style since modern browsers can now do the same work but more quickly). These require nothing more than a basic modern computer.

On the other hand , if you are using PhotoShop or hi-res images & videos, then you may want to invest your budget on Display, RAM & Storage. 

There’s another reason to invest on storage than just having a display that display high resolution images to their true color: space. That is, you can have a window to code and another window to see how update the results or follow tutorials.

If you are using heavy duty IDEs such as Dreamweaver and VS Studio, you should also invest on RAM & optionally storage. 

Back End Development

Although Back End Developers know how to use HTML,CSS and so on. They need to code with Java, PHP, Ruby on Rails, Python and .Net. 

The main issue with these are not the languages themselves but the IDE which takes a lot of RAM and benefits from a fast Storage Drive. They also might be running databases locally and even using VMs which adds up to more RAM & Storage.

Full Path Developer

This just means someone works on both “Front End” WD (Html, CSS, javascript etc) and on backend code (databases, .net, Php, C#, Ruby etc).

As for me, I usually have several apps open at all times: Atom for coding, Safari and Chrome for web browsing and testing, 4–5 terminal windows (issuing SQL statements, testing, and Git tasks, and Redis, and…), 1–2 Finder windows, Slack, Mail, Affinity Designer and SourceTree.

Student

If you are a student starting web development, you’ll probably go through a combination of both of these branches. I started with C# classes which used Visual Studio and a SQL Server.
The most useful feature I found was also the display, that is, I could have an IDE on side and a web browser (to follow tutorials). You can always switch between spaces or use ALT+TAB but this can be rather annoying.
 

Software

Keep in mind that TextMade, CodeKit, Atom and SublimeText are just text editors tailored for web development do not require anything special, in fact, you can run these on your iPhone. I would suggest these over DreamWeaver if your system is too slow to respond.

There are only two type of software that are worth taking into consideration when buying a computer for web development: PhotoShop or Virtual Box.

Illustrator/Photoshop

If you do minor graphic editing, mainly converting vector AI files to SVG and tweaking colors, you don’t need a GPU for PhotoShop nor huge amounts of RAM or a high end CPU. The latter is actually rarely a bottleneck even for hardcore photoshop users.

VirtualBox

On the other hand, if often work with an Ubuntu Server VM using Vagrant and VirtualBox to simulate your production environment before release you need to make sure you have at least 8GB RAM.

Hardware Specs for Web Development

CPU

Generation

When people think of computer speed, they always think of the CPU—2.9 GHz Intel Core i7, etc. But with modern CPUs, especially the 8th generation, they will never be the bottleneck (even if you are running VMs) plus web design is hardly CPU intensive.

However if you want to throw all the multitasking you’ve read above, you ought get a modern CPU. Core i3, Core i5 or Core i7 doesn’t really matter as long as its from the 7th and 8th generation (the 6th might be pushing but it’s still alright) you’ll be fine.

Cores

A huge exception might be developers who rely on virtual machines. Even then there’s not much need to worry about CPU since modern CPUs have at least two cores and +3GHz, both are enough to launch a virtual machine or two.

Recommneded CPUs: Core i3 -7100U, 83100U. Core i5-8250U, Core i5-8625U, etc. Although there are more powerful CPUs today, they’re overkill for web development.

RAM

On the other hand, RAM is probably the most important component for any Web Developer. The amount of multitasking can be insane. Just imagine having a textEditor a web browser a virtual machine a SQL server and a few web browsers for tutorials and a video and even terminal open.

Let’s add to the mix that you use a heavy IDE like DreamWeaver or Visual Studio and 4GB will be gone pretty fast. Let’s not forget PhotoShop and a thousand layers jammed into an image.

8GB RAM: You need at least 8 Gigs, this is even enough to run a local web server or a virtual machine.
16GB RAM: I never saw the need to have 16GB. However if you plan on becoming a proffessional full stack developer, it may come in handy. Since most laptops are upgradeable (except the MacBooks and UltraBooks) you can choose to update yours. 

Storage

For web design, the speed of the computer is much more about the hard disk rather than the CPU, especially now since CPUs are just way too fast.

Storage Speed

You’ll be constantly opening and closing a lot of files, almost all the time, and this means your laptop has to read/write data to/from files. Having a storage drive that do this a few seconds faster is a huge advantage. Remember that a few seconds added up several times throughout the day can add up to hours and less time working on a project.

SSD (Solid State Drive)

This is where SSDs come in handy they can read/write data up to 17x faster than traditional HDDs. They can also launch heavy IDEs. My two-year-old SSD-based ultra-thin laptop can boot up Windows 7 cold in nine seconds, while my MacBook Air boots in about 9 seconds!

Disk Memory

For the few instances where you go crazy with amount of the apps you are launching, virtualBox and PhotoShop at the same time, RAM will just not be sufficient. Your computer will then go onto using your storage device as “extra RAM”. God forbid if you still have a 5400 RPM because it will be painfully slow. On the other hand, if you have an SSD, the speed will not be much detrimental to your workflow.

Space

The problem is of course that Solid State Drives usually don’t have the “1TB HDD” that old fashioned and slow HDD bricks have. As a web developer though you won’t need that much space 256GB will be sufficient and is what most SSDs offer you today.

Durability

If want your storage drive to be reliable, and you can’t even trust your back up storage, I’d recommend going for Samsung 850 Evo SSD drives. If not, whatever storage drive you have, be it an HDD or SSD, replace it every 2-3 years.

What about my backups?

You can use CarbonCopyCloner to clone my entire disk on an external drive every other day. There are similar software for windows machines you can use.

Display

Probably the most important component for a web developer besides an SSD (since RAM and CPU are usually decent on most modern laptops). Why?

This is the part of the machine you physically interact with more than any other part. You’re staring at it the entire time you are using it.

Resolution

Virtually all of you will find it useful to have two panes open to each other: IDE on the left and Web Browser on the right. You might even want some space to copy/paste code into EverNote to try out on your IDE.

It’s not too much about size to do all of this but resolution. 

1600×900: should be the bare minimum anything less you will always feel you don’t have enough space even if you have another display. I made that mistake once, luckily, it was possible to upgrade my display by replacing the LCD (I had a ThinkPad back then). However this is not always possible , in fact, almost never.

1900×800: This is the perfect resolution, you should seriously invest your budget (even if you have to sacrifice any other component) on it. You can always reduce the resolution but you can’t raise it!

Size

Personally, my ideal screen is 15″ but I know a lot of people who like the portability of laptops with a 14″ screen or ven 13” screen. These are good sizes too. Anything less paired with small font sizes can strain your eyes.

Note that the small screen shouldn’t affect the size of the font at all, you can always change them. It will just control how big your windows are.

I normally use the smallest text scaling option and side by side doesn’t really cut it. I split my panes top and bottom. When really in need of a 2nd monitor and not using my desktop, I plug an iPad to serve as a 2nd monitor. This is something I was also doing on a 13″ MBP. I haven’t tried a 15″ laptop as it is too bulky to carry everywher

IPS

A wide horizontal and vertical viewing angle is also a god send. Besides being a huge plus to your work flow, viewing angles  may be important is if you are doing any pair programming or if you are showing off your work to potential clients/bosses.

This is only possible with IPS displays. Another huge plus of IPS display is their color accuracy

Glossy vs Matte

While glossy screens are fun to watch, matte anti-glare screens are much easier on the eyes especially over many hours. 

ThunderCat Ports and Dual Monitors

Modern laptops now may come with “ThunderBolt” ports or Type-C USB ports. You can throw in two external monitors if your has one, this is because you can also use an HDMI to attach an external monitor.

Other factors

Gamut

Some might say that colour gamut isn’t that important however if you are a front-end developer, it may be.

The day you have two screens connected and notice that blues and reds look purple and orange on your other screen, you’ll be wishing you had a laptop with a better screen gamut to be sure which colour you are using. 

Also when you know you are seeing the right colours, you can feel safe telling others that it’s their screen that is displaying the colours wrong.

TouchScreen

Finally, the issue of touch screens. Touch interfaces may not be something to keep in mind now  but they are definitely on the books for the future.

Tablets, smartphones — if you want to make sure your websites work with these, it is probably wise to get a laptop with touch screen if you can afford it already.

GPU

Dedicated graphics card are not necessary for pretty much any web developer, that is, unless you plan on developing video games.

Intel video built into the CPU chips “Intel HD” graphics will do just fine.

Keyboard

Typing on poor quality keyboard will slow down your work and bring your motivation down. If you are going to be typing code for 8-15 hours day you want your fingers to be happy!

Landing the best keyboards isn’t easy but here are a few general guidelines (and recommended models):

MacBooks: They have the best keyboards on the market, enough said.

ThinkPads: There’s nothing like working on the legendary keyboards found on these.

  • When you go the store type a page of text after doing this on a few laptops, you’ll quickly realize they’re not the same and you will unconciously pick the one that feels best , write down the model then and order one from the same manufacturer (with a more beefy configuration depending on your needs).

BackLit KeyBoard

Don’t forget lighting for the keyboard.

Programmers often work until it’s dark outside. A well lit keyboard can be less disturbing to those who are sleeping than having a bright light on.

Try typing on a perfectly flat keyboard with the lights off. It’s a lot harder than you might think. Get a good overhead or back lighting for your keyboard if you do encounter these situations.

Trackpad

I would seriously recommend the switch over to a mouse. I’ve improved my workflow multifold. On the other hand, if you are just used to TrackPads, when you go to the store be sure to thoroughly test them out I mean you are going to be using this thing the entire day.

So don’t just look at it, try it out. Is it responsive? Can you scroll with it? Is it multi-touch? Does it have mouse physical buttons that are not just part of the trackpad? Try dragging and dropping something. Try right clicking.

Wifi

AC Wireless Adapter

The internet is like a car: the faster the better. Being able to upload and download files in a flash just feels good. When you are searching for specific tips on how to do something on Google, speed is essential!

Remember that you’ll be writing code and following instructions from documentations sometimes resorting to youtube tutotrials or reusing someone’s code too.

If it is available in your part of the world, get it. Most laptops today have it anyways just make sure your does as well. Even my 55 year old neightbor has it.