SlideShare una empresa de Scribd logo
1 de 34
Descargar para leer sin conexión
More than
Media QueriesSALLY JENKINSON · @sjenkinson · Responsive Day Out 2 · 27th June 2014
Hello!
Tony Hisgett - https://www.flickr.com/photos/hisgett/5546030045/
Responsive
Planning
1. Process & workflow
2. Features & DETAIL
Responsivizer
8000
3. invisible requirements
Attitudes &
Responsibility
I Can Make - @icanmakehq
twitter.com/aral/status/450983599911997440
“ Tech isn’t just about tech - the stuff
you make can (and does) change the
very character of the society we live in. ”
!
- Aral Balkan, 2014
- Batman, 2005
“ It’s not who I am underneath, but
what I do that defines me. ”
Size isn’t everything
(RWD > media queries > widths)
dev.w3.org/csswg/mediaqueries4/
+ + API
DeviceLightEvent = ? lux
LightLevelEvent = dim | normal | bright
(Approximate levels of dim: < 50 lux, normal: 50 - 10000 lux, bright: > 10000 lux)
www.w3.org/TR/ambient-light/
Media query translation: washed
sallyjenkinson.co.uk/blog/2014/05/18/light-level-demo/
Texas State Archives - https://www.flickr.com/photos/texasstatearchives/9079476324/in/set-72157634196756057, D-Tailor - http://d-tailor.deviantart.com/art/Howl-s-Moving-Castle-80916550
Responsive architecture
Kenny Stoltz -https://www.flickr.com/photos/42901313@N00/226740290/
Shelley Bernstein -https://www.flickr.com/photos/31484272@N00/7044075263/
Be responsible
Narcissistic
web design
Andreas Levers - https://www.flickr.com/photos/96dpi/3878544769/in/photostream/
Your decisions are not isolated
Dean Terry - https://www.flickr.com/photos/16262447@N00/86988892/
Change is hard
(but it’s also good)
Performance
Derek Bridges - https://www.flickr.com/photos/84949728@N00/4285019229
AND finally…
Thank you
Sally Jenkinson
www.recordssoundthesame.com
sally@recordssoundthesame.com · @sjenkinson

Más contenido relacionado

Más de Sally Lait

Changing the world with the web
Changing the world with the webChanging the world with the web
Changing the world with the webSally Lait
 
Making the leap from execution to strategy
Making the leap from execution to strategyMaking the leap from execution to strategy
Making the leap from execution to strategySally Lait
 
Websites are a symptom, not the cause - DXN May 2017
Websites are a symptom, not the cause - DXN May 2017Websites are a symptom, not the cause - DXN May 2017
Websites are a symptom, not the cause - DXN May 2017Sally Lait
 
Websites are a symptom, not the cause
Websites are a symptom, not the causeWebsites are a symptom, not the cause
Websites are a symptom, not the causeSally Lait
 
All these moments will be lost in time: the web, the future, and us
All these moments will be lost in time: the web, the future, and usAll these moments will be lost in time: the web, the future, and us
All these moments will be lost in time: the web, the future, and usSally Lait
 
Working with the web and the future
Working with the web and the futureWorking with the web and the future
Working with the web and the futureSally Lait
 
All these moments will be lost in time: the web, the future, and us
All these moments will be lost in time: the web, the future, and usAll these moments will be lost in time: the web, the future, and us
All these moments will be lost in time: the web, the future, and usSally Lait
 
An introduction to open data
An introduction to open dataAn introduction to open data
An introduction to open dataSally Lait
 
An introduction to open data
An introduction to open dataAn introduction to open data
An introduction to open dataSally Lait
 
All these moments will be lost in time: the web, the future, and us
All these moments will be lost in time: the web, the future, and usAll these moments will be lost in time: the web, the future, and us
All these moments will be lost in time: the web, the future, and usSally Lait
 
Open Data: Open Your Mind
Open Data: Open Your MindOpen Data: Open Your Mind
Open Data: Open Your MindSally Lait
 
An introduction to open data
An introduction to open dataAn introduction to open data
An introduction to open dataSally Lait
 
Choosing the "right" CMS (and other things)
Choosing the "right" CMS (and other things)Choosing the "right" CMS (and other things)
Choosing the "right" CMS (and other things)Sally Lait
 
Choosing the "right" CMS
Choosing the "right" CMSChoosing the "right" CMS
Choosing the "right" CMSSally Lait
 
