06.23.08

I’m building a website from scratch - find out how

Posted in website building, website software at 4:16 pm by Ron

I’m currently building a website for a couple who are offering disc jockey and live music entertainment. The site is just in the embryo stage at present.  Take a look at it here

Please note that these web pages will not change much, if at all. I shall continue working on the site but at a different URL to protect the privacy of my clients. When it’s finished, and if my clients give approval, the complete site may be revealed.

There are only two pages at present; any more will depend on my clients. At present I’m just using a folder on the Shed 18 website. Nobody can access it unless given the URL. You’re privileged :-) .This is a useful dodge until the website is ready to publish on its own domain. I shall set it up to receive payments, provided my clients open the necessary accounts. WordPress may form a further part of the site, where my clients can publish details of events and accept comments.

As I say, the website is in an embryonic state and the final site may look and feel completely different. But I’d like to tell you how I set about it. I used the web editor Dreamweaver 3, a very old version, but one that I know very well, but I could just as well have used Profit Site Pro  In fact I used a template I developed using Profit Site Pro that gives a page that’s OK in all screen resolutions. But more of that later.

=========================
Making the header graphic
=========================
I started with a picture from my customer, resized it and edited it in Irfanview (available from the Shed 18 member’s zone, graphics section). Then, using an ancient graphics program, Fireworks 2, I inserted it into an existing header graphic of a similar color and added some text. So,in a way, the pic determined the look and feel of the web page, the main colors of the pic being brown and green.

The size, or rather the width, of the header is important if you want it to work in various screen resolutions. The header graphic needs to fit the lowest useful screen resolution, that I consider to be 800×600. But this leaves an ugly gap at the RHS when viewed in higher resolutions. My solution, and I’m sure there must be others, is to fill the gap area with a matching color. You’ll see this on the Shed 18 and Member’s zone headers as well.

To match colors I use a simple little tool “Hex Color Finder”. Using the eyedropper tool any color can be sampled. 
~~~~~~~~~~
The Home Page
~~~~~~~~~~
At present the home page contains very little as I’m waiting for photos and content. Apart from the DJ Yazoo” and “Disk Jockey” under the header it’s virtually the template.

The two buttons will be made “rollover” and may even change completely. The buttons work - try them.

~~~~~~~~~~~~
Intermission
~~~~~~~~~~~~
This page is about Diane “The Girl on the Fiddle” and contains samples of music from her latest CD.

I copied the tracks from the CD to my hard drive, then took the samples using an open-source program “Audacity” You can get it through the Shed 18 Member’s zone, Audio section.

Then I used Impact Web Audio to turn the MP3 files into streaming audio and provide the buttons. I matched the color of the buttons to the page using “Hex Color Finder”

There’s an offer on Rons Deals at the moment for Impact Web Audio. It’s great, and a pleasure to use. Use it as I have or for voice recording with optional music backing.