-=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- (c) WidthPadding Industries 1987 0|40|0 -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=-
SoCoder -> Blogs Home -> Blogs

 
Cower
Created : 09 September 2010
 
System : iOS

New Site Design (Janice)

Because female names sound a lot better than male names
As part of my series of site designs, that began with Sandra (which has not gone as well as I'd have liked), I'm working on a new design for my site that does away with all the bloggy crap. I have blogs all over the net, but I can only have one art portfolio, so Spifftastic is an art portfolio from implementation on.

You can view the test for Janice here: spifftastic.net/janice/galtec.html

If you use IE, first of all: fuck you and shame on you, this site will not render properly in your browser. Get a real browser, pansy. Second of all: this is what it looks like, you horrible person:



The goal is fairly simple: the art is the first thing you notice, and it must be the central part of the site. If the art isn't the first thing and the last thing on your mind, the design has failed its purpose and your families will die as a result. Note, I said your families, not mine, mine are cool. Sort of. I mean they're cool as in they're not going to die, not as in they're actually cool.

Anyhow, the site renders properly in Firefox 3.6 and up (although you require 4.0 and up to use CSS transitions), Chrome, Safari 4 and up, and Opera 10-ish (CSS transitions do actually work in Opera), and ideally they will work in any browser moving forward that supports the current CSS3 specs for transitions. There is absolutely no Javascript in use here - this is 100% static XHTML. It was originally HTML5, but Firefox has some issues handling things like <section> and such, so I abandoned that in favor of divs and spans (the latter of which are all rendered as blocks, but for the sake of correctness, I cannot wrap a <div> in an <a>, so <span> is used pretty heavily). There is one benefit given to Webkit browsers that Firefox, Opera, etc. don't have: it will use CSS animations. That said, the only animation is a drop-in animation for the content, so it's not that important.

 

Comments
Thursday, 09 September 2010, 13:09
CodersRule
 		My problem with it is that the images load too slowly when I hover. I assume that's because that's the transition padding time? I'm not using FF 4.0. (Couldn't find the download )

I think there needs to be something to keep it from transitioning if you don't have an uber-new browser. I'm okay if a site doesn't look good without CSS3, but this is fairly new stuff here.

Otherwise, the design looks great.
Thursday, 09 September 2010, 14:00
Cower
if you don't have an uber-new browser.
No. You want to have a nice time on the net, you update like everyone else.
Thursday, 09 September 2010, 16:37
CodersRule
 		I want to have a nice time on the net, I don't download browsers that are still in beta.
Friday, 10 September 2010, 03:23
Jayenkai
 		That's like saying "Eeeuw GMail Beta!?!"
Friday, 10 September 2010, 07:38
spinal
 		Shutting out IE users is a bad move, it is after all the most used browser.
That aside, is the title of each image supposed to be off the top of each one?
Friday, 10 September 2010, 11:57
Cower
Shutting out IE users is a bad move, it is after all the most used browser.
It is not the most-used browser among people who would visit my site. Just because Joe Retard uses IE to view facebook doesn't mean he'll ever view my site.