With great power comes great (development) responsibility
With great power comes great (development) responsibilityWith great power comes great (development) responsibility
With great power comes great (development) responsibilitySally Lait
 
Mini hacks, big difference
Mini hacks, big differenceMini hacks, big difference
Mini hacks, big differenceSally Lait
 
HTML5 - Create The Web London
HTML5 - Create The Web LondonHTML5 - Create The Web London
HTML5 - Create The Web LondonSally Lait
 

Más de Sally Lait (17)

Changing the world with the web
Changing the world with the webChanging the world with the web
Changing the world with the web
 
Making the leap from execution to strategy
Making the leap from execution to strategyMaking the leap from execution to strategy
Making the leap from execution to strategy
 
Websites are a symptom, not the cause - DXN May 2017
Websites are a symptom, not the cause - DXN May 2017Websites are a symptom, not the cause - DXN May 2017
Websites are a symptom, not the cause - DXN May 2017
 
Websites are a symptom, not the cause
Websites are a symptom, not the causeWebsites are a symptom, not the cause
Websites are a symptom, not the cause
 
All these moments will be lost in time: the web, the future, and us
All these moments will be lost in time: the web, the future, and usAll these moments will be lost in time: the web, the future, and us
All these moments will be lost in time: the web, the future, and us
 
Working with the web and the future
Working with the web and the futureWorking with the web and the future
Working with the web and the future
 
All these moments will be lost in time: the web, the future, and us
All these moments will be lost in time: the web, the future, and usAll these moments will be lost in time: the web, the future, and us
All these moments will be lost in time: the web, the future, and us
 
An introduction to open data
An introduction to open dataAn introduction to open data
An introduction to open data
 
An introduction to open data
An introduction to open dataAn introduction to open data
An introduction to open data
 
All these moments will be lost in time: the web, the future, and us
All these moments will be lost in time: the web, the future, and usAll these moments will be lost in time: the web, the future, and us
All these moments will be lost in time: the web, the future, and us
 
Open Data: Open Your Mind
Open Data: Open Your MindOpen Data: Open Your Mind
Open Data: Open Your Mind
 
An introduction to open data
An introduction to open dataAn introduction to open data
An introduction to open data
 
Choosing the "right" CMS (and other things)
Choosing the "right" CMS (and other things)Choosing the "right" CMS (and other things)
Choosing the "right" CMS (and other things)
 
Choosing the "right" CMS
Choosing the "right" CMSChoosing the "right" CMS
Choosing the "right" CMS
 
With great power comes great (development) responsibility
With great power comes great (development) responsibilityWith great power comes great (development) responsibility
With great power comes great (development) responsibility
 
Mini hacks, big difference
Mini hacks, big differenceMini hacks, big difference
Mini hacks, big difference
 
HTML5 - Create The Web London
HTML5 - Create The Web LondonHTML5 - Create The Web London
HTML5 - Create The Web London
 

Último

20240509 QFM015 Engineering Leadership Reading List April 2024.pdf
20240509 QFM015 Engineering Leadership Reading List April 2024.pdf20240509 QFM015 Engineering Leadership Reading List April 2024.pdf
20240509 QFM015 Engineering Leadership Reading List April 2024.pdfMatthew Sinclair
 
Trump Diapers Over Dems t shirts Sweatshirt
Trump Diapers Over Dems t shirts SweatshirtTrump Diapers Over Dems t shirts Sweatshirt
Trump Diapers Over Dems t shirts Sweatshirtrahman018755
 
Call Girls Sangvi Call Me 7737669865 Budget Friendly No Advance BookingCall G...
Call Girls Sangvi Call Me 7737669865 Budget Friendly No Advance BookingCall G...Call Girls Sangvi Call Me 7737669865 Budget Friendly No Advance BookingCall G...
Call Girls Sangvi Call Me 7737669865 Budget Friendly No Advance BookingCall G...roncy bisnoi
 
Katraj ( Call Girls ) Pune 6297143586 Hot Model With Sexy Bhabi Ready For S...
Katraj ( Call Girls ) Pune  6297143586  Hot Model With Sexy Bhabi Ready For S...Katraj ( Call Girls ) Pune  6297143586  Hot Model With Sexy Bhabi Ready For S...
Katraj ( Call Girls ) Pune 6297143586 Hot Model With Sexy Bhabi Ready For S...tanu pandey
 
