Extended version of my "Making your site mobile-friendly" talk, including a short look at native applications vs web apps, for the UKOLN DevCSI event "Developing for Mobile Applications in Education" in Reading http://www.ukoln.ac.uk/events/devcsi/mobile_applications/
Transaction Management in Database Management System
Making your site mobile-friendly - DevCSI Reading 21.07.2010
1. Making your site mobile-friendly
TIPS AND TECHNIQUES FOR A BETTER MOBILE PRESENCE
Patrick H. Lauke / Developing for Mobile Applications in Education / DevCSI / Reading / 21 July 2010
28. CSS 3 Media Queries
“...the new hotness” Jeffrey Zeldman
http://www.zeldman.com/2010/04/08/best-aea-yet/
29. CSS 3 Media Queries
● build and extend CSS 2.1 Media Types
● more granular control of capabilities
● width, height, orientation, color, resolution, …
http://www.w3.org/TR/css3-mediaqueries/
30. CSS 3 Media Queries
<link rel="stylesheet" ...
media="screen and (max-width:480px)" href="...">
@import url("...") screen and (max-width:480px);
@media screen and (max-width:480px) {
// insert CSS rules here
}
38. minimise data
● data transfer over network can be slow
● compress images (PNGCrush)
● optimise your HTML (death to div-itis)
● minify JavaScript
● combine CSS
39. minimise server requests
● each request has overhead
● limit to concurrent requests
● caching not reliable (e.g. iPhone > 25Kb)
40. CSS sprites
Dave Shea, A List Apart
www.alistapart.com/articles/sprites