Stop Worrying & Get On With It (WDC Bristol 2009)

Post on 01-Nov-2014

2,319 views 0 download

description

 

transcript

What are we worried about

What are we worried about

Some users see lsquobrokenrsquo sites

What are we worried about

Some users see lsquobrokenrsquo sites

Donrsquot build broken sites basic support can be offered as long as it doesnrsquot look broken If itrsquos a real problem for older browsers use universalie6css a warning message or something similar

What are we worried about

Some users see lsquobrokenrsquo sites

Donrsquot build broken sites basic support can be offered as long as it doesnrsquot look broken If itrsquos a real problem for older browsers use universalie6css a warning message or something similar

But this visual treatment is integral to the brand

What are we worried about

Some users see lsquobrokenrsquo sites

Donrsquot build broken sites basic support can be offered as long as it doesnrsquot look broken If itrsquos a real problem for older browsers use universalie6css a warning message or something similar

But this visual treatment is integral to the brand

Then include it (if not donrsquot worry)

What are we worried about

Some users see lsquobrokenrsquo sites

Donrsquot build broken sites basic support can be offered as long as it doesnrsquot look broken If itrsquos a real problem for older browsers use universalie6css a warning message or something similar

But this visual treatment is integral to the brand

Then include it (if not donrsquot worry)

Missing rounded corners donrsquot matter

Take Your Design To The Next Level With CSS3 jmpsmashingcss3

Fearful forabeautifulwebcoms598

Great article thanks but I think to wait that the most of browsers support CSS3 totally to develop websites for my clients

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

I hope CSS3 will be a standard in the near future right now you cant really use anything of it rsquocause not every browser supports it

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

CSS 3 rocks Unfortunately we need to stay at least 5 more years with CSS 21 if we want to offer the same design to each user (what in most lsquocommercialrsquo projects is necessary)

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

I canrsquot wait to use CSS3 in a real project Unfortunately Irsquom going to be stuck with things as they are for the time being as I wait for my clients to catch up I expect this will be the case for most designers for the time being

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

CSS3 looks really good however because of IE it will be long time before I start using it

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

These arguments are complete and utter bullshit

If 98 of the users canrsquot see a text-shadow it doesnrsquot matter but itrsquoll be a nice enrichment for the 2 of users who can

Tap Tap Tap taptaptapcom

Tweet CC tweetcccom

Fusion Ads fusionadsnet

Fusion Ads fusionadsnet

Progressive means progressive

Progressive means progressive

Fall-back solutions (JS on and off)

Barclaycard online admin barclaycardcouk

Progressive means progressive

Fall-back solutions (JS on and off)

Enhancements only become features when the majority of users are experiencing them

Progressive means progressive

Fall-back solutions (JS on and off)

Enhancements only become features when the majority of users are experiencing them

Use progressive enrichment in your dull corporate sites mdash the sexy stuff is an add-on so itrsquos fine

Do websites need to look exactly the same in every browser

dowebsitesneedtolookexactlythesameineverybrowsercom

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

Jon Tan

Designers will use [technologies like Flash PDF and hacks like embedding type in images] [] because they wonrsquot have to deal with painful inconsistencies between user agents the bane of the browser wars and in this instance the bane of web typography in what seems like the age of the raster warsldquo rdquo

Display Type amp the Raster Wars jmpjontan

Jon Tan Web Typography tag jontangerinecomlogtagweb-typography

Bookmark these URLs

Web Typography (Richard Rutter) webtypographynet

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

So stop trying to reach the unreachable Embrace the differences

Usability vs aesthetics

Usability accessibility functionality= very important

Usability vs aesthetics

Usability accessibility functionality= very important

But donrsquot underestimate the importance of beauty

The experience

The experience

Beauty is the experiencersquos visual layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer(See Dan Mallrsquos FOWD presentation eventscarsonifiedcomfowd2008newyorkvideosdan-mall)

The experience layer

Our emotions change the way we think and serve as constant guides to appropriate behaviour steering us away from the bad and guiding us towards the good

Donald Norman Emotional Design

ldquo rdquo

Variety in web design

I can haz it

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

Whorsquos pushing things forward

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

What are we worried about

Some users see lsquobrokenrsquo sites

What are we worried about

Some users see lsquobrokenrsquo sites

Donrsquot build broken sites basic support can be offered as long as it doesnrsquot look broken If itrsquos a real problem for older browsers use universalie6css a warning message or something similar

What are we worried about

Some users see lsquobrokenrsquo sites

Donrsquot build broken sites basic support can be offered as long as it doesnrsquot look broken If itrsquos a real problem for older browsers use universalie6css a warning message or something similar

But this visual treatment is integral to the brand

What are we worried about

Some users see lsquobrokenrsquo sites

Donrsquot build broken sites basic support can be offered as long as it doesnrsquot look broken If itrsquos a real problem for older browsers use universalie6css a warning message or something similar

But this visual treatment is integral to the brand

Then include it (if not donrsquot worry)

What are we worried about

Some users see lsquobrokenrsquo sites

Donrsquot build broken sites basic support can be offered as long as it doesnrsquot look broken If itrsquos a real problem for older browsers use universalie6css a warning message or something similar

But this visual treatment is integral to the brand

Then include it (if not donrsquot worry)

Missing rounded corners donrsquot matter

Take Your Design To The Next Level With CSS3 jmpsmashingcss3

Fearful forabeautifulwebcoms598

Great article thanks but I think to wait that the most of browsers support CSS3 totally to develop websites for my clients

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

I hope CSS3 will be a standard in the near future right now you cant really use anything of it rsquocause not every browser supports it

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

CSS 3 rocks Unfortunately we need to stay at least 5 more years with CSS 21 if we want to offer the same design to each user (what in most lsquocommercialrsquo projects is necessary)

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

I canrsquot wait to use CSS3 in a real project Unfortunately Irsquom going to be stuck with things as they are for the time being as I wait for my clients to catch up I expect this will be the case for most designers for the time being

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

CSS3 looks really good however because of IE it will be long time before I start using it

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

These arguments are complete and utter bullshit

If 98 of the users canrsquot see a text-shadow it doesnrsquot matter but itrsquoll be a nice enrichment for the 2 of users who can

Tap Tap Tap taptaptapcom

Tweet CC tweetcccom

Fusion Ads fusionadsnet

Fusion Ads fusionadsnet

Progressive means progressive

Progressive means progressive

Fall-back solutions (JS on and off)

Barclaycard online admin barclaycardcouk

Progressive means progressive

Fall-back solutions (JS on and off)

Enhancements only become features when the majority of users are experiencing them

Progressive means progressive

Fall-back solutions (JS on and off)

Enhancements only become features when the majority of users are experiencing them

Use progressive enrichment in your dull corporate sites mdash the sexy stuff is an add-on so itrsquos fine

Do websites need to look exactly the same in every browser

dowebsitesneedtolookexactlythesameineverybrowsercom

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

Jon Tan

Designers will use [technologies like Flash PDF and hacks like embedding type in images] [] because they wonrsquot have to deal with painful inconsistencies between user agents the bane of the browser wars and in this instance the bane of web typography in what seems like the age of the raster warsldquo rdquo

Display Type amp the Raster Wars jmpjontan

Jon Tan Web Typography tag jontangerinecomlogtagweb-typography

Bookmark these URLs

Web Typography (Richard Rutter) webtypographynet

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

So stop trying to reach the unreachable Embrace the differences

Usability vs aesthetics

Usability accessibility functionality= very important

Usability vs aesthetics

Usability accessibility functionality= very important

But donrsquot underestimate the importance of beauty

The experience

The experience

Beauty is the experiencersquos visual layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer(See Dan Mallrsquos FOWD presentation eventscarsonifiedcomfowd2008newyorkvideosdan-mall)

The experience layer

Our emotions change the way we think and serve as constant guides to appropriate behaviour steering us away from the bad and guiding us towards the good

Donald Norman Emotional Design

ldquo rdquo

Variety in web design

I can haz it

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

Whorsquos pushing things forward

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

What are we worried about

Some users see lsquobrokenrsquo sites

Donrsquot build broken sites basic support can be offered as long as it doesnrsquot look broken If itrsquos a real problem for older browsers use universalie6css a warning message or something similar

What are we worried about

Some users see lsquobrokenrsquo sites

Donrsquot build broken sites basic support can be offered as long as it doesnrsquot look broken If itrsquos a real problem for older browsers use universalie6css a warning message or something similar

But this visual treatment is integral to the brand

What are we worried about

Some users see lsquobrokenrsquo sites

Donrsquot build broken sites basic support can be offered as long as it doesnrsquot look broken If itrsquos a real problem for older browsers use universalie6css a warning message or something similar

But this visual treatment is integral to the brand

Then include it (if not donrsquot worry)

What are we worried about

Some users see lsquobrokenrsquo sites

Donrsquot build broken sites basic support can be offered as long as it doesnrsquot look broken If itrsquos a real problem for older browsers use universalie6css a warning message or something similar

But this visual treatment is integral to the brand

Then include it (if not donrsquot worry)

Missing rounded corners donrsquot matter

Take Your Design To The Next Level With CSS3 jmpsmashingcss3

Fearful forabeautifulwebcoms598

Great article thanks but I think to wait that the most of browsers support CSS3 totally to develop websites for my clients

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

I hope CSS3 will be a standard in the near future right now you cant really use anything of it rsquocause not every browser supports it

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