Wadgaon Sheri $ Call Girls Pune 10k @ I'm VIP Independent Escorts Girls 80057...
Wadgaon Sheri $ Call Girls Pune 10k @ I'm VIP Independent Escorts Girls 80057...Wadgaon Sheri $ Call Girls Pune 10k @ I'm VIP Independent Escorts Girls 80057...
Wadgaon Sheri $ Call Girls Pune 10k @ I'm VIP Independent Escorts Girls 80057...SUHANI PANDEY
 
VIP Model Call Girls NIBM ( Pune ) Call ON 8005736733 Starting From 5K to 25K...
VIP Model Call Girls NIBM ( Pune ) Call ON 8005736733 Starting From 5K to 25K...VIP Model Call Girls NIBM ( Pune ) Call ON 8005736733 Starting From 5K to 25K...
VIP Model Call Girls NIBM ( Pune ) Call ON 8005736733 Starting From 5K to 25K...SUHANI PANDEY
 
Pirangut | Call Girls Pune Phone No 8005736733 Elite Escort Service Available...
Pirangut | Call Girls Pune Phone No 8005736733 Elite Escort Service Available...Pirangut | Call Girls Pune Phone No 8005736733 Elite Escort Service Available...
Pirangut | Call Girls Pune Phone No 8005736733 Elite Escort Service Available...SUHANI PANDEY
 
Lucknow ❤CALL GIRL 88759*99948 ❤CALL GIRLS IN Lucknow ESCORT SERVICE❤CALL GIRL
Lucknow ❤CALL GIRL 88759*99948 ❤CALL GIRLS IN Lucknow ESCORT SERVICE❤CALL GIRLLucknow ❤CALL GIRL 88759*99948 ❤CALL GIRLS IN Lucknow ESCORT SERVICE❤CALL GIRL
Lucknow ❤CALL GIRL 88759*99948 ❤CALL GIRLS IN Lucknow ESCORT SERVICE❤CALL GIRLimonikaupta
 
VIP Call Girls Himatnagar 7001035870 Whatsapp Number, 24/07 Booking
VIP Call Girls Himatnagar 7001035870 Whatsapp Number, 24/07 BookingVIP Call Girls Himatnagar 7001035870 Whatsapp Number, 24/07 Booking
VIP Call Girls Himatnagar 7001035870 Whatsapp Number, 24/07 Bookingdharasingh5698
 
在线制作约克大学毕业证(yu毕业证)在读证明认证可查
在线制作约克大学毕业证(yu毕业证)在读证明认证可查在线制作约克大学毕业证(yu毕业证)在读证明认证可查
在线制作约克大学毕业证(yu毕业证)在读证明认证可查ydyuyu
 
Dubai=Desi Dubai Call Girls O525547819 Outdoor Call Girls Dubai
Dubai=Desi Dubai Call Girls O525547819 Outdoor Call Girls DubaiDubai=Desi Dubai Call Girls O525547819 Outdoor Call Girls Dubai
Dubai=Desi Dubai Call Girls O525547819 Outdoor Call Girls Dubaikojalkojal131
 
20240508 QFM014 Elixir Reading List April 2024.pdf
20240508 QFM014 Elixir Reading List April 2024.pdf20240508 QFM014 Elixir Reading List April 2024.pdf
20240508 QFM014 Elixir Reading List April 2024.pdfMatthew Sinclair
 
best call girls in Hyderabad Finest Escorts Service 📞 9352988975 📞 Available ...
best call girls in Hyderabad Finest Escorts Service 📞 9352988975 📞 Available ...best call girls in Hyderabad Finest Escorts Service 📞 9352988975 📞 Available ...
best call girls in Hyderabad Finest Escorts Service 📞 9352988975 📞 Available ...kajalverma014
 
Russian Call Girls Pune (Adult Only) 8005736733 Escort Service 24x7 Cash Pay...
Russian Call Girls Pune  (Adult Only) 8005736733 Escort Service 24x7 Cash Pay...Russian Call Girls Pune  (Adult Only) 8005736733 Escort Service 24x7 Cash Pay...
Russian Call Girls Pune (Adult Only) 8005736733 Escort Service 24x7 Cash Pay...SUHANI PANDEY
 
