Major changes coming!

In a sort of mini-epiphany I had earlier today regarding the forthcoming upgrade of the old MZ Online site, I did some research and have designed the master ‘skin’ for the site.

You will notice a significant change…and hopefully an impressive one at that.

I looked around the web for what I’ll call ‘pseudo-popular’ designs for page layout. I’ve had ideas in my head for some time as to what I’d like to attempt, but it was nothing coherent until this afternoon. The goals were as follows:

1. Design still had to be no larger than 800 pixels wide, yet larger than the old 640×480 (which doesn’t allow for any decent presentation of content anymore).
2. I wanted to keep the ‘centered’ page look of the existing site (if you notice, it’s simply a table in the middle of a page — without any borders).
3. I wanted some contrast between background and content. For instance, almost make it more of a ‘presentation’ than just reading a page of text.
4. Add some snazz to it. Add curves.
5. Keep it simple to navigate and easy to understand.
6. Make it not as stagnant. Add dynamic properties.

With all those things in mind, it was obvious that TWiki had to be involved (to solve the dynamic and also layout issues). Most of the raw content itself won’t change a lot, but the presentation will change significantly. At this time I fired up the old HTML editor (for testing purposes), a few terminal clients (for connectivity to the server), and Photoshop (for the obvious). I’d copied all the old site content over to TWiki last night, so I just had to begin changing the layout and presentation.

Well, I’m pleased to report that now (five hours later) I’ve got the master ‘viewing’ skin complete. It’s essentially a combination of CSS (for managing all the colors, text styles, etc.) and a master page template which all content is filtered through (or which is used to generate all pages…more correctly speaking). And besides all that stuff, it looks absolutely awesome!

The design (without actually showing it) is only 750 pixels wide, about 720 of which are dedicated to content. There’s a standard header for each page, generated ‘dynamically’ so to speak. This also now becomes the navigation bar (akin to the sidebar here). The footer of the page includes the drop-down list of destinations (as was present in the old site) as well as copyright information.

What I really like the most about the design in total is the contrast between parts of the page. There’s a dark(er) background as the general page background, then a ‘frame’ of a different color which is slightly brighter. This allows for relatively good contrast between the page itself and the ‘content holding unit’ (e.g. the actual page). This ‘frame’ is also the background for the header and navigation bar. Inside this frame is the actual content window, where the textual content of each page is displayed. This window is the ‘black on white’ standard page contrast.

I think this positively frames and distinguishes parts of the page and just provides a good look overall. I actually like this look significantly more than this site itself, although I don’t think it’s appropriate to have a layout of such here.

At this time, I’m looking at making the final adjustments and ‘going live’ with the new design tomorrow afternoon, unless I have to work early(ier) than scheduled. If the latter is true, the site won’t go live until after Christmas.

So there’s lots of exciting stuff forthcoming!

A Mixup?

Since I generally use the same layout of my main CSS file between sites (just changing and/or adding/removing information as necessary), I usually copy that file to a new location and edit as appropriate.

Due to the revamping of the MZ Online site, I (this time) copied the MHotW CSS file.

Everything went as planned through the process…until I came here to make this news posting.

I discovered (quickly) that the CSS file wasn’t working here. Upon doing some investigation, I realized that I must’ve either typed something funny, or something hit the bit bucket and won’t be back.

Now, some additional background information is necessary here. When I first started using the TWiki software for stuff like the picture archive (which is really the first use I had for TWiki here before migrating everything)…I had to use two different CSS pages, one for the TWiki stuff and the other for regular HTML files.

Once I moved everything over, I wanted to make sure (during transition) that I didn’t do anything weird or miss something, so I removed the old TWiki CSS page and linked it to the new page layout CSS.

What does this mean? It essentially means that (without copying the file) there are two files in the directory which are the same file…and are always the same file. If you change one, the other is automatically changed as well.

I’m not sure exactly what happened, but when I copied the CSS file over earlier, it did something very odd with the linking. It also removed the file, although the link wasn’t completely broken. Usually if there’s no file, the link is completely broken (meaning it’ll return a 404 on the webserver) or something of similar nature. The link was still in good order, but there was an empty CSS file in its place.

The short of the story: After several hours, I had to manually restore an older version of the CSS page…and I believe everything’s back in order now. Things seemed to look pretty close to what they should’ve…

So, if you happened to be here during that five-hour period or so and noticed the pages weren’t looking anything like they normally do (if you don’t know what I’m talking about, this doesn’t apply to you)…please accept my apologies.

Until next time…

This post was upgraded to the MZ Online Blog on 8/25/07