CSS 3 rocks Unfortunately we need to stay at least 5 more years with CSS 21 if we want to offer the same design to each user (what in most lsquocommercialrsquo projects is necessary)

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

I canrsquot wait to use CSS3 in a real project Unfortunately Irsquom going to be stuck with things as they are for the time being as I wait for my clients to catch up I expect this will be the case for most designers for the time being

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

CSS3 looks really good however because of IE it will be long time before I start using it

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

These arguments are complete and utter bullshit

If 98 of the users canrsquot see a text-shadow it doesnrsquot matter but itrsquoll be a nice enrichment for the 2 of users who can

Tap Tap Tap taptaptapcom

Tweet CC tweetcccom

Fusion Ads fusionadsnet

Fusion Ads fusionadsnet

Progressive means progressive

Progressive means progressive

Fall-back solutions (JS on and off)

Barclaycard online admin barclaycardcouk

Progressive means progressive

Fall-back solutions (JS on and off)

Enhancements only become features when the majority of users are experiencing them

Progressive means progressive

Fall-back solutions (JS on and off)

Enhancements only become features when the majority of users are experiencing them

Use progressive enrichment in your dull corporate sites mdash the sexy stuff is an add-on so itrsquos fine

Do websites need to look exactly the same in every browser

dowebsitesneedtolookexactlythesameineverybrowsercom

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

Jon Tan

Designers will use [technologies like Flash PDF and hacks like embedding type in images] [] because they wonrsquot have to deal with painful inconsistencies between user agents the bane of the browser wars and in this instance the bane of web typography in what seems like the age of the raster warsldquo rdquo

Display Type amp the Raster Wars jmpjontan

Jon Tan Web Typography tag jontangerinecomlogtagweb-typography

Bookmark these URLs

Web Typography (Richard Rutter) webtypographynet

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

So stop trying to reach the unreachable Embrace the differences

Usability vs aesthetics

Usability accessibility functionality= very important

Usability vs aesthetics

Usability accessibility functionality= very important

But donrsquot underestimate the importance of beauty

The experience

The experience

Beauty is the experiencersquos visual layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer(See Dan Mallrsquos FOWD presentation eventscarsonifiedcomfowd2008newyorkvideosdan-mall)

The experience layer

Our emotions change the way we think and serve as constant guides to appropriate behaviour steering us away from the bad and guiding us towards the good

Donald Norman Emotional Design

ldquo rdquo

Variety in web design

I can haz it

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

Whorsquos pushing things forward

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

What are we worried about

Some users see lsquobrokenrsquo sites

Donrsquot build broken sites basic support can be offered as long as it doesnrsquot look broken If itrsquos a real problem for older browsers use universalie6css a warning message or something similar

But this visual treatment is integral to the brand

What are we worried about

Some users see lsquobrokenrsquo sites

Donrsquot build broken sites basic support can be offered as long as it doesnrsquot look broken If itrsquos a real problem for older browsers use universalie6css a warning message or something similar

But this visual treatment is integral to the brand

Then include it (if not donrsquot worry)

What are we worried about

Some users see lsquobrokenrsquo sites

Donrsquot build broken sites basic support can be offered as long as it doesnrsquot look broken If itrsquos a real problem for older browsers use universalie6css a warning message or something similar

But this visual treatment is integral to the brand

Then include it (if not donrsquot worry)

Missing rounded corners donrsquot matter

Take Your Design To The Next Level With CSS3 jmpsmashingcss3

Fearful forabeautifulwebcoms598

Great article thanks but I think to wait that the most of browsers support CSS3 totally to develop websites for my clients

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

I hope CSS3 will be a standard in the near future right now you cant really use anything of it rsquocause not every browser supports it

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

CSS 3 rocks Unfortunately we need to stay at least 5 more years with CSS 21 if we want to offer the same design to each user (what in most lsquocommercialrsquo projects is necessary)

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

I canrsquot wait to use CSS3 in a real project Unfortunately Irsquom going to be stuck with things as they are for the time being as I wait for my clients to catch up I expect this will be the case for most designers for the time being

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

CSS3 looks really good however because of IE it will be long time before I start using it

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

These arguments are complete and utter bullshit

If 98 of the users canrsquot see a text-shadow it doesnrsquot matter but itrsquoll be a nice enrichment for the 2 of users who can

Tap Tap Tap taptaptapcom

Tweet CC tweetcccom

Fusion Ads fusionadsnet

Fusion Ads fusionadsnet

Progressive means progressive

Progressive means progressive

Fall-back solutions (JS on and off)

Barclaycard online admin barclaycardcouk

Progressive means progressive

Fall-back solutions (JS on and off)

Enhancements only become features when the majority of users are experiencing them

Progressive means progressive

Fall-back solutions (JS on and off)

Enhancements only become features when the majority of users are experiencing them

Use progressive enrichment in your dull corporate sites mdash the sexy stuff is an add-on so itrsquos fine

Do websites need to look exactly the same in every browser

dowebsitesneedtolookexactlythesameineverybrowsercom

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

Jon Tan

Designers will use [technologies like Flash PDF and hacks like embedding type in images] [] because they wonrsquot have to deal with painful inconsistencies between user agents the bane of the browser wars and in this instance the bane of web typography in what seems like the age of the raster warsldquo rdquo

Display Type amp the Raster Wars jmpjontan

Jon Tan Web Typography tag jontangerinecomlogtagweb-typography

Bookmark these URLs

Web Typography (Richard Rutter) webtypographynet

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

So stop trying to reach the unreachable Embrace the differences

Usability vs aesthetics

Usability accessibility functionality= very important

Usability vs aesthetics

Usability accessibility functionality= very important

But donrsquot underestimate the importance of beauty

The experience

The experience

Beauty is the experiencersquos visual layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer(See Dan Mallrsquos FOWD presentation eventscarsonifiedcomfowd2008newyorkvideosdan-mall)

The experience layer

Our emotions change the way we think and serve as constant guides to appropriate behaviour steering us away from the bad and guiding us towards the good

Donald Norman Emotional Design

ldquo rdquo

Variety in web design

I can haz it

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

Whorsquos pushing things forward

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

What are we worried about

Some users see lsquobrokenrsquo sites

Donrsquot build broken sites basic support can be offered as long as it doesnrsquot look broken If itrsquos a real problem for older browsers use universalie6css a warning message or something similar

But this visual treatment is integral to the brand

Then include it (if not donrsquot worry)

What are we worried about

Some users see lsquobrokenrsquo sites

Donrsquot build broken sites basic support can be offered as long as it doesnrsquot look broken If itrsquos a real problem for older browsers use universalie6css a warning message or something similar

But this visual treatment is integral to the brand

Then include it (if not donrsquot worry)

Missing rounded corners donrsquot matter

Take Your Design To The Next Level With CSS3 jmpsmashingcss3

Fearful forabeautifulwebcoms598

Great article thanks but I think to wait that the most of browsers support CSS3 totally to develop websites for my clients

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

I hope CSS3 will be a standard in the near future right now you cant really use anything of it rsquocause not every browser supports it

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

CSS 3 rocks Unfortunately we need to stay at least 5 more years with CSS 21 if we want to offer the same design to each user (what in most lsquocommercialrsquo projects is necessary)

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

I canrsquot wait to use CSS3 in a real project Unfortunately Irsquom going to be stuck with things as they are for the time being as I wait for my clients to catch up I expect this will be the case for most designers for the time being

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

CSS3 looks really good however because of IE it will be long time before I start using it

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

These arguments are complete and utter bullshit

If 98 of the users canrsquot see a text-shadow it doesnrsquot matter but itrsquoll be a nice enrichment for the 2 of users who can

Tap Tap Tap taptaptapcom

Tweet CC tweetcccom

Fusion Ads fusionadsnet

Fusion Ads fusionadsnet

Progressive means progressive

Progressive means progressive

Fall-back solutions (JS on and off)

Barclaycard online admin barclaycardcouk

Progressive means progressive

Fall-back solutions (JS on and off)

Enhancements only become features when the majority of users are experiencing them

Progressive means progressive

Fall-back solutions (JS on and off)

Enhancements only become features when the majority of users are experiencing them

Use progressive enrichment in your dull corporate sites mdash the sexy stuff is an add-on so itrsquos fine

Do websites need to look exactly the same in every browser

dowebsitesneedtolookexactlythesameineverybrowsercom

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

Jon Tan

Designers will use [technologies like Flash PDF and hacks like embedding type in images] [] because they wonrsquot have to deal with painful inconsistencies between user agents the bane of the browser wars and in this instance the bane of web typography in what seems like the age of the raster warsldquo rdquo

Display Type amp the Raster Wars jmpjontan

Jon Tan Web Typography tag jontangerinecomlogtagweb-typography

Bookmark these URLs

Web Typography (Richard Rutter) webtypographynet

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

So stop trying to reach the unreachable Embrace the differences

Usability vs aesthetics

Usability accessibility functionality= very important

Usability vs aesthetics

Usability accessibility functionality= very important

But donrsquot underestimate the importance of beauty

The experience

The experience

Beauty is the experiencersquos visual layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer(See Dan Mallrsquos FOWD presentation eventscarsonifiedcomfowd2008newyorkvideosdan-mall)

The experience layer

Our emotions change the way we think and serve as constant guides to appropriate behaviour steering us away from the bad and guiding us towards the good

Donald Norman Emotional Design

ldquo rdquo

Variety in web design

I can haz it

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

Whorsquos pushing things forward

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

What are we worried about

