• Notifications: Notificationsthatappearinaninterfacearevisuallyobviousbutrequireproactivediscoverybyscreenreaderusers.Acomparableexperienceforblindusers,canbeachievedbyusingaliveregion.Thenotificationthenrequiresnoexplicitactiononthepartoftheuser.

• Content for alternatives: Havingabasicalternative,whetherit’salttext,atranscript,audiodescription,orsignlanguage,makesthecontentaccessiblebuttobeequivalentitneedstocapturetheessenceoftheoriginal.

Ensureyourinterfaceprovidesacomparableexperienceforallsopeoplecanaccomplishtasksinawaythatsuitstheirneedswithoutunderminingthequalityofthecontent.

Providecomparableexperience

Whetheroutofcircumstance,choice,orcontextpeoplearediverse.Aspeopleusedifferentapproachesandtoolstoreadandoperateinterfaces,whattheinterfaceofferseachusershouldbecomparableinvalue,quality,andefficiency.

Adapted from inclusivedesignprinciples.org

Examples of how to achieve this principle

Closed captions

• Ergonomic features: Providingsynchronisedclosedcaptionsmakesyourvideoaccessible.Butmakingthemcustomisable,colorcoded,andrepositionableprovidesamorecomparableexperience.

For more information go to barclayscorporate.com/accessibility ThisworkislicensedundertheCreativeCommonsAttribution-ShareAlike3.0UnportedLicense.

1

InclusiveDesignPrinciple

• Allow zoom: Therearemanyreasonswhyausermaywanttooperatethepinch-to-zoomgestureontheirtouchdevice.Makesureitisnotsuppressed,andthatthecontentdoesnotgetobscuredwhenitisputtouse.

• Make it stop:Someusersfindthatanimationsorparallaxscrollingcausenausea,andothersfindthemplaindistracting.Wheretheyplayautomatically,theyshouldatleastbeeasytostop,byprovidingprominentplaybackcontrols.

• Scrolling control: ‘Infinitescrolling’canbeproblematic,especiallyforusersnavigatingbykeyboardbecausetheycan’tgetpastthestreamofrefreshingcontent.Givetheoptiontoturnoffthisfeatureandreplaceitwitha‘loadmore’button.

Ensurepeopleareincontrol.Peopleshouldbeabletoaccessandinteractwithcontentintheirpreferredway.

Givecontrol

Donotsuppressordisabletheabilitytochangestandardbrowserandplatformsettingssuchasorientation,fontsize,zoom,andcontrast.Inaddition,avoidcontentchangesthathavenotbeeninitiatedbytheuserunlessthereisawaytocontrolit.

Adapted from inclusivedesignprinciples.org

Examples of how to achieve this principle

Load more

For more information go to barclayscorporate.com/accessibility ThisworkislicensedundertheCreativeCommonsAttribution-ShareAlike3.0UnportedLicense.

2

InclusiveDesignPrinciple

• Multiple ways to complete an action: Whereappropriate,providemultiplewaystocompleteanaction.Onmobileswipetodeleteanitemcanbesupportedtogetherwithaneditbuttonthatallowsyoutoselectitemsthendelete.AnexampleofthisisiniOSmail.

Considerprovidingdifferentwaysforpeopletocompletetasks,especiallythosethatarecomplexornonstandard.

Offerchoice

Thereisoftenmorethanonewaytocompleteatask.Youcannotassumewhatsomeone’spreferredwaymightbe.Byprovidingalternativesforlayoutandtaskcompletion,youofferpeoplechoicesthatsuitthemandtheircircumstancesatthetime.

Adapted from inclusivedesignprinciples.org

Examples of how to achieve this principle

Edit

FlagMore Trash

• Accessible alternatives: Alternativewaysofpresentingdata,suchasdatatablesforinfographics,shouldbeavailabletoallusersasanoptionratherthanahiddenlinkjustforscreenreaderusers.Accessiblealternativescanbenefitnotjustaspecifictargetgroupbutallusersaslongasweofferthechoice.

• Layout:Wheretherearelonglistsofcontentconsiderofferingagridorlistlayoutoption.Thissupportspeoplewhomaywantlargerimagesonscreenorsmallerrows.

For more information go to barclayscorporate.com/accessibility ThisworkislicensedundertheCreativeCommonsAttribution-ShareAlike3.0UnportedLicense.

3

InclusiveDesignPrinciple

• Context sensitive help:Usersmayneedhelpwhentheyfirstencounteracomplexformorinteraction.Thishelpmaybecomeredundant,evendistracting,asauserbecomesmorefamiliarwiththeformorinteraction.Contextsensitivehelpprovidestheuserwithchoiceastowhentheyaccesshelpandbettercontroloverthepage.

• Captions on the go: You’reawarethatthevideocontentyouareprovidingwillbeconsumedonmobiledevices,whichmaybeinpublicspaceswherepeoplemightprefertoconsumethecontentwithoutbeingantisocial.Forsmallerviewports,soundisswitchedoffandcaptionsactivatedbydefault.

• Colour contrast:Whenusinganinterfaceoutdoors,goodcontrastlessenstheimpactofbrightsunshine.

Peopleuseyourinterfaceindifferentsituations.Makesureyourinterfacedeliversavaluableexperiencetopeopleregardlessoftheircircumstances.

Considersituation

