Toolbox Blog: resources, tips, tricks & info for creative professionals

Archive for the ‘Web Development’ Category

August 18th, 2009

How Much Does a Website Cost?

4 out of 5 inquiries from new customers begin with some form of the question, “How much does a website cost?”

I think they would be most happy if we could open up the magic website price book and provide them with a useful answer. Instead, we usually say … “Well, that depends upon the type of website you would like to build.”  (How’s that for helpful?)

Actually, it is helpful because such a question begins a discussion that allows both parties to thumbnail out the actual scope of the project at hand.

Here is my firm’s approach to collecting the information necessary to provide initial pricing estimates.  It is a four quadrant model that includes: scale, features & functionality, content development, and interactivity.

Scale – How many sections and pages are we thinking about here?  Is it a redesign of your current site whereby the size of the site might grow by a foreseeable percentage?  Is there a competing site that does a good job capturing the information we’re hoping to capture?  Have you jotted out a preliminary sitemap?  The more thoughts the client can provide on the scale of the site, the quicker we can provide helpful budgetary information.

Features & Functionality – Basically this means “what do you want visitors to be able to do on your site?” – and – “what type of management control and integration are you looking for on the back end?”.   Front end features are usually more obvious.  Are you looking for basic forms, links, and a search feature?  Do you want to post jobs, manage news & events, and host a forum?  Is ecommerce involved? (If so, get ready for a good many more questions.)  Back end features are typically not as thought through.  What degree of content management are you looking for?  Does the site need to integrate with any other software, servers, databases?  One atypical feature request can easily add 50% to the cost of a web project.

Content Development – Content covers both the copy (words on the page) and the images (photos, illustrations, video).  Will the client be providing final website copy?  Or, will you be in need of copywriting and/or copyediting services?  To what degree?  Is there any video production needed for the website?  Will we be using stock photography, client-provided photography, or custom photography?

Interactivity – How much interactivity are we wanting to incorporate into the website?  Hold all other parts equal (scale, features, content), a website with a high degree of interactivity (transitions, multimedia presentations, flash integration) can easily cost 2-3 times more than a basic static website.

To make the “how much?” question even more interesting, the “how much” often depends upon “who” you’re asking.

As you move across the scale from part timers/freelancers/students/friends to very-large-agencies, the cost of a similarly scoped project will increase exponentially.  Experience, team size, and overhead all get factored in and influence the pricing.  On the plus side, you do usually get what you pay for.  Not always.  Usually.  Also, it’s sometimes comforting to know that your web resource will be reliable and won’t be moving/leaving the industry/graduating/you-name-it any time soon.

Technologies used to create your website certainly influence price.  Microsoft licensing costs can add up.  Open source web technology provides a major value, though is not welcome in all organizations.

Lastly, certainly not least, is the degree of search engine optimization effort that is provided with your website.   If a web partner is going to invest the time and effort to identify how people find your business and then incorporate that knowledge into the architecture of the website, be prepared to see at least a few thousand dollars added to the cost of the project.

Some sites cost $1,200.  Others $300,000.  Still others $2MM.   There’s no one price for a website, only a series of trade-offs.

So there we have it, right?

March 19th, 2009

Should Your Web Developer Be Your SEO Consultant As Well?

SEO/Design/Development JuggleMost people not in the industry think about SEO as something that is done outside the actual website, if they’ve done their research then it will be all about link building, blog posting, PPC, etc.  The truth is there are an awful lot of things that can be done within the coding of a site that can make or break any SEO effort – we call this ‘On-page SEO’.  For more specifics take a look at our Simple Guide to SEO post, but it suffices to say that ignoring this type of SEO can kill a campaign before any ‘off-page’ effort has even started.

Ideally your web developer will know about these practices, but you’ll be hard pressed to find someone who has the time to stay up-to-date on the constantly changing SEO world AND continue to move forward with the latest design techniques.  ViceVersa, don’t expect your average SEO consultant to be able to design and code your entire website.

There are people out there who are experts in both areas and can effectively build your site and manage your SEO, but they are few and far between.  Nine times out of ten attempting to cut costs by having one person do both will backfire.  Another option is to hire different people/agencies for each component.  It is a valid strategy, but there are inherent potential problems with this type of set up.  Any SEO consultant worth his salt will want to take a look at your website’s code, and will probably want to make at least a few changes.  Suddenly  issues of file access and permissions pop up that can really complicate, not to mention drastically slow down, the process.

The best possible solution is to have your site designed by an agency who employs both designers/developers and online marketing specialists.  You’ll end up with a coherent and more successful website because of the smooth communication between the two camps.

February 5th, 2009

Crafty Custom 404 Pages

Few things are as frustrating as not being able to find a web page you are looking for.  You’re cruising along when all of a sudden you click that bad link, or your finger slips and you type a ‘r’ instead of a ‘t’, or you know you got it right and your page has inexplicably disappeared – hey, we’ve all been there.  Yes, when that moment comes and you are met with the standard “Page Not Found” message it’s more than a little annoying.