APNIC Policy Roundup, presented by Sunny Chendi at the 5th ICANN APAC-TWNIC E...
APNIC Policy Roundup, presented by Sunny Chendi at the 5th ICANN APAC-TWNIC E...APNIC Policy Roundup, presented by Sunny Chendi at the 5th ICANN APAC-TWNIC E...
APNIC Policy Roundup, presented by Sunny Chendi at the 5th ICANN APAC-TWNIC E...APNIC
 
WhatsApp 📞 8448380779 ✅Call Girls In Mamura Sector 66 ( Noida)
WhatsApp 📞 8448380779 ✅Call Girls In Mamura Sector 66 ( Noida)WhatsApp 📞 8448380779 ✅Call Girls In Mamura Sector 66 ( Noida)
WhatsApp 📞 8448380779 ✅Call Girls In Mamura Sector 66 ( Noida)Delhi Call girls
 
APNIC Updates presented by Paul Wilson at ARIN 53
APNIC Updates presented by Paul Wilson at ARIN 53APNIC Updates presented by Paul Wilson at ARIN 53
APNIC Updates presented by Paul Wilson at ARIN 53APNIC
 

Último (20)

20240509 QFM015 Engineering Leadership Reading List April 2024.pdf
20240509 QFM015 Engineering Leadership Reading List April 2024.pdf20240509 QFM015 Engineering Leadership Reading List April 2024.pdf
20240509 QFM015 Engineering Leadership Reading List April 2024.pdf
 
(INDIRA) Call Girl Pune Call Now 8250077686 Pune Escorts 24x7
(INDIRA) Call Girl Pune Call Now 8250077686 Pune Escorts 24x7(INDIRA) Call Girl Pune Call Now 8250077686 Pune Escorts 24x7
(INDIRA) Call Girl Pune Call Now 8250077686 Pune Escorts 24x7
 
Trump Diapers Over Dems t shirts Sweatshirt
Trump Diapers Over Dems t shirts SweatshirtTrump Diapers Over Dems t shirts Sweatshirt
Trump Diapers Over Dems t shirts Sweatshirt
 
Call Girls Sangvi Call Me 7737669865 Budget Friendly No Advance BookingCall G...
Call Girls Sangvi Call Me 7737669865 Budget Friendly No Advance BookingCall G...Call Girls Sangvi Call Me 7737669865 Budget Friendly No Advance BookingCall G...
Call Girls Sangvi Call Me 7737669865 Budget Friendly No Advance BookingCall G...
 
6.High Profile Call Girls In Punjab +919053900678 Punjab Call GirlHigh Profil...
6.High Profile Call Girls In Punjab +919053900678 Punjab Call GirlHigh Profil...6.High Profile Call Girls In Punjab +919053900678 Punjab Call GirlHigh Profil...
6.High Profile Call Girls In Punjab +919053900678 Punjab Call GirlHigh Profil...
 
Katraj ( Call Girls ) Pune 6297143586 Hot Model With Sexy Bhabi Ready For S...
Katraj ( Call Girls ) Pune  6297143586  Hot Model With Sexy Bhabi Ready For S...Katraj ( Call Girls ) Pune  6297143586  Hot Model With Sexy Bhabi Ready For S...
Katraj ( Call Girls ) Pune 6297143586 Hot Model With Sexy Bhabi Ready For S...
 
Wadgaon Sheri $ Call Girls Pune 10k @ I'm VIP Independent Escorts Girls 80057...
Wadgaon Sheri $ Call Girls Pune 10k @ I'm VIP Independent Escorts Girls 80057...Wadgaon Sheri $ Call Girls Pune 10k @ I'm VIP Independent Escorts Girls 80057...
Wadgaon Sheri $ Call Girls Pune 10k @ I'm VIP Independent Escorts Girls 80057...
 
VIP Model Call Girls NIBM ( Pune ) Call ON 8005736733 Starting From 5K to 25K...
VIP Model Call Girls NIBM ( Pune ) Call ON 8005736733 Starting From 5K to 25K...VIP Model Call Girls NIBM ( Pune ) Call ON 8005736733 Starting From 5K to 25K...
VIP Model Call Girls NIBM ( Pune ) Call ON 8005736733 Starting From 5K to 25K...
 
Pirangut | Call Girls Pune Phone No 8005736733 Elite Escort Service Available...
Pirangut | Call Girls Pune Phone No 8005736733 Elite Escort Service Available...Pirangut | Call Girls Pune Phone No 8005736733 Elite Escort Service Available...
Pirangut | Call Girls Pune Phone No 8005736733 Elite Escort Service Available...
 
