ThemeForest vs. WordPress: Theme Comparison

Seattle Animal Shelter Foundation contacted me in fall 2021 about a website rebuild.

The organization was satisfied with their overall brand identity, as well as the look and feel of their existing site. However, the board of directors wanted to address concerns of very poor mobile page load speeds, often in excess of 12 seconds.

Scope of Work

My goal was to clone the site content and mimic the existing visual look and feel – while optimizing accessibility, performance, and search engine optimization.

  • accessibility testing
  • front-end web development
  • performance optimization
  • security hardening
  • search engine optimization
  • WordPress training and consulting

It was easy to identify the root cause of the performance issues: a template ThemeForest Theme, with too many Plugins. Overall page size was 3.6 Mb, well above the industry average of 2.4 Mb. However, the main contributor to page load latency is usually ‘web server file requests.’ Together, the Theme and Plugins generated 89 server requests – including 36 Javascript files. In addition to a rotating content carousel, the Visual Composer Plugin was generating significant code bloat. These poor development practices impacted usability, site engagement and conversions.

Below are screenshots during development. Do you notice significant changes in the look & feel?

Before (left) & After (right) optimization screenshots

Performance Analysis

By switching to a WordPress.org-approved Theme, _Underscores, and consolidating and removing Plugins – web server requests were reduced 64%, from 89 to 32; overall page size also decreased 71%, from 3.6 Mb to 1 Mb. Replacing the Visual Composer Plugin with WordPress’ native Gutenberg Block Editor significantly improved performance. These efforts improved page load speed to reasonable sub 3 seconds on mobile devices.

MetricThemeForest (Anima) ThemeWordPress _Underscores Theme
Google Lighthouse: Accessibility88/10096/100
Google Lighthouse: Best Practices80/10092/100
Google Lighthouse: Mobile Speed31/10085/100
Google Lighthouse: Desktop Speed64/10099/100
Google Lighthouse: Search Engine Optimization70/10086/100
WebPageTest Speed Index7.5233.267
Homepage File Size3.6 Mb (1.9 Mb Images + 1.3 Mb Scripts + 199 Kb CSS + 305 Kb Fonts + 70 Kb HTML)1.05 Mb (720 Kb Images + 125 Kb Scripts + 68 Kb CSS + 120 Kb Fonts + 28 Kb HTML)
Web Server Requests89 (21 Images + 36 Scripts +15 CSS + 7 Font + 9 Other + 5 HTML)32 (9 Images + 11 Scripts + 7 CSS +3 Fonts + 2 Other + 1 HTML)
Homepage Load Time~7.5 seconds~3.3 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.

The final result is a simpler, faster, yet on-brand, website that is easier to maintain.

Site Credits

WordPress Theme Development by Scott Marlow

What Would Western Wildlife Outreach Do?

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 requestsresulting 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
Pingdom69/10078/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

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

WordPress Child Themes at Work

supply chain and logistics company website
Twenty Twenty-One is a blank canvas for your ideas. It makes the block editor your best brush. See how Twenty Twenty-One elevates your portfolio, business website, or personal blog.

WordPress’ TwentyTwenty-One template theme turned into a turn-key landing page solution for Solmark International – a global supply chain and logistics company.

Before & After Twenty Twenty-One Theme CSS Customization

Scope of Work

brand discovery
project management
content strategy
copywriting
creative strategy
art direction
color palette development
front-end web development
performance optimization
security hardening
visual design
WordPress training and consulting

BenchmarkScore
Google Lighthouse: Mobile Performance87/100
Google Lighthouse: Desktop Performance100/100
Google Lighthouse: Accessibility100/100
Google Lighthouse: Best Practices100/100
Google Lighthouse: SEO93/100
WebPageTest Speed Index2.116
Total Homepage File Size1.56 Mb
Total Web Server Requests22
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.

Team

Branding, Visual Design and Content Strategy by: Gravity Communications
WordPress Theming and Consulting by: Scott Marlow

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