Some users see lsquobrokenrsquo sites

Donrsquot build broken sites basic support can be offered as long as it doesnrsquot look broken If itrsquos a real problem for older browsers use universalie6css a warning message or something similar

But this visual treatment is integral to the brand

Then include it (if not donrsquot worry)

Missing rounded corners donrsquot matter

Take Your Design To The Next Level With CSS3 jmpsmashingcss3

Fearful forabeautifulwebcoms598

Great article thanks but I think to wait that the most of browsers support CSS3 totally to develop websites for my clients

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

I hope CSS3 will be a standard in the near future right now you cant really use anything of it rsquocause not every browser supports it

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

CSS 3 rocks Unfortunately we need to stay at least 5 more years with CSS 21 if we want to offer the same design to each user (what in most lsquocommercialrsquo projects is necessary)

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

I canrsquot wait to use CSS3 in a real project Unfortunately Irsquom going to be stuck with things as they are for the time being as I wait for my clients to catch up I expect this will be the case for most designers for the time being

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

CSS3 looks really good however because of IE it will be long time before I start using it

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

These arguments are complete and utter bullshit

If 98 of the users canrsquot see a text-shadow it doesnrsquot matter but itrsquoll be a nice enrichment for the 2 of users who can

Tap Tap Tap taptaptapcom

Tweet CC tweetcccom

Fusion Ads fusionadsnet

Fusion Ads fusionadsnet

Progressive means progressive

Progressive means progressive

Fall-back solutions (JS on and off)

Barclaycard online admin barclaycardcouk

Progressive means progressive

Fall-back solutions (JS on and off)

Enhancements only become features when the majority of users are experiencing them

Progressive means progressive

Fall-back solutions (JS on and off)

Enhancements only become features when the majority of users are experiencing them

Use progressive enrichment in your dull corporate sites mdash the sexy stuff is an add-on so itrsquos fine

Do websites need to look exactly the same in every browser

dowebsitesneedtolookexactlythesameineverybrowsercom

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

Jon Tan

Designers will use [technologies like Flash PDF and hacks like embedding type in images] [] because they wonrsquot have to deal with painful inconsistencies between user agents the bane of the browser wars and in this instance the bane of web typography in what seems like the age of the raster warsldquo rdquo

Display Type amp the Raster Wars jmpjontan

Jon Tan Web Typography tag jontangerinecomlogtagweb-typography

Bookmark these URLs

Web Typography (Richard Rutter) webtypographynet

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

So stop trying to reach the unreachable Embrace the differences

Usability vs aesthetics

Usability accessibility functionality= very important

Usability vs aesthetics

Usability accessibility functionality= very important

But donrsquot underestimate the importance of beauty

The experience

The experience

Beauty is the experiencersquos visual layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer(See Dan Mallrsquos FOWD presentation eventscarsonifiedcomfowd2008newyorkvideosdan-mall)

The experience layer

Our emotions change the way we think and serve as constant guides to appropriate behaviour steering us away from the bad and guiding us towards the good

Donald Norman Emotional Design

ldquo rdquo

Variety in web design

I can haz it

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

Whorsquos pushing things forward

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Take Your Design To The Next Level With CSS3 jmpsmashingcss3

Fearful forabeautifulwebcoms598

Great article thanks but I think to wait that the most of browsers support CSS3 totally to develop websites for my clients

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

I hope CSS3 will be a standard in the near future right now you cant really use anything of it rsquocause not every browser supports it

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

CSS 3 rocks Unfortunately we need to stay at least 5 more years with CSS 21 if we want to offer the same design to each user (what in most lsquocommercialrsquo projects is necessary)

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

I canrsquot wait to use CSS3 in a real project Unfortunately Irsquom going to be stuck with things as they are for the time being as I wait for my clients to catch up I expect this will be the case for most designers for the time being

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

CSS3 looks really good however because of IE it will be long time before I start using it

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

These arguments are complete and utter bullshit

If 98 of the users canrsquot see a text-shadow it doesnrsquot matter but itrsquoll be a nice enrichment for the 2 of users who can

Tap Tap Tap taptaptapcom

Tweet CC tweetcccom

Fusion Ads fusionadsnet

Fusion Ads fusionadsnet

Progressive means progressive

Progressive means progressive

Fall-back solutions (JS on and off)

Barclaycard online admin barclaycardcouk

Progressive means progressive

Fall-back solutions (JS on and off)

Enhancements only become features when the majority of users are experiencing them

Progressive means progressive

Fall-back solutions (JS on and off)

Enhancements only become features when the majority of users are experiencing them

Use progressive enrichment in your dull corporate sites mdash the sexy stuff is an add-on so itrsquos fine

Do websites need to look exactly the same in every browser

dowebsitesneedtolookexactlythesameineverybrowsercom

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

Jon Tan

Designers will use [technologies like Flash PDF and hacks like embedding type in images] [] because they wonrsquot have to deal with painful inconsistencies between user agents the bane of the browser wars and in this instance the bane of web typography in what seems like the age of the raster warsldquo rdquo

Display Type amp the Raster Wars jmpjontan

Jon Tan Web Typography tag jontangerinecomlogtagweb-typography

Bookmark these URLs

Web Typography (Richard Rutter) webtypographynet

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

So stop trying to reach the unreachable Embrace the differences

Usability vs aesthetics

Usability accessibility functionality= very important

Usability vs aesthetics

Usability accessibility functionality= very important

But donrsquot underestimate the importance of beauty

The experience

The experience

Beauty is the experiencersquos visual layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer(See Dan Mallrsquos FOWD presentation eventscarsonifiedcomfowd2008newyorkvideosdan-mall)

The experience layer

Our emotions change the way we think and serve as constant guides to appropriate behaviour steering us away from the bad and guiding us towards the good

Donald Norman Emotional Design

ldquo rdquo

Variety in web design

I can haz it

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

Whorsquos pushing things forward

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Fearful forabeautifulwebcoms598

Great article thanks but I think to wait that the most of browsers support CSS3 totally to develop websites for my clients

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

I hope CSS3 will be a standard in the near future right now you cant really use anything of it rsquocause not every browser supports it

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

CSS 3 rocks Unfortunately we need to stay at least 5 more years with CSS 21 if we want to offer the same design to each user (what in most lsquocommercialrsquo projects is necessary)

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

I canrsquot wait to use CSS3 in a real project Unfortunately Irsquom going to be stuck with things as they are for the time being as I wait for my clients to catch up I expect this will be the case for most designers for the time being

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

CSS3 looks really good however because of IE it will be long time before I start using it

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

These arguments are complete and utter bullshit

If 98 of the users canrsquot see a text-shadow it doesnrsquot matter but itrsquoll be a nice enrichment for the 2 of users who can

Tap Tap Tap taptaptapcom

Tweet CC tweetcccom

Fusion Ads fusionadsnet

Fusion Ads fusionadsnet

Progressive means progressive

Progressive means progressive

Fall-back solutions (JS on and off)

Barclaycard online admin barclaycardcouk

Progressive means progressive

Fall-back solutions (JS on and off)

Enhancements only become features when the majority of users are experiencing them

Progressive means progressive

Fall-back solutions (JS on and off)

Enhancements only become features when the majority of users are experiencing them

Use progressive enrichment in your dull corporate sites mdash the sexy stuff is an add-on so itrsquos fine

Do websites need to look exactly the same in every browser

dowebsitesneedtolookexactlythesameineverybrowsercom

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

Jon Tan

Designers will use [technologies like Flash PDF and hacks like embedding type in images] [] because they wonrsquot have to deal with painful inconsistencies between user agents the bane of the browser wars and in this instance the bane of web typography in what seems like the age of the raster warsldquo rdquo

Display Type amp the Raster Wars jmpjontan

Jon Tan Web Typography tag jontangerinecomlogtagweb-typography

Bookmark these URLs

Web Typography (Richard Rutter) webtypographynet

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

So stop trying to reach the unreachable Embrace the differences

Usability vs aesthetics

Usability accessibility functionality= very important

Usability vs aesthetics

Usability accessibility functionality= very important

But donrsquot underestimate the importance of beauty

The experience

The experience

Beauty is the experiencersquos visual layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer(See Dan Mallrsquos FOWD presentation eventscarsonifiedcomfowd2008newyorkvideosdan-mall)

The experience layer

Our emotions change the way we think and serve as constant guides to appropriate behaviour steering us away from the bad and guiding us towards the good

Donald Norman Emotional Design

ldquo rdquo

Variety in web design

I can haz it

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

Whorsquos pushing things forward

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Great article thanks but I think to wait that the most of browsers support CSS3 totally to develop websites for my clients

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

I hope CSS3 will be a standard in the near future right now you cant really use anything of it rsquocause not every browser supports it

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

CSS 3 rocks Unfortunately we need to stay at least 5 more years with CSS 21 if we want to offer the same design to each user (what in most lsquocommercialrsquo projects is necessary)

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

I canrsquot wait to use CSS3 in a real project Unfortunately Irsquom going to be stuck with things as they are for the time being as I wait for my clients to catch up I expect this will be the case for most designers for the time being

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

CSS3 looks really good however because of IE it will be long time before I start using it

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

These arguments are complete and utter bullshit

If 98 of the users canrsquot see a text-shadow it doesnrsquot matter but itrsquoll be a nice enrichment for the 2 of users who can

Tap Tap Tap taptaptapcom

Tweet CC tweetcccom

Fusion Ads fusionadsnet

