Shortcuts, Tools, Web Design

10 Ways to Save Time While Building a Website

81 Comments 04 August 2008


As a freelance web developer, time is money. I use many different tricks to increase my productivity and these are my top selections for saving time. Please make you own suggestions for other time savers in the comments.

Drop Down Menus :: All Web Menus (http://www.likno.com/allwebmenusinfo.html )
Whenever I need to add a complex drop-down menu to a site, I turn to All Web Menus. This program styles a complex multi level menu in less time then it takes to type the text. All websites need menus and for detailed menus, you should try All Web Menus.

Time saved: 1 Hour per menu.

Image Capture :: Gadwin Printscreen (http://www.gadwin.com/printscreen/)
Gadwin Printscreen utility replaces windows standard printscreen keyboard button with more options and flexibility. It loads on windows startup and runs silently in the background without consuming system resources but it’s always there when you need it. Instead of just capturing the entire screen view, Gadwin allows you to select a rectangular area very precisely with the help of a built in magnifying window. This tool is invaluable to my work. I often use it to grab different pieces to mock up a design.

Time saved: 2 Minutes per screen capture.

Batch Image Resizing :: Multiple Image Resizer .NET (http://www.multipleimageresizer.net/ )
I tried 10-15 different batch resizing programs before setting on Multiple Image Resizer .NET. This program’s ease of use in unparalleled and it has absolutely any function you could desire. Simply select a folder of images you want resized, determine whether to resize, add border, add text, overlay images, crop, rotate or flip them as a whole and save time editing the images one by one. I often use it to add small watermarks to a group of images I’m uploading to a clients website.

Time saved: 20 Minutes for a group of 20 images to an hour or more for a group of 100+.

Web Forms :: My Contact Form (http://www.mycontactform.com)
Web forms take time to build, time to style and time to test. I use My Contact Form because it offers all of these steps in one plus more options then I can easily code. The forms are highly customizable including things like adding attachments, multiple recipients, selecting a recipient and complete control over the look of the form.

Time saved: 30 Minutes to 1 hour per form.

CSS Text Boxes :: Rounded Cornr (http://www.roundedcornr.com/)
Once you have your rough draft laid out in CSS, and you need to start adding style, Rounded Cornr can save you a lot of time. Rounded Cornr quickly and easily creates images and CSS code for different box styles in an easy to use interface. It also offers an option to code it using only one image for all four corners, saving a minimal amount of bandwidth.

Time Saved: 10 Minutes per style.

Vectorizing Images :: Vector Magic (http://vectormagic.com/)
A lot of the time, I’m designing images using Photoshop. I do all of my logo work in Illustrator but I often find the need to convert another one of my designs to a vector so I can resize it without a reduction in quality. Vector Magic is a free online service that does this amazingly well. I was skeptical at first, but after answering a few short questions about my image, they were able to create a high quality vector image from my jpeg. Doing it by hand for complex images would take a lot of time and not turn out quite as precise.

Time Saved: 1-3 Hours per complex vector.

Selecting Color Schemes :: Adobe Kuler (http://kuler.adobe.com/)
This is one site you’ve probably heard of before, but I find it easier to use and with more advanced features then the other color scheme utilities available online. Add Adobe Air and use this tool even when you’re not connect to the internet. Kuler offers many premade color schemes as well that are an excellent source of inspiration for your website.

Time Saved: 5-10 Minutes per scheme over self-selection.

Creating a Patterned Background :: Stripe Generator (http://www.stripegenerator.com/)
A simple patterned background can add a much needed professional finish to your websites. Sometimes, if a site of mine is looking amateur despite clean design, all I need to add is a touch of design to the background. Stripe Generator, as it’s name implies, auto generates a striped background based on your input criteria. You can change all the colors and create a wide variety of non-distracting backgrounds.

Time Saved: 15 Minutes over creating it manually.

Building a Quick Photo Gallery :: Flickr Slidr (http://flickrslidr.com/)
First off, I’m partial to Thickbox, but it isn’t always the easiest to configure exactly as you like and can require use of other programs like the Multiple Image Resizer. Flickr Slidr creates a user controlled photo slideshow that pulls the pictures directly from your Flickr account. You can create a separate account for each project and spend much less time editing the look of the already well-designed gallery.

Time Saved: 25 Minutes over Thickbox.

Testing Your Website in Multiple Browsers :: Browser Shots (http://browsershots.org/)
It’s extremely important that your websites look good on all browsers (or at a minimum, all widely used ones). Most people don’t have very many browsers installed on their computer and even if they did, the time it would take to open your site in each browser would be huge. That’s where Browser Shots comes in. Put in your URL and choose all the browsers you liked to test for. Over 50 browsers are currently supported and you can even specify different screen sizes. Browser Shots then shows you a screenshot of what your website looks like in each browser.

Time Saved: 1-2 Hours if you choose all the browsers.

Want a free website?

Free unique, custom drag and drop flash site

Make sure to check out Ander’s latest article, 10 Ways to Save Time Building a Website: Improved

Share and Enjoy:
  • Digg
  • Sphinn
  • del.icio.us
  • Facebook
  • Mixx
  • Google

Related posts:

  1. 10 Ways to Save Time While Building a Website: Improved
  2. Building an Effective Website
  3. Save on Bandwidth!
  4. Fresh Uses Of Creative Backgrounds In Website Design
  5. Website Background Images : Examples and Implementation

Author

Anders Haig

Anders Haig - who has written 16 posts on [Re]Encoded.com.


Contact the author

Your Comments

81 Comments so far

  1. Nick says:

    Thank you for the mention of myContactForm.com. I am the owner of the service and appreciate the blog mention!

    If there are any other Wordpress users reading this forum, I might direct you to the tutorial we’ve written specifically for Wordpress users looking to add myContactForm.com to their blogs:

    http://www.email-forms.com/blogs/wordpress/

  2. Great stuff!

    I’m also planning to do a list of tools that help me work faster, :) .

  3. Awesome collection of all the things I love to read lolz.


Trackbacks/Pingbacks

  1. Ad Club @ Wake Tech - 05. Aug, 2008

    [...] 10 Ways to Save Time While Building A Website [...]

  2. 10 Ways to Save Time While Building a Website | WhiteSandsDigital.com - 05. Aug, 2008

    [...] selections for saving time. Please make you own suggestions for other time savers in the comments.read more | digg [...]

  3. How to: Save Time While Building a Website [10 Tips] | WhiteSandsDigital.com - 08. Aug, 2008

    [...] a freelance web developer, time is money. read more | digg [...]

  4. 10 tips para acelerar el desarrollo web | eleZeta - Lucas Zallio - 08. Aug, 2008

    [...] Tips que te permiten acelerar el desarrollo web. Muchas veces perdemos más tiempo del que deberías con algunas tareas. Esto puede servir. Tecnologia, Tips, minipost Deja un Comentario [...]

  5. dpatterson.blogsite.org » How to: Save Time While Building a Website [10 Tips] - 08. Aug, 2008

    [...] read more | digg story [...]

  6. Satiated « no narcissus - 08. Aug, 2008

    [...] on how to design the thing. I was doing some research on proper layout and shortcuts and found this website. There’s definitely some fun stuff here. I think I’ll wait until tomorrow to play [...]

  7. Website yapmayı kolaylaştırmanın en hızlı yolları , teyt.org - 09. Aug, 2008

    [...] rutin işlemler ve rutin araçlar vardır. Örneğin arkaplanlar, headerlar, formlar vs. gibi. Burada ki pratik 10 web aracı ile basit rutin işlemleri kolaylaştırarak farkedilmese bile bir website [...]

  8. Aueralis - Genesis » Re[Encoded] - 09. Aug, 2008
  9. 10 Ways to Save Time While Building a Website | 23Systems Web Devsign - 09. Aug, 2008

    [...] Read More at [Re]Encoded dot Com » 10 Ways to Save Time While Building a Website [...]

  10. Flickrslidr - Autocreated slideshow with Leo Laporte and Ambermac « What … ? - 09. Aug, 2008

    [...] 9, 2008 · No Comments I was reading an excellent post on “Top 10 tips for saving time building websites“. I like them all (although I prefer Jing for screen [...]

  11. Marcelino 2.0 » Blog Archive » 10 Ways to Save Time While Building a Website - 09. Aug, 2008
  12. Burn Your Web Candle Less « TEACH J: For Teachers of Journalism And Media - 09. Aug, 2008

    [...] is a great post from (Re)Encoded that has 10 ways to save time creating web pages.  I only wish I could find 10 tips for writing, photography and video editing! Posted in [...]

  13. Save Time While Building a Website [10 Tips] | Total Geek - 10. Aug, 2008

    [...] Continue reading… SHARETHIS.addEntry({ title: “Save Time While Building a Website [10 Tips]“, url: “http://geek.bustablog.com/save-time-while-building-a-website-10-tips/” }); [...]

  14. Fisha Seventeen Inc. » Lead News i-tutorial » Cara Cepat Dalam Membuat Sebuah Website - 11. Aug, 2008

    [...] dari sini dan [...]

  15. Monday morning links serving: The August 11th edition - 11. Aug, 2008

    [...] -10 Ways to Save Time While Building a Website As a freelance web developer, time is money. I use many different tricks to increase my productivity and these are my top selections for saving time. [...]

  16. 10 Ways to Speed Up Website Building - 12. Aug, 2008

    [...] if you’re quite the expert on web design, you may find Anders Haig’s article on 10 Ways to Save Time While Building a Website pretty [...]

  17. 10 Ways to Save Time While Building a Website | micklanders - 12. Aug, 2008

    [...] As a freelance web developer, time is money. People use many different tricks to increase productivity and these are the top selections for saving time. [...]

  18. 10 verktøy for raskere webutvikling | Frilansinfo.no | Informasjonsportalen for kreative frilansere | - 13. Aug, 2008

    [...] Klikk her for å lese hele lista (nytt vindu). [...]

  19. 10 Maneras de ahorrar tiempo al construir un website » El blog de KnxDT - 13. Aug, 2008

    [...] Enlace: ReEncoded [...]

  20. Electronics Made Easy | CEA Digital Dialogue - 14. Aug, 2008

    [...] family still see me as the electronics expert so I frequently use my resources to help them out and save them time. While I don’t mind lending a helping hand, it would be great if I could send those closest to me [...]

  21. 10 timesaving tools for web design - 21. Aug, 2008
  22. Grammy’s Stuff » 10 Ways to Save Time Building A Site - 21. Aug, 2008

    [...] From reencoded.com [...]

  23. Two Mad Geeks Tech Articles » Blog Archive » 10 Ways To Save Time While Building A Website - 28. Sep, 2008

    [...] Link: [Re]Encoded [...]

  24. 10 Ways to Save Time While Building a Website » My Web Stuff - 21. Nov, 2008

    [...] http://www.reencoded.com/2008/08/04/10-ways-to-save-time-while-building-a-website/#more As a freelance web developer, time is money. I use many different tricks to increase my productivity and these are my top selections for saving time. Please make you own suggestions for other time savers in the comments. [...]

  25. 2008年最佳Web设计文章、教程及资源 - 刀客征途 - 23. Dec, 2008

    [...] 如何节省搭建网站的时间 [...]

  26. 2008 Most Popular Design posts, Tutorials and Resources | Web Hosting and Domains - 31. Dec, 2008

    [...] 61. How to: Save Time While Building a Website [...]

  27. 2008 Most Popular Design posts, Tutorials and Resources | SulVision - 31. Dec, 2008

    [...] 61. How to: Save Time While Building a Website [...]

  28. 2008 Most Popular Design posts, Tutorials and Resources | Web2.0 - 19. Jan, 2009

    [...] 61. How to: Save Time While Building a Website [...]

Share your view

Post a comment

          

Community News

  • Free Telecom Icon Set

    ComFi developed a specific ”ComFi Telecom Icons” icon pack in 32 x 32 pixels in Jan 2010. For personal & commercial use.

    February 8, 2010
  • 25 Unique 3D Light Graphics Wallpapers

    What I’m gonna show you is 3D version of light painting wallpapers, which called light graphics. At first, I’m a little bit confused & had no idea what they are called.

    February 8, 2010
  • 30 Twitter Hacks and Plugins to Spice Up Your Word…

    Twitter has grown exponentially in the past few months and Still, It’s growing like crazy. Twitter has surpassed Facebook and others to become the fastest-growing site in the “Member Communitie…

    February 8, 2010
  • 50 Fantastic Examples Of Origami Art Work

    Origami,from oru meaning “folding“, and kami meaning “paper” is the traditional Japanese art of paper folding. The goal of this art is to create a representation of an object using geometri…

    February 8, 2010
  • Web Hosting Layout Tutorial in Adobe Photoshop

    This tutorial will teach you how to create a PSD layout for a hosting business, internet service provider, or any other internet related business.

    February 7, 2010






© 2010 [Re]Encoded.com. Powered by Wordpress.