Skip to main content

10 Ways to Be a More Productive Web Developer


Advertise here with BSA

10 Ways to Be a More Productive Web Developer

We could all be more productive. There are many things we can do — some big, some small — that will enhance the way we work and improve the outcomes of our activities.

Although I can’t promise that I’ll be able to help you cure all your productivity ailments, I do hope that I can provide you with a few useful, solid tips on streamlining your web development workflow and making every part of the development cycle move quickly and smoothly.

Follow each one of these tips and I can almost guarantee you that you’ll save time, be able to create more and/or better work and be a more productive developer, ready to tackle that next task in half the time it would’ve taken you before.

1. Use a Web Development Framework

I used to refuse frameworks for web development because they can be bloated with excess stuff. But ever since I’ve adopted one, I’ve loved it.

Good web development frameworks:

  • Have features that provide solutions to common web development problems (e.g. standard web page layouts, functions for dealing with web forms, and browser compatibility fixes).
  • Are tested by many other web developers for bugs, security and performance.
  • Make code reuse easier because of a consistent API.
  • Have community-developed extensions and tools that further enhance development (for example, jQuery has plenty of plugins that deal with things like UI, images and web typography).
  • Often force you to follow coding best practices and great programming design patterns without even thinking about it.
  • Have a development community of supporters and users you can reach out to for help and collaboration.
  • Typically are easier for beginners to start using.

All these benefits save you time and improve the quality of your deliverables.

There are many types of web development frameworks you can adopt.

An often-cited downside to using web development frameworks is that they will invariably come with extra things that you won’t use. This extra stuff can slow down website speed and performance due to code bloat, so you have to make sure that the benefits of using them outweigh the potential performance hit.

More often than not — and this applies especially to those just starting out — the code of frameworks are written using the best coding practices and design patterns and are reviewed by many brilliant and passionate developers, which often translates to better, faster and more secure code compared to what an average web developer can produce by himself.

2. Create a Library of Code Snippets

There’s no reason to reinvent the wheel. Recycle your code! Create a collection of your favorite and often-used snippets and make sure that it’s easily searchable and well organized.

At the simplest level, you can have a folder/directory of source code and text files in your hard drive. However, this may not be the most efficient technique.

A step up to that is using a source code editor or IDE that allows you to save snippets. For example, Notepad++ has a plugin called SnippetPlus and Dreamweaver has the built-in Snippets Panel that even has prepackaged code snippets ready to use.

Adobe Dreamweaver’s Snippets Panel.

Another solution is to use a dedicated snippet tool like Snippet or Snipplr.

Here’s an idea: You can even use a private code repository/version control system like Git for finer control over your source code. This additionally allows you to revert to older versions of your snippets and see how they’ve evolved over your career.

My collection of code snippets spans several different languages and is employed all the time for repetitive tasks like inserting new CSS3 rules with browser prefixes. It’s also handy for oft-used functions that are easily forgotten, like how to display Custom Fields in a WordPress loop.

When choosing a tool or method for collecting snippets, consider making sure that it has these time-saving features:

  • Search
  • Hierarchical organization so you can easily categorize snippets
  • Syntax highlighting for enhanced readability
  • In a perfect world, it’s integrated (or can be integrated) with your source code editor to reduce application-switching

Remember to regularly review, improve and update your existing snippets.

3. Use the Right Tools

This should be a no-brainer: Make sure you’re equipped with good tools and that you know how to use them effectively.

If you’re a web designer, you probably need Photoshop and Illustrator. If you’re a developer, you need a good set of web development apps to help you get the job done.

Of course, toolsets differ between professions and between people. Not everyone will need the Coda web development suite to build their websites — some just need a terminal.

What matters is that your tools should help you get the job done as efficiently as possible.

4. Collect and Organize Free Design Resources

There are many sites on the Web that give away free design resources. Add these sites to your RSS reader, and every time they post a freebie you can potentially use, grab it.

I’ve been doing this for months and now have a massive library of icons, PSD templates, vector illustrations, Creative Commons-licensed images and artwork, buttons, GUI elements, Photoshop brushes, @font-face kits, and all kinds of miscellaneous design elements.

Having such a huge library makes it incredibly easy to put together mockups in Photoshop, or get a quick sketch ready to show a client.

My icon and button library has been integral to putting finishing touches on websites I’ve nearly finished. This collection of little details is super handy — instantly sprucing up a design.

Here are some links to check out:

5. Work in Sprints

Working in sprints can greatly improve productivity. For example, I wrote this article in short sprints, writing two or three bullet points at a time, taking a very long break from it to work on something else, and then returning later in the day.

Working in 10- to 20-minute blocks allows your brain time to generate new ideas and keeps it from burning out.

Don’t work for hours at a time — your pace will slowly decrease and your work will decline in quality over time.

Working on a project in short bursts means you’re always coming back fresh.

6. Take Breaks

The most important part of sprint-based working is the break. It’s crucial to let your mind rest. Use these breaks to separate yourself from your workspace — go outside and stretch, or if you’re lucky enough to be a freelancer working from home, go to the kitchen and fix a little snack.

Again, don’t bother with tracking your time if you don’t have to. Your sprints don’t have to be exactly 15 minutes, and your breaks don’t have to be exactly 5 minutes. Work until you’re at a good stopping point, then take a comfortably timed break. Micromanaging time, in my experience, has only led to further procrastination.