Fusion Ads fusionadsnet

Progressive means progressive

Progressive means progressive

Fall-back solutions (JS on and off)

Barclaycard online admin barclaycardcouk

Progressive means progressive

Fall-back solutions (JS on and off)

Enhancements only become features when the majority of users are experiencing them

Progressive means progressive

Fall-back solutions (JS on and off)

Enhancements only become features when the majority of users are experiencing them

Use progressive enrichment in your dull corporate sites mdash the sexy stuff is an add-on so itrsquos fine

Do websites need to look exactly the same in every browser

dowebsitesneedtolookexactlythesameineverybrowsercom

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

Jon Tan

Designers will use [technologies like Flash PDF and hacks like embedding type in images] [] because they wonrsquot have to deal with painful inconsistencies between user agents the bane of the browser wars and in this instance the bane of web typography in what seems like the age of the raster warsldquo rdquo

Display Type amp the Raster Wars jmpjontan

Jon Tan Web Typography tag jontangerinecomlogtagweb-typography

Bookmark these URLs

Web Typography (Richard Rutter) webtypographynet

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

So stop trying to reach the unreachable Embrace the differences

Usability vs aesthetics

Usability accessibility functionality= very important

Usability vs aesthetics

Usability accessibility functionality= very important

But donrsquot underestimate the importance of beauty

The experience

The experience

Beauty is the experiencersquos visual layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer(See Dan Mallrsquos FOWD presentation eventscarsonifiedcomfowd2008newyorkvideosdan-mall)

The experience layer

Our emotions change the way we think and serve as constant guides to appropriate behaviour steering us away from the bad and guiding us towards the good

Donald Norman Emotional Design

ldquo rdquo

Variety in web design

I can haz it

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

Whorsquos pushing things forward

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

I hope CSS3 will be a standard in the near future right now you cant really use anything of it rsquocause not every browser supports it

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

CSS 3 rocks Unfortunately we need to stay at least 5 more years with CSS 21 if we want to offer the same design to each user (what in most lsquocommercialrsquo projects is necessary)

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

I canrsquot wait to use CSS3 in a real project Unfortunately Irsquom going to be stuck with things as they are for the time being as I wait for my clients to catch up I expect this will be the case for most designers for the time being

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

CSS3 looks really good however because of IE it will be long time before I start using it

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

These arguments are complete and utter bullshit

If 98 of the users canrsquot see a text-shadow it doesnrsquot matter but itrsquoll be a nice enrichment for the 2 of users who can

Tap Tap Tap taptaptapcom

Tweet CC tweetcccom

Fusion Ads fusionadsnet

Fusion Ads fusionadsnet

Progressive means progressive

Progressive means progressive

Fall-back solutions (JS on and off)

Barclaycard online admin barclaycardcouk

Progressive means progressive

Fall-back solutions (JS on and off)

Enhancements only become features when the majority of users are experiencing them

Progressive means progressive

Fall-back solutions (JS on and off)

Enhancements only become features when the majority of users are experiencing them

Use progressive enrichment in your dull corporate sites mdash the sexy stuff is an add-on so itrsquos fine

Do websites need to look exactly the same in every browser

dowebsitesneedtolookexactlythesameineverybrowsercom

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

Jon Tan

Designers will use [technologies like Flash PDF and hacks like embedding type in images] [] because they wonrsquot have to deal with painful inconsistencies between user agents the bane of the browser wars and in this instance the bane of web typography in what seems like the age of the raster warsldquo rdquo

Display Type amp the Raster Wars jmpjontan

Jon Tan Web Typography tag jontangerinecomlogtagweb-typography

Bookmark these URLs

Web Typography (Richard Rutter) webtypographynet

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

So stop trying to reach the unreachable Embrace the differences

Usability vs aesthetics

Usability accessibility functionality= very important

Usability vs aesthetics

Usability accessibility functionality= very important

But donrsquot underestimate the importance of beauty

The experience

The experience

Beauty is the experiencersquos visual layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer(See Dan Mallrsquos FOWD presentation eventscarsonifiedcomfowd2008newyorkvideosdan-mall)

The experience layer

Our emotions change the way we think and serve as constant guides to appropriate behaviour steering us away from the bad and guiding us towards the good

Donald Norman Emotional Design

ldquo rdquo

Variety in web design

I can haz it

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

Whorsquos pushing things forward

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

CSS 3 rocks Unfortunately we need to stay at least 5 more years with CSS 21 if we want to offer the same design to each user (what in most lsquocommercialrsquo projects is necessary)

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

I canrsquot wait to use CSS3 in a real project Unfortunately Irsquom going to be stuck with things as they are for the time being as I wait for my clients to catch up I expect this will be the case for most designers for the time being

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

CSS3 looks really good however because of IE it will be long time before I start using it

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

These arguments are complete and utter bullshit

If 98 of the users canrsquot see a text-shadow it doesnrsquot matter but itrsquoll be a nice enrichment for the 2 of users who can

Tap Tap Tap taptaptapcom

Tweet CC tweetcccom

Fusion Ads fusionadsnet

Fusion Ads fusionadsnet

Progressive means progressive

Progressive means progressive

Fall-back solutions (JS on and off)

Barclaycard online admin barclaycardcouk

Progressive means progressive

Fall-back solutions (JS on and off)

Enhancements only become features when the majority of users are experiencing them

Progressive means progressive

Fall-back solutions (JS on and off)

Enhancements only become features when the majority of users are experiencing them

Use progressive enrichment in your dull corporate sites mdash the sexy stuff is an add-on so itrsquos fine

Do websites need to look exactly the same in every browser

dowebsitesneedtolookexactlythesameineverybrowsercom

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

Jon Tan

Designers will use [technologies like Flash PDF and hacks like embedding type in images] [] because they wonrsquot have to deal with painful inconsistencies between user agents the bane of the browser wars and in this instance the bane of web typography in what seems like the age of the raster warsldquo rdquo

Display Type amp the Raster Wars jmpjontan

Jon Tan Web Typography tag jontangerinecomlogtagweb-typography

Bookmark these URLs

Web Typography (Richard Rutter) webtypographynet

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

So stop trying to reach the unreachable Embrace the differences

Usability vs aesthetics

Usability accessibility functionality= very important

Usability vs aesthetics

Usability accessibility functionality= very important

But donrsquot underestimate the importance of beauty

The experience

The experience

Beauty is the experiencersquos visual layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer(See Dan Mallrsquos FOWD presentation eventscarsonifiedcomfowd2008newyorkvideosdan-mall)

The experience layer

Our emotions change the way we think and serve as constant guides to appropriate behaviour steering us away from the bad and guiding us towards the good

Donald Norman Emotional Design

ldquo rdquo

Variety in web design

I can haz it

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

Whorsquos pushing things forward

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

I canrsquot wait to use CSS3 in a real project Unfortunately Irsquom going to be stuck with things as they are for the time being as I wait for my clients to catch up I expect this will be the case for most designers for the time being

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

CSS3 looks really good however because of IE it will be long time before I start using it

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

These arguments are complete and utter bullshit

If 98 of the users canrsquot see a text-shadow it doesnrsquot matter but itrsquoll be a nice enrichment for the 2 of users who can

Tap Tap Tap taptaptapcom

Tweet CC tweetcccom

Fusion Ads fusionadsnet

Fusion Ads fusionadsnet

Progressive means progressive

Progressive means progressive

Fall-back solutions (JS on and off)

Barclaycard online admin barclaycardcouk

Progressive means progressive

Fall-back solutions (JS on and off)

Enhancements only become features when the majority of users are experiencing them

Progressive means progressive

Fall-back solutions (JS on and off)

Enhancements only become features when the majority of users are experiencing them

Use progressive enrichment in your dull corporate sites mdash the sexy stuff is an add-on so itrsquos fine

Do websites need to look exactly the same in every browser

dowebsitesneedtolookexactlythesameineverybrowsercom

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

Jon Tan

Designers will use [technologies like Flash PDF and hacks like embedding type in images] [] because they wonrsquot have to deal with painful inconsistencies between user agents the bane of the browser wars and in this instance the bane of web typography in what seems like the age of the raster warsldquo rdquo

Display Type amp the Raster Wars jmpjontan

Jon Tan Web Typography tag jontangerinecomlogtagweb-typography

Bookmark these URLs

Web Typography (Richard Rutter) webtypographynet

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

So stop trying to reach the unreachable Embrace the differences

Usability vs aesthetics

Usability accessibility functionality= very important

Usability vs aesthetics

Usability accessibility functionality= very important

But donrsquot underestimate the importance of beauty

The experience

The experience

Beauty is the experiencersquos visual layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer(See Dan Mallrsquos FOWD presentation eventscarsonifiedcomfowd2008newyorkvideosdan-mall)

The experience layer

Our emotions change the way we think and serve as constant guides to appropriate behaviour steering us away from the bad and guiding us towards the good

Donald Norman Emotional Design

ldquo rdquo

Variety in web design

I can haz it

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

Whorsquos pushing things forward

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

CSS3 looks really good however because of IE it will be long time before I start using it

Comments from Smashing Magazine readers on jmpsmashingcss3

ldquo rdquo

These arguments are complete and utter bullshit

If 98 of the users canrsquot see a text-shadow it doesnrsquot matter but itrsquoll be a nice enrichment for the 2 of users who can

Tap Tap Tap taptaptapcom

Tweet CC tweetcccom

Fusion Ads fusionadsnet

