Header 3 not shown for mobile speed.

Save the Internet from WordPress speed abuse.

Updated: July 2017

15 minute read

Below is a description and list of 45 plugins previously used on PagePipe. Even with this many plugins, load time was under 2 seconds. It’s not the quantity, it’s the quality that makes a difference. Web designers can’t be arbitrary in loading and activating plugins. The result is slow pages.

All themes and plugins are free downloads from WordPress.org.

Description Kiyomizu WordPress child theme has a responsive 2-column post list and customizes a stock Twenty-fifteen WordPress Theme.

Child Theme Kiyomizu
Parent Theme Twenty Fifteen
WordPress Version 4.1.2

Home Page Specifications

Yslow grade 99 A

Loadtime
cache cleared 2 seconds
cache full 1 second

Server
Shared Economy Linux Apache

CDN None

Page weight
cache cleared 129k
cache full 12k
Components 13

A few theme features we removed or changed:

1. All Google fonts were changed to Arial and Impact websafe fonts in the style.css file. Those are our company publication fonts used for PDFs and web pages. We deliberately chose identity fonts for speed. The Google fonts that were being called added one second to the page load time.

2. We removed Genericons by WordPress. They are baked into the WordPress twenty-fourteen theme installation in the functions.php file. We removed all “genericons” words from the file. This reduced page weight by an additional 75k. It eliminated two HTTP calls and bought us another second of reduced load time.

3. We tweaked the headlines and titles a bit for letter spacing. We made <h1> headlines be Arial bolded instead of the default Noto Serif “700” bolded font-weight.

h1 {
color: #3E5D58; 
font-family: Arial, serif; 
font-size: 30px; 
line-height: 1em; 
letter-spacing: -1px; 
font-weight: 900;
}

Requesting Noto Sans and Noto Serif from the Google cloud was adding about 1 to 2 seconds to the page load time. The trade off for branding wasn’t worth it.

Impact is our web-safe decorative display font and is expressive aesthetic which is useful for branding and directing attention. It should never be used for body text.

The body text is generic and ubiquitous Arial which is perceived as an utility font. Arial’s classic aesthetic (Microsoft’s pirated Helvetica) is transparent to the reader. It doesn’t get in the way of comprehension or scanning before viewer commitment to reading.

These common fonts aren’t special except for being fast loading. That’s why we chose them. We aren’t the first to build our identity around fast-loading websafe fonts. Read about how Ikea insulted the type world by using websafe Verdana for it’s corporate identity and web continuity. Cool rebels.

