Wednesday, April 28, 2010

The Start of a New Website, Part 1

The Start of a New Website, Part 1

I revel in the start of a new website.

I only get to do this once, maybe twice a year. Starting a new website from scratch is a long project, at least for me. But it has a New Year kind of feel to it. Doing it so infrequently requires me to brush up on my HTML and CSS standards. What DTD should I use? What has been deprecated? What version of HTML is most current? How do I link to a stylesheet?

Writing code for a new website requires some basic research, but it also has a liberating, fresh feel to it. I feel like I'll be able to right some wrongs I committed the last time I wrote. Sometimes a stubborn coding problem causes me to crudely smash tags and routines together in a desperate, clumsy way, not caring about standards, not regarding accessability, not wanting to make it clean and elegant...I just want to get it to work. And it bothers me, giving me an uneasy feeling of incompleteness and mediocrity.

So, the chance to write a completely new website lifts me to an excited, hopeful, idealistic mood. I can design a new graphic, learn some new Javascript, and perhaps gain Google's undivided attention!

A local civic organization has asked for a volunteer to help design, create, and manage their new website. I met with their communication committee today and it went well. We all seemed comfortable with each other, and their expectations seem to fit well with my experience level (limited) and expertise (shakey). I'll put together a sample page based on their initial descriptions and goals and email them a prototype next week. I'm excited.

Here's my first steps for those who are in a similar situation:

I met with my clients (Wow! That sure sounds professional! I have clients! I wonder if they know that?) and got paper copies of their latest newsletter and a screenshots of another group's organization that seemed to be what they were thinking of. A friend accompanied me, and offered some good suggestions during the meeting that I hope to incorporate. One of the representatives will be emailing me a PDF version of a MS Word document he created, a model or example of what he envisioned. This will give me some starting content and graphics.

As soon as I got home I fired up Chrome and went to World Wide Web Consortium (W3C). This seems to be the center of website design standards and practices. I know that lots of changes have undoubtedly been made during the last year or so since I've created a website. It's important to adhere to global will affect how the page shows up on search engines, and how compatible it will be on all the major browsers. Every website, every smart phone, every computer, and every program that accesses the World Wide Web must decide what programming language to use, what version of that language to use, and what particular conventions it will follow. The people who adhere to the standard are the ones who enjoy wider access, better compatibility, and more popularity.

As I look (wade, stumble, puzzle) through the standards, I gradually pick up some the major criteria that I need to follow. I copy specific lines of code that they recommend and paste them into a blank document that I will use later as a template. This will make it much easier to create successive pages that are standards-compliant and user-friendly.

After creating a template, I want to go into creative-artist mode. I close my laptop and put away my iPod and grab the artist's favorite, always-dependable tools: paper and pencil. I also grab a handful of my granddaughter's crayons.

Grab your first blank piece of paper and jot down, in random, fluffy-cloud-like manner, goals or topics that this new website might include. Write down things like, Products, Contact Information, Customer Service, Features, Benefits, FAQ's, Photos, Volunteers, Prices, How-To's, and whatever else the organization might be concerned with.

Switch to analytical mode: What topics can be combined? What needs to be front-and-center? What can be buried? What is most important?

You might have to do these two exercises more than once. Don't try to be neat and one but you will ever see these pages. You're using both sides of your brain, working together and separately, creating some possiblities.

Now, be the artist.

Here is a great way to open the mind up to effective, attractive, creative websites. Sketch out a possible layout of the home page. What should be most prominent? Does a two-column design look good? What will the title look like? What color combinations enhance the website's mission or goal? Draw some simple images. Don't try to make it detailed and don't try to make it perfect. Stick figures work fine. The goal here is to simply try different ideas. Expect to make at least three different designs. Try for a conservative, simple version. Then try for a wild, crazy, way-far-out design. Then make one that might fit in the middle...not too plain, and not too crazy. Make several versions. Try different colors, different shapes, different style of lettering, different sizes, different focal points.

Switch to analytical mode. What sketches seem to be likely candidates? Choose three and write a simple home page based on each sketch. These will become the rough draft pages that you can take back to your clients and get their feedback. Expect to make changes, and expect more questions.

But most of all, expect more ideas!

Creative Commons License
This work is licensed under a Creative Commons Attribution 3.0 Unported License.