Fusion Ads fusionadsnet

Progressive means progressive

Progressive means progressive

Fall-back solutions (JS on and off)

Barclaycard online admin barclaycardcouk

Progressive means progressive

Fall-back solutions (JS on and off)

Enhancements only become features when the majority of users are experiencing them

Progressive means progressive

Fall-back solutions (JS on and off)

Enhancements only become features when the majority of users are experiencing them

Use progressive enrichment in your dull corporate sites mdash the sexy stuff is an add-on so itrsquos fine

Do websites need to look exactly the same in every browser

dowebsitesneedtolookexactlythesameineverybrowsercom

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

Jon Tan

Designers will use [technologies like Flash PDF and hacks like embedding type in images] [] because they wonrsquot have to deal with painful inconsistencies between user agents the bane of the browser wars and in this instance the bane of web typography in what seems like the age of the raster warsldquo rdquo

Display Type amp the Raster Wars jmpjontan

Jon Tan Web Typography tag jontangerinecomlogtagweb-typography

Bookmark these URLs

Web Typography (Richard Rutter) webtypographynet

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

So stop trying to reach the unreachable Embrace the differences

Usability vs aesthetics

Usability accessibility functionality= very important

Usability vs aesthetics

Usability accessibility functionality= very important

But donrsquot underestimate the importance of beauty

The experience

The experience

Beauty is the experiencersquos visual layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer(See Dan Mallrsquos FOWD presentation eventscarsonifiedcomfowd2008newyorkvideosdan-mall)

The experience layer

Our emotions change the way we think and serve as constant guides to appropriate behaviour steering us away from the bad and guiding us towards the good

Donald Norman Emotional Design

ldquo rdquo

Variety in web design

I can haz it

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

Whorsquos pushing things forward

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

These arguments are complete and utter bullshit

If 98 of the users canrsquot see a text-shadow it doesnrsquot matter but itrsquoll be a nice enrichment for the 2 of users who can

Tap Tap Tap taptaptapcom

Tweet CC tweetcccom

Fusion Ads fusionadsnet

Fusion Ads fusionadsnet

Progressive means progressive

Progressive means progressive

Fall-back solutions (JS on and off)

Barclaycard online admin barclaycardcouk

Progressive means progressive

Fall-back solutions (JS on and off)

Enhancements only become features when the majority of users are experiencing them

Progressive means progressive

Fall-back solutions (JS on and off)

Enhancements only become features when the majority of users are experiencing them

Use progressive enrichment in your dull corporate sites mdash the sexy stuff is an add-on so itrsquos fine

Do websites need to look exactly the same in every browser

dowebsitesneedtolookexactlythesameineverybrowsercom

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

Jon Tan

Designers will use [technologies like Flash PDF and hacks like embedding type in images] [] because they wonrsquot have to deal with painful inconsistencies between user agents the bane of the browser wars and in this instance the bane of web typography in what seems like the age of the raster warsldquo rdquo

Display Type amp the Raster Wars jmpjontan

Jon Tan Web Typography tag jontangerinecomlogtagweb-typography

Bookmark these URLs

Web Typography (Richard Rutter) webtypographynet

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

So stop trying to reach the unreachable Embrace the differences

Usability vs aesthetics

Usability accessibility functionality= very important

Usability vs aesthetics

Usability accessibility functionality= very important

But donrsquot underestimate the importance of beauty

The experience

The experience

Beauty is the experiencersquos visual layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer(See Dan Mallrsquos FOWD presentation eventscarsonifiedcomfowd2008newyorkvideosdan-mall)

The experience layer

Our emotions change the way we think and serve as constant guides to appropriate behaviour steering us away from the bad and guiding us towards the good

Donald Norman Emotional Design

ldquo rdquo

Variety in web design

I can haz it

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

Whorsquos pushing things forward

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

If 98 of the users canrsquot see a text-shadow it doesnrsquot matter but itrsquoll be a nice enrichment for the 2 of users who can

Tap Tap Tap taptaptapcom

Tweet CC tweetcccom

Fusion Ads fusionadsnet

Fusion Ads fusionadsnet

Progressive means progressive

Progressive means progressive

Fall-back solutions (JS on and off)

Barclaycard online admin barclaycardcouk

Progressive means progressive

Fall-back solutions (JS on and off)

Enhancements only become features when the majority of users are experiencing them

Progressive means progressive

Fall-back solutions (JS on and off)

Enhancements only become features when the majority of users are experiencing them

Use progressive enrichment in your dull corporate sites mdash the sexy stuff is an add-on so itrsquos fine

Do websites need to look exactly the same in every browser

dowebsitesneedtolookexactlythesameineverybrowsercom

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

Jon Tan

Designers will use [technologies like Flash PDF and hacks like embedding type in images] [] because they wonrsquot have to deal with painful inconsistencies between user agents the bane of the browser wars and in this instance the bane of web typography in what seems like the age of the raster warsldquo rdquo

Display Type amp the Raster Wars jmpjontan

Jon Tan Web Typography tag jontangerinecomlogtagweb-typography

Bookmark these URLs

Web Typography (Richard Rutter) webtypographynet

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

So stop trying to reach the unreachable Embrace the differences

Usability vs aesthetics

Usability accessibility functionality= very important

Usability vs aesthetics

Usability accessibility functionality= very important

But donrsquot underestimate the importance of beauty

The experience

The experience

Beauty is the experiencersquos visual layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer(See Dan Mallrsquos FOWD presentation eventscarsonifiedcomfowd2008newyorkvideosdan-mall)

The experience layer

Our emotions change the way we think and serve as constant guides to appropriate behaviour steering us away from the bad and guiding us towards the good

Donald Norman Emotional Design

ldquo rdquo

Variety in web design

I can haz it

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

Whorsquos pushing things forward

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Tap Tap Tap taptaptapcom

Tweet CC tweetcccom

Fusion Ads fusionadsnet

Fusion Ads fusionadsnet

Progressive means progressive

Progressive means progressive

Fall-back solutions (JS on and off)

Barclaycard online admin barclaycardcouk

Progressive means progressive

Fall-back solutions (JS on and off)

Enhancements only become features when the majority of users are experiencing them

Progressive means progressive

Fall-back solutions (JS on and off)

Enhancements only become features when the majority of users are experiencing them

Use progressive enrichment in your dull corporate sites mdash the sexy stuff is an add-on so itrsquos fine

Do websites need to look exactly the same in every browser

dowebsitesneedtolookexactlythesameineverybrowsercom

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

Jon Tan

Designers will use [technologies like Flash PDF and hacks like embedding type in images] [] because they wonrsquot have to deal with painful inconsistencies between user agents the bane of the browser wars and in this instance the bane of web typography in what seems like the age of the raster warsldquo rdquo

Display Type amp the Raster Wars jmpjontan

Jon Tan Web Typography tag jontangerinecomlogtagweb-typography

Bookmark these URLs

Web Typography (Richard Rutter) webtypographynet

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

So stop trying to reach the unreachable Embrace the differences

Usability vs aesthetics

Usability accessibility functionality= very important

Usability vs aesthetics

Usability accessibility functionality= very important

But donrsquot underestimate the importance of beauty

The experience

The experience

Beauty is the experiencersquos visual layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer(See Dan Mallrsquos FOWD presentation eventscarsonifiedcomfowd2008newyorkvideosdan-mall)

The experience layer

Our emotions change the way we think and serve as constant guides to appropriate behaviour steering us away from the bad and guiding us towards the good

Donald Norman Emotional Design

ldquo rdquo

Variety in web design

I can haz it

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

Whorsquos pushing things forward

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Tweet CC tweetcccom

Fusion Ads fusionadsnet

Fusion Ads fusionadsnet

Progressive means progressive

Progressive means progressive

Fall-back solutions (JS on and off)

Barclaycard online admin barclaycardcouk

Progressive means progressive

Fall-back solutions (JS on and off)

Enhancements only become features when the majority of users are experiencing them

Progressive means progressive

Fall-back solutions (JS on and off)

Enhancements only become features when the majority of users are experiencing them

Use progressive enrichment in your dull corporate sites mdash the sexy stuff is an add-on so itrsquos fine

Do websites need to look exactly the same in every browser

dowebsitesneedtolookexactlythesameineverybrowsercom

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

Jon Tan

Designers will use [technologies like Flash PDF and hacks like embedding type in images] [] because they wonrsquot have to deal with painful inconsistencies between user agents the bane of the browser wars and in this instance the bane of web typography in what seems like the age of the raster warsldquo rdquo

Display Type amp the Raster Wars jmpjontan

Jon Tan Web Typography tag jontangerinecomlogtagweb-typography

Bookmark these URLs

Web Typography (Richard Rutter) webtypographynet

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

So stop trying to reach the unreachable Embrace the differences

Usability vs aesthetics

Usability accessibility functionality= very important

Usability vs aesthetics

Usability accessibility functionality= very important

But donrsquot underestimate the importance of beauty

The experience

The experience

Beauty is the experiencersquos visual layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer(See Dan Mallrsquos FOWD presentation eventscarsonifiedcomfowd2008newyorkvideosdan-mall)

The experience layer

Our emotions change the way we think and serve as constant guides to appropriate behaviour steering us away from the bad and guiding us towards the good

Donald Norman Emotional Design

ldquo rdquo

Variety in web design

I can haz it

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

Whorsquos pushing things forward

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Fusion Ads fusionadsnet

Fusion Ads fusionadsnet

Progressive means progressive

