fowd nyc 2009
DESCRIPTION
'Stop Worrying & Get On With It' (FOWD NYC version)TRANSCRIPT
![Page 1: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/1.jpg)
Take Your Design To The Next Level With CSS3 jmpsmashingcss3
Fearful forabeautifulwebcoms598
Great article thanks but I think Irsquoll wait until most of the 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 (which 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
![Page 2: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/2.jpg)
Fearful forabeautifulwebcoms598
Great article thanks but I think Irsquoll wait until most of the 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 (which 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
![Page 3: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/3.jpg)
Great article thanks but I think Irsquoll wait until most of the 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 (which 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
![Page 4: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/4.jpg)
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 (which 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
![Page 5: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/5.jpg)
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 (which 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
![Page 6: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/6.jpg)
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
![Page 7: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/7.jpg)
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
![Page 8: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/8.jpg)
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
![Page 9: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/9.jpg)
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
![Page 10: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/10.jpg)
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
![Page 11: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/11.jpg)
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
![Page 12: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/12.jpg)
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
![Page 13: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/13.jpg)
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
![Page 14: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/14.jpg)
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
![Page 15: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/15.jpg)
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
![Page 16: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/16.jpg)
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
![Page 17: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/17.jpg)
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
![Page 18: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/18.jpg)
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
![Page 19: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/19.jpg)
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
![Page 20: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/20.jpg)
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
![Page 21: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/21.jpg)
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
![Page 22: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/22.jpg)
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
![Page 23: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/23.jpg)
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
![Page 24: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/24.jpg)
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
![Page 25: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/25.jpg)
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
![Page 26: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/26.jpg)
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
![Page 27: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/27.jpg)
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
![Page 28: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/28.jpg)
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
![Page 29: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/29.jpg)
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
![Page 30: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/30.jpg)
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
![Page 31: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/31.jpg)
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
![Page 32: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/32.jpg)
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
![Page 33: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/33.jpg)
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
![Page 34: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/34.jpg)
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
![Page 35: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/35.jpg)
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
![Page 36: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/36.jpg)
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
![Page 37: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/37.jpg)
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
![Page 38: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/38.jpg)
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
![Page 39: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/39.jpg)
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
![Page 40: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/40.jpg)
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
![Page 41: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/41.jpg)
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
![Page 42: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/42.jpg)
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
![Page 43: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/43.jpg)
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
![Page 44: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/44.jpg)
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
![Page 45: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/45.jpg)
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
![Page 46: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/46.jpg)
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
![Page 47: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/47.jpg)
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
![Page 48: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/48.jpg)
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
![Page 49: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/49.jpg)
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
![Page 50: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/50.jpg)
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
![Page 51: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/51.jpg)
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
![Page 52: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/52.jpg)
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
![Page 53: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/53.jpg)
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
![Page 54: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/54.jpg)
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
![Page 55: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/55.jpg)
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
![Page 56: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/56.jpg)
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
![Page 57: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/57.jpg)
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
![Page 58: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/58.jpg)
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
![Page 59: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/59.jpg)
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
![Page 60: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/60.jpg)
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
![Page 61: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/61.jpg)
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
![Page 62: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/62.jpg)
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
![Page 63: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/63.jpg)
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
![Page 64: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/64.jpg)
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
![Page 65: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/65.jpg)
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
![Page 66: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/66.jpg)
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
![Page 67: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/67.jpg)
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
![Page 68: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/68.jpg)
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
![Page 69: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/69.jpg)
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
![Page 70: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/70.jpg)
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
![Page 71: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/71.jpg)
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
![Page 72: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/72.jpg)
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
![Page 73: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/73.jpg)
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
![Page 74: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/74.jpg)
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
![Page 75: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/75.jpg)
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
![Page 76: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/76.jpg)
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
![Page 77: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/77.jpg)
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
![Page 78: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/78.jpg)
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
![Page 79: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/79.jpg)
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
![Page 80: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/80.jpg)
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
![Page 81: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/81.jpg)
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
![Page 82: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/82.jpg)
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
![Page 83: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/83.jpg)
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
![Page 84: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/84.jpg)
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
![Page 85: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/85.jpg)
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
![Page 86: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/86.jpg)
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
![Page 87: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/87.jpg)
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
![Page 88: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/88.jpg)
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
![Page 89: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/89.jpg)
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
![Page 90: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/90.jpg)
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
![Page 91: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/91.jpg)
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
![Page 92: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/92.jpg)
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
![Page 93: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/93.jpg)
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
![Page 94: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/94.jpg)
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
![Page 95: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/95.jpg)
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
![Page 96: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/96.jpg)
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
![Page 97: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/97.jpg)
Wersquore looking at it 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
![Page 98: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/98.jpg)
Wersquore looking at it 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
![Page 99: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/99.jpg)
Wersquore looking at it 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
![Page 100: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/100.jpg)
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
![Page 101: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/101.jpg)
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
![Page 102: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/102.jpg)
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
![Page 103: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/103.jpg)
10 of users today will be 100 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
![Page 104: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/104.jpg)
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
![Page 105: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/105.jpg)
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
![Page 106: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/106.jpg)
10 of users today will be 100 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
![Page 107: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/107.jpg)
10 of users today will be 100 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
![Page 108: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/108.jpg)
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
![Page 109: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/109.jpg)
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
![Page 110: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/110.jpg)
All 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
![Page 111: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/111.jpg)
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
![Page 112: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/112.jpg)
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
![Page 113: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/113.jpg)
All 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
![Page 114: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/114.jpg)
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
![Page 115: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/115.jpg)
All 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
![Page 116: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/116.jpg)
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
![Page 117: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/117.jpg)
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
![Page 118: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/118.jpg)
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
![Page 119: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/119.jpg)
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
![Page 120: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/120.jpg)
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
![Page 121: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/121.jpg)
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
![Page 122: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/122.jpg)
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
![Page 123: FOWD NYC 2009](https://reader038.vdocuments.us/reader038/viewer/2022102814/54c822a44a795923758b456f/html5/thumbnails/123.jpg)
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