Erik Fadiman

Erik FadimanErik Fadiman is a professor at Seattle Central Creative Academy. He reads a lot about emerging technologies and industry best practices and implements those concepts into his curriculum. His classes cover Web Design, UX Design, and Web Development, with a focus on accessibility and inclusive design. He also works as a freelance web developer, specializing in WordPress as a content management system, and advises clients in branding, strategy, and visual design. fadimantium.com

Identifying Usability Problems. Developing Effective Websites.

Posted on

Henry M Jackson nonprofit foundation website screenshot

A recently redesigned website for Henry M Jackson Foundation, a Seattle-based nonprofit diversifying and democratizing  public policy by broadening access to public policy graduate study programs; and encouraging young legislators to build relationships across party lines through cross-partisan dialogue, debate, and action.

Despite using a WordPress-approved Theme, the foundation’s previous mobile site speed was sluggish, primarily due too excessive number of Plugins and associated Javascript. Our goal was to improve benchmark performance, while modernizing the brand identity and improving ease of use.

Scope of Work

  • Accessibility Consulting
  • Performance Optimization
  • Visual Design
  • WordPress Theme Development
  • WordPress Training & Consulting

Performance

Mobile page load speed was improved significantly by reducing web server requests 66%, from 102 to 35 and by reducing overall page size 54%, from 1.196 Mb to 551 Kb.

Accessibility

Improvements include higher contrast colors to better adhere to Web Content Accessibility Guidelines (WCAG) color contrast ratio guidelines; increased font sizes; increased vertical rhythm; a navigation skip link; and text links with 2 visual indicators.

Before & After Performance Comparison

Performance Metric old website New Website
Google Lighthouse: Accessibility 94/100 100/100
Google Lighthouse: Best Practices 83/100 92/100
Google Lighthouse: Mobile Speed 56/100 88/100
Google Lighthouse: Desktop Speed 97/100 98/100
Google Lighthouse: Search Engine Optimization 93/100 92/100
WebPageTest Speed Index 4.036 3.318
Total Homepage File Size 1.196 Mb (636 Kb Images + 253 Kb Scripts + 145 Kb CSS + 177 Kb Fonts + 13 Kb HTML) 551 Kb (317 Kb Images + 113 Kb Scripts + 106 Kb CSS + 16 Kb Fonts + 12 Kb HTML)
Total Web Server Requests 102 (7 Images + 47 Scripts + 41 CSS + 4 Font + 2 Other + 1 HTML) 35 (5 Images + 11 Scripts + 14 CSS + 2 Fonts + 2 Other + 1 HTML)
Estimated Mobile Homepage Load Time ~4 seconds ~3.3 seconds

WebPage Test Speed Index: median = ~3.591; top 10% = <1.388
In 2022, 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.

Site Credits

Visual Design: Erik Fadiman
WordPress Theme Development: Scott Marlow

WordPress. The Most Respected Content Management System in the World.

Posted on

Did you know WordPress powers 39.5% of all websites (up from powering 35% of sites in 2020)?

CMSMarket Share (2021)
WordPress65%
Shopify6.5%
Wix3.4%
SquareSpace3.0%
Joomla2.5%
Drupal1.9%
2021 stats according to W3 Techs

Lytle Enterprises contacted our team in October 2021 with accessibility, SEO and usability concerns for their aging website. Our goals included:

  1. To refresh and modernize the website based on the organization’s existing brand identity;
  2. To improve ease of use – including content management, information architecture, readability, and site maintenance;
  3. To improve conformance with Web Content Accessibility Guidelines (WCAG) level AA – including keyboard-navigable navigation, skip-to-content links, semantic HTML, site search; and high color contrast [> 4.5:1 and > 3.5:1 for large text];
  4. To improve site performance and security;
  5. To improve search engine visibility and optimization.

The final benchmark results were impressive …

Performance MetricOld website (November 2021)New Website (April 2022)
Google Lighthouse: Accessibility96/100100/100
Google Lighthouse: Best Practices67/100100/100
Google Lighthouse: Mobile Speed59/10086/100
Google Lighthouse: Desktop Speed71/10098/100
Google Lighthouse: Search Engine Optimization71/10093/100
WebPageTest Speed Index5.8452.116
Total Homepage File Size377 Kb
(201 Kb Images + 172 Kb Scripts + 13 Kb CSS + 40 Kb Fonts + 19 Kb HTML)		383 Kb
(231 Kb Images + 4 Kb Scripts + 41 Kb CSS + 107 Kb Fonts + 8 Kb HTML)
Total Web Server Requests25
(3 Images +13 Scripts + 5 CSS + 2 Font + 5 HTML)		20
(6 Images + 2 Scripts + 8 CSS + 3 Fonts + 1 HTML)
Total Homepage Load Time~5.8 seconds~2.1 seconds
WebPage Test Speed Index: median = ~3.591; top 10% = <1.388
In 2021, 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.