Progressive means progressive

Fall-back solutions (JS on and off)

Barclaycard online admin barclaycardcouk

Progressive means progressive

Fall-back solutions (JS on and off)

Enhancements only become features when the majority of users are experiencing them

Progressive means progressive

Fall-back solutions (JS on and off)

Enhancements only become features when the majority of users are experiencing them

Use progressive enrichment in your dull corporate sites mdash the sexy stuff is an add-on so itrsquos fine

Do websites need to look exactly the same in every browser

dowebsitesneedtolookexactlythesameineverybrowsercom

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

Jon Tan

Designers will use [technologies like Flash PDF and hacks like embedding type in images] [] because they wonrsquot have to deal with painful inconsistencies between user agents the bane of the browser wars and in this instance the bane of web typography in what seems like the age of the raster warsldquo rdquo

Display Type amp the Raster Wars jmpjontan

Jon Tan Web Typography tag jontangerinecomlogtagweb-typography

Bookmark these URLs

Web Typography (Richard Rutter) webtypographynet

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

So stop trying to reach the unreachable Embrace the differences

Usability vs aesthetics

Usability accessibility functionality= very important

Usability vs aesthetics

Usability accessibility functionality= very important

But donrsquot underestimate the importance of beauty

The experience

The experience

Beauty is the experiencersquos visual layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer(See Dan Mallrsquos FOWD presentation eventscarsonifiedcomfowd2008newyorkvideosdan-mall)

The experience layer

Our emotions change the way we think and serve as constant guides to appropriate behaviour steering us away from the bad and guiding us towards the good

Donald Norman Emotional Design

ldquo rdquo

Variety in web design

I can haz it

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

Whorsquos pushing things forward

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Fusion Ads fusionadsnet

Progressive means progressive

Progressive means progressive

Fall-back solutions (JS on and off)

Barclaycard online admin barclaycardcouk

Progressive means progressive

Fall-back solutions (JS on and off)

Enhancements only become features when the majority of users are experiencing them

Progressive means progressive

Fall-back solutions (JS on and off)

Enhancements only become features when the majority of users are experiencing them

Use progressive enrichment in your dull corporate sites mdash the sexy stuff is an add-on so itrsquos fine

Do websites need to look exactly the same in every browser

dowebsitesneedtolookexactlythesameineverybrowsercom

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

Jon Tan

Designers will use [technologies like Flash PDF and hacks like embedding type in images] [] because they wonrsquot have to deal with painful inconsistencies between user agents the bane of the browser wars and in this instance the bane of web typography in what seems like the age of the raster warsldquo rdquo

Display Type amp the Raster Wars jmpjontan

Jon Tan Web Typography tag jontangerinecomlogtagweb-typography

Bookmark these URLs

Web Typography (Richard Rutter) webtypographynet

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

So stop trying to reach the unreachable Embrace the differences

Usability vs aesthetics

Usability accessibility functionality= very important

Usability vs aesthetics

Usability accessibility functionality= very important

But donrsquot underestimate the importance of beauty

The experience

The experience

Beauty is the experiencersquos visual layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer(See Dan Mallrsquos FOWD presentation eventscarsonifiedcomfowd2008newyorkvideosdan-mall)

The experience layer

Our emotions change the way we think and serve as constant guides to appropriate behaviour steering us away from the bad and guiding us towards the good

Donald Norman Emotional Design

ldquo rdquo

Variety in web design

I can haz it

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

Whorsquos pushing things forward

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Progressive means progressive

Progressive means progressive

Fall-back solutions (JS on and off)

Barclaycard online admin barclaycardcouk

Progressive means progressive

Fall-back solutions (JS on and off)

Enhancements only become features when the majority of users are experiencing them

Progressive means progressive

Fall-back solutions (JS on and off)

Enhancements only become features when the majority of users are experiencing them

Use progressive enrichment in your dull corporate sites mdash the sexy stuff is an add-on so itrsquos fine

Do websites need to look exactly the same in every browser

dowebsitesneedtolookexactlythesameineverybrowsercom

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

Jon Tan

Designers will use [technologies like Flash PDF and hacks like embedding type in images] [] because they wonrsquot have to deal with painful inconsistencies between user agents the bane of the browser wars and in this instance the bane of web typography in what seems like the age of the raster warsldquo rdquo

Display Type amp the Raster Wars jmpjontan

Jon Tan Web Typography tag jontangerinecomlogtagweb-typography

Bookmark these URLs

Web Typography (Richard Rutter) webtypographynet

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

So stop trying to reach the unreachable Embrace the differences

Usability vs aesthetics

Usability accessibility functionality= very important

Usability vs aesthetics

Usability accessibility functionality= very important

But donrsquot underestimate the importance of beauty

The experience

The experience

Beauty is the experiencersquos visual layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer(See Dan Mallrsquos FOWD presentation eventscarsonifiedcomfowd2008newyorkvideosdan-mall)

The experience layer

Our emotions change the way we think and serve as constant guides to appropriate behaviour steering us away from the bad and guiding us towards the good

Donald Norman Emotional Design

ldquo rdquo

Variety in web design

I can haz it

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

Whorsquos pushing things forward

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Progressive means progressive

Fall-back solutions (JS on and off)

Barclaycard online admin barclaycardcouk

Progressive means progressive

Fall-back solutions (JS on and off)

Enhancements only become features when the majority of users are experiencing them

Progressive means progressive

Fall-back solutions (JS on and off)

Enhancements only become features when the majority of users are experiencing them

Use progressive enrichment in your dull corporate sites mdash the sexy stuff is an add-on so itrsquos fine

Do websites need to look exactly the same in every browser

dowebsitesneedtolookexactlythesameineverybrowsercom

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

Jon Tan

Designers will use [technologies like Flash PDF and hacks like embedding type in images] [] because they wonrsquot have to deal with painful inconsistencies between user agents the bane of the browser wars and in this instance the bane of web typography in what seems like the age of the raster warsldquo rdquo

Display Type amp the Raster Wars jmpjontan

Jon Tan Web Typography tag jontangerinecomlogtagweb-typography

Bookmark these URLs

Web Typography (Richard Rutter) webtypographynet

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

So stop trying to reach the unreachable Embrace the differences

Usability vs aesthetics

Usability accessibility functionality= very important

Usability vs aesthetics

Usability accessibility functionality= very important

But donrsquot underestimate the importance of beauty

The experience

The experience

Beauty is the experiencersquos visual layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer(See Dan Mallrsquos FOWD presentation eventscarsonifiedcomfowd2008newyorkvideosdan-mall)

The experience layer

Our emotions change the way we think and serve as constant guides to appropriate behaviour steering us away from the bad and guiding us towards the good

Donald Norman Emotional Design

ldquo rdquo

Variety in web design

I can haz it

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

Whorsquos pushing things forward

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Barclaycard online admin barclaycardcouk

Progressive means progressive

Fall-back solutions (JS on and off)

Enhancements only become features when the majority of users are experiencing them

Progressive means progressive

Fall-back solutions (JS on and off)

Enhancements only become features when the majority of users are experiencing them

Use progressive enrichment in your dull corporate sites mdash the sexy stuff is an add-on so itrsquos fine

Do websites need to look exactly the same in every browser

dowebsitesneedtolookexactlythesameineverybrowsercom

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

Jon Tan

Designers will use [technologies like Flash PDF and hacks like embedding type in images] [] because they wonrsquot have to deal with painful inconsistencies between user agents the bane of the browser wars and in this instance the bane of web typography in what seems like the age of the raster warsldquo rdquo

Display Type amp the Raster Wars jmpjontan

Jon Tan Web Typography tag jontangerinecomlogtagweb-typography

Bookmark these URLs

Web Typography (Richard Rutter) webtypographynet

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

So stop trying to reach the unreachable Embrace the differences

Usability vs aesthetics

Usability accessibility functionality= very important

Usability vs aesthetics

Usability accessibility functionality= very important

But donrsquot underestimate the importance of beauty

The experience

The experience

Beauty is the experiencersquos visual layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer(See Dan Mallrsquos FOWD presentation eventscarsonifiedcomfowd2008newyorkvideosdan-mall)

The experience layer

Our emotions change the way we think and serve as constant guides to appropriate behaviour steering us away from the bad and guiding us towards the good

Donald Norman Emotional Design

ldquo rdquo

Variety in web design

I can haz it

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

Whorsquos pushing things forward

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Progressive means progressive

Fall-back solutions (JS on and off)

Enhancements only become features when the majority of users are experiencing them

Progressive means progressive

Fall-back solutions (JS on and off)

Enhancements only become features when the majority of users are experiencing them

Use progressive enrichment in your dull corporate sites mdash the sexy stuff is an add-on so itrsquos fine

Do websites need to look exactly the same in every browser

dowebsitesneedtolookexactlythesameineverybrowsercom

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

Jon Tan

Designers will use [technologies like Flash PDF and hacks like embedding type in images] [] because they wonrsquot have to deal with painful inconsistencies between user agents the bane of the browser wars and in this instance the bane of web typography in what seems like the age of the raster warsldquo rdquo

Display Type amp the Raster Wars jmpjontan

Jon Tan Web Typography tag jontangerinecomlogtagweb-typography

Bookmark these URLs

Web Typography (Richard Rutter) webtypographynet

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

So stop trying to reach the unreachable Embrace the differences

Usability vs aesthetics

Usability accessibility functionality= very important

Usability vs aesthetics

Usability accessibility functionality= very important

