Image Credits

I would like to thank Toke Nygaard from K10K for the pixel pattern used on the background. Also, kudos to the various photographers from the SXC for the photos in the collage. Your contributions are well appreciated.

Need a Designer?

If you're looking for a designer for your online project, I would be happy to work with you. You can find my other works on OWD and OSWD, and you can reach me at kmcannon [at] telus [dot] net.

“ The City…”

Well, theres one day left before the contest is over, so I figured I better start on my entry. Welcome to Mecca, my submission to the OWD 2006 City contest. A big thanks to all the sponsors for making stuff like this possible. And good luck to all of the other contestants, of course.

So this is Mecca. I figured everyone else will take the theme literally and simply use stock images of modern-day cities for their entries. I decided to do something a little different, focusing just as much on ancient cities that were more impressive in their time than Oslo, or Vancouver, or New York. They were the building blocks on which our societies are built, and even by modern standards are amazing works of art and architecture.

Anyways, thats probably enough philosophy and history for now. Mecca is designed with a city theme, but I wanted to create a template that you can use for any themed site, whether it be a blog or a business.


A huge part of this design is the usability and adherence to web standards. Mecca is composed of a backbone of light and rigid Xhtml Strict, coupled with a design layer of flexible Css. A print-style sheet is included for responsible printing.

Mecca has been tested in Interet Explorer and Firefox at all common screen resolutions. The Xhtml and Css are both valid, and the design adheres to section 508. Mecca will hold any amount of text and handle any text-size increases. I've also taken steps to ensure that Mecca works with images or Css turned off.

Styled Elements

I've taken the time to style some default elements, so that you wont have to. Following are examples of components already styled in the Css.

There are also a number of text styles you can use, to make things more important, or to emphasize certain words. Or you can go to other places with links.