4. The theme appearance settings allowed for color changes of backgrounds and text. We installed classic colors – forest green (#3E5D58), black (#000), and white (#fff), color scheme. Works well for low-fidelity, flat images. Body text is #333 dark gray to reduce hard contrast and eye fatigue.

5. Thematic graphic elements tie things together. Clichés accelerate understanding. Limiting the site palette to three colors, also, made super, fast-to-load PNG graphics.

6. The stock woodcuts are from a collection by Ron&Joe. The rhino woodcut is custom art by Brad Teare. Woodcuts make for fast-loading PNG files.

7. We removed the Twenty-fifteen Post entry headers. These links weren’t valuable and were bad usability. Visitors would head in the wrong direction and not get the article they needed. We didn’t need to create confusion and frustration. We added the following code to the child theme CSS file:

/* Remove entire Post entry footer */
.entry-footer {
display:none !important;
}

45 Active Plugins Used on PagePipe.com

It’s a myth that using many plugins will slowdown your website. Being sloppy in judging plugin quality or necessity is the culprit. That’s within a designer’s control. It calls for wisdom and speed testing. The best plugins add no page weight at all – weightlessness!

404page
Defines any page as 404-not-found error page. We use our sitemap page.

Advanced Tagline
This plugin gives the option to have multiple taglines for your website and display them at random or sequentially with each page view. We are taste-testing 9 different taglines (list shown below). They are randomly displayed when pages load. You can choose sequential loading if that’s your preference.

  • How to optimize WordPress mobile branding for page speed.
  • Optimize the opposition of page speed and web aesthetics.
  • Manage the eternal friction between mobile speed and branding.
  • Making WordPress websites feel right.
  • Consistent balance of speed and web aesthetics is just one UX puzzle among many.
  • Research about the seesaw balance of aesthetics and web speed.
  • Mobile marketing with WordPress.
  • Upgrading WordPress for speed.
  • Mobile-optimized WordPress Sites

BackWPup
WordPress Backup Plugin. This schedules backups and copies files to a remote location. We’re using free Dropbox file cloud storage.

Block Bad Queries (BBQ)
Automatically protects WordPress against malicious URL requests.

Better WordPress Minify
Allows you to minify your CSS and JS files for faster page loading for visitors. Not all minifier plugins work – in fact – they frequently break your site. This plugin really works. It combines (concatenates) all possible files to reduce the number of HTTP requests and removes code “white space” and comments. In our case, that was the combination of several calls. All the little things add up.

Broken Link Checker
We use a free online tool for link checking.

BruteProtect
BruteProtect allows the millions of WordPress theme sites to work together to defeat Brute Force attacks. It protects our site from brute force security attacks 24/7.

Cache Buddy
Minimizes the situations in which logged-in users appear logged-in to WordPress, which increases the cacheability of your site. Improves page load time.

Captcha on Login
Protects from login brute force attacks adding a captcha on login page. Also locks IPS after a specific number of login tries fail. Allows changing the default admin username from admin to whatever you want for better security.

Change Database Prefix (obsolete)
Changes the MySQL database prefix as a protective security measure against hackers.

Date and Time Widget
Widget that displays the local date and/or time.

Default Featured Image
Allows users to select a default featured image in the media settings.

Disable Google Fonts
Disable enqueuing of Open Sans and other fonts used by WordPress from Google. This speeds up load time. Note: Open Sans is rarely a speed problem because it is cached on so many browsers. But other Google Fonts can drag a site down by a second in speed.

Disable Google Fonts is a very lightweight, it has no settings, just activate it and it works immediately.

Disable Emojis
This plugin disables the new emoji functionality in WordPress 4.2. WP does not need emoji. Probably, the worst decision ever by WordPress Core is enabling emojis by default, and providing no way to disable them. WordPress core developers should have a disable setting instead of us installing another removal plugin. Emoji functions add 5.6k to 14.7k page weight and 2 or 3 HTTP requests to a site. Waste.

Emoji are the 12-pixel-square-grid ideograms, emoticons, or smileys used in Japanese electronic messages and Web pages, the use of which is spreading outside Japan. Originally meaning pictograph, the word emoji literally means “picture” + “character”.

Beyond the standard emoticon-type “smileys”, there are hundreds of emoji, ranging from plants and animals to people, objects, vehicles, food, the Sun and Moon, and more.

Disk Usage
We removed this plugin after testing because it increased page load time by enabling “prototype.js” – a fat javascript file. It added around 100k to the page weight. Bad.

Email Address Encoder
A lightweight plugin to protect email addresses from email-harvesting robots by encoding them into decimal and hexadecimal entities. We’ve used these techniques for a long time and it really prevents email spam.

Enable Media Replace
Enable replacing media files by uploading a new file in the “Edit Media” section of the WordPress Media Library. Just a handy utility for swapping out images fast. It’s best to disable unused plugins or remove them after production for security reasons.

Far Future Expiration Header
This plugin will add a “far future expiration” date for various file types to improve site performance. This is a best practice advocated by the Yahoo Extreme Performance Team. It keeps files and images cached longer. There is also a radio button to enable Gzip – a nice addition.

FD Word Statistics
Computes Gunning-Fog, Flesch, and Flesch-Kincaid readability indexes about posts as they are edited for the purpose of improving their readability.

Image Clean Up
This plugin allows you to delete all unused images. It looks for all images not referred to by any post, page, or widget within WordPress. Removal reduces wasted space on your server.

Infinite Scroll To Twenty Fifteen obsolete
One-click add Infinite Scroll to Twenty Fifteen theme with animation effect. Built to work only with the theme we wanted to use. We couldn’t help but use the plugin for it’s lightweight and coolness factor. It improves the 2-column post list.

jonradio Current Year and Copyright Shortcodes
Perpetual-copyright plugin for WordPress. Provides Shortcodes to display the Current Year and/or a Copyright symbol. Shortcode inserts the © Copyright symbol, a blank and the current year. Place this plugin’s shortcode almost anywhere. We used a sidebar text widget. You’ll always appear fresh and up to date.

Light SEO
Automatically optimizes your WordPress site for Search Engines (Search Engine Optimization). Optimizes your titles for avoiding the typical duplicate content found on WordPress sites. Easy for beginners, it works out-of-the-box. It’s lightweight.

Media Library Alt Fields
Lets you change image alt text from the media library. This is good SEO practice and helpful for screen readers.

My Eyes Are Up Here
Detects faces during thumbnail cropping and moves the crop position accordingly.

One-Click Child Theme
Easily child theme any theme from wp-admin wp-admin without going into shell or using FTP.

Optimize Database after Deleting Revisions
Optimizes the WordPress database after cleaning it out. This flushes the deadwood from the MySQL database that WordPress uses. MySQL is provided by your hosting company.

Post Type Switcher
Allow switching of a post type while editing a post (in post publish section). This plugin saved us a lot of work. We had 30 pages of existing content we wanted to convert to posts so we could use the dual column effect provided by the Kiyomizu child theme. It was done in a matter of minutes. Beautiful.

Responsive Notification Bar
A lightweight, only-5k, plugin that places a sticky message and Call to Action button at the top of your website. It’s very simple, only 5kb in size and well coded. We’re using it to promote free PDF downloads. the default colors were hideous. We changed those in the plugin editor to match our color scheme.

Rocket Lazy Load
A tiny Lazy Load script for WordPress without using jQuery or others libraries. Lazy load is a method of delaying loading non-critical images that are “below the fold.” This technique buys about 1 to 2 seconds of faster perceived load time. Rocket Lazy Load automates everything.

This tiny script (less than 2k!) displays all images in a post or widget, thumbnails, avatars and emoticons as users scroll down your site. It doesn’t come with any options or customizations, just install and activate this plugin and let it do it’s thing.

ShortPixel Image Optimiser
ShortPixel is an image compression tool that helps improve our website performance. The plugin optimises images automatically using either lossy or lossless compression. Resulting, smaller, images are no different in visual quality from the original. The plugin can do this as images are loaded or can retrofit your image library. Retrofits can take about 20 minutes of computer time. So go make a sandwich. The savings results are shown in your media library for each image.

Simple Basic Contact Form
Simple, basic, plug-n-play contact form for WordPress. Contact Form 7 plugin may have a lot of popularity downloads (millions) but it is not the fastest or safest contact form. Newer plugins are lighter and more secure – like this one.

Simple Drop Cap
Simple drop cap plugin. Transforms the first letter of a word into a drop cap or initial letter simply by wrapping the word with a shortcode. We used two methods of building drop caps. Some were by CSS inline code. That was necessary to keep the post’s drop caps from appearing on the front page excerpts. Too much visual noise for our taste. But the used by the plugin is much faster and global for pages. This plugin is easier to customize and use than some others we’ve tried.

Below is the custom CSS style we placed in the Simple Drop Cap plugin settings panel:

float: left; font-size: 193px; font-weight: normal; color: #3E5D58; line-height: 89px; text-transform: capitalize; margin: 0px; padding: 20px 0.08em 20px 0px; font-family: Impact, Haettenschweiler, Charcoal, AvenirNext-Heavy,  sans-serif;

Simple Image Widget
A simple image widget utilizing the new WordPress media manager. Simple Image Widget is the easiest way to add images to your sidebars.

Simple Scroll To Top
Smooth-and-simple, scroll-to-top, plug-and-play plugin helps to add a “Back to top” feature to your site. Very lightweight compared to others.

Simple Sitemap
A HTML sitemap is a list of pages of a web site accessible to crawlers or users. It helps with findability and SEO to display content as a single linked list of posts and pages, or as groups sorted by classification (via a drop-down box). Just create a page titled sitemap and place the simple-sitemap shortcode on it. Works great and again is lightweight.

Standout CSS3 Buttons
Display CSS3 style buttons with gradient color styles on your website using popular social media colors. We wanted more “flair” than just text links for our call to action (CTA) at the bottom of posts and pages.

To speed up this plugin, we stripped all of the 24 button colors we weren’t using. We were only using “midnight.” The speed savings were significantly improved. It was worth it. We used the Plugin > Editor again to make this happen.

Super Simple Google Analytics
Bare bones option to simply insert the basic Google Analytics tracking code into the head section of every page without any fuss. We later disabled this plugin and just use the Visitor Mailer plugin (see below).

Tipso
Simple tooltip plugin that displays a responsive, animated, fully customizable tooltip when the visitor hovers over the matched element. Test it here.

Title Remover
Gives you the ability to hide the title of any post, page or custom post type item without affecting menus or titles in the admin area. It’s handy. It’s just a select box on the page or post. On or Off. Easy.

Visitor Mailer
Receive an email update of the number of visitors to your site. We hate using Google Analytics because it’s slow. It requires calls and wait time and adds page weight. We only need reassurance that people are coming to our site. We may get more sophisticated someday and start measuring bounce rate and clickthru. But not yet. We aren’t selling pet supplies or trendy clothes.

Visual Subtitle
Allows part of a post title to be styled as a subtitle or deck. The subtitle is still within the title level 1 or 2 heading, but is wrapped in a span to be styled differently.

A deck is one or more lines of text found between the headline and the body of an article. The deck elaborates or expands on the headline and topic of the accompanying text. Size the deck type somewhere between the headline and body text to provide contrast. We modified the CSS to make the deck Arial ALLCAPS, half the size of the headline, and with loose letter-spacing.

A deck is a visual signpost or cue that lets readers know where they are and where they’re going. Signposting breaks up text and images into readable, easy-to-follow blocks or panels of information. A deck is a visual signpost helping readers assess an article before committing to reading the whole thing.

We modified the subtitle or deck styling in our child theme by adding the following CSS code to the end of the style.css file:

.subtitle { 
    display: block;
    color: #000;
    font-family: Arial, sans-serif;
    text-transform: uppercase;
    font-size: .6em;
    letter-spacing: 1px;
  }

WordPress Popular Posts
Customizable widget that displays the most popular posts on your blog. We use this on the 404 page. We later disabled this because it wasn’t adding content value.

WP jQuery Plus
Loads jQuery from Google and is nicely compressed and minified. Plus there’s a failsafe. If it doesn’t respond, it just loads the onboard WordPress version. jQuery is usually one of the biggest chunks of code in WordPress. It needs special attention. Loading WordPress javascript files from Google’s Libraries rather than serving directly from your WordPress install, will – in theory – reduce latency, increase parallelism, and improve caching. Note: To get the browser to download more assets in parallel, you can serve them from different domains.

WP Resized Image Quality
Change the compression-level of uploaded JPEG images and thumbnails. Get better image quality or save bandwidth.

WP Super Cache
Caching plugin for WordPress. We find this plugin doesn’t always help with speed. But in this case, it did. So we used it. The benefit at best case was 500 milliseconds gain. We’ll take it.

WP Updates Notifier
Sends email to notify you if there are any updates for your WordPress site. Can notify about core, plugin and theme updates.

Secret download: css backup child >

PagePipe helps you balance performance and mobile branding.

Godspeed—

Steve Teare
performance engineer

Mobile WordPress Speed – without coding!

What others think of us:


"Bloat was out, lean and speedy sites on multiple platforms with easy editing was the new target. Steve hit the bullseye with our new WordPress sites … Give Steve a call if you're serious about a highly effective website for your business or organization." visitpalouse.com Washington, USA

by - Mike Milano