But donrsquot underestimate the importance of beauty

The experience

The experience

Beauty is the experiencersquos visual layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer(See Dan Mallrsquos FOWD presentation eventscarsonifiedcomfowd2008newyorkvideosdan-mall)

The experience layer

Our emotions change the way we think and serve as constant guides to appropriate behaviour steering us away from the bad and guiding us towards the good

Donald Norman Emotional Design

ldquo rdquo

Variety in web design

I can haz it

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

Whorsquos pushing things forward

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Progressive means progressive

Fall-back solutions (JS on and off)

Enhancements only become features when the majority of users are experiencing them

Use progressive enrichment in your dull corporate sites mdash the sexy stuff is an add-on so itrsquos fine

Do websites need to look exactly the same in every browser

dowebsitesneedtolookexactlythesameineverybrowsercom

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

Jon Tan

Designers will use [technologies like Flash PDF and hacks like embedding type in images] [] because they wonrsquot have to deal with painful inconsistencies between user agents the bane of the browser wars and in this instance the bane of web typography in what seems like the age of the raster warsldquo rdquo

Display Type amp the Raster Wars jmpjontan

Jon Tan Web Typography tag jontangerinecomlogtagweb-typography

Bookmark these URLs

Web Typography (Richard Rutter) webtypographynet

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

So stop trying to reach the unreachable Embrace the differences

Usability vs aesthetics

Usability accessibility functionality= very important

Usability vs aesthetics

Usability accessibility functionality= very important

But donrsquot underestimate the importance of beauty

The experience

The experience

Beauty is the experiencersquos visual layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer(See Dan Mallrsquos FOWD presentation eventscarsonifiedcomfowd2008newyorkvideosdan-mall)

The experience layer

Our emotions change the way we think and serve as constant guides to appropriate behaviour steering us away from the bad and guiding us towards the good

Donald Norman Emotional Design

ldquo rdquo

Variety in web design

I can haz it

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

Whorsquos pushing things forward

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Do websites need to look exactly the same in every browser

dowebsitesneedtolookexactlythesameineverybrowsercom

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

Jon Tan

Designers will use [technologies like Flash PDF and hacks like embedding type in images] [] because they wonrsquot have to deal with painful inconsistencies between user agents the bane of the browser wars and in this instance the bane of web typography in what seems like the age of the raster warsldquo rdquo

Display Type amp the Raster Wars jmpjontan

Jon Tan Web Typography tag jontangerinecomlogtagweb-typography

Bookmark these URLs

Web Typography (Richard Rutter) webtypographynet

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

So stop trying to reach the unreachable Embrace the differences

Usability vs aesthetics

Usability accessibility functionality= very important

Usability vs aesthetics

Usability accessibility functionality= very important

But donrsquot underestimate the importance of beauty

The experience

The experience

Beauty is the experiencersquos visual layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer(See Dan Mallrsquos FOWD presentation eventscarsonifiedcomfowd2008newyorkvideosdan-mall)

The experience layer

Our emotions change the way we think and serve as constant guides to appropriate behaviour steering us away from the bad and guiding us towards the good

Donald Norman Emotional Design

ldquo rdquo

Variety in web design

I can haz it

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

Whorsquos pushing things forward

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

dowebsitesneedtolookexactlythesameineverybrowsercom

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

Jon Tan

Designers will use [technologies like Flash PDF and hacks like embedding type in images] [] because they wonrsquot have to deal with painful inconsistencies between user agents the bane of the browser wars and in this instance the bane of web typography in what seems like the age of the raster warsldquo rdquo

Display Type amp the Raster Wars jmpjontan

Jon Tan Web Typography tag jontangerinecomlogtagweb-typography

Bookmark these URLs

Web Typography (Richard Rutter) webtypographynet

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

So stop trying to reach the unreachable Embrace the differences

Usability vs aesthetics

Usability accessibility functionality= very important

Usability vs aesthetics

Usability accessibility functionality= very important

But donrsquot underestimate the importance of beauty

The experience

The experience

Beauty is the experiencersquos visual layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer(See Dan Mallrsquos FOWD presentation eventscarsonifiedcomfowd2008newyorkvideosdan-mall)

The experience layer

Our emotions change the way we think and serve as constant guides to appropriate behaviour steering us away from the bad and guiding us towards the good

Donald Norman Emotional Design

ldquo rdquo

Variety in web design

I can haz it

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

Whorsquos pushing things forward

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

Jon Tan

Designers will use [technologies like Flash PDF and hacks like embedding type in images] [] because they wonrsquot have to deal with painful inconsistencies between user agents the bane of the browser wars and in this instance the bane of web typography in what seems like the age of the raster warsldquo rdquo

Display Type amp the Raster Wars jmpjontan

Jon Tan Web Typography tag jontangerinecomlogtagweb-typography

Bookmark these URLs

Web Typography (Richard Rutter) webtypographynet

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

So stop trying to reach the unreachable Embrace the differences

Usability vs aesthetics

Usability accessibility functionality= very important

Usability vs aesthetics

Usability accessibility functionality= very important

But donrsquot underestimate the importance of beauty

The experience

The experience

Beauty is the experiencersquos visual layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer(See Dan Mallrsquos FOWD presentation eventscarsonifiedcomfowd2008newyorkvideosdan-mall)

The experience layer

Our emotions change the way we think and serve as constant guides to appropriate behaviour steering us away from the bad and guiding us towards the good

Donald Norman Emotional Design

ldquo rdquo

Variety in web design

I can haz it

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

Whorsquos pushing things forward

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

Jon Tan

Designers will use [technologies like Flash PDF and hacks like embedding type in images] [] because they wonrsquot have to deal with painful inconsistencies between user agents the bane of the browser wars and in this instance the bane of web typography in what seems like the age of the raster warsldquo rdquo

Display Type amp the Raster Wars jmpjontan

Jon Tan Web Typography tag jontangerinecomlogtagweb-typography

Bookmark these URLs

Web Typography (Richard Rutter) webtypographynet

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

So stop trying to reach the unreachable Embrace the differences

Usability vs aesthetics

Usability accessibility functionality= very important

Usability vs aesthetics

Usability accessibility functionality= very important

But donrsquot underestimate the importance of beauty

The experience

The experience

Beauty is the experiencersquos visual layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer(See Dan Mallrsquos FOWD presentation eventscarsonifiedcomfowd2008newyorkvideosdan-mall)

The experience layer

Our emotions change the way we think and serve as constant guides to appropriate behaviour steering us away from the bad and guiding us towards the good

Donald Norman Emotional Design

ldquo rdquo

Variety in web design

I can haz it

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

Whorsquos pushing things forward

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Jon Tan

Designers will use [technologies like Flash PDF and hacks like embedding type in images] [] because they wonrsquot have to deal with painful inconsistencies between user agents the bane of the browser wars and in this instance the bane of web typography in what seems like the age of the raster warsldquo rdquo

Display Type amp the Raster Wars jmpjontan

Jon Tan Web Typography tag jontangerinecomlogtagweb-typography

Bookmark these URLs

Web Typography (Richard Rutter) webtypographynet

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

So stop trying to reach the unreachable Embrace the differences

Usability vs aesthetics

Usability accessibility functionality= very important

Usability vs aesthetics

Usability accessibility functionality= very important

But donrsquot underestimate the importance of beauty

The experience

The experience

Beauty is the experiencersquos visual layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer(See Dan Mallrsquos FOWD presentation eventscarsonifiedcomfowd2008newyorkvideosdan-mall)

The experience layer

Our emotions change the way we think and serve as constant guides to appropriate behaviour steering us away from the bad and guiding us towards the good

Donald Norman Emotional Design

ldquo rdquo

Variety in web design

I can haz it

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

Whorsquos pushing things forward

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Jon Tan Web Typography tag jontangerinecomlogtagweb-typography

Bookmark these URLs

Web Typography (Richard Rutter) webtypographynet

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

So stop trying to reach the unreachable Embrace the differences

Usability vs aesthetics

Usability accessibility functionality= very important

Usability vs aesthetics

Usability accessibility functionality= very important

But donrsquot underestimate the importance of beauty

The experience

The experience

Beauty is the experiencersquos visual layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer(See Dan Mallrsquos FOWD presentation eventscarsonifiedcomfowd2008newyorkvideosdan-mall)

The experience layer

Our emotions change the way we think and serve as constant guides to appropriate behaviour steering us away from the bad and guiding us towards the good

Donald Norman Emotional Design

ldquo rdquo

Variety in web design

I can haz it

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

Whorsquos pushing things forward

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Do websites need to look exactly the same in every browser

Websites will never look consistent across all browsers

Rendering engines operating systems and user-specific variables like screen settings and resolution will always stand in the way

So stop trying to reach the unreachable Embrace the differences

Usability vs aesthetics

Usability accessibility functionality= very important

Usability vs aesthetics

Usability accessibility functionality= very important

But donrsquot underestimate the importance of beauty

The experience

The experience

Beauty is the experiencersquos visual layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer(See Dan Mallrsquos FOWD presentation eventscarsonifiedcomfowd2008newyorkvideosdan-mall)

The experience layer

Our emotions change the way we think and serve as constant guides to appropriate behaviour steering us away from the bad and guiding us towards the good

Donald Norman Emotional Design

ldquo rdquo

Variety in web design

I can haz it

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

Whorsquos pushing things forward

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Usability vs aesthetics

Usability accessibility functionality= very important

