Web Accessibility Guide 2017 By Kinex Media

KINEX MEDIAWACECBESSISTIEBILITY-A Beginner’sGuide

Introduction‘Website Accessibility’isone ofthe mosttalked topicsamong the industryprofessionalsanddigitalenthusiasts.Wearelivingintheageofdigitalization,andwebsites have become a basic human need to access forthe realtimeinformation.Simplyput,‘webaccessibility’istheprocessofremovingbarricadesandconstructingasmoothroadforthepeoplewithdisabilitiestooperatingthewebwithoutdependinguponanyone.Whenawebsiteisdesignedcorrectly,everyonecanaccessithasslefreeincludingpeoplewithdisabilities.Hence,theterm ‘webaccessibility’wascoined.Nomatterifyouareadesigner,developer,onlinemarketer,oraCEO,havinginformationonwebsiteaccessibilityhelpsmilestocreateastunninguserexperienceforeverykindofvisitor.Thislittleguidewillhelpyoutoreachmoreaudience,andtowintheirsinceretrustandlifelongloyalty.Note:Addingfeaturesisn’textraeffortifyouaddthem intoyourworkflow.“Beingtherichestmaninthecemeterydoesn'tmattertome.Goingtobedatnightsayingwe'vedonesomethingwonderful...that'swhatmatterstome.”–SteveJobsWhenawebsiteiscreatedwithHTML,thetextualcontentofimagesandvideosunderstand thetext-to-speech and/ortext-to-Braillefeatures–and disabledpeoplecaneasilygettheinformationrelevanttotheparticulartopic.Page1 www.kinexmedia.com

DisabilitiestoKeepinMindThelegaldefinitionofvisionblindnessishavingavisionlessthanorequalto20/200.Accordingtomedicalreports,therearenearly8.1millionpeoplesufferingfrom visionproblemsandoutofthose,2millionpeoplearetotallyblind.Eachtypeofdisabilityneedsspecialconsiderationinthedesigningphaseforthebestoutputpossible.Themagicthatcomesalongwiththisadaptationisthat;itbenefitseveryone,notonlydisabledpeoplebutanyonehavingwaylessattentionspanoruserslookingtohaveagreatuser-experience.Followingarethedisabilitiestokeepinmindwhilecreatingaportalthatdoesjusticetoall; •TotalBlindness •LegallyBlind •OcularBlindness •ColorBlindness •CognitiveDisabilities •PhysicalDisabilities •DeafandHardofHearingPage2 www.kinexmedia.com

DisabilitiestoKeepinMindPeoplewithdisabilitiesareusuallydependentonscreenreaderstonavigatethepage.And,peoplewithlowvisionchangethefonttolarge,andcontrastcolortounderstandthewebsitewithoutstressingtheireyes.Hence,thesefeaturesoughttobeincorporatedinawebsite.Now,therearepeoplewithhearingproblems.Havingaclearaudioonyourwebsiteenablesthem tounderstandwhatthevideowantstosay.Followingarethecommontypeofhearingproblemsthatyouhavetoencounterwhileworkingonawebsite; •Deaf •HardofHearing •UsingHearingAidsWhilecreatingaudios;considertone,sound,musicalcuesandaccents.Moreover,trynottouseCAPSatall.Ifyouhavetouseit,thensolelyuseittohighlightingoremphasizingsomethinghighlyimportanttogetnoticed;otherwise,don’t.Therearephysicaldisabilitiesthatyoushouldconsider,too;PhysicalDisabilities•LossorDamageofLimbs•Parkinson’Disease•CerebralPalsy•CarpalTunnel•ArthritisPage3 www.kinexmedia.com

DisabilitiestoKeepinMindToolstohelpnavigatingthewebsite•KeyboardonlyInputs •On-screenKeyboards•EyeTrackingDevices •SpeechRecognitionSoftware•One-handedKeyboards How yourWebsiteCanHelp •LargeClickAreas •LengthyTimers •AddBypassBlocksforEasy Navigation •KeyboardandMouseIncorporatingabovelistedelementsinawebsitebringuniversality.Consideranon-nativeEnglishspeaker,whofindsithardtokeepupwithanaccentandlookforcaptionsorsubtitles;oraperson,whoisseeingthevideowithoutaudio.https://youtu.be/BEFgnYktC7UPage4 www.kinexmedia.com

