Planning stages, a checklist, and sites to help out


{information taken from BYUI course}

  1. Web site name: Does the name reflect the company and its online efforts? In this case, the Web site name is the company name, which is “Wiki Whatevers.” The company may want to develop a tag line as well if they don’t already use one. The tag line will then be placed with the company name and logo together on the Web page.
  2. Logo and branding: I want to collect any printed matter that was developed prior to this task, including logo, brochures, etc, so I can build a file that will hold information such as phone numbers and addresses. These items will also help me to understand the “tone,” branding and style of this business better from their past efforts. If none of this has been developed previously, then I’ll want to hire a logo design team to build a logo (I’m not a logo designer, so I farm that work out—and you can as well by building that price into your billing).
  3. Web site domain name: In tandem with the Web site name, I want to know if the domain name is available. The domain name is the address that a Web site uses for identification, and that the user will type into a browser’s address bar to reach that Web outside resources. The domain name can carry any number of upper level domain registrations, such as “.com,” “.org,” and so on. While a designer usually isn’t responsible for the domain name registration, it helps to know if the domain name has been chosen and registered. In some cases I’ve had to change a domain site name and some site content because the domain name was unavailable. This problem led to a higher charge for the client, which would have been unnecessary had the domain name been chosen first.
  4. Competition research: It helps to know what competitors’ Web sites contain in terms of graphics and content so that the site you design will enter the market on an equal or better footing than the company’s main competitors.
  5. Information architecture: Does the site need a shopping cart or a blog? What plans for expansion does the site owner have in mind? What structure would be best to link the pages together? These items are important, as you will need to build them into the site design and its navigation. You need to know how the site will expand in the future—this will determine how you build the site as well.
  6. Site content: Has the site content been developed? If so, you’ll want to gain access to the content immediately to help determine the navigation, type design, and layout. Categorizing the content is the best way to develop navigation. The content can help determine the look and feel of the site as well; therefore, if content hasn’t been developed, it might be wise to delay the design. Be sure that the content is relevant and plan for updates, as site content is what keeps visitors returning to a site.
  7. Research web hosts: While the client may have a particular Web host provider in mind, you may need something else entirely as not all hosts provide equal technology support. A Web host is the business that hosts Web sites, and some Web hosts provide access to databases, which you may need for a blog or for cataloging information or products through a shopping cart. Other hosts limit the number of visitors to a site, and this can create problems if the site becomes popular. For a large list of Web hosting providers and their capabilities, visit the Web Host Database (WHDb). Make sure the client has purchased space on this Web host before you begin your site design so that you know your design parameters.
  8. Directed departure: Planning for directed departure means that you/your client gains control over how users will leave the site. Viewers will leave the Web site eventually, so why not plan for their departure through monetized ad placement or through link exchanges? Making plans for this direction now can add value to the site monetarily and/or through offering a service to your site users.
  9. Deadlines: Determine now when the site will go “live.” Usually an eight-week lead time is enough to finalize any small project such as this, as long as the clients have their content ready, they are amenable to color and layout designs you offer as samples, and no difficult programming is required.

Once you have these basics out of the way, you can sit down, read the content, plan for navigation, and decide how to best optimize the site for search engines.

Starting with a real business example:

  1. Using the company’s pre-existing logo, I want to prepare a digital copy to use throughout the client’s Web site. I’ll need a scanner to scan the image into a graphic program such as Photoshop or Gimp. I’ll size the logo for the site later, once I’ve determined the layout. I’ll save the image at 92 dpi, which will allow for faster download time. I probably will use this logo for #4 below as well. Match colors by either using it from the web, or from a printed logo. If they have both, ask if they prefer one or make sure they match.
  2. I’ll use photos of the programmers on the staff page (or “About” page), so I’ll need digital images for this project. They will either provide digital images or print photos for scanning. If they send digital images, I’ll want an image with more detail than I’ll eventually use, so a 300 dpi image or greater is good, or a full-sized image that I can reduce later to my own specifications.
  3. The client has decided to use a blog, since they already have sufficient content to keep this blog active for the next few months. Fortunately, the client has chosen a Web host provider that supports blogs and has the necessary capabilities to handle databases and high traffic—including spikes in traffic. This host also provides several solutions for expansion, a great offer if the client wants to grow. If the host’s up time is guaranteed, the client will be happier if he or she can stay with the same host throughout this growth phase down the road. This ability to stay with a host provider for years makes life much simpler.
  4. Using FTP (there are several to choose from on the market, such as the Open Source product Filezilla. I’ll upload a static page that announces the upcoming site. “Under Construction” is a terrible phrase to use, as visitors to the site may not return if they don’t know your “grand opening” date. Instead, use a page that states the name of the company, what they will offer, a date that the site will be active, and a contact (email is fine—if this is a bricks-and-mortar business, use a street address and phone number as well). Even better, utilize an email form that individuals can use to be notified when the site goes live. This last suggestion provides clients with potential consumers even before the site opens for business.
  5. Using the content/structure information received from the client and the fact that they want advertising space designed into all pages, I’ll design the architecture for the site and plan the navigation and textual links. I’ll also use this copy to plan for keywords for the site’s SEO.
  6. Using the colors in the logo, I’ll choose two or three color schemes to present to the client for approval.
  7. Then, I’ll choose other photographs or illustrations from a stock photo place such as iStock orComstock. But, be sure to shop around, as some stock photo businesses offer sales and other deals that you may not be able to pass up. Using stock photography is not that expensive, and it saves headaches concerning copyright issues. I’ll also need any images that the company has produced—or that they will produce—to accompany any code, “how-to” articles and blog entries.

Other things:

Use alt attributes for navigation, even if you are using images.

Have the wireframe checked off by the client, so that you only have to code the layout once or make slight adjustments.

Use a code and css validator.

Test the layout across the different available browsers.

Only after the code is generated, validation finalized and go-ahead from the client received should you begin to add colors, images, and any other code such as for advertising.

Here are a few good check lists to use:

Bulleted out

A little more description


Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s