How To Build A New Site Over An Old Site.

Kate and I are on a mission to rebuild a web site and neither of us claim any particular design and coding skills.

What we need are the right web site construction tools, some experience, a few objectives, and a little participation from Mac360 readers.

Our objective for the site is rather straightforward. Update, freshen, improve, and expand Mac360 and bring it from 2004 to 2009. For example, in 2004, a site that was 760 pixels wide was all the rage, very common.

These days new sites are about 980 pixels wide, probably because Mac screens keep getting wider. Another example is the use of Tables in a web page. Mac360 has plenty. Good sites these days use CSS for layout, pushing Tables back where they belong, collecting and holding tabular data. So, more CSS in the new site.

Along the way of our site re-design and upgrade, we want to collect and identify the best Mac tools to handle the upgrade process, and we’ve chosen a few already. CSSedit is our CSS utility of choice. If there’s a better Mac CSS editor then we don’t know where to find it.

We’ve also centered on Xscope to help us measure, align, inspect graphics and layouts. Few tools save time and money and become so indispensable as Xscope has become in just a few weeks of use.

For now, we’re sticking with Adobe’s newly acquired Fireworks instead of Photoshop, though I suspect we’ll use the latter from time to time. Fireworks doesn’t do .ico files for web site icons.

Another objective is to create a Mac360 which conforms wholly to web standards such as XHTML and CSS, and looks great in all browsers, including Internet Explorer for the Windows using crowd.

Even if you don’t know much about how to code a site using XHTML and CSS, validating code is easier these days with standards and toolsfrom W3C.

What about the code, the XHTML that makes up the web pages? Fortunately, by choosing to design with CSS, there just isn’t much XHTML to worry about, though we need an editor to mix XHTML with CSS elements for the site’s pages.

We’ve tried many Mac utilities and have some favorites, though we haven’t settled on a single tool. Yet. I like Panic’s Coda, which Kate describes with other tools here. I’ve used BBEdit, TextMate, and many other editors, but don’t have one I stick with day in and out.

So, I’ll be happy to take suggestions and alternatives. The requirements are simple. Live preview. Easy development and use of ‘snippets’ of text to enter into pages. As Kate pointed out, we plan to continue to use Expression Engine as the content management system. It requires PHP and MySQL, which I’ve been managing on sites for years.

Our approach has already begun. Kate designed her own web site recently, and I finished the code for it recently. It’s called PixoBebo. We’ll use that code and basic 3-column layout as the basis for expanding and improving Mac360, one pixel at a time, one line at a time.

As Kate adds content to PixoBebo, please don’t hesitate to review our work, code and content, and offer suggestions which we can use in the Mac360 upgrade.

We do not plan to alter the focus of Mac360, which is reviews and commentary. The site receives about 200,000 visitors a month, and most readers want reviews of Macs and Mac software. That will continue. So will the Forums and the Comments system, as both components are beneficial to readers.

What we plan to alter is the look and feel of the site, though not drastically. It may be difficult to make it much easier to navigate Mac360, but we can make the pages more spacious and easier to read.

Unfortunately, advertising is a necessary evil for web sites these days. We’ll keep the advertising to a minimum per page, and make sure the ads are appropriate for the content.

Along the way to building a new Mac360, you’re likely to see a few changes to the current site design and layout. Already we’re taking what we’ve learned about XHTML and CSS and applied it to the original Mac360, which our co-founder Tera Patricks built back in early 2004. Some of the code that’s there I simply do not know how to fix.

For the most part, Mac360 validates XHTML 1.0 and CSS 2.1. We’ve added a little more spacing here and there through use of Margins and Padding. Kate picked up a number of good suggestions from readers in her earlier article. We appreciate that.

So, bear with us for the next four to six months. We’ll be ‘under construction’ for awhile. Thanks for your continued visits, your patience, and your participation.