The SPF Pure HTML & CSS Competition

[DaveMaxwell]

You contradict yourself, or have at least got yourself in a muddle. You say IE is a part of the real world and as such must be accommodated. On that I couldn't agree more with you. However, in contrast to this, you then say that an HTML5Shiv is not allowed, despite this being the way that you accommodate IE outside the realms of this competition. HTML5 is part of the real, every day working world, why would you not want to accommodate that?

I don't think I'm contradicting myself at all. The challenge simply states, no javascript. HTML5Shiv requires javascript to work, so it can't be used. Period. It's part of the rules.

What I'm talking about it graceful degradation. Taking restrictions like this and creating a working, functional page in all browsers takes skill and creativity. Does it have to look exactly the same? No - but it does have to function.

Also, please don't compare this to the 1k challenges, those encourage creative freedom whereas this only serves to restrict it and implies that not using standard technologies such as HTML5 and Javascript is the right thing to do.

I simply meant that the 1k challenges forces you to be creative and original. You can't be lazy and use jquery or yui. It's all on you. That's all I meant.

It's your competition, granted, but it only serves to promote backward values and you don't seem to have your facts straight either.

See, I disagree here. What this is promoting is to see how far you can push yourself and the browsers by using the basics, and not using all the little easy tips and hacks that are out there.

It's amazing how many sites don't work in mobile browsers, or on connections without javascript (which I have had to turn off due to OS restrictions and/or slow connections). To me, that's lazy - creating something that's functional for everyone is the sign of a true artist.

[Stormrider]

You say IE is a part of the real world and as such must be accommodated. On that I couldn't agree more with you. However, in contrast to this, you then say that an HTML5Shiv is not allowed, despite this being the way that you accommodate IE outside the realms of this competition. HTML5 is part of the real, every day working world, why would you not want to accommodate that?

Because it isn't fully supported by every major browser in use, and that is an important aspect of the competition.

If you really want to link it to the real world, then imagine this. We have had clients before who have specifically requested that we don't use Flash (2 clients in the past 3 months in fact, so not that uncommon), so while it hasn't happened yet, it isn't beyond the realms of possibility that a client would request that you don't use any JavaScript. Imagine a site that has to be as accessible as possible by many people who use screen readers, mobile devices etc, which can't use JavaScript. Now this is also the type of site which will need to be open to as many different browsers as possible, including IE6.

There you have a real world situation which matches the rules of this contest. It's about balance - sure, you can use HTML 5 to enhance the semantics of the site if you like, but with the downside that it isn't properly supported by some browsers. It's a trade-off, and trade-offs are most DEFINITELY something that happens in the professional world of web development!

So its entirely up to you whether you want to take the risk and gain points for semantic code but lose them for compatibility, or play it safe and ensure maximum compatibility while losing some semantics. It's up to you, that's what makes a competition like this fun and interesting!

[Code Junkie]

Because it isn't fully supported by every major browser in use, and that is an important aspect of the competition.

If you really want to link it to the real world, then imagine this. We have had clients before who have specifically requested that we don't use Flash (2 clients in the past 3 months in fact, so not that uncommon), so while it hasn't happened yet, it isn't beyond the realms of possibility that a client would request that you don't use any JavaScript. Imagine a site that has to be as accessible as possible by many people who use screen readers, mobile devices etc, which can't use JavaScript. Now this is also the type of site which will need to be open to as many different browsers as possible, including IE6.

There you have a real world situation which matches the rules of this contest. It's about balance - sure, you can use HTML 5 to enhance the semantics of the site if you like, but with the downside that it isn't properly supported by some browsers. It's a trade-off, and trade-offs are most DEFINITELY something that happens in the professional world of web development!

So its entirely up to you whether you want to take the risk and gain points for semantic code but lose them for compatibility, or play it safe and ensure maximum compatibility while losing some semantics. It's up to you, that's what makes a competition like this fun and interesting!

