Je kunt de mooiste site maken die je wilt, maar iedereen ziet ‘m anders. Hou rekening met andere ogen. Kleurenblinden. Slechtzienden. Een paar praktische tips.
- https://wpaccessibility.org/ WordPress expertise bundled. New.
- Get the Wave plugin to inspect website accessibility
- Uploading media, fill the ALT tag right away. What is to see here? Leave empty for non-informational images. Then the ALT tag will also be filled when used else where.
- Wave checks for contrast in text and images. Lastig in WordPress te vinden maar je kunt kleuren van tekstblokken en de achtergronden zelf kiezen.
- Gebruik Accessibility Font Resizer van SatteliteWP om een AAA size selector te maken.
- Zet de instellingen via Instellingen -> Font Resizer
- Voeg ergens toe aan een HTML element, zoals Customizer -> Bovenste Balk -> Inhoud
<div id="textresizer"><span class=:afr-normal textresize1>A</span><span class=:afr-normal textresize2>A</span><span class=:afr-normal textresize3>A</span></div>Voeg deze CSS code toe aan Custom CSS
a:hover, #footer-widgets a,
.textresize1:hover,
.textresize2:hover,
.textresize3:hover {
text-decoration: underline;
}
#textresizer {
float:right;
color: #661b0b;
vertical-align:top;
margin-top:0;
}
.textresize1 {
font-size:20px;
cursor:pointer;
margin:2px;
vertical-align:top;
}
.textresize2 {
font-size:25px;
cursor:pointer;
margin:2px;
font-weight: 600;
vertical-align:top;
}
.textresize3 {
font-size:33px;
cursor:pointer;
margin:2px;
font-weight: 600;
vertical-align:top;
}
