A WordPress Theme rebuild for Alpha Supported Living Services – a non-profit agency providing supported living and group training home services to adults and children with developmental disabilities in King, Snohomish, and Spokane counties.
This latest WordPress website project involved helping a nonprofit to better comply with Web Content Accessibility Guidelines (Level AA). By replacing the commercial paid Theme with an open source WordPress-approved Theme (_Underscores), accessibility benchmark scores improved markedly.
Scope of Work
accessibility testing
front-end web development
performance optimization
security hardening
search engine optimization
WordPress training and consulting
Accessibility
To improve conformance with WCAG Level AA, 3 navigation features were added: a ‘skip to content’ link to help visitors bypass repetitive navigation; a keyboard-navigable menu; and site search. For low vision visitors, color contrast ratios were increased to meet the minimum 4.5:1 guidelines; a second visual indicator was added to body text links; image-based text was replaced with text; and the minimum font size was increased to 16 pixels.
Other accessibility improvements included removing an auto-rotating content slider (that did not include a pause feature); integrating more accessible social media icons; and making telephone numbers more accessible to assistive technology and mobile devices.
Ongoing accessibility efforts include improving alternate text for images; converting inaccessible PDF documents, like Annual Reports, to Pages and Posts; and maintaining content in semantic HTML.
Performance
Additional work involved optimizing page load performance. By optimizing images for web loading and reducing the number of web server requests (generated by Plugins and the former Theme) by 46% – page load speed almost doubled.
| Performance Metric | Old website |
New Website |
| Google Lighthouse: Accessibility | 71/100 | 100/100 |
| Google Lighthouse: Best Practices | 93/100 | 100/100 |
| WebPageTest Speed Index | 3.092 | 1.654 |
| Total Homepage File Size | 6.4 Mb (4 Mb Images + 937 Kb Scripts + 157 Kb CSS + 278 Kb Fonts + 63 Kb HTML) | 1.5 Mb (464 Kb Images + 763 Kb Scripts + 84 Kb CSS + 111 Kb Fonts + 72 Kb HTML) |
| Total Web Server Requests | 99 (13 Images + 32 Scripts + 13 CSS + 8 Other + 16 Font + 5 HTML) | 53 (8 Images + 20 Scripts + 10 CSS + 5 Fonts + 7 Other + 6 HTML) |
| Total Homepage Load TIme | ~3.1 seconds | ~1.7 seconds |
WebPage Test Speed Index: median = ~3.591; top 10% = <1.388
In 2020, the average page size = ~2.4 Mb and median page size = ~2.1 Mb.
Database-driven websites, like WordPress, are more performance optimized when server requests are < 40 – 60.
You must be logged in to post a comment.