ImplementingWebAccessibilityBeforemakingyourwebsiteaccessible,firstlyunderstandtheterm in-depthandknowwhatareasyouhavetocoverto create an everlastingexperience for everyindividualwho visits yourwebsite.AwarenessIt’s wrong to say that adeveloperruns away frommakingawebsiteaccessibleorhesitatetoexploringthesubject.Inreality,webdevelopershavenoproblem indoingwebaccessibility;however,theactualproblem islackofawareness.\"If,then,IwereaskedforthemostimportantadviceIcouldgive,thatwhichIconsideredbeingthemostusefultothemenofourcentury,Ishouldsimplysay:inthenameofGod,stopamoment,ceaseyourwork,lookaroundyou.\"― LeoTolstoyMostwebaccessibleerrorsaretheresultofhavingapathy.Withoutraisingawareness,web developerswillnevercome to know whatchallengesthedisabledcommunityface.Page5 www.kinexmedia.com

LeadershipChangehappensbyraisingawarenessaboutthesubject.However,toremaininfluenced bythewaveofanyawarenesscampaign,astrongleadership isrequiredwhocanstringhisteam ononethreaduntilthegoalisnotachieved. Thescenarioisworseinlargecorporations.Thewebsites ofmany large companies aren’tweb accessible.The reason clearly is the lack ofleadership abilities and professionalism.PoliciesandProceduresEveniftheleaderhasexpressedhisdesirefortheideaimplementation,itwillsufferandsuffocate,untilthecompany’spoliciesaren’tstrongtobacktheidea.Hence,thebestthingistocreateaninternalpolicy,dogroupmeetingsandothersessionstoemphasizethewebaccessibilityintheveryproject.Sometimes,tocreateadisciplinedenvironment,onemusthavetoactlikeacollegeprincipal.Page6 www.kinexmedia.com

TrainingandTechnicalSupportToliveinfearistodestroythefuturepossibilities.Oftenwebdevelopers’fearcreatingweb accessiblewebsiteisbecauseitwould consumetheirtimeandproductivity.Hence,theykeeponcreatinganinaccessiblewebsiteoutoftheirsheer‘fear'.It’sanillusionandwhenillusionoutweighsreality,thingsfallapartanditdirectlyaffectstheorganizationinabadway.Manydevelopersresistlearningwebaccessibilitybecause,accordingtothem,itwilltakemonthstodevelopamindsetforcreatingaccessiblewebsites.Hence,theactualreasonisnotfear,buttime.Designers,developersand administratorscan learn accessibilityfrom w3org,tutplusetc.Therearemanyprofessionalswhoarealwayswillingtohelpteachingwebaccessibility.Ifyouarelookingtoknowmoreaboutthetopicandortolearnfrom theindustrymaestros,then‘KinexMedia’hasateam whobelievesinwebaccessibleonlywebsitesandhasmadeadifferenceinthelivesofdisabledPage7 www.kinexmedia.com

LawsandStandardsOnJune13,2005,theAccessibilityforOntarianswithDisabilitiesAct,2005(AODA),receivedRoyalAssentandisnowalaw.Themainpurposewastoprovidejusticeandoverallbettermentofthesocietysothatnotonlyphysicallyfit,butdisabledpeoplecanoperatethevirtualworldwithoutdependingonanyoneelse.TheWebContentAccessibilityGuidelines(WCAG)detailseverythingrelatedtowebsiteaccessibility.WCAGisgovernedbyWorldwideWebConsortium (W3C).InDecember2008,Version2.0wasintroducedwithfollowingguidelines,whicharebasedonfourprinciples;1.Perceivable www.kinexmedia.comThewebsiteorthesoftwareshouldbeavailabletothesense.Itcanbethroughscreenreaders,screenenlargers,etc.2.OperableDisabled userscan operate ornavigate thewebsite using a mouse,keyboard,or anassistivedevice3.UnderstandableThecontentshouldbeclearandcanbeeasilyunderstoodbyeveryindividual.4.RobustWhetherthetechnologyisoldornew;itshouldbecapableofaccessingtheinternetandcanrunthefeaturesforbetterusernavigation.Page8