Lucknow ❤CALL GIRL 88759*99948 ❤CALL GIRLS IN Lucknow ESCORT SERVICE❤CALL GIRL
Lucknow ❤CALL GIRL 88759*99948 ❤CALL GIRLS IN Lucknow ESCORT SERVICE❤CALL GIRLLucknow ❤CALL GIRL 88759*99948 ❤CALL GIRLS IN Lucknow ESCORT SERVICE❤CALL GIRL
Lucknow ❤CALL GIRL 88759*99948 ❤CALL GIRLS IN Lucknow ESCORT SERVICE❤CALL GIRL
 
VIP Call Girls Himatnagar 7001035870 Whatsapp Number, 24/07 Booking
VIP Call Girls Himatnagar 7001035870 Whatsapp Number, 24/07 BookingVIP Call Girls Himatnagar 7001035870 Whatsapp Number, 24/07 Booking
VIP Call Girls Himatnagar 7001035870 Whatsapp Number, 24/07 Booking
 
在线制作约克大学毕业证(yu毕业证)在读证明认证可查
在线制作约克大学毕业证(yu毕业证)在读证明认证可查在线制作约克大学毕业证(yu毕业证)在读证明认证可查
在线制作约克大学毕业证(yu毕业证)在读证明认证可查
 
Dubai=Desi Dubai Call Girls O525547819 Outdoor Call Girls Dubai
Dubai=Desi Dubai Call Girls O525547819 Outdoor Call Girls DubaiDubai=Desi Dubai Call Girls O525547819 Outdoor Call Girls Dubai
Dubai=Desi Dubai Call Girls O525547819 Outdoor Call Girls Dubai
 
20240508 QFM014 Elixir Reading List April 2024.pdf
20240508 QFM014 Elixir Reading List April 2024.pdf20240508 QFM014 Elixir Reading List April 2024.pdf
20240508 QFM014 Elixir Reading List April 2024.pdf
 
best call girls in Hyderabad Finest Escorts Service 📞 9352988975 📞 Available ...
best call girls in Hyderabad Finest Escorts Service 📞 9352988975 📞 Available ...best call girls in Hyderabad Finest Escorts Service 📞 9352988975 📞 Available ...
best call girls in Hyderabad Finest Escorts Service 📞 9352988975 📞 Available ...
 
Russian Call Girls Pune (Adult Only) 8005736733 Escort Service 24x7 Cash Pay...
Russian Call Girls Pune  (Adult Only) 8005736733 Escort Service 24x7 Cash Pay...Russian Call Girls Pune  (Adult Only) 8005736733 Escort Service 24x7 Cash Pay...
Russian Call Girls Pune (Adult Only) 8005736733 Escort Service 24x7 Cash Pay...
 
Call Girls in Prashant Vihar, Delhi 💯 Call Us 🔝9953056974 🔝 Escort Service
Call Girls in Prashant Vihar, Delhi 💯 Call Us 🔝9953056974 🔝 Escort ServiceCall Girls in Prashant Vihar, Delhi 💯 Call Us 🔝9953056974 🔝 Escort Service
Call Girls in Prashant Vihar, Delhi 💯 Call Us 🔝9953056974 🔝 Escort Service
 
APNIC Policy Roundup, presented by Sunny Chendi at the 5th ICANN APAC-TWNIC E...
APNIC Policy Roundup, presented by Sunny Chendi at the 5th ICANN APAC-TWNIC E...APNIC Policy Roundup, presented by Sunny Chendi at the 5th ICANN APAC-TWNIC E...
APNIC Policy Roundup, presented by Sunny Chendi at the 5th ICANN APAC-TWNIC E...
 
WhatsApp 📞 8448380779 ✅Call Girls In Mamura Sector 66 ( Noida)
WhatsApp 📞 8448380779 ✅Call Girls In Mamura Sector 66 ( Noida)WhatsApp 📞 8448380779 ✅Call Girls In Mamura Sector 66 ( Noida)
WhatsApp 📞 8448380779 ✅Call Girls In Mamura Sector 66 ( Noida)
 
APNIC Updates presented by Paul Wilson at ARIN 53
APNIC Updates presented by Paul Wilson at ARIN 53APNIC Updates presented by Paul Wilson at ARIN 53
APNIC Updates presented by Paul Wilson at ARIN 53
 

More Than Media Queries - Responsive Day Out 2