However, some developers may be better served with more structure. If this is you, check out the Pomodoro Technique.

7. Invest Time in Learning

In the short term, constantly learning, keeping up with industry news and staying ahead of the curve is time-consuming.

However, the idea is that by investing your time in self-improvement, you can save time in the long run, increase your output and improve the quality of your work.

8. Don’t Over-Plan

There was a time in my life when I used to schedule out my day. I planned out everything in little 30- or 60-minute increments, stacking them up neatly in iCal.

I thought I was being productive, but I was only really setting myself up for failure.

You shouldn’t make your day any more rigid than it has to be — your mind needs to have some flexibility, some time to breathe and fully think.

Make sure to keep your schedule open to changes. I found that by over-planning my day, I only procrastinated more, and despaired watching those neat little chunks of productivity pass by.

9. Don’t Just Jump In Head First

This is the opposite extreme of over-planning. Although you shouldn’t over-plan, you can’t under-plan either.

Jumping in without knowing what you’re supposed to do can lead to disastrous website projects.

Whenever you begin work on a project, make sure you know what’s expected of you. In a web design project, this can be anything from knowing what the site is supposed to do, having the content of the landing page, having a set of colors from your client to work with, etc.

Before I start work on a client’s site, I always have the following:

  • Color scheme
  • Goal of the website
  • Any content they can provide
  • Any design ideas they already have

Knowing certain things about your project can lead you in the right direction without requiring you to take shots in the dark about what your customer wants.

10. Don’t Make Things Complicated

This is probably the most important one of them all: Don’t overcomplicate your job. Don’t do more than you have to, and don’t set yourself up for too much work in a given time period.

I’m not advocating delivering to your customer the minimum deliverable every time, but you certainly don’t need to deliver the maximum.

There aren’t any clear guidelines here, so you’ll have to judge it on a case-by-case basis. Give the client what they need. No more, no less.

Also, don’t overcomplicated your productivity strategy. Keep things simple. I tried using a "Getting Things Done" application to organize my life for a while, and it didn’t work.

I moved on to using sticky notes and finally TeuxDeux, a loveably minimal to-do list.

Wrapping Up

I don’t advise you to follow exactly in my footsteps when figuring out how to be most productive; everyone is different and requires their own processes for getting things done.

But keep the above tips in mind, and hopefully your workflow will be a little more streamlined than it was before.

If you have any productivity tips, share them in the comments below!

Related Content
About the Author

Delwin Campbell is a web developer (among other things) at No Enemies, based in Austin, Texas. He is a crazy person with too many hobbies; right now he’s learning Swedish! Check out his personal site.

10 Ways to Be a More Productive Web Developer
Jacob Gube
Thu, 22 Sep 2011 10:00:43 GMT


Popular posts from this blog

Apple will disconnect ‘obsolete’ first-gen Apple TV from iTunes in May

Apple has announced today it will drop iTunes support for some older devices from May 25. This includes the first generation Apple TV, and also any PC running Windows XP or Vista. The company is introducing new security changes which will prevent those devices from using the latest version of iTunes.
Apple says that the original Apple TV is an "obsolete Apple product" and will not be updated to support security changes. Only those with the second generation of Apple TV or later will be able to access the iTunes store.
Windows XP or Vista users won't be able to use the latest version of iTunes, but older Windows computers can still use previous versions without support from Apple. Those who do so, however, won't be able to make new purchases or re-download previous purchases on that computer. If you're on on XP or Vista, you'll need to upgrade to Windows 7 or later to continue using iTunes normally.
The writing was already on the wall for these devices: Wi…

Windows 10: Microsoft retires HomeGroup

Microsoft plans to remove the HomeGroup functionality from its Windows 10 operating system. The company made the first step towards that goal in the most recent Insider Preview version of Windows 10 as it disabled it in that build.
In "a note about HomeGroup" in the release announcement of the Windows 10 Insider Build, Microsoft confirms that HomeGroup will be retired.
The company introduced HomeGroup in Windows 7 as a new option for home users to access printers, files, and media in home networks. The core idea was to assign all devices to a single HomeGroup to share access to files and printers between all devices.
It is unclear how popular the feature was and is. It is clear however that it was never the only option that Windows users had in this regard, and it was not the best either for certain use cases. You could not add Mac OS X or Linux devices to a HomeGroup for instance.
The end of HomeGroup
Easily connecting to and sharing the important pieces of your digi…

Microsoft Reportedly Replacing With Office 365

Microsoft might be thinking about replacing the technology and user interface of with Office 365 if a new report is to be believed. Apparently the company will be migrating all users to Office 365 at some point later this year. Office 365 brings other services as well which include Outlook Web Access. The question that surely must be on everyone’s mind is that why is Microsoft doing this? According to The Verge the reason behind this migration is to make sure that Microsoft Outlook, Exchange and Office 365 platforms are perfectly aligned. In favor of keeping things consistent Microsoft is going to go ahead and add the consumer to the mix as well. There has been speculation previously about impending major user interface changes for, Microsoft’s general manager of Office Apps Rob Lefferts suspected that much. It’s worth nothing that Microsoft hasn’t updated its consumer email service for quite a few months and it even showed the door to G…