But sometimes it’s not so bad.  When a designer takes the time to create a custom 404 page it adds to the user experience.  Sure, you’re still a little annoyed you haven’t found what you were looking for – but running into an error page that’s funny or creative or just plain great to look at lessens the blow a bit.  You might even stick around and give it another go instead of bouncing right off the site.

We love well done custom 404 pages – here are 35 of our favorites for your inspiration!



































January 30th, 2009

Is AdSense Worth Running on My Site?

This question gets asked a lot, and the answer is almost always “It depends”.

Let’s be honest, most websites that enjoy any sort of traffic have some form of advertising placed on them.  If you have the resources, time or talent to create your own custom advertising solution that is probably the way to go.  But AdSense can be a good alternative if used effectively and, as with any advertising, the only major drawback is the potential ‘commercialized’ look of a site that runs ads.

Google’s AdSense is one of the easiest ad programs to use, so it’s great for everyone.  They place very relevant text or image ads onto your site immediately…and it’s free to use.  However, just sticking the ads on your site and leaving them won’t bring in much revenue.

To make running AdSense worthwhile you’ll have to do a bit of optimizing.  Placement is important, you’ll want to put the ads somewhere people will see them and click on them, but be careful not to make them too intrusive or your user’s will block them.  AdSense offers a pretty good variety of styles, colors and sizes to use, so be sure to test out a few and see which looks the best and fits in with your site’s overall design well.

AdSense automatically does the targeting of your ads…but you’ll want to make a few changes here as well.  The more relevant the ads are to your site’s content the more likely people are to click on them – making you more money.  They offer section targeting, which is a way to specify certain sections of your site that you would like to emphasize or downplay when it comes to matching content up with ad topics.  You can also filter out ads from certain domains with the Competitive Ad Filter.  For example, if you don’t want ads from a rival showing up on your site, or you notice a site that keeps advertising completely off topic, just enter in their domain to the filter list.

So, yes, AdSense is worth running if you are realistic about the levels of extra cash you can make and if you take the time to create ads that fit in stylistically with your current site design.

For more info, or to get started and try it out head to the Google Adsense page.

January 23rd, 2009

12 Great Free Website Templates – And Where to Go to Find More

Everyone has heard the saying “you can’t get something for nothing” in some form or another.

We respectfully disagree when it comes to free web design templates.  Templates in general have bad rap – especially the free ones.  There are so many sites out there offering free templates that are thrown together, look like they belong in 1996 or are just plain ugly – you also run the risk of having a website that looks exactly the same as your competitor’s.  Don’t get discouraged!  If you don’t have the talent, time or money to get a custom designed site there are plenty of free templates out there that are not only presentable – but actually quite well designed and even unique.

Here are 12 to prove our point:

And here are 6 reliable sites that offer well-designed free templates:
Open Source Web Design

Happy Hunting!

December 1st, 2008

Quick HTML Reference

Need a quick refresher on HTML? We’ve pulled together some of the most easy to use resources to use when you’re stuck!

HTML Quick Reference – Online quick reference for HTML coding.

W3 Schools HTML Tutorial – Everything you could possibly need to know about HTML, all in one place.

How to Serve Better HTML – 8 tips on how to serve better HTML or XHTML.

HTML Cheatsheet – One page document for use as an HTML quick reference.

HTML Character Cheatsheet – Yet another HTML cheatsheet, but this time for HTML character codes.

HTML Editors

NVU – Free, open source HTML authoring software.

SquareFree HTML Editor – Online, real-time HTML editor for quick coding checks.

CoffeeCup – WYSIWYG editor for HTML. Inexpensive considering the feature set.

HTML Templates

Free HTML/CSS Templates – Free HTML templates to base other designs off of or just customize one to suit your needs.

Layout-o-Matic – Generate a quick HTML and CSS skeleton layout to base your design off of.

November 19th, 2008

Valuable CSS Resources Every Designer Should Know About

CSS Tutorials

SitePoint CSS Tutorials – Sitepoint’s collection of useful CSS tutorials for advanced CSS users.

CSS Slicing Guide – Tutorial covering how to create a CSS structure by slicing a single image file.

Position is Everything – Analysis of common CSS bugs and instructions on how to fix them.

Floatutorial – Comprehensive tutorial on using float with CSS.

CSS Properties

CSS Properties – Alphabetical listing of every CSS property.

CSS Code Examples

glish CSS Layouts – Examples of some basic cross-browser CSS layouts.

DynamicDrive Code Library – Collection of submitted CSS code samples showing how to make good looking menus, forms, divs and more.

Web Design Library – Extensive library of CSS articles, tutorials and example code.

CSS Font Styling

