A Fresh Website Redesign for California Foundation

During the summer of 2021, Cecile Thomas of Make it Matter approached our team to redesign the website of the Girard Foundation.

Their vision is to foster innovation and systemic change in education with the goal of improving student outcomes in San Diego County and beyond. The old site was outdated in its appearance and needed to better present their recent accomplishments.

Our goal was to migrate all the existing website content into a fresh, modern Theme; and train the team to manage content with the new WordPress Block Editor.

California nonprofit foundation website redesign
Girard Foundation’s new look and feel

Michele is over the moon thrilled with the Girard Foundation website. One board member’s only email after receiving the link was “love love love it” The board chairman said it was ‘marvelous‘ and makes them look like a major player.
Cecile Thomas, Make-it-Matter

Performance Analysis (October 2021)

Google Lighthouse
Accessibility: 97/100
Best Practices: 100/100
Mobile Optimization: 82/100
Desktop Optimization: 96/100
Search Engine Optimization: 79/100

WebPageTest Speed Index: 1.992 (median = ~3.591; top 10% = <1.388)

Total Page File Size: 912 Kb ( 834 Kb Images + 131 Kb Scripts + 52 Kb CSS + 29 Kb Fonts + 11 Kb HTML) – In 2020, the average page size = ~2.4 Mb and median page size = ~2.1 Mb.
Total Web Server Requests: 29 (10 Images + 8 Scripts + 6 CSS + 2 Fonts + 2 Other + 1 HTML) [< 40 – 60 requests recommended]
Total Page Load Time: ~2 seconds

Web Design Team

Content and Creative Strategy: Make It Matter
Visual Design: Erik Fadiman
WordPress Theme Development: Scott Marlow

Providing WordPress Support, Empowering Clients, & Encouraging Accessibility

supported living services nonprofit website

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.

A WordPress Developer Committed to Performance-Optimized Themes

Composer website screenshot

This new version of the site is definitely WAY more mobile friendly. Love it!
Reg Unterseher

My latest WordPress project, which involved customizing a single Theme for 5 domains for 4 Northwest choral composers.

By collaborating on their marketing efforts – the group was able to affordably launch a series of custom, co-branded domains. The new, customized Gutenberg Block Editor enables each composer to create rich page layouts and integrate a unique color palette – while providing a consistent layout and user experience to visitors. In particular, each composer appreciated the power and flexibility of the Latest Posts Block, which was used to compile their respective choral catalogs alphabetically, as well as showcase featured compositions on their homepages.

Conductor-Composer website screenshot

Based on Automattic’s _Underscores Theme, page load speed ranks in the top 10% of sites – with high benchmark scores for accessibility, SEO, and other best practices.

Site Statistics

Google Lighthouse Insights
Accessibility: 98/100
Best Practices: 100/100
Mobile Speed: 87/100
Desktop Speed: 99/100
SEO: 100/100

WebPageTest Speed Index: 1.238 (median = ~3.519; top 10% = <1.388)

Total Server Requests:   26 (7 Scripts + 7 Images + 3 Fonts + 7 CSS + 1 HTML)
Total Page Size:                 334 Kb (In 2020, the average page size was ~2.4 Mb; the median size was ~2.1 Mb)
Page Load Speed:             ~1.2 seconds

Composer-Conductor website screenshot

Web Design + Development Team

Visual Design by David Owen Hastings
WordPress Theme Development by Scott Marlow

Building Nonprofit Websites in King County

Nonprofit youth mentoring website screenshot

A redesigned WordPress website for The 4C Coalition – a community-based nonprofit, founded in 1999, that helps black and other youth of color succeed in school and in life. The 4C Coalition offers one-on-one mentoring, group mentoring and tutoring to 12- to 17-year-olds in King County.

Scope of Work

content migration
copywriting
creative strategy
color palette development
front-end web development
online data management
performance optimization
security hardening
search engine optimization
visual design
WordPress training and consulting

Performance

Page load speed ranks in the top 15% of sites.

WebPageTest Speed Index: 1.737 (median = ~3.591; top 10% = <1.388)

Total Page File Size: 1.3 Mb (In 2020, the median web page size = ~2.1 MB; the average page size = ~2.4 Mb)
Total Web Server Requests: 48

Web Design Team

Content Strategy: Rita Cipalla
Photography: Rebecca Sullivan
Visual Design: Joan van den Berg
WordPress Theme DevelopmentScott Marlow

 

Original Websites for Original Artists

musician-composer website

A redesigned WordPress website for musician-composer, Glenna Burmer. The new site merges content from burmermusic.com into a single domain for the award-winning artist. Visitors can listen and watch concert clips from SoundCloud and Vimeo. Stay tuned for the teaser trailer for the award-winning animated short film, Nana korobi, Ya oki.

The new website is simply FANTASTIC! Absolutely beautiful!
Glenna Burmer

Scope of Work

content migration
copywriting
creative strategy
color palette development
front-end web development
performance optimization
security hardening
search engine optimization
visual design
WordPress training and consulting

Performance

Page load speed ranks in the top 10% of sites.

Google Lighthouse benchmarks
Mobile Speed: 85/100
Desktop Speed: 97/100
Accessibility: 96/100
Best Practices:  100/100
Search Engine Optimization: 93/100

WebPageTest Speed Index: 1.169 (median = ~3.591; top 10% = <1.388)

Total Page File Size: 489 Kb (In 2020, the average page size was ~2.4 Mb; the median size was ~2.1 Mb)
Total Web Server Requests: 24 (4 Scripts + 5 Images + 6 CSS files + 4 fonts + 2 Other + 1 HTML )

Team

Content Strategy by: Rita Cipalla
Visual Design by: Joan van den Berg
Banner artwork: Descending Dragon by Nobu Burmer | Banner photo: Sakurajima volcano, Kyushu, Japan, by Glenna Burmer
WordPress Theme Development byScott Marlow