Changes for page Presentations
Last modified by Lizzie Bruce on 2020/01/11 23:39
From version 1.1
edited by Lizzie Bruce
on 2019/03/09 04:35
on 2019/03/09 04:35
Change comment:
There is no comment for this version
To version 1.2
edited by Lizzie Bruce
on 2019/03/11 18:24
on 2019/03/11 18:24
Change comment:
There is no comment for this version
Summary
-
Page properties (1 modified, 0 added, 0 removed)
Details
- Page properties
-
- Content
-
... ... @@ -1,42 +1,72 @@ 1 1 (% class="box" %) 2 2 ((( 3 3 Following this helps: 4 -\\ 4 + 5 +* **people using mobiles ** 6 +* **people using tablets** 7 +* **people using laptops and desktop computers** 8 +* **people with visual impairments** 5 5 ))) 6 6 7 -== 8 -Guidance 9 - == 11 +(% class="wikigeneratedid" %) 12 +== == 10 10 11 - ~1.Accessing content on a mobiledevice exaggerates many readability issues due to the small screensize. Designing for "mobile first" can help you make your content concise and accessible.14 +== Guidance == 12 12 13 - 2.Alwaysaskyourself“Howwould this lookon mobile?”whendesigningcontent.16 +Accessing content on a mobile device exaggerates many readability issues due to the small screen size. Improving content presentation and interaction for mobile use will generally improve its usability across all devices. 14 14 15 -3. Test content with users on mobile devices. 16 16 17 -4. Position calls to action close to the relevant content. 18 - 19 +[[1. Design for mobile first not last.>>doc:||anchor="#1"]] 19 19 21 +[[2. Always ask “How would this look on mobile?”.>>doc:||anchor="#2"]] 22 + 23 +[[3. Put calls to action close to content they relate to.>>doc:||anchor="#3"]] 24 + 25 +[[4. Test content with people using mobiles.>>doc:||anchor="#4"]] 26 + 27 +[[Usability evidence>>doc:||anchor="#UEMD"]] 28 + 29 + 20 20 ---- 21 21 32 +=== {{id name="#1"/}}1. Designing for mobile first not last. === 33 + 34 +This can help you make your content concise and accessible. 35 + 36 + 37 +=== {{id name="#2"/}}2. Always ask yourself “How would this look on mobile?”. === 38 + 39 +If you are considering for example how long a paragraph is, think about how much longer it would be on a mobile. That might help you decide whether it should be split into 2 paragraphs. 40 + 41 + 42 +=== {{id name="#3"/}}3. Put calls to action close to content they relate to. === 43 + 44 +This saves users from scrolling across and down or searching around for the link and getting lost or frustrated. It also helps users who have a small area of visual focus. 45 + 46 + 47 +=== {{id name="#4"/}}4. Test content with people using mobiles. === 48 + 49 +Find out how they interpret and interact with the content. Did you write something that can be understood in different ways? Did anyone use their mobile in ways you did not expect? 50 + 51 + 52 +---- 53 + 22 22 == 23 -Usability evidence == 55 +{{id name="#UEMD"/}}Usability evidence == 24 24 25 25 [[Reading on mobile>>url:https://www.nngroup.com/articles/better-mobile/]], Amy Schade, Neilson Norman Group, 2017 26 26 [[Mobile first is not mobile only>>url:https://www.nngroup.com/articles/mobile-first-not-mobile-only/]], Raluca Budiu and Kara Pernice, Neilson Norman Group, 2016 27 27 [[Do mobile technologies reshape speaking, writing, or reading?>>url:http://journals.sagepub.com/doi/full/10.1177/2050157912459739]] 28 28 Naomi S. Baron, SAGE Journals, 2013 29 - 30 -Related reading: 31 - 32 32 [[Mobile App Design Fundamentals: 10 Tips for an Effective Content Strategy>>url:https://clearbridgemobile.com/mobile-app-design-fundamentals-10-tips-for-an-effective-content-strategy/]], Britt Armour, 2017 33 33 [['Content strategy for mobile'>>url:https://abookapart.com/products/content-strategy-for-mobile]], Karen McGrane, 2012 34 34 [[How to Create Mobile Friendly Content>>url:https://neilpatel.com/blog/how-to-create-mobile-friendly-content/]], Neil Patel, undated 35 - 36 36 37 37 38 38 (% class="box" %) 39 39 ((( 40 40 See also: 41 -\\ 69 + 70 +* [[Plain English>>doc:Plain English.Plain English, simple sentences.WebHome]] 71 +* [[Calls to action and button copy>>doc:User centred design.Links.Button copy.WebHome]] 42 42 )))