epcostello.net site redesign ∴ 20:57 GMT 4 September 2004 ∴ ed costello: articles and essays

This is a collection of notes about the redesign I'm doing for epcostello.net this labor day weekend. It'll be updated occasionally as I do the work. Remember: I'm a rank amateur. I am not a professional. Thank &deity;. Don't try this at home. If you do, I don't care.

Current Problems:

Let's start with the obvious: I'm not a graphic designer. I don't even try to play one on TV. Yet, I'd like to try to add some color to the site. I will freely borrow ideas from sites I like on the web, and mangle them (in)appropriately.

Almost all of the HTML content is generated using PHP. This isn't a bad thing, however I need to work back in some lessons learned over the past year or so in playing with PHP. I include multiple modules now, I'd like to cut that down to one or two. I'd like to create a page class or perhaps classes for specific sections of each page.
All pages need to have appropriate metadata generated, either for the HTTP header or the HEAD section of each page. Currently this work is split between PHP and MovableType. MT will need to generate the actual values, but PHP should be used to create the necessasry HTML tags.
All pages should have proper expiration dates, however I'm not certain of that, again due to the multiple PHP modules thing.
Currently some pages handle modified-GET requests correctly while others just return the document.
Some pages are served with a gzip transfer-encoding, while others are not.
The CSS used throughout the site is a mess. The classes are a mix of leftovers from three previous sites with MT gorp added in for good measure. I want to get back to having one single CSS file, with browser-specific secondary files to fix specific problems. I don't want to use the various CSS hacks that float around as they all depend on various unique problems each browser has parsing CSS.
The content for Articles, Journal, and the blog--er--comments should use pretty much the same templates. I think. At any rate, I've learned enough about the oddities of MTIfEmpty that I need to clean up the templates, ie if there are no comments on an entry then don't display a Comments heading
For index pages advertising should be on the sides. For content pages advertising should be inline as much as possible with Google
Perhaps too much this time around but I'd like to make better use of Amazon for advertising
In case anyone's interested, I've earned an amazing US$1.30 from advertising this year. So, it's not exactly a money earner but it is something I'm using on other client sites so the more variations I play with the better
I've tried various layouts for the homepage, the last entry from each section, headlines only, headlines and excerpts, etc. I've created the problem for myself by splitting content up as I have and I'd just as soon keep it separated but it means I can't just dump a list of things into a file. There needs to be some sorting or ordering done to keep some semblance of date order.

Guidelines, Goals

All pages will have proper Last-modified and Expires headers.
All pages will be able to be served with a gzip transfer encoding if the client supports that method.
All pages will support modified-GET
All content will have explicit cache headers set, most for 24 hours from serving time
The homepage will use a different layout from the rest of the site, but content will use the same classes as on the other pages of the site
No URLs from the previous design should break, should either continue to be served or redirect to appropriate replacements.
CSS classes will be used to identify different types of content. CSS ids will be used to further delineate within a class.
The site will continue to have three main sections (Personal Journal,Comments & Links / ‘blog, and Articles & Essays). Information about the site will be chained off the "about" pages.
I'm using Firefox as the reference browser, on Windows and Mac OS X. The site should work with Opera 7 (Windows) and Safari (Mac). I really don't care what happens with Microsoft Internet Explorer except, I guess, that the site should display.
I'm going to supply ~~three~~ two feeds for each section: RSS .91 headlines and Atom headlines~~, and Atom articles~~. Other feeds will continue to be generated but I'll remove them from the <link>s in the HEAD as well as from the nav.
Would be nice if the feeds were gzip'd as well but I suspect most feedreaders don't support gzip or deflate as a transfer encoding
I like the general layout I've been using (left hand content, narrow right hand nav/meta column). One problem I've had is that, although I'd like to use relative sizes and widths, the different CSS engines are not at all consistent in how they treat relative widths for side by side content, so I'm going to set hard widths and sizes, but using points and picas, not pixels as the units
In the Articles section, the title of the article should be prominent, not the title of the site. I mean, I'm not a brand, the site title should be repeated somewhere but not as an h1/banner
If possible, switch from the gorp of intertwined PHP and HTML to a page-as-PHP-object model with the content being passed in.

I want to try something with comments...having them automatically close 7 days after posting unless a trackback comes in, then reopening them for seven days.

Development

There's a mockup now online at <URI:http://gothic-egg.net/~epc/test2/>. Put any feedback here....

I added:

php_flag zlib.output_compression On
php_value zlib.output_compression_level 9

to the .htaccess for the site to automatically gzip all PHP generated content (assuming the client supports it). Pair does not support mod_gzip so the non-PHP items are still uncompressed.

epcostello.net site redesign