WEB ACCESSIBILITY
SPECIALIST (WAS)
CERTIFICATION -
SEMANTIC STRUCTURE
AND NAVIGATION
SCORED A+
Evatee 10/5/24 WAS
,WEB ACCESSIBILITY SPECIALIST (WAS)
CERTIFICATION - SEMANTIC STRUCTURE AND
NAVIGATION SCORED A+
First thing screen readers hear: Answer - Page <title> (also this is good for SEO)
Page <title> rules: Answer - Page <title> must be present and must contain
text. Must be updated when the web address changes. Must be accurate and
informative. If a page is the result of a user action or scripted change of
context, the text of the <title> SHOULD describe the result or change of context
to the user. Should be concise. Should be unique if possible. Unique
information should come first. The page <title> SHOULD match (or be very
similar to) the top heading in the main content.
The primary language of the page MUST be identified accurately on the <html>
element. Answer - If the language is not specified, or if it the language
designation is inaccurate, a screen reader will read the document in the user's
default language, which may result in a very bad accent if the page language
doesn't match the user's default. Or not understandable.
The primary language of the page MUST be identified with a valid value on the
<html> element. Answer - Using 2 letter language code or LCID string.
Inline language changes MUST be identified with a valid lang attribute. Answer
- Identify any changes of language within the document. The lang attribute can
be applied to block level elements (<div>, <h1>, <p>, <table>, etc.) as well as
inline elements (<span>, <a>, <strong>, etc.).
Example:
, <p>While in Spain, my friend tried to speak Spanish,
but she wasn't very good. Everyone kept saying
"<span lang="es">No comprendo nada de lo que
dices.</span>"</p>
Landmarks SHOULD be used to designate pre-defined parts of the layout
(<header>, <nav>, <main>, <footer>, etc.). Answer - Use either HTML 5
landmarks or their ARIA equivalents to mark sections of the layout in the
design, so that screen reader users can easily find their way around the layout.
Landmarks are used to designate sections of the overall page design and
layout. Headings are used to designate sections within the content.
All text SHOULD be contained within a landmark region. Answer - Labels for
headers, mains, sections, articles, asides, footers, etc. Using just <div> isn't
enough.
Multiple instances of the same type of landmark SHOULD be distinguishable by
different discernible labels (aria-label or aria-labelledby). Answer - Example:
<nav aria-label="Corporate and legal info">
A page SHOULD NOT contain more than one instance of each of the following
landmarks: banner, main, and contentinfo. Answer - The ARIA specification
states that the landmarks role="banner", role="main", and role="contentinfo"
are meant to be used only once per page. Other ARIA landmarks can be used
multiple times. Interestingly, the HMTL 5 specification allows multiple instances
of the equivalent landmarks: <header>, <main>, and <footer>. The official
restriction is only on ARIA landmarks. Even so, it is appropriate in most web
designs to have only one each of these landmarks, whether they are specified
using ARIA or HTML 5.
SPECIALIST (WAS)
CERTIFICATION -
SEMANTIC STRUCTURE
AND NAVIGATION
SCORED A+
Evatee 10/5/24 WAS
,WEB ACCESSIBILITY SPECIALIST (WAS)
CERTIFICATION - SEMANTIC STRUCTURE AND
NAVIGATION SCORED A+
First thing screen readers hear: Answer - Page <title> (also this is good for SEO)
Page <title> rules: Answer - Page <title> must be present and must contain
text. Must be updated when the web address changes. Must be accurate and
informative. If a page is the result of a user action or scripted change of
context, the text of the <title> SHOULD describe the result or change of context
to the user. Should be concise. Should be unique if possible. Unique
information should come first. The page <title> SHOULD match (or be very
similar to) the top heading in the main content.
The primary language of the page MUST be identified accurately on the <html>
element. Answer - If the language is not specified, or if it the language
designation is inaccurate, a screen reader will read the document in the user's
default language, which may result in a very bad accent if the page language
doesn't match the user's default. Or not understandable.
The primary language of the page MUST be identified with a valid value on the
<html> element. Answer - Using 2 letter language code or LCID string.
Inline language changes MUST be identified with a valid lang attribute. Answer
- Identify any changes of language within the document. The lang attribute can
be applied to block level elements (<div>, <h1>, <p>, <table>, etc.) as well as
inline elements (<span>, <a>, <strong>, etc.).
Example:
, <p>While in Spain, my friend tried to speak Spanish,
but she wasn't very good. Everyone kept saying
"<span lang="es">No comprendo nada de lo que
dices.</span>"</p>
Landmarks SHOULD be used to designate pre-defined parts of the layout
(<header>, <nav>, <main>, <footer>, etc.). Answer - Use either HTML 5
landmarks or their ARIA equivalents to mark sections of the layout in the
design, so that screen reader users can easily find their way around the layout.
Landmarks are used to designate sections of the overall page design and
layout. Headings are used to designate sections within the content.
All text SHOULD be contained within a landmark region. Answer - Labels for
headers, mains, sections, articles, asides, footers, etc. Using just <div> isn't
enough.
Multiple instances of the same type of landmark SHOULD be distinguishable by
different discernible labels (aria-label or aria-labelledby). Answer - Example:
<nav aria-label="Corporate and legal info">
A page SHOULD NOT contain more than one instance of each of the following
landmarks: banner, main, and contentinfo. Answer - The ARIA specification
states that the landmarks role="banner", role="main", and role="contentinfo"
are meant to be used only once per page. Other ARIA landmarks can be used
multiple times. Interestingly, the HMTL 5 specification allows multiple instances
of the equivalent landmarks: <header>, <main>, and <footer>. The official
restriction is only on ARIA landmarks. Even so, it is appropriate in most web
designs to have only one each of these landmarks, whether they are specified
using ARIA or HTML 5.