Usability vs aesthetics

Usability accessibility functionality= very important

But donrsquot underestimate the importance of beauty

The experience

The experience

Beauty is the experiencersquos visual layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer(See Dan Mallrsquos FOWD presentation eventscarsonifiedcomfowd2008newyorkvideosdan-mall)

The experience layer

Our emotions change the way we think and serve as constant guides to appropriate behaviour steering us away from the bad and guiding us towards the good

Donald Norman Emotional Design

ldquo rdquo

Variety in web design

I can haz it

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

Whorsquos pushing things forward

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Usability vs aesthetics

Usability accessibility functionality= very important

But donrsquot underestimate the importance of beauty

The experience

The experience

Beauty is the experiencersquos visual layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer(See Dan Mallrsquos FOWD presentation eventscarsonifiedcomfowd2008newyorkvideosdan-mall)

The experience layer

Our emotions change the way we think and serve as constant guides to appropriate behaviour steering us away from the bad and guiding us towards the good

Donald Norman Emotional Design

ldquo rdquo

Variety in web design

I can haz it

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

Whorsquos pushing things forward

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

The experience

The experience

Beauty is the experiencersquos visual layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer(See Dan Mallrsquos FOWD presentation eventscarsonifiedcomfowd2008newyorkvideosdan-mall)

The experience layer

Our emotions change the way we think and serve as constant guides to appropriate behaviour steering us away from the bad and guiding us towards the good

Donald Norman Emotional Design

ldquo rdquo

Variety in web design

I can haz it

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

Whorsquos pushing things forward

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

The experience

Beauty is the experiencersquos visual layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer(See Dan Mallrsquos FOWD presentation eventscarsonifiedcomfowd2008newyorkvideosdan-mall)

The experience layer

Our emotions change the way we think and serve as constant guides to appropriate behaviour steering us away from the bad and guiding us towards the good

Donald Norman Emotional Design

ldquo rdquo

Variety in web design

I can haz it

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

Whorsquos pushing things forward

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer(See Dan Mallrsquos FOWD presentation eventscarsonifiedcomfowd2008newyorkvideosdan-mall)

The experience layer

Our emotions change the way we think and serve as constant guides to appropriate behaviour steering us away from the bad and guiding us towards the good

Donald Norman Emotional Design

ldquo rdquo

Variety in web design

I can haz it

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

Whorsquos pushing things forward

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer(See Dan Mallrsquos FOWD presentation eventscarsonifiedcomfowd2008newyorkvideosdan-mall)

The experience layer

Our emotions change the way we think and serve as constant guides to appropriate behaviour steering us away from the bad and guiding us towards the good

Donald Norman Emotional Design

ldquo rdquo

Variety in web design

I can haz it

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

Whorsquos pushing things forward

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer(See Dan Mallrsquos FOWD presentation eventscarsonifiedcomfowd2008newyorkvideosdan-mall)

The experience layer

Our emotions change the way we think and serve as constant guides to appropriate behaviour steering us away from the bad and guiding us towards the good

Donald Norman Emotional Design

ldquo rdquo

Variety in web design

I can haz it

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

Whorsquos pushing things forward

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

The experience

Beauty is the experiencersquos visual layer

Visually pleasing layer = more fulfilling user experience

Functionality leads to usage aesthetics lead to emotion

The experience layer(See Dan Mallrsquos FOWD presentation eventscarsonifiedcomfowd2008newyorkvideosdan-mall)

The experience layer

Our emotions change the way we think and serve as constant guides to appropriate behaviour steering us away from the bad and guiding us towards the good

Donald Norman Emotional Design

ldquo rdquo

Variety in web design

I can haz it

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

Whorsquos pushing things forward

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

The experience layer

Our emotions change the way we think and serve as constant guides to appropriate behaviour steering us away from the bad and guiding us towards the good

Donald Norman Emotional Design

ldquo rdquo

Variety in web design

I can haz it

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

Whorsquos pushing things forward

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Variety in web design

I can haz it

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

Whorsquos pushing things forward

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

Whorsquos pushing things forward

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

BORING

BORING

BORING

BORING

BORING

BORING

BORING

BORING

Whorsquos pushing things forward

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

BORING

BORING

BORING

BORING

BORING

BORING

BORING

Whorsquos pushing things forward

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

BORING

BORING

BORING

BORING

BORING

BORING

Whorsquos pushing things forward

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

BORING

BORING

BORING

BORING

BORING

Whorsquos pushing things forward

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

BORING

BORING

BORING

BORING

Whorsquos pushing things forward

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

BORING

BORING

BORING

Whorsquos pushing things forward

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

BORING

BORING

Whorsquos pushing things forward

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

BORING

Whorsquos pushing things forward

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Whorsquos pushing things forward

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Made By Elephant madebyelephantcom

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Atebits atebitscom

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Atebits atebitscomtweetie-mac

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

24 Ways 24waysorg

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Stack Overflow stackoverflowcarsonifiedcom

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Carsonified Events eventscarsonifiedcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Born Living bornlivingcom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Jason Santa Maria jasonsantamariacom

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Whorsquos pushing things forward

Tim Van Damme Made By Elephant

Mike Kus Carsonified

Miguel Ripoll Cesser Digital

Jason Santa Maria

Matthew Smith Squared Eye

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Squared Eye squaredeyecomworkfeaturedfamily-life-network

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Squared Eye squaredeyecomworkfeaturedfamily-life-network

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

The nicer your site looks

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

The nicer your site looks

the longer your visitors will look at it

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

The nicer your site looks

the longer your visitors will look at it

the longer your visitors look at it the longer theyrsquoll spend on your website

and the longer they spend on your website the easier it will be for you to sell them your product or service

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Web design for me is predominantly full of boring unimaginative work

Letrsquos change that

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

WARNING

controversial

statement

approaching

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Validation is irrelevant

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Yes yes Bear with me

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Yes yes Bear with me

New techniques wonrsquot validate

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Validation errors jigsaww3orgcss-validator

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

The CSS3 Validator could offer the option to ignore vendor specific extensions

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

Validator suggestions css3infothe-big-css3-validation-debate

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

The CSS3 Validator could offer the option to ignore vendor specific extensions

The CSS3 Validator could highlight vendor specific extensions with a warning rather than an error

The validator could mark such code as lsquoexperimentalrsquo rather than an error or warning

Validator suggestions css3infothe-big-css3-validation-debate

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Jon Hicks hicksdesigncoukjournal

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Jon Hicks hicksdesigncoukjournal

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

tops b displayblock floatright width333px height15px backgroundurl(imagespaulsmithgif) no-repeat

hicksdesigncoukcsslayout-9css

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

ltbgt

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Yes yes Bear with me

New techniques wonrsquot validate

and it doesnrsquot matter

Know that you can break the rules

Validation does not equal conformity to Web Standards you can build a site with tables and a complete lack of semantics yet still have it validate

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Validation

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

does

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

not

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

equal

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

conformity

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

to

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Web

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Standards

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Wersquore looking at it in the wrong way

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Wersquore looking at it in the wrong way

ldquoWe canrsquot ensure that all users get the same experiencerdquo negative

ldquoWe can add further enhancements above the normrdquo positive

The flexibility the web offers is a blessing not a curse

Ensure a good experience for most a great one for some

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Itrsquos not just about making things look pretty

Forward-thinking code meansa future-proof website

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

10

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

10 of users today will be 100 of users tomorrow

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

My site before Firefox 35 (no font-face support) elliotjaystockscom

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

My site after Firefox 35 (with font-face support) elliotjaystockscom

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

10 of users today will be 100 of users tomorrow

The amount of people who see your enrichments might seem small right now but that number will only grow not decline

Itrsquos our duty to push forward-thinking development to make the most of the tools made available to usand our users

New CSS techniques will never become mainstream if we designers arenrsquot using them

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

All the small things

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

ltul class=blogrollgt ltligt lta href=httpshauninmancomgtShaun Inmanltagt ltligt ltligt lta href=httpmezzobluecomgtDave Shealtagt ltligt ltligt lta href=httphicksdesigncoukgtJon Hicksltagt ltligtltulgt

HTML with no need for class names on each ltligt

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

ulblogroll li a[href=httpshauninmancom] backgroundurl(httpshauninmancomfaviconico)

Attribute selectors

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Fusion Ads fusionadsnetblog

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

All the small things

CSS21 CSS3 etc allows you to write less code speeds up development time and generally makes life easier

Consider attribute selectors

Consider nth-child selectors

And if a browser doesnrsquot support these things so what

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Thomas Silkjaeligr theundersignednet (Safari)

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

ulgallery lihover webkit-transformrotate(-25deg)

theundersignednetwp-contentthemesdefaultstylecss

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Thomas Silkjaeligr theundersignednet (Firefox)

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

dictionaryreferencecombrowseprogressive

Favoring or advocating progress change improvement or reform as opposed to wishing to maintain things as they areldquo rdquo

Progressive

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Donrsquot fear degradationplan for it

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Slides will be available online at elliotjaystockscomspeaking

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Sexy Web Designby Elliot Jay StocksExpert reviewers Jina Bolton amp Dan Rubin

Published by SitePoint

Shameless plug

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251

Thank you

elliotjaystockscom | twittercomelliotjaystocks

Pin-ups image by Mauren Veras - flickrcomphotosmauren2298724158

Paint textures from The Stock Exchange - sxchu

Set in FS Clerkenwell - fontsmithcomfont_detailsphpfont_num=251