CSS Font Reference Sheet – Reference sheet for using CSS.

October 28th, 2008

To Blog or Not to Blog?

Let’s be honest…blogging is hard.  In fact, Michael Parsons touts it as the “hand-to-hand combat of the writing world”.  Creating and maintaining a successful blog is a huge undertaking, and those that are really successful at it put forth great amounts of effort.  They eat, they sleep, and they blog.

The blogosphere really is another world, with it’s own set of rules and etiquette that you’ll need to learn.  You should set aside time to read other people’s blogs, and try to establish relationships with other bloggers.  Learn when to comment, when to post your own content, and when to link to other blogs.  Staying up to date can quickly turn into a full time job if you let it, so here are a few tips to help:

  1. Write about something you like and write often.  Seems like common sense, but readers will know if you aren’t sincere and you’ll build up loyal readership faster by making new content available regularly.
  2. Stay well-informed.  Get your facts straight and be aware of what others are writing about the same topic.  Readers will nail you to the proverbial wall for obvious duplicate posts or not fact checking first.
  3. Promote your blog.  Readers will not be magically drawn to your site so you’ll need to do some grunt work, especially in the beginning.  Ping, use trackbacks, and leave comments on other relavent blog posts to let others know what you are up to.  Use gimmicks, wit, a specific tagline – anything to get noticed, the internet is a black hole of information that is easy to get lost in.  Lastly, make use of social bookmarking and article submission sites by submitting one of your better posts once in a while to reel in new visitors.
  4. Don’t just blog for the sake of blogging.  Have an opinion or something useful/interesting to say or no one will pay attention
  5. Have thick skin.  Readers will leave harsh comments, its part of the game.  Respond (tactfully) if you must and then move on.  If it bothers you, use comment moderation to weed out the particularly hurtful ones.
  6. Hang in there.  It will get easier.  Most bloggers who get discouraged and quit do it in the first few months.  Building an audience takes time, and it doesn’t really matter how many people you are reaching as long as that number keeps growing.  The older your blog gets the more credibility it will earn.

It’s hard, and its not for everyone – but blogging can be very rewarding.  Adding a blog is a great way to make sure your site has fresh content, you’ll get your point across to lots of people, and hopefully you’ll have fun and gain satisfaction from sharing information with others and participating in online communitites.

August 19th, 2008

Can Pink Be Professional? 15 Pink Websites You Have to See

It’s a question the designers have asked for a while now.  Can pink be used in a professional design?  I think the answer is a resounding YES!  Nixing the color pink all together can stifle the creative process. You decide…here are 15 websites utilizing the wonderful color pink

Some uber professional sites: A financial/trading company, an advertising agency, and a large well-respected mobile phone service provider…all using pink!

Even a few professional web design firms…

And even if the pink seems overwhelming, keep in mind the type of company and intended audience.  Character design or a stuffed animal designer for example…

Then again, you don’t want to get too carried away…

May 23rd, 2008

Get Rid of Yellow Form Fields Once and For All

Have you ever created a website form and wondered why when you go to the form on the website that certain fields have a yellow background in the form field?

This is the Google toolbar that turns these fields yellow. On the toolbar there is an “auto fill” option. This tells the user that they can use this option to auto fill certain fields on your form (which are marked in yellow).

The Problem

In CSS if you declare a background color of your form fields this will typically change the background color for all the fields except the fields that are marked by Google for auto fill.

For example, CSS code that looks like:

input {
background: #F3F4EC;

Results in a form that looks like:

Yellow Form Fields

Not only are some of the fields an ugly yellow color, but the coloring is also misleading to users. Most web users are unaware of the yellow, “auto fill” option and instead assume that yellow indicates a required field. In the case of the form above, the Phone field is yellow even though it’s not a required field.

As you can probably guess, these yellow fields are bad news:

Confusing Forms = A Drop in Conversions

The Fix

To override the yellow background all you have to do is declare your background as important.

Change the CSS to:

input {
background: #F3F4EC !important;

Then the form looks like this:

No More Yellow Form Fields

Problem solved. The yellow fields are gone and the form is much more user-friendly.

DreamTemplate - Web Templates     Host 6 Domains on 1 Account    

Website 120x60 Logo    

ABOUT AGENCYTOOL At its core, AgencyTool exists to serve as a resource for creative agencies, whether they be into web design, print, advertising or anything else. Here on the AgencyTool Blog you'll find a mish-mosh of resources and thoughts that we think are worth sharing.

Feel free to comment on a post or drop us a note if you've got something to say. We love comments, so we don't use nofollow, but we do moderate - you've been warned!


How is different from other web directories?

  Quality Listings. We're selective. We take the time to individually review each submission, so you know the companies listed with us are legitimate and of the highest quality. If you list with us, you know your brand will be associated with the Nation's Premiere Creative Agency Directory. Always above the board, and always there for you... Get Listed Now!