TopCatDK CrocHunter
January 11th, 14:50
SiteEpisodesPeopleMultimedia

(Re)play Intro
Index Page
News Archive
TV Schedule
Croc Links
Info & Contact

Software
Here's a list of the programs I
currently use to create my sites:

Pictures/Graphics:

  • AcdSee
  • Adobe Photoshop

Screengrabs/Scans:

  • VirtualDub
  • WinDVD
  • HP Scanner

Audio:

  • Cool Edit Pro

Texts:

  • Microsoft Word

Coding (PHP/HTML/CSS):

  • Microsoft Notepad

A WebSite Story

Well, I've built quite a few web pages over the years, and I usually just change the design and expand without giving much thought. Then once the site has run for a year or more I start to wonder; how did it actually look when I started? To avoid that this time I'm putting up some screenshots and a few words about the past designs, feel free to grab inspiration if you find any.

Old Sites
The AQUA ZoneThe Cosmic String
For some strange reason I still have the source files for these old sites, but I can't see when I first used the designs. Both these sites were built without possibility for PHP or ASP and were a pain to update.

"The AQUA Zone", a fan-site for a Danish band, on the left, was active from 1997 to 2000; the design shown here is probably from early 1999 and very traditional with a title line at the top and the menu on the left.

On the right: "The Cosmic String", a Star Trek site, as it looked in March 1998. Built on frames and was a real pain to get working, it was before CSS became available and the differences between browsers resulted in the site looking great in one and horrible in another. The design was a bit unusual for me as it had the menu at the bottom.


The Next Step
MsTS Techie
The "MsTS Techie" site (MsTS=Microsoft Train Simulator) formed the initial basics for the first layout, it had also given me a lot of problems as time passed, even though the design of that site has never had any major changes I've had to redo almost all of it from scratch several times just to make some minor changes, a valuable lesson in (lack of) flexibility.

Design 1: It is green
Design 1
The first design from 30/10-2003, basically just a color change from the "MsTS Techie" site, the real difference is found under the hood. Knowing that this would end up as a 200+ pages website, if I ever finish the episode guide, required a very strict structure to begin with or I knew I would be sorry later on. With almost all text and menus created through PHP and all colors defined with CSS, makes it possible to change the entire design of all pages by just editing 3 files.

Design 2: Star Trek, The Croc Generation?
Design 2Design 2
Design 1 was just intended to be temporarily until the site got off the ground, so on 10/12-2003 I started using this design. There is a bit of a milestone for me in this, as this is the first time I've used Adobe Photoshop to create graphics. I really enjoyed making this one, based on the Star Trek LCARS and pushing the limits of what I thought was possible to do with CSS code, while breaking an old habit of mine; to have a solid border holding menu, copyright note and headline. The actual making of the design took less than a day, but I then used quite a long time to rearrange certain parts of the site and fine-tuning the appearance, so the actual time from initial idea to upload to server was about 2 weeks.

Design 3: Warm Khaki
Design 3Design 3
It's early April 2004 and I've just realized that I'm making a Croc Hunter site without Khaki colors. At the same time I needed a change away from the dark colors, so time to start all over. I'm definitely starting to get the hang of Adobe Photoshop and the many possibilities available and I think it shows. The biggest change this time is that I've ditched the optimization for Explorer and replaced it with full compliance to the HTML 4.01 standard defined by the W3C group, trying to do that and still avoiding the many oddities in Explorer was no easy task. A server crash with all files lost forced me to upload the new lay-out on 20/04-2004, a week ahead of planned, and then do the final optimizing of the site online.

On June 21st I moved the site to www.crochunter.dk, but it only resulted in a few minor changes in the site-headers.

More minor changes were made in late July to help viewers with 800x600 screens and the final version of the design looked like this:

Design 3Design 3

Design 4: Gator and Wood
Design 4
Design 4Design 4
Design 4Design 4
September 2004 and the no-nonsense design was getting a bit too simple for my liking, so the only thing that survived was the flash banner at the top (which I had made half-way through the lifespan of Design 3). There weren’t many problems in making this design, only a few differences between Explorer and Firefox required rethinking, particularly getting the white border around the navigation panels’ right took some experimenting. Actually I used the most time in figuring out which images I would use for the backgrounds and how to arrange the navigation links. I did experiment with having a background behind the main texts, but it almost always makes the text harder to read so I ditched that part.


Chart.dk
Since 2003-10-30