Peoplearefirsttimeusers,establishedusers,usersatwork,usersathome,usersonthemove,andusersunderpressure.Allofthesesituationscanhaveanimpact.Forthosewhoalreadyfindinteractionchallenging,suchasthosewithdisabilities,thisimpactmaymakeusageparticularlydifficult.

Adapted from inclusivedesignprinciples.org

Examples of how to achieve this principle

Good contrast

Goodcontr

?Username

For more information go to barclayscorporate.com/accessibility ThisworkislicensedundertheCreativeCommonsAttribution-ShareAlike3.0UnportedLicense.

4

InclusiveDesignPrinciple

• Consistent page architecture:Useconsistentpagearchitectureacrosstemplatestohelppeoplescanandnavigatekeycontent.

• Consistent design patterns:Useconsistentwebandplatformdesignpatternstohelpbuildfamiliarityandunderstanding.

• Consistent editorial:Useplainlanguageconsistentlyacrossplatformsincludingeditorialthatisreliedonbyscreenreaderuserssuchastextalternatives,headings,labelsforbuttonsandsoon.Keepingeditorialstyleconsistentisalsoimportant,suchasmakingsurethetopofarticlesalwayshaveaclearlymarkedsummaryparagraph,ormakingsurebulletsalwaysstartwithaboldeddefinition.

Usefamiliarconventionsandapplythemconsistently.

Beconsistent

Familiarinterfacesborrowfromwell-establishedpatterns.Theseshouldbeusedconsistentlywithintheinterfacetoreinforcetheirmeaningandpurpose.Thisshouldbeappliedtofunctionality,behavior,editorial,andpresentation.Youshouldsaythesamethingsinthesamewayandusersshouldbeabletodothesamethingsinthesameway.

Adapted from inclusivedesignprinciples.org

Examples of how to achieve this principle

For more information go to barclayscorporate.com/accessibility ThisworkislicensedundertheCreativeCommonsAttribution-ShareAlike3.0UnportedLicense.

5

InclusiveDesignPrinciple

• Prioritising content:Theprimarycontentonanewsarticlepageisthestory,thereforeitshouldcomebeforeothercontent,bothvisuallyandinthesourceorder.Relatedcontent,suchassimilararticles,shouldfollowit,andunrelatedcontentafterthat.

• Prioritising editorial:Editorialforlinks,headingsandbuttonsshoulduseplainlanguageandputtheprimarytextfirst.Thisappliestobothvisibleandhiddentext.Thismakesthetexteasytoscanbothvisuallyandaudiblyforscreenreaderusers.Plainlanguagealsobenefitsnonnativespeakersandiseasiertotranslate.

• Keep task focused: Progressivelyrevealfeaturesandcontentwhenneeded,notallinonego.

• Prioritising tasks: Anemailapplicationisprincipallyforwritingandreadingemail.The‘compose’buttonis,therefore,presentonallscreens,andearlyinthefocusorder.Theinboxisprioritisedoverotherlistsofemail,suchas‘sent’and‘spam’messages.Lessusedfeaturessuchastaggingororganisingemailintofoldersappearlaterinthefocusorder,astheywillgenerallyonlybeusedwhentheprimarytaskofreadingtheemailiscomplete.

Helpusersfocusoncoretasks,features,andinformationbyprioritisingthemwithinthecontentandlayout.

Prioritisecontent

Interfacescanbedifficulttounderstandwhencorefeaturesarenotclearlyexposedandprioritised.Asiteorapplicationmayprovidelotsofinformationandfunctionality,butpeopleshouldbeabletofocusononethingatatime.Identifythecorepurposeoftheinterface,andthenthecontentandfeaturesneededtofulfillthatpurpose.

Adapted from inclusivedesignprinciples.org

Examples of how to achieve this principle

Compose

1 2•

For more information go to barclayscorporate.com/accessibility ThisworkislicensedundertheCreativeCommonsAttribution-ShareAlike3.0UnportedLicense.

6

InclusiveDesignPrinciple

• Make task completion easier: Adda‘Showpassword’buttontoinputfieldssouserscanverifytheyhavecorrectlyinputtext,oraddtouchidentificationforpasswordprotectedareas.

• Integration with connected devices or second screen:Usingvoiceinterfacestocontrolmultimedia,searchforcontent,outputfrommusicorTVaddsvalueforpeoplewhostruggletouseotherinterfaces.

• Integration with platform APIs:Enhancefunctionalityusingplatformfeatures.ThevibrationAPImakesnotificationsmoreusablebydeafandhardofhearingpeoplewhilethegeolocationAPImakesiteasierforpeoplewithmobilityimpairmentstouselocationbasedservices.

Considerthevalueoffeaturesandhowtheyimprovetheexperiencefordifferentusers.

Addvalue

Featuresshouldaddvaluetotheuserexperiencebyprovidingefficientanddiversewaystofindandinteractwithcontent.Considerdevicefeaturessuchasvoice,geolocation,cameraandvibrationAPI’s,andhowintegrationwithconnecteddevicesorasecondscreencouldprovidechoice.

Adapted from inclusivedesignprinciples.org

Examples of how to achieve this principle

Show password

qwerty123

For more information go to barclayscorporate.com/accessibility ThisworkislicensedundertheCreativeCommonsAttribution-ShareAlike3.0UnportedLicense.

7

InclusiveDesignPrinciple