This is the first in a series of posts on efficient web development. Subscribe to our blog or check back for future updates and posts.
At WrightIMC, we’re always looking for ways to improve our productivity. Whether this means optimizing code, or debugging errors more rapidly—efficiency is something we can all work on improving. Luckily, in the world of development, there are a number of tools and communities that you can leverage to lower the turnover time on your projects. Here are 3 web development tips and tools to help make you more efficient.
Tilt
A New Way to Visualize Markup
Tilt is a plugin for Firefox that lets you view the markup of websites on a 3D plane. It also has built-in functionality for viewing and editing the properties of different elements on the fly. There are many uses for such a visualization tool, such as debugging errors caused by nested markup or to see how bloated a particular page is. I’ve used Tilt to find offending elements that make me crazy, such as objects with improper width that cause a container to be wider than it should be. It’s also useful for jumping into projects quicker by acquainting yourself with the visual structure of elements on a page. This solution is much more graceful than the barbaric method of having to add an outline or border style in order to diagnose an issue.
JSLint
A Stricter Way to Evaluate Your Programs
Have you ever found yourself writing a particularly large piece of Javascript, only to run into an error that causes you to bang your head against the wall in frustration? Welcome to the club. When I run into situations like this, I turn to JSLint first. JSLint is a code quality tool than analyzes your programs and reports errors that you have made and approximately where to find them. Javascript users know that the language has its good parts, but also its horrible and ugly parts. JSLint also helps you differentiate between these good and bad parts by evaluating code based on a stricter subset of Javascript. It will reject programs that browsers would not typically reject, forcing its users to do away with sloppy code and embrace code of a higher quality.
Bases & Frameworks
Getting a Headstart
As a web developer, you get used to reusing pieces of code across several different projects. If you’re taking the time to write that code out from scratch for each project, you’re being inefficient. This is where a base or framework comes in. There are a number of great starting points out there, such as the 960 Grid System and the HTML5 Boilerplate, but these bases all share a common flaw—excess code. Sure you can pick and choose which parts of a framework to use, but I prefer to build my own. I’ve got a base set of CSS classes including a master reset that I use to rapidly flesh out my layouts, in addition to a basic HTML markup structure and a handful of JS functions. When I start a project, I can jump right into stylizing and creating functionality—skipping the preliminary structuring. I suggest you do the same.
Have questions about these web development tips, tools or other development resources? Leave it in the comments section or ask me on Twitter at @JosephNDenton.
Need SEO or Web Develpment Services?
Fill out the form below, call us at 469-277-8150, or send us an email: info@wrightimc.com, for more information about SEO services with WrightIMC.
