Wednesday, October 10, 2007

DIY website

At last! I have finally completed my website! C-c-c-c-check it out-t-t-t-t, here. There could be some bugs or things to work out so if you encounter any please let me know or if you have any other feedback to offer that is also welcome.



I thought I would go through the steps to building it in case anyone needs tips on making their own. If you don't care about reading about how to build a website stop reading two sentences ago.

1 - I designed the layout of the main menu and project gallery in illustrator on a page 1024x768. The layout included the text that would be used to make the buttons. The normal state is the black lettering you see for each option. The rollover state is the text with the blue outline.

2 - I copied those various elements into photoshop/imageready where I created buttons, using slices. I exported a full web page with image ready, but in the end trashed it all and only kept the buttons (two gifs to create a rollover state). The imageready page was messy and would have been harder to make future corrections.

3 - Based off of my original design I created the website from scratch in dreamweaver. Dreamweaver is super easy if you know a little about html. I only used tables, rollover states, and a few other minor tools to build everything. You can download a free 30 day trial of dreaweaver if you don't have it.

I also looked at a lot of web sites to figure out some of the not so obvious things that you wouldn't think about, like key wording meta data. You can download someone's webpage (html only) and look at how they built it, simply right click on the page and select 'save page as'. From there you can open the page with dreamweaver or textedit to view the code.

4 - For hosting and a domain name I used doteasy. It is only 25 bones a year, can't find cheaper than that.

Other tidbits -
Make jpegs about 100kb. In photoshop view files at actual pixel size that you plan to show then when you choose the compression quality reduce it as much as you can before you begin to notice visible pixelation.
You can use Google Analytics to track visitors.
The doteasy email seems a bit annoying so I forward all my emails to my already existing gmail account. That way I don't have to worry about maxing out storage space or dealing with another program.

That is basically it. In all it will only cost you $25 and you get to learn all sort of new stuff. Like I said you can download free trials of any of the programs I listed if you don't already have them. My instructions are pretty minimal, but it might help start you in the right direction. If you want more information about anything please call or email.

3 comments: