10 Ways to Save Time While Building a Website: Improved
While you should never rush to complete a website, money is time. The more web work you can do, the greater your income will be and/or you’ll have extra free time to do as you wish with. I’ve compiled a list of 10 tools and resources that can help you reduce the amount of time you spend developing considerably.
1) Firebug – Firebug is a Firefox add-on that contains a variety of functions. It saves me a lot of time by reminding me what I named a particular CSS class or id using the inspect element function. Firebug also allows you to test changes to the CSS and HTML in browser. The changes aren’t permanent, but it helps me work through a number of scenarios quickly.
Time Saved: Varies depending on use.
2) Templating engines – By starting with a standard base that includes preconfigured headers and footer includes, I save a lot of time connecting favicons, robots.txt, meta data and links to my CSS files. This is a huge time saver. A good templating engine called REDUX is developed by Phil Thompson.
Time Saved: 30 minutes per website.
3) MeasureIt – MeasureIt is a Firefox add-on for measuring pixels on your screen. When you need to create an image to fit in a certain spot, make sure that padding or margins are correct or a web page is the correct size, it’s a simple as clicking and dragging.
Time Saved: Varies depending on use.
4) Colorzilla – There are a number of tools you can use to create a color scheme or pick colors for your website, but Colorzilla allows you to quickly click and get the HEX or RGB value for any color on your page. I use this a great deal when I’m using a custom color and I need to grab the HEX again quickly without sorting through my code.
Time Saved: 5 minutes per use.
5) Reusing your CSS – I start every website off with a base CSS document that includes some basic content that is the same for every site. This includes margins, body tags, IE6/7 hacks etc. I have a couple, some with preconfigured CSS menus but not having to rewrite some CSS saves me time every website.
Time Saved: 15 minutes per website.
6) PHP Include – I’ve still seen some websites that still use a different static page for each and every page of the website. At a minimum, use PHP includes for your header and footer so that any changes to design will automatically be sitewide, not individual. Depending on the size of your site, the time you can save can be huge.
Time Saved: Hours over not using PHP includes.
7) Son of Suckerfish Menus – Suckerfish was originally published by A List Apart as a simple menu solution using only CSS. Son of Suckerfish has improved on the design by supporting multiple level menus. By using CSS only, load time is considerably slower as well as easily changing the design. You’d be suprised with the designs Son of Suckerfish is capable of.
Time Saved: 20 minutes per menu.
Making Use of Open Source – When working with particularly complicated forms and functions, it’s often easier to use or at least sample from a predeveloped form. I would never support ripping off someone else’s work, but many people make it available for free use or at least give you a place to begin. One example I’ve used to help me before is Dagon Design’s Secure PHP Form. Sampling from this form helped me to create a secure contact form support image attachments.
Time Saved: 2+ hours over coding from scratch.
9) Consider SEO from the Start – Working SEO (Search Engine Optimization) back into your completed website is often more difficult then designing with it in mind. Take the time to follow some basic SEO guidelines from the very beginning. A great list of top factors can be found from SEOmoz.
Time Saved: Varies depending on use.
10) Litmus for Browser Testing – I formerly recommend Browser Shots to get a comprehensive view of what you’re website will look like in all browsers. It’s still a good solution but Litmus is a better choice for me. It requires a free sign-up but has some added features such as a complete report, very helpful if you need to report to someone or to send along to your client to show them you cared to check.
Time Saved: 1-2 hours if you test all browsers.
There’s no replacement for having good skills and these solutions will not make you a rockstar designer but they WILL save you time and make you’re life as a designer a lot easier.
February 28th, 2009 at 9:34 pm
Thanks for the 10 Ways to Save Time While Building a Website: Improved after your previous sucessful article on saving time while building a website.. These tools are actually requred to build a sucessfull website in a short span of time.. Thanks Again..
March 1st, 2009 at 7:37 am
This article is useful for me,thanks a lot!
March 1st, 2009 at 7:39 am
This article is useful for me,thanks.
March 1st, 2009 at 7:55 pm
Great suggestions. Definatly bookmarking and digging this list.
March 2nd, 2009 at 7:30 pm
This was very helpful, thank you.
:]
July 28th, 2009 at 2:03 pm
Great tips on design – Further to your comments about SEO – I’d just add that before you even get the site built – stick wordpress up and write a post and get some content spidered ASAP – this will get the spider over to your page and will start giving your domain age (if it is a new one).
I’d also suggest that for a small-ish site – these days there’s pretty much no reason why you cant build it using WordPress!
November 1st, 2010 at 9:23 pm
Hi, just stopped by doing some research for my Cricut site. Can’t believe the amount of information out there. Not quite what i was looking for, but great site. Have a great day.