Skip to content

Files

Latest commit

 

History

History

exercise4-magnification

Folders and files

NameName
Last commit message
Last commit date

parent directory

..
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Magnification/Zoom Testing

So far in this workshop, we've only looked at the desktop width.

In the industry at this point in time, it's rare to build a website that doesn't get visited on mobile.

And no matter the device, if a visitor to our website is low vision, they might zoom in.

Our web applications should remain usable no matter the zoom level or viewport size.

The Web Content Accessibility Guidelines have something to say about this, too:

Exercise: Improve layout issues for magnification and zoom

Using the files in this directory as a reference, fix layout issues found on the homepage when zooming in with the browser:

  • index.html

URL to view "fixed" files locally:

http://localhost:1234/exercise4-magnification

URL to view a deployed version for this exercise:

https://workshop-manual-a11y-testing.testingaccessibility.com/exercise4-magnification

Files you'll touch to make these improvements include:

  • index.html
  • scss/_header.scss
  • scss/pages/_home.scss
  • scss/_layouts.scss