This is what I was thinking about too. It's really not that hard to imagine that you might have a stubborn client who insists that you make their site work in IE6 and without JavaScript enabled. What if your client himself uses IE6 and his nephew turned JavaScript off because he kept getting viruses from shady websites, and your client isn't computer literate enough to know that 99.5% of people out in the world won't see his website broken the way he does? What if he gets upset and irritated every time you try to explain it to him and starts thinking of going elsewhere? What if your site you're making for him actually does cater to an audience where more than 20% of site users are just like your client? Would you fight him this much over his request or just work in older technologies?

Being flexible about the tools is a huge part of both good accessibility and good client management. I don't know why people are bucking the rules so violently and not just trying to show that they can do a good job within the restrictions.

[YuriKolovsky]

Being flexible about the tools is a huge part of both good accessibility and good client management. I don't know why people are bucking the rules so violently and not just trying to show that they can do a good job within the restrictions.

The only reason I might be mentioning the rules, is because I'm not all that clear if I'll be penalized and degraded for something that is not dis-allowed by the first 2 posts of rules, and there are a lot of things that those rules don't mention.

Can we have a small revamp and clarification of the first 2 posts of rules?
Mentioning exactly what the judges will consider good, and what they will consider bad, especially with designs that have lots to do with text, typography, css-imagery and interactivity (css interactivity).

[Code Junkie]

I think it's a good idea to become more clear on the rules. I've posted a few times too asking for clarification. It just felt to me like some posters were being kind of antagonistic and trying to get the rules changed.

[TomB]

I have to question the consistency here.

IE is forced because it's "part of the real world". Fair enough.


Yet we can't use HTML5 shiv and CSS3 PIE (or similar alteranatives...). These are part of the real world too. Oh and I *did* make my own

Hacking in javascript via HTC files should be disallowed but using existing tools which make IE play nicer is part of the game isnt it? Just seems really inconsistent to me. Either don't bother judging in IE or allow us to use well-known, existing IE hacks.

[Stormrider]

I have to question the consistency here.

IE is forced because it's "part of the real world". Fair enough.


Yet we can't use HTML5 shiv and CSS3 PIE (or similar alteranatives...). These are part of the real world too. Oh and I *did* make my own

Hacking in javascript via HTC files should be disallowed but using existing tools which make IE play nicer is part of the game isnt it? Just seems really inconsistent to me. Either don't bother judging in IE or allow us to use well-known, existing IE hacks.

Noone setting the competition ever said anything about the competition emulating the real world in the first place, why does it have to? There are rules, and there are judging criteria, and that's as simple as it gets. If you don't want to enter because you don't feel you can make a usable website in IE without using JavaScript, you don't have to enter. The competition is here for people who want to see what they can do within the constraints.

[Ijj]

Noone setting the competition ever said anything about the competition emulating the real world in the first place, why does it have to?

So if the contest isn't based on real world usage, what's the point of testing the page in IE? or better yet, what's the argument in favor of it?

[TomB]

We're sorry you feel this way, but you have to remember this is a challenge, and no matter how you look at it, IE is a part of the real world, and as such MUST be accomodated for.

I was referring to this.... IE is part of the real world, so are IE hacks.

[zcorpan]

The point is clearly to make it harder and see if people come up with interesting solutions to make stuff work in IE without JS. Maybe someone comes up with a brilliant idea that is better than the current state of the art workarounds.

[Stormrider]

So if the contest isn't based on real world usage, what's the point of testing the page in IE? or better yet, what's the argument in favor of it?

Because it is a COMPETITION and it has CONDITIONS to make it FUN & ENGAGING.

I don't know how to make it any more clear :P

[Ijj]

Because it is a COMPETITION and it has CONDITIONS to make it FUN & ENGAGING.

I don't know how to make it any more clear :P

Right, but what are these conditions based on? What is the logic you used to determine IE was a good constraint? All it could ever do is undermine the purpose of the other constraints. Limiting someone to only using CSS is a brilliant idea and could lead to some very innovative and clever design techniques, but adding IE as a condition on top of that would only detract from the potential quality that would come about from this.

[ScallioXTX]

