Difference between revisions of "Mobile Web Best Practices 1.0"
Line 43: | Line 43: | ||
|colspan='2' style='text-align:left;background-color:beige;'| | |colspan='2' style='text-align:left;background-color:beige;'| | ||
===''"Rules of Thumb"'' Advice=== | ===''"Rules of Thumb"'' Advice=== | ||
*[THEMATIC_CONSISTENCY] Ensure that content provided by accessing a URI yields a thematically coherent experience when accessed from different devices. | *[[Rule:Rule #272|<small style='float:right'>(Rule #272)</small>]]<!-- | ||
*[CAPABILITIES] Exploit device capabilities to provide an enhanced user experience. | -->[THEMATIC_CONSISTENCY] Ensure that content provided by accessing a URI yields a thematically coherent experience when accessed from different devices. | ||
*[DEFICIENCIES] Take reasonable steps to work around deficient implementations. | *[[Rule:Rule #273|<small style='float:right'>(Rule #273)</small>]]<!-- | ||
*[TESTING] Carry out testing on actual devices as well as emulators. | -->[CAPABILITIES] Exploit device capabilities to provide an enhanced user experience. | ||
*[URIS] Keep the URIs of site entry points short. | *[[Rule:Rule #274|<small style='float:right'>(Rule #274)</small>]]<!-- | ||
*[NAVBAR] Provide only minimal navigation at the top of the page. | -->[DEFICIENCIES] Take reasonable steps to work around deficient implementations. | ||
*[BALANCE] Take into account the trade-off between having too many links on a page and asking the user to follow too many links to reach what they are looking for. | *[[Rule:Rule #261|<small style='float:right'>(Rule #261)</small>]]<!-- | ||
*[NAVIGATION] Provide consistent navigation mechanisms. | -->[TESTING] Carry out testing on actual devices as well as emulators. | ||
*[ACCESS_KEYS] Assign access keys to links in navigational menus and frequently accessed functionality. | *[[Rule:Rule #109|<small style='float:right'>(Rule #109)</small>]]<!-- | ||
*[LINK_TARGET_ID] Clearly identify the target of each link. | -->[URIS] Keep the URIs of site entry points short. | ||
*[LINK_TARGET_FORMAT] Note the target file's format unless you know the device supports it. | *[[Rule:Rule #280|<small style='float:right'>(Rule #280)</small>]]<!-- | ||
*[IMAGE_MAPS] Do not use image maps unless you know the device supports them effectively. | -->[NAVBAR] Provide only minimal navigation at the top of the page. | ||
*[POP_UPS] Do not cause pop-ups or other windows to appear and do not change the current window without informing the user. | *[[Rule:Rule #282|<small style='float:right'>(Rule #282)</small>]]<!-- | ||
*[AUTO_REFRESH] Do not create periodically auto-refreshing pages, unless you have informed the user and provided a means of stopping it. | -->[BALANCE] Take into account the trade-off between having too many links on a page and asking the user to follow too many links to reach what they are looking for. | ||
*[REDIRECTION] Do not use markup to redirect pages automatically. Instead, configure the server to perform redirects by means of HTTP 3xx codes. | *[[Rule:Rule #283|<small style='float:right'>(Rule #283)</small>]]<!-- | ||
*[EXTERNAL_RESOURCES] Keep the number of externally linked resources to a minimum. | -->[NAVIGATION] Provide consistent navigation mechanisms. | ||
*[SUITABLE] Ensure that content is suitable for use in a mobile context. | *[[Rule:Rule 301|<small style='float:right'>(Rule 301)</small>]]<!-- | ||
-->[ACCESS_KEYS] Assign access keys to links in navigational menus and frequently accessed functionality. | |||
*[[Rule:Rule 301|<small style='float:right'>(Rule 301)</small>]]<!-- | |||
-->[LINK_TARGET_ID] Clearly identify the target of each link. | |||
*[[Rule:Rule 301|<small style='float:right'>(Rule 301)</small>]]<!-- | |||
-->[LINK_TARGET_FORMAT] Note the target file's format unless you know the device supports it. | |||
*[[Rule:Rule 301|<small style='float:right'>(Rule 301)</small>]]<!-- | |||
-->[IMAGE_MAPS] Do not use image maps unless you know the device supports them effectively. | |||
*[[Rule:Rule 301|<small style='float:right'>(Rule 301)</small>]]<!-- | |||
-->[POP_UPS] Do not cause pop-ups or other windows to appear and do not change the current window without informing the user. | |||
*[[Rule:Rule 301|<small style='float:right'>(Rule 301)</small>]]<!-- | |||
-->[AUTO_REFRESH] Do not create periodically auto-refreshing pages, unless you have informed the user and provided a means of stopping it. | |||
*[[Rule:Rule 301|<small style='float:right'>(Rule 301)</small>]]<!-- | |||
-->[REDIRECTION] Do not use markup to redirect pages automatically. Instead, configure the server to perform redirects by means of HTTP 3xx codes. | |||
*[[Rule:Rule 301|<small style='float:right'>(Rule 301)</small>]]<!-- | |||
-->[EXTERNAL_RESOURCES] Keep the number of externally linked resources to a minimum. | |||
*[[Rule:Rule 301|<small style='float:right'>(Rule 301)</small>]]<!-- | |||
-->[SUITABLE] Ensure that content is suitable for use in a mobile context. | |||
*[[more|more...]] | *[[more|more...]] | ||
<hr/>{{#formlink:form=Advice|link text=Add another "Rule of Thumb" '''''(from the same source only)'''''|link type=|query string=|query string parameters|target=|tooltip=|popup|new window}} | <hr/>{{#formlink:form=Advice|link text=Add another "Rule of Thumb" '''''(from the same source only)'''''|link type=|query string=|query string parameters|target=|tooltip=|popup|new window}} | ||
Line 88: | Line 105: | ||
|- | |- | ||
!colspan='4' style='background-color:white;color:teal;'| | !colspan='4' style='background-color:white;color:teal;'| | ||
<div style='text-align:center;'>[[{{TALKPAGENAME}}|Community discussion | <div style='text-align:center;font-size:medium;padding:1em;'>[[{{TALKPAGENAME}}|Community discussion & public comments happen on the "Talk" page]]</div> | ||
|- | |- | ||
|colspan='2' style='background-color:cornsilk;color:teal;vertical-align:top;'| | |colspan='2' style='background-color:cornsilk;color:teal;vertical-align:top;'| |
Revision as of 18:10, 25 March 2013
Best Practice:Mobile Web Best Practices 1.0 Source: http://www.w3.org/TR/mobile-bp/#d0e630 |
A Best Practice Mobile Web Best Practices 1.0
Context
audiences: Job:Web designer
Catalog Information source: Web document
| ||||||||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
This document specifies Best Practices for delivering Web content to mobile devices. The principal objective is to improve the user experience of the Web when accessed from such devices. The recommendations refer to delivered content and not to the processes by which it is created, nor to the devices or user agents to which it is delivered. It is primarily directed at creators, maintainers and operators of Web sites. Readers of this document are expected to be familiar with the creation of Web sites, and to have a general familiarity with the technologies involved, such as Web servers and HTTP. Readers are not expected to have a background in mobile-specific technologies.in bundle: Mobile Web Initiativenarrower than: LOC:Web Applicationsbroader than: Nokia Operating System Applications | |||||||||||||||||||
"Rules of Thumb" Advice
{{#formlink:form=Advice|link text=Add another "Rule of Thumb" (from the same source only)|link type=|query string=|query string parameters|target=|tooltip=|popup|new window}} |
Media links{{#ask:Link:+|format=list|default=No media items found See also{{#ask:Relation:+|format=list|default=No other items found Community Contacts{{#ask:Advice:+|format=list|default=No contacts found {{#formlink:form=Expert|link text=Be a go-to expert about this practice|link type=|query string=|query string parameters|target=|tooltip=|popup|new window}} {{#formlink:form=Practitioner|link text=Do you or your organization use this best practice ?|link type=|query string=|query string parameters|target=|tooltip=|popup|new window}} {{#formlink:form=Search|link text=Search for more Group Blog{{#formlink:form=Blog|link text=Start a group blog Snap Poll{{#formlink:form=Practitioner|link text=Do you or your organization use this best practice ?|link type=|query string=|query string parameters|target=|tooltip=|popup|new window}} {{#formlink:form=Poll|link text=Create a poll|link type=button|query string=|query string parameters|target=|tooltip=|popup|new window}} | ||||||||||||||||||
Case studies, datasets & surveys{{#ask:Study:+|format=list|default=No case studies found {{#ask:Dataset:+|format=list|default=No open data datasets found }} {{#formlink:form=Dataset|link text=Add a dataset|link type=button|query string=|query string parameters|target=|tooltip=|popup|new window}} {{#ask:Survey:+|format=list|default=No surveys found}} {{#formlink:form=Survey|link text=Add a survey|link type=button|query string=|query string parameters|target=|tooltip=|popup|new window}} |
Expert Opinions{{#ask:Opinion:+|format=list|default=No opinions found}} {{#set: |
Article has average rating={{#averagerating:}}
}} {{#showcommentform:}} |
?Has comment person | ?Has comment date | ?Has comment text | ?Has comment rating | ?Belongs to comment | ?Comment was deleted#true,false | ?Has comment editor | ?Modification date | ?Has attached article | format=template | template=CommentResult | sort=Has comment date | order=asc | link=none | limit=100
}} {{#formlink:form=Expert|link text=Add an expert opinion about this best practice|link type=|query string=|query string parameters|target=|tooltip=|popup|new window}} |
{{#css: h1#firstHeading {display:none} }}