PrinciplesofAccessibleDesignFollowingaresomeofthekeyfeaturesthatgointowebaccessibilitydesign.Thesefeaturesdonotcompromisetheoveralllookofthedesignandthedesignwilllookasimpeccableasyouwantedittobe. ProvideAppropriateAlternativeText Asweknow,‘Alternativetext’or‘Alttext’isthe wordorphrasethatisusedinHTMLcodingfor betterreadabilityto non-textcontentin web pages AppropriateDocumentStructure Featuressuchasheadings,lists,providegreat accessibilitytotheuser,andtheycanfacilitate keyboardnavigation,too.Hence,it'samusthave featuretobeincludedinthedesigningphase. HeadersforDataTables Tablesshouldbeaccurateandappropriatetable headers(the <th> element).Itmakesscreen readersaccessandreadthecontentwithoutany confusionandtheusercanunderstandthedata table.Page9 www.kinexmedia.com

PrinciplesofAccessibleDesignTo EnsurethatUsersCan Completeand Annotations NormalSubmitAllForms Speed German  Subtitles/CC(3) Auto480 Beitatextfield,checkbox,dropdownlistor Qualityanyotherthing;makesureithasalabel,whichusescorrectform elementusingthe<label>element.EnsurethatEveryLinkMakesSenseIt'san importantpointto considerwhen itcomes to readability for screen readers.However,phraseslike ‘clickhere’or‘more’shouldbeavoided.Inaddition,userscanusethe screen readersto read linkson awebpage.Caption and/or Provide Transcripts forMediaAny video must have a transcript andcaptions.Inthecaseofarchivedvideos,onlyatranscriptcanwork;keepthisinmind.“Ensureaccessibilityofnon-HTMLcontent,includingPDFfiles,MicrosoftWorddocuments,PowerPointpresentations,andAdobeFlashcontent.”Note:PDFsorotherlistednon-HTMLdocumentsshouldbeaccessible.Ifit’shardtomakeitaccessible,lookforthebestalternativein doingso.In addition,aPDFdocumentcanuseseriesoftagstobecomeaccessible.Thebottom lineis;makeeverythingcompletelyaccessiblesoanyonecanuseitwithoutchangingthelookofthewebsiteandcanincorporatecertainfeaturesthatareinusers'bestinterest.Page10 www.kinexmedia.com

PrinciplesofAccessibleDesignStop Relyingon Colorsto Define YourMessageIfyouarerelyingonacolortoconveyyourmessage,thenit'sgood,butoverdoingitwillbeofnouseforthedisabledpeople.Forinstance;acolor-blindpersonmaynotgetyourmessageandscreenreaderswillnotaccessittothepeoplewhodependonit. WriteandPresentContentinaClearWay Usingclearandpropersizefonts,heading,sub-headingswill makeyourcontentlookprofessionalandeasilyreadable.Italso helpsindecreasingthebouncerateofthewebsitebecausea readercanstayonthewebpageforlonger.Page11 www.kinexmedia.com

Conclusion Thewebissurelyagreatplaceandoffers seamlessopportunitiesandcomfortnotonlyto physicallyfitbuttodisabledpeople,either.Keep inmind;ifawebsitefailstoadoptweb accessibility,thenitsside-liningagroupofpeople whoarewaitingtoexploreyourwebsiteandcan turnintoyourvaluableasset.Page12 www.kinexmedia.com

Canada'sTopDigitalAgencyOurmissionistohelpcompaniesbecomemoresuccessfulinthedigitalworld.Wedothatbytakingthetimetounderstandyourgoalsandyourbusinessobjectives,andbyworkingwithyoutodesign&deliverwebsolutionsthatdrivebusinessgrowth.Wehaveworkedwithmorethan800+businesses& helpedthemexpand theirbusiness roots globally.By utilizing ouryears ofexperienceandonlinemarketknowledge,ourexpertsbuildthemostefficientand effectivewebsites& ecommercesolutionsusingthemostadvancedtechnologiesandplatformssuchasMagento,Drupal,JoomlaandWordPress,andetc.At Kinex Media, we've handpicked the very best design &developmentexpertsalongwiththefinestmarketingstrategists&E-commercespecialistsfrom differentpartsoftheworld.Wehavebeenrewardedmanytimesforourexceptionaldesignsandservices.Weaim tobuildever-lastingbusinessrelationswithourclientsbydelivering exceptionalresults,increased sales and improve thereturnoninvestment(ROI).  Page13 416-907-4030  info@kinexmedia.com  25WatlineAvenue,Suite302,  Mississauga,OntarioL4Z2Z1 www.kinexmedia.com