Case Study: PagePipe.com

Ecommerce + Email Marketing

Example product family.

Guest Post

This case study was written by Steve Teare of PagePipe.com. Steve is a website performance engineer.

Project Sketch

PagePipe is a leading debunker of mass misconceptions surrounding page speed.

Our specialty is building mobile-first WordPress websites. We curate content about WordPress performance optimization. Our obsession is mobile page speed. That differentiates us from other web developers.

Why should I care about site speed?

Speed affects website user experience. Everyone hates a slow site.

This article focuses on PagePipe’s ecommerce store: SpeedHospital.org, and the email marketing work on our blog: PagePipe.com.

Matt Stern produced the following deliverables:

Web Graphics
Custom graphics enhance or enable the representation of something intangible – idea, feeling or digital product – to reach the site user.

Prototype Page Design
A website prototype is any mock-up or demo of what a site will look like when it goes live. It can be anything from a paper sketch, to a clickable HTML prototype. Matt did the latter. Also referred to as
*rapid* or high-fidelity prototyping.

Custom Coding

Landing Page Design
Unlike web pages, which have many goals and encourage exploration, landing pages are designed with a single goal, known as a call to action
(or CTA, for short).

Mailchimp Email Marketing Integration
Mailchimp is an all-in-one marketing platform that helps you share emails, ads, and other messages with your audience.

Email marketing on average sees a 4300 percent return on investment (ROI) for businesses in the United States. This is because email marketing is easy to manage, gives you full control, and allows you to establish a direct connection with your customers.

Custom graphics included:

  • hero images
  • badges
  • infographics
  • medical-motif product packaging
  • manual covers
  • family-bundle illustrations

Project Gallery

An infographic is a visual image such as a chart or diagram used to represent information or data. Matt designed and created 7 infographics. One for each product page. The goal is making the data and benefits easily understandable at a glance.
Product family hero images: A hero image is an oversized banner image at the top of a website page. Since the products are intangible, downloaded intellectual property, Matt created group illustrations of imaginary product lines.
He used pharmaceutical-style packaging to reinforce the sites medical metaphor of healing slow websites.
A call to action is an invitation for a user to take some desired action. You often see call to action examples in persuasive writing. Once a brand has made its case in a blog post or video, for instance, they'll often include a call to action at the end.

Note: All images were optimized by-hand offline before uploading as PNG or JPEG files.

Each downloadable product bundle includes an ebook (PDF). Matt designed the covers for continuity.

Email Marketing

Landing Pages

%

Landing pages don’t need to be flashy to produce results.

These two pages convert visitors into subscribers at rates of 59.2% and 51.3%.

What does PagePipe do anyway?

PagePipe improves site origin optimization. You then avoid increased website annual overhead cost caused

by popular and paid plugins and theme rental fees. Also, it reduces hosting costs with cheaper shared servers and no CDN or server cache fees. The

 performance goal is two-second page load times or better. Our approach to solving mobile performance problems is unconventional 

and creative. We always use free resources whenever possible. We provide speed 

alternatives for International site-owners and developers who use low-cost, shared hosting without CDN.

We use free Twenty Seventeen default theme on all our three sites.

We use shared hosting at https://www.rochen.com/ and https://godaddy.com/

Each site uses a different theme set up using standard features in the WordPress customizer.

 

Example Product Concept

PagePipe uses free plugins for customizing stock themes.

We use 28 free open-source plugins on Speed Hospital. Some are our proprietary forks of old plugins. Some plugins are obsolete and no longer offered in the WordPress plugin directory but still work. We feel these relics are gems.

All our plugins are strategically chosen with speed and cost in mind. We don’t use any paid premium plugins.

Test Results for SpeedHospital.org

Webpage Speed Test Results:

  • Time to First Byte: 644 milliseconds
  • Load time 1.78 seconds
  • 7 requests
  • Page size 254 kilobytes.

Click here to see test results.

Pingdom Speed Test Results:

  • TTFB 550 milliseconds
  • Load time 895 milliseconds
  • 13 requests
  • Page size 382 kilobytes.

Click here to see test results.

How Our Design Philosophy
Informs Our Choices

We’re examples of what we preach for speed. This site deliberately doesn’t use a pagebuilder like Elementor. We don’t advocate pagebuilders for extreme mobile speed. They’re a necessary design compromise when a site owner needs drag-and-drop page creation. We use creative workarounds instead.

