So yeah, Dan still is designing things, he just hasn't uploaded in a while.
So, here it is, the king of all killer designs - the idea has been in my head for a long time, but it finally came out the way I wanted it two nights ago. Last night was spent finalizing the layout and writing the jQuery to paginate single-page content. There is little content in it as of now, but this one is just too good to leave sit empty. Also, the swooshy above the church is only on the front page - the internal pages will each have their own overlain enhancement to keep the pages fresh.
So, without further ado, I present: Monumental
Put your browser in full-screen mode, and it'll look like an interactive desktop background. The image just keeps on going, extending all the way to 1600px wide, and it fades out into black for a smooth transition if your browser happens to be even bigger. The body area is anchored to the bottom, with full length bars across the horizontal edges for the links, but it all flows smoothly and naturally within the viewing area, with never a scroll bar in sight.
And guess what - it's a live site! For once, I'm uploading the finished version first, mainly because there was no real "mock up". The background is just a well-framed photograph, and the HTML elements are placed in complimentary places.
You can check it out here: TechnoloGrafik.com
Basically, this site gives the big middle finger to IE6 - it uses PNG transparency for the overlay effects, and it relies upon a box-model technique that IE6 doesn't comprehend. I'm sick of supporting that antiquated ruin of a browser, and I'm not going to do so on my personal sites any longer.*
Viewing the working version requires any competent, modern graphical browser. Firefox works in all versions tested (back to 1.5), Safari works in 3.0 and up, Opera works in all versions tested (back to 9.23), and it even works in IE7! The one exception I must make is Konqueror - there seemed to be a PNG transparency cut-off in the screenshot I got, which makes the overlay in the bars cut between black and transparent - but other than that it works fine.
Screenshots courtesy of: BrowserShots.org
Photo Credit: pipo99
Graphical Header font: Fragmenta
Graphics created in The GIMP
Code written in Notepad++
, and based upon jQuery
Enjoy! Comments and criticism are always welcomed.
* Fun Fact:
Despite that whole "I hate IE" attitude I have, in a delicious bit of irony, the BrowserShots workstation that screencapped this image for me was running IE8 - AND IT FRIGGIN' WORKED! I'm quite impressed, given IE's track record.