Right, but what are these conditions based on? What is the logic you used to determine IE was a good constraint?

The reason it's in the competition is to see how well people can handle graceful degradation. That's all there is to it.

[Stormrider]

The reason it's in the competition is to see how well people can handle graceful degradation. That's all there is to it.

Exactly, this isn't a 'who can demo the best CSS trick' competition, it involves several different components and tests your ability to balance these to create the best possible result given a set of constraints.

[YuriKolovsky]

So if the contest isn't based on real world usage, what's the point of testing the page in IE? or better yet, what's the argument in favor of it?

As far as I can tell, IE6 is there simply to make things harder
(and force you to find alternatives that you are not used to)

this isn't a 'who can demo the best CSS trick' competition

Awwww.
This probably explains all my confusion with this, I was sure it was "who can demo the best CSS trick to make it look the prettiest without js or images".
So it's the "boring but pretty" CSS, down to real world, pesky client type of competition.
Somewhat like Zen Garden but with other limitations? Or are there bonuses for CSS trickery?

[Paul O'B]

This probably explains all my confusion with this, I was sure it was "who can demo the best CSS trick to make it look the prettiest without js or images".

I believe that was the original intent. IE6 was thrown in there to put the cat among the pigeons and it has certainly done that.

I think what you should aim for is something brilliant in a browser of your choice (from the list in the first post e.g. safari if animations are involved), that should then look reasonably good in the other browsers like Firefox and IE8. For IE6 it should just be usable and have some reasonable styling (i.e. not just plain text).

[exis7]

What I'm talking about it graceful degradation. Taking restrictions like this and creating a working, functional page in all browsers takes skill and creativity. Does it have to look exactly the same? No - but it does have to function.

I agree, graceful degradation is necessary. But that doesn't rule out javascript! In fact, if you build javascript functionality into your website then you should consider how it will work with javascript turned off.

There's nothing wrong with using an HTML5 shiv and then having it degrade fairly well if JS is turned off.

It's amazing how many sites don't work in mobile browsers, or on connections without javascript (which I have had to turn off due to OS restrictions and/or slow connections). To me, that's lazy - creating something that's functional for everyone is the sign of a true artist.

If a website doesn't work in a mobile browser it's been built badly and not tested properly. There should be a mobile-targeted site if mobile access is important to that company, and it should function properly on handheld devices. What 'OS restrictions or slow connections' are you talking about that limit JS? I call bullsh*t.

If you really want to link it to the real world, then imagine this. We have had clients before who have specifically requested that we don't use Flash (2 clients in the past 3 months in fact, so not that uncommon), so while it hasn't happened yet, it isn't beyond the realms of possibility that a client would request that you don't use any JavaScript. Imagine a site that has to be as accessible as possible by many people who use screen readers, mobile devices etc, which can't use JavaScript. Now this is also the type of site which will need to be open to as many different browsers as possible, including IE6.

There are good reasons why a client wouldn't want to use Flash - it's slow, bloated, crashes browsers and can't be viewed on Apple devices. Javascript on the other hand is fast, can degrade well, is supported by all major browsers and devices and has been for years on end.

I don't know any client who would want to lose the functionality of all javascript offers to suit the tiny minority of users who wouldn't have it turned on. Because it degrades well (if you know what you're doing) there is no reason to ever declare that you wouldn't want JS to feature on your site.

If your markup is semantic and well structured, and your javascript is unobtrusive and well-planned, there's no reason whatsoever that someone using a screenreader or other device could not access your content easily.

And if you aren't telling your client that, and actually believe that there is a valid time to ever not use JS on your site, then you need to man up and give your professional opinion to that client. That is what they pay you for.

It's really not that hard to imagine that you might have a stubborn client who insists that you make their site work in IE6 and without JavaScript enabled. What if he gets upset and irritated every time you try to explain it to him and starts thinking of going elsewhere?

Personally, I think that if you can't convince your client of the benefits, you're not worth your money.

[Stormrider]

It doesn't matter anyway. Noone has claimed that this competition is trying to emulate any real world situation, its just a competition.

[DaveMaxwell]

There's nothing wrong with using an HTML5 shiv and then having it degrade fairly well if JS is turned off.

Ah yes, but claiming "it won't work at all" in IE lends me to believe that it's not going to degrade gracefully at all. Perhaps not you, but that's the impression it leads to.

What 'OS restrictions or slow connections' are you talking about that limit JS? I call bullsh*t.

I'm talking about people that have less than 14.4 kb/sec connectivity (and yes I know a few - they live less than five miles from me) who turn all javascript off so they don't have to wait for those "bells and whistles".

And as for the OS limitations? You've never worked for a government agency have you? Especially the US Dept of Defense - not only did they not allow javascript, people had multiple machines because they didn't want internal and external networks to intermix. They even had a term for it (Sneakernet), for the method they used to get information from one network to the other - they hand carried it by disk (with a separate machine connected purely for virus scanning...).

Personally, I'm not sure what all the fuss of this is about - it's supposed to be a fun challenge, but it should be challenging. Yes, you may be handcuffed more than you normally would - but that lets you look for new and exciting ways to get around problems. You might find a way that's better than the "best practices".

[xhtmlcoder]

I surf 99% of the time without JavaScript. Since it should be completely unnecessary to need JavaScript for a website to actually function. Like Dave said because I have a dire connection (similar to those speeds mentioned #94) and pay for bandwidth; it's another one of the reasons I disable JavaScript.

I do not understand why there is all this fuss that can kicked-up about a simple competition rule; that accepts HTML and CSS WITHOUT relying upon JavaScript. If you are one of those people that thinks your page will disintegrate in dinosaur called IE6 then fair enough...

But we are NOT just judging CSS or browser compatibly and it's highly unlikely IE6 will be one of [my] major concerns; obviously depending upon what the competitors actually create and send me. Semantic Markup is as important as the CSS aspect.

Polite notice: anybody who quotes this post for the sake of 'personal attack' or banal bickering about its 'not fair', etc. Will really impress me with their childish attitude and I am judging. I didn't make the rules but I will enforce them when scoring.

[LePhuronn]

Frankly, this is all getting a wee bit silly now.

If you can't gracefully degrade your design and coding when required then you have no right to call yourself a web developer. Any script kiddie can bolt in JQuery, HTML5 Shiv or whatever browser hack and produce funky, amazing sites and not have to worry about deficiencies in all (especially) older browsers. If you want to use HTML5 Shiv to enable HTML 5 rendering in IE6 then I'm gonna use JS to enable rounded borders in IE8, because if you're gonna moan that you can't design the way you want, then so shall I.

A harsh standpoint I know, but it's one I firmly believe in.

So enjoy the competition for what it is, and if you don't like hte rules or the constraints it places on you then don't contribute and feel free to come back when a "anything goes - knock us dead" competition comes along.

[RyanReese]

Bottom line-if you don't like the contest rules, don't bother arguing over it, it's not going to be changed

Just had to say that, I wasn't even the arguee here and I was getting annoyed

[RyanReese]

Will text indentation/how the file is structured matter? Need to know the level of ...nitpicky that you judges will have .

[junjun]

Bottom line-if you don't like the contest rules, don't bother arguing over it, it's not going to be changed

Just had to say that, I wasn't even the arguee here and I was getting annoyed

I completely agree.

If this competition is not up your alley, please don't feel forced to participate.
This is supposed to be fun and interesting!

Arguing over what is 'the real world' or not does not belong in here.

My guess is that the next competition might not include IE6. But it's just a guess and it really doesn't matter that much.

Personally I'm looking forward to some great creative solutions to the challenge!

.

[xhtmlcoder]

Ryan, are you referring to example 2 and those 'truly amazing' source code comments in both the XHTML and CSS? Plus source code indentation in general; if so think both I, and the other judges will have to view the source code. In contrast, if it looks sloppy and lacks clear comments - well I'll let you decide, which is the better path... ;-)

Imagine that you are trying 'impress' me for a coding job interview if you want.