Supporting Handout - The Mobile Web: keep up if you can!

IWMW2009 The Mobile Web – Keep up if you can!

PCs: http://iphonetester.com/ | http://bit.ly/dK8yN (winksite) | http://bit.ly/4DSJB (question form)
Phones: http://winksite.mobi/ssteeples/iwmw

University Mobile Sites
UK
• http://www.brad.ac.uk/mobile/
• http://m.warwick.ac.uk/
• http://www.shef.ac.uk/union/mobile/ (Sheffield Students union)

USA
• http://mobi.mit.edu/home/
• http://m.acu.edu/acu-mobile/ (Exceptional on an iPhone. Can’t be viewed on a PC)
• http://www.bsu.edu/libraries/mobile/ (Try searching the catalogue)
• http://www.uis.edu/m/
• http://www.utexas.mobi/ (Nice computing lab feature)
• http://m.moreheadstate.edu/
• http://www.apu.edu/m/
• http://mobile.virginia.edu/
• http://m.uiowa.edu (Can’t be viewed on a PC)
• http://www3.lehigh.edu/mobile/
• http://www.umsystem.edu/m/
• http://www.library.upenn.edu/m/
• http://www.iep.ucr.edu/m/index.html (International Programmes)
• http://uc2go.mobi/
• http://mobile.usablenet.com/mt/illinois.edu/mobile/?un_jtt_redirect
• http://ublib.buffalo.edu/hsl/mobile/mobilecircinfo.html (Library site)
http://libweb.uoregon.edu/mobile/ (Library site)

Australia http://m.unimelb.edu.au/

Page 1 of 5


Italy http://www.m.aspeninstitute.it/mwt/ (English version link at top)
Japan http://www.wul.waseda.ac.jp/m/index-e.html

Page 2 of 5


QR Codes

This is the title of the session. This is the URL of the IWMW2009 social
events page.

This is the URL for Sharon’s WinkSite

This should take you to Google map for the
University of Essex

This is a text message

Page 3 of 5


Example XHTML-MP (Mobile Profile) Code

Things to note
about the mark-up:

The character
<?xml version="1.0" encoding="UTF-8"?> encoding is UTF-8 for
maximum
compatibility.
<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN"
"http://www.wapforum.org/DTD/xhtml-mobile10.dtd"> The DOCTYPE is
essential.
<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<title>My Mobile Site</title>
<link rel="stylesheet" type="text/css" href="mobile.css" />
<meta name="description" content="My Mobile Site" />
The cache control
<meta http-equiv="Cache-Control" content="max-age=600" /> header is important
because it instructs
</head> the browser to use a
local cached copy
<body > instead of a
requesting a new
<div> copy from the server
if the local copy
<img alt="Smiley" src="smiley.gif" width="30" height="30" /> hasn’t expired. This
<h1 class="title">Welcome to My Mobile Site</h1> example is set to 10
<p>Page content goes here<p /> mins expiry (600
<p>[1] <a accesskey="4" href="http://m.site.com">Link One</a> seconds). Cache
<p /> control can be helpful
for downloads on
</div>
slower networks, and
</body>
it may save your
</html>
users money in data
download charges.

More help
 While you code keep this website open: http://www.developershome.com/wap/xhtmlmp/
(it is an ugly site, but replete with great advice!)

 A complete list of XHTML-MP tags can be found at:
http://htmllint.itc.keio.ac.jp/htmllint/tagslist.cgi?HTMLVersion=XHTML-MP

Page 4 of 5


Recommended Resources
Development
Building an HE microsite: http://blogs.warwick.ac.uk/saralever/entry/development_of_the/
MobiThinking: http://mobithinking.com/
MobiForge: http://mobiforge.com/
Mobile Usability: http://www.useit.com/alertbox/mobile-usability.html
W3C: Mobile Web Best Practices (http://www.w3.org/TR/mobile-bp/)
Apple iPhone Dev Center (http://developer.apple.com/iphone/ )
Mobile Usability Best Practice:
http://mobithinking.com/sites/mobithinking.com/files/dotMobi_Mobile_Usability_Best_Practice.pdf
Phone Use in Cambridge University m-Libraries study:
http://arcadiaproject.lib.cam.ac.uk/docs/M-Libraries_report.pdf
Coding for the mobile web: http://carsonified.com/blog/features/css/coding-for-the-mobile-web/

Validation
W3C Mobile Validator: http://validator.w3.org/mobile
ReadyMobi: http://ready.mobi/

Emulators
iPhone Emulator: http://iphonetester.com
Nokia Phone Emulator download: http://tinyurl.com/2b657r
OpenWave Phone Simulator: http://developer.openwave.com/dvl/tools_and_sdk/phone_simulator/
iPhoney: http://sourceforge.net/projects/iphonesimulator/
Blackberry simulators: (http://na.blackberry.com/eng/developers/resources/simulators.jsp )

Advertising and SEO
Google Mobile Adwords: http://services.google.com/adwords/mobile_ads
Google Webmasters Tools: https://www.google.com/webmasters/tools/

Matrix Codes
QR Code Generator : http://qrcode.kaywa.com/
Seven Things You Should Know About QR Codes: http://net.educause.edu/ir/library/pdf/ELI7046.pdf
QuickMark: http://www.quickmark.cn/
BeeTagg: http://www.beetagg.com/

SMS
To register a Short Code go to: http://www.short-codes.com

Books
Mobile Web Design, Cameron Moll
Designing the Mobile User Experience, Barbara Ballard
Mobile Interaction Design, Matt Jones & Gary Marsden

Other
How Teenagers Consume Media by Matthew Robson (Aged 15 yrs & 7 months)
http://media.ft.com/cms/c3852b2e-6f9a-11de-bfc5-00144feabdc0.pdf

Training
Introduction to W3C's Mobile Web Best Practices, (online course, 9 weeks at 99 Euros, 2hrs a week)
http://www.w3.org/2009/03/mobitrain_course_description.html

Video
Mobile Phone Evolution: http://www.youtube.com/watch?v=x0DrncbhoeM

Page 5 of 5

Supporting Handout - The Mobile Web: keep up if you can!

Recommandé

Recommandé

Contenu connexe

En vedette

En vedette (11)

Similaire à Supporting Handout - The Mobile Web: keep up if you can!

Similaire à Supporting Handout - The Mobile Web: keep up if you can! (20)

Dernier

Dernier (20)

Supporting Handout - The Mobile Web: keep up if you can!