Web Design + Development Team

Visual Design: Erik Fadiman
WordPress Theme Development: Scott Marlow

Empowering Nonprofit Clients. Strengthening Nonprofit Communities.

Posted on

The latest custom-branded, mobile responsive WordPress redesign for Refugee Women’s Alliance. ReWA provides refugees and immigrants in the Puget Sound area with services to help them become independent.

Primary project objectives included:

  1. To improve ease of use: content management, information architecture, and site maintenance
  2. To improve page load performance

One of our first tasks was optimizing 10.5 Mb of full size images to load faster. Other performance optimization tasks included:
replacing homepage content sliders/carousels with more effective user interface elements – such as sitewide calls-to-action to drive conversions; reducing Javascript features; consolidating and removing Theme features; replacing theme-integrated features, such as  custom event Post Types, with more appropriate Plugins to improve modular integration, long-term stability and maintenance.

screenshot of website redesign for nonprofit serving refugees and immigrants

Web Design + Development Team

Visual Design Consulting: Erik Fadiman
WordPress Theme Development: Scott Marlow

What Would Western Wildlife Outreach Do?

Posted on

Western Wildlife Outreach (WWO) works with partners to provide science-based information to community groups about the ecology, biology, and behavior of grizzly bears, black bears, cougars, and gray wolves. By engaging communities in wildlife and habitat stewardship activities, WWO programs foster an appreciation for large carnivores’ niche in maintaining ecosystem health — providing critical context to environmental recovery efforts happening throughout the Pacific Northwest.

nonprofit wildlife organization website screenshot
screenshot of WWO’s new WordPress site

By fall 2021, WWO’s old website was becoming endangered. Page load speed was sluggish, above 5 seconds. Volunteers and new staff could not easily add and update content. Compounded by a clunky user interface that was difficult to navigate, visitors were not engaging with the science-based content.

WWWWOD?

WWO found my nonprofit website marketing services thru 501 Commons. Soon, we embarked to completely rebuild their existing WordPress site, using the native Block Editor to provide a rich, intuitive editing interface, which showcases their rich wildlife photography.

Project objectives included:

  1. To refresh and modernize the website based on WWO’s existing brand identity;
  2. To improve ease of use – content management, information architecture, readability, and site maintenance;
  3. To improve the mobile responsiveness of the site layout for displays from phones to tablets to desktops – including a collapsible navigation menu on mobile;
  4. To improve compliance with Web Content Accessibility Guidelines (WCAG) level AA – including keyboard-navigable navigation, skip-to-content links, semantic HTML, and high color contrast [> 4.5:1 and > 3.5:1 for large text];
  5. To improve site security and performance.

Overall homepage size decreased 36% from 1.8 to 1.14 Mb, with another 36% decrease in web server requests – resulting in sub 2-3 second page load speeds.

Performance Analysis

Performance MetricOld website (November 2021)New Website (February 2022)
Google Lighthouse: Accessibility90/10098/100
Google Lighthouse: Best Practices80/10092/100
Google Lighthouse: Mobile Speed74/10094/100
Google Lighthouse: Desktop Speed97/10097/100
Google Lighthouse: Search Engine Optimization83/10098/100
WebPageTest Speed Index1.5952.029
Total Homepage File Size1.8 Mb
( 1.3 Mb Images + 110 Kb Scripts + 36 Kb CSS + 12 Kb HTML)		1.14 Mb
(788 Kb Images + 241 Kb Scripts + 69 Kb CSS + 44 Kb Fonts + 22 Kb HTML)
Total Web Server Requests67
(32 Images + 24 Scripts + 9 CSS + 1 HTML)		43
(11 Images + 17 Scripts + 11 CSS + 2 Fonts + 2 HTML)
Total Homepage Load Time~2.4 seconds~2 seconds
WebPage Test Speed Index: median = ~3.591; top 10% = <1.388
In 2021, 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.

Web Design + Development Team

Visual Design: Erik Fadiman
WordPress Theme Development: Scott Marlow

A Fresh Website Redesign for California Foundation

Posted on

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