We did use Elementor as a rapid prototyping tool to speed up pre-production design. Rapid prototyping doesn’t use wireframes. Pages are built live.

We then found creative ways to duplicate the resultant “look and feel” without using the pagebuilder.

This proves our philosophical point: You can achieve a “pagebuilder-look” without a bloated pagebuilder. But you must enjoy solving puzzles with creativity. The harsher the self-imposed limitation; the more valuable creativity.

Example Product Concept

The Speed Plugin List

Autoptimize
This plugin speeds up our site. It does caching, concatenation, minification of JS, CSS, and HTML, removes emojis, removes query strings, and does smooth image lazy loading.

BleuT FavIcon
The fastest way to load a favicon without using WordPress bloated customizer method (site identity > site icon).

Block Bad Queries (BBQ)
A firewall plugin for improved site security.

Classic Editor
Disables Gutenberg block editor.

Code Snippets
We add custom code to fix decimals in Easy Digital Download plugin.

Current Year and Copyright Shortcodes
Provides shortcodes to display the Current Year and/or a Copyright symbol.

Date/Time Now Button
Adds a Now button to the right of date and time fields. We use this when updating pages and posts.

Disable Comments
Globally disables comments.

Easy Digital Downloads
A lightweight eCommerce plugin for selling digital products (ebooks and plugins and video).

Easy Publisher
Makes publishing posts and pages easier.

Easy Table
Converts a comma-delimited .csv file (exported from Excel) into an HTML table using a short code.

Exclude Image Thumbnails From UpdraftPlus Backups
This conserves space on our cloud backup space. The original, full-sized image is included in backups. Thumbnails are excluded. If a restoration from backup is needed, regenerate thumbnails plugin is used.

https://wordpress.org/plugins/regenerate-thumbnails-advanced/

Instant-jQ
Our plugin to speed up the loading of jQuery.

Limit Login Attempts Reloaded
A security plugin to prevent brute force attacks. It limits the rate of login attempts for each IP address. Also provides XMLRPC gateway protection.

LongCache
Leverage browser caching by setting browser expiration date to 365 days.

Peanut Butter Bar (smooth version)
This is a sticky notification bar with button link. We selectively activate this plugin only on product pages to feature our bundle offer. We customize the colors using custom CSS code placed in the Simple CSS plugin in the WordPress customizer.

Remove Google Fonts References
Removes Google Fonts. This causes fallback to system fonts. We use Arial and Impact fonts.

Responsive Pricing Table
Present our offerings to our visitors. We use custom code in Simple CSS to modify the look and colors.

Simple CSS
We can add custom CSS code to individual pages or globally in the Customizer.

Simple Drop Cap
Transforms the first letter of a word into a drop cap or initial letter when we wrap the word with shortcode [dropcap].

SpeedSwitch
Selectively enable and disable plugins by page to speed up our site.
The plugins we selectively activate or deactivate are: Responsive Pricing Table, Easy Digital Downloads, Easy Table, Peanut Butter Bar, and WP Image Borders.

Title Remover
Allows us to hide the title of any post or page without affecting menus or titles in the admin area. We don’t use it on posts. But we do on most pages.

TourniKit
We use this plugin to dequeue 5 unused or unneeded scripts including wp-embed, wp-block-library, wp-block-library-theme, twentyseventeen-block-style, and twentyseventeen-fonts.

UpdraftPlus – Backup/Restore
We backup the site with weekly automatic schedules to a free Dropbox cloud storage account. We can restore anytime needed.

WP Author, Date and Meta Remover
We remove post meta data without any settings. This is to assist in keeping content appearing evergreen and fresh.

WP Counter
Site visitor counter. We don’t use Google Analytics.

WP Image Borders
We selectively add image borders to one blog post pictures.

WP Show Posts
We list posts using categories anywhere on our site with a shortcode.

WP Sticky Sidebar
Makes blog post sidebars sticky for better user experience. The floating sidebar menu is visible at all times. This makes it permanently visible while scrolling.

About The Author

Steve Teare is passionate about helping savvy website owners speed up their websites and save money in the process. His approach combines creative problem solving with technical WordPress know-how. Learn more at Pagepipe.com

Interested in a project like this?

Other Projects