Post on 15-May-2015
description
transcript
Mobile Web 2.0
Mobilise your ASP.NET Website
matt lacey@mrlacey - blog.mrlacey.co.uk -
mrlacey.mobi
Mobile Web
Vs
The web on mobile
What is “Mobile”?•Person not device•About context•About the “Point of Inspiration”•30 second not 30 minutes•Not about minaturisation
Web 2.0
1. The Web as a Platform2. Harnessing Collective
Intelligence3. Data as the Next “Intel Inside”4. End of the Software Release
Cycle5. Lightweight Programming
Models6. Above the level of a single
device7. Rich User Experiences
"we expect that eventually the majority of the usage of the internet will be on mobile phones"
"Mobile devices are the most important technology of them all."
“Google’s future depends on the next internet, on cellphones.”
http://www.codeproject.com/
What’s changed?
Who’s using the mobile web?
17,400,000 users in the UK
Mobile Social Networks(350% increase in last 6 months - Orange)
http://www.stoplivinginthepast.com/
http://mdbf.codeplex.com/
Mobile Browser Definition File
Alternatives
•UAProfile•WURFL (http://wurfl.sourceforge.net/)
•Device Atlas (http://www.deviceatlas.com)
•DetectRight (http://www.detectright.com/)
•Volantis (http://www.volantis.com/)
•MobileAware (http://www.mobileaware.com/)
Testing
•Emulators•Web Emulators•Firefox (with Add-ons)•User Agent Switcher•XHTML Mobile Profile•Wmlbrowser•Devices
Demos 1 - 3
CSS Solutions
Handheld style sheets<link media="handheld“ ... />
CSS Propertiesmax-device-width:480px
CSS Tips
•Some browsers don’t support CSS in other files
•Avoid trying to set position or anything other than simple styling.
Demo 4
Demos 5 - 7
http://ready.mobi/ - vbug.co.uk
Demo 8
http://ready.mobi/ - demo8
Demo Summary•Detecting Mobile Browsers•CSS•Domains•Images•Colours•Screen Size•Page Structure
HTTP_USER_AGENT => Nokia6288/2.0 (05.92) Profile/MIDP-2.0 Configuration/CLDC-1.1 HTTP_X_WAP_PROFILE => "http://nds1.nds.nokia.com/uaprof/N6288r100.xml" HTTP_ACCEPT => application/vnd.wap.wmlscriptc, text/vnd.wap.wml, application/vnd.wap.xhtml+xml, application/xhtml+xml, text/html, multipart/mixed, */* HTTP_ACCEPT_CHARSET => ISO-8859-1, US-ASCII, UTF-8; Q=0.8,
ISO-10646-UCS-2; Q=0.6 HTTP_ACCEPT_LANGUAGE => en HTTP_ACCEPT_ENCODING => gzip, deflate HTTP_CONNECTION => Keep-Alive
Nokia 6288
HTTP_USER_AGENT => = Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.8.0.7) Gecko/20060909 Firefox/1.5.0.7 MG (Novarra-Vision/6.1)
HTTP_ACCEPT => text/html;q=1.0, text/css; q=1.0, application/x-javascript; q=1.0, text/plain;q=0.8, application/xhtml+xml;q=0.6, application/x-httpd-php;q=0.1, */*;q=0, image/gif; q=1.0, image/jpeg; q=1.0, image/png; q=1.0 HTTP_ACCEPT_CHARSET => ISO-8859-1,utf-8;q=0.7,*;q=0.7 HTTP_ACCEPT_LANGUAGE => en HTTP_ACCEPT_ENCODING => identity;q=1.0, gzip;q=0.1, *;q=0 HTTP_X_NOVARRA_DEVICE_TYPE => 0 HTTP_X_DEVICE_USER_AGENT => Nokia6288/2.0 (05.94) Profile/MIDP-2.0 Configuration/CLDC-1.1 ...
Nokia 6288 – on Vodafone
For more information:
•http://mobiforge.com/
•http://www.w3.org/TR/mobile-bp/
•Ask me (matt@mrlacey.co.uk)
Let’s talk