Colophon 2016: State-of-the-art WordPress

Are you looking to create a quick WordPress with a professional set of modern features? Yea, well, earlier this year, I was too. (Seriously? What were we thinking, putting “quick,” “Wordpress,” and “features” in the same sentence?)

Happily, you can skip the frustration and time-sink via this colophon — a cheat sheet with all the ingredients needed to create a lean, fast, modern, state-of-the-art website in WordPress.

Too Long; Didn’t Read Summary

If you’re in a big big hurry and just need the TL;DR shopping-list version, here you go:

The Theme

The Plugins

Done! Just download all of those and configure them and you’re good to go.

However, if you’re saying things out loud like, “Whoa! That’s a lot of plugins!”  or “Wow, no caching plugin?” read on.

A Somewhat Longer and More-Taxing Summary But With Helpful Explanations

If you’re a red-pill type who’s needing a deeper understanding as to why these particular plugins represent an ideal plugin cocktail, here you go:

The Theme

Twenty Fourteen
Visuals. The Twenty Fourteen design sports an overall excellent desktop AND mobile visual design. A rare bird.

Code. If you aren’t a coder, this theme will look and work great out of the box. It was built by Automattic, the company behind WordPress itself, so the code is super lean and mean and good. 

For web developers who have attempted to find the perfect “90% there” theme and then hand-code the rest (only to discover, under the hood, a massively confusing, over-coded mess that is a nightmare to understand and maintain), this codebase is a dream. If you’re OK with a “80% there” set of CSS styles, getting the other 20% with this theme will be easy, fast, and satisfying. Let’s acknowledge that an unfortunate part of WordPress theme culture is the lure of turn-key and plug-and-play promises.

 Fourteenpress – A companion child theme that removes the left sidebar and makes the theme look less like a blog and more like a regular web site. If you planned to customize the design anyway, this saves you the step of creating the child theme. 

The Plugins

Again, as above, in alphabetical order.

Akismet – If you plan to allow comments on your pages or posts, this comment spam service blocks the obvious comment spammer bots, which is important because, like ferreting out your email spam, it can be time-consuming if done manually.  FWIW, some major sites have given up on comments — too much effort for too many trolls and spammers — turning instead to solutions like Disqus or Facebook comments.

AMP – This plugin creates a second, stripped-down, fast-loading version of your post pages (viewable by appending “/amp/” to your post links) according to the standards of Google’s Accelerated Mobile Pages (AMP) Project. And good thing too: “Google is now planning to show AMP links everywhere.

Autoptimize – In addition to “minifying” your CSS and Javascripts (taking out the extra spaces and hard returns in the code that make your files bigger and slower to download), this plugin also grabs all the various helper files and packs them into one CSS and one JS file which really speeds up your website. It even converts your small images into lightning-fast text data! (who knew?) Just turn it on and it works. A must-have performance booster.

Better WordPress reCAPTCHA – Ah, gone are the simple days. A couple of years ago, computers figured out how to read and defeat regular CAPTCHAs. Puzzles are the new black, i.e. Turing tests, and your first line of defense from getting hacked, spammed, bothered in general, etc. There are many plugins that embed the new reCAPTCHA puzzles into your site; I liked this one.

CloudFlare – This is your game changer. In the olden days, we worried about 1) caching and 2) having too many plugins that slowed your site’s speed. CloudFlare has free accounts where they cache and host your content on their speedy international network of content servers. Now your feature-rich and plugin-happy site won’t be brought to its knees by a small hoard of well-intended visitors — or a mob of ransom-seeking DDoS attackers. This is yuge. Suddenly, deploying your own content delivery network (CDN) is viable.  Go ahead, have another plugin.

Contact Form 7 – An old standby. Create contact forms or other forms easily. Large community and ecosystem. Lots of integrations with other plugins.  A basic building block.

Customize Login Image – It replaces the WordPress logo on the login page with your logo or image.  Not a biggie.  Just a pro fit-and-finish touch.

Duplicator – This unique plugin captures your whole site — WordPress, images, database content, everything! — and creates a ZIP file package that you can tuck away as a backup or use to migrate to another web server or provider.  Wow.

Easy Forms for MailChimp – If you use MailChimp, this is a good customizable plugin to start with. It lets you create unlimited forms and use AJAX to respond to user signups (versus having to reload the whole page just to say “Thank you for subscribing!”).

Enable Media Replace – Sometimes you’ll see an image on your site that needs tweaking. This plugin allows you to easily swap-in an updated version of the image. (Oddly, WordPress won’t let you do this out of the box.)

EWWW Image Optimizer – Even my images, optimized via an online tool, received a ~20% reduction in file size. It works automatically as you add images. It also has a bulk feature to shrink your previously uploaded images.

FV Simpler SEO – The SEO plugin arena has long been dominated by heavyweights like Yoast and All in One SEO Pack, but I prefer this lightweight alternative. SEO continues to change fast and seems to matter less and less over time — versus the basics of: be discoverable, use HTTPS, be mobile-friendly, be fast, and have really compelling content. Search leader Google is systematically removing ways to game the system and that’s good news for everyone.

Lazy Load – Images on your pages will only load into the vistor’s browser when they become visible to the visitor. This will quicken their above-the-fold load time and reduce unnecessary image downloads.

Page Builder by SiteOrigin – Your first plugin. Next to WordPress itself, this is a primary building tool.  It allows you to turn any page into a framework of rows and columns, inside which you can add content widgets. Powerful. WordPress is now truly a full-fledged CMS. So, whenever you need a new layout for a page, you and your editors don’t need a developer to code a whole new template in WordPress. Better still, it’s a great foundation for building responsive content for mobile.

Postman SMTP Mailer/Email Log – If you want your site or contact form to send emails to a Gmail email account, you need this plugin. Gmail’s servers regard mail sent from WordPress as a spam risk and won’t receive it.

Really Simple SSL – This plugin enforces that HTTPS is used for all of your URLs — for both your users AND for your content files, images, etc. If even one of your plugins or themes isn’t coded correctly (and, say, uses an insecure URL style), it could trigger unsightly and scary warnings, block your site, or even lock you out of your own site. Ask me how I know this.

Remove Category URL – This plugin, err, removes the “/category/” part of your URLs for category pages, i.e. turning the inelegant “mysite.com/category/foo” URL into simply “mysite.com/foo”.

Search & Replace – A dream come true. A quick fix when you need to change content not just in a post or page, but across the whole site.

SiteOrigin Widgets Bundle – This companion plugin to the Page Builder plugin, mentioned above, adds a grab-bag of content widgets including: Google Maps, embedded videos, a slider,  a simple contact form and more. I mostly like it for the rich-HTML editor you can embed in sidebars and footers (versus the default plain text widget in WordPress, which is unfriendly to editors who can’t or don’t code HTML.)

Super Socializer – There are lots of social plugins that enable you to embed social sharing icons, but this one also enables “social login” (so users can login to your site via their Facebook, Google+, LinkedIn, Twitter, Instagram, etc. accounts — versus creating an account locally inside your WordPress site).  Additionally, it allows you to add or shift to “social commenting” (where the heavy lifting of commenting is performed by Disqus, Facebook, or Google+ for the reasons mentioned earlier).

TablePress – For elegantly designed data tables. It matters.

Widget Logic – An oldie but a goodie. This plugin enables you to make widgets appear or disappear according to the logic conditions you give it, e.g. don’t display the What’s New content widget on the homepage or the contact form page, but include on all the other pages. Sooner or later, everyone needs Widget Logic.

WP Remote WordPress Plugin – If you manage more than one WordPress site, you need this. From the wpremote.com site, you can carefully control how and when to apply updates to plugins, themes, and WordPress for each of your sites.

XML Sitemap & Google News feeds – Not glamorous, but essential to your site being properly discovered by search engines. This plugin generates a sitemap XML that Google, Bing, etc. use to index your web site. You can help them help you by indicating and scoring your important pages.

The 5 Big Take-aways

When we talk about “modern websites,” this is code for: must-have features users are expecting.  Sure you could skip them, but there’s a strategic risk that Google and/or users might get an intangible (or tangible) sense that your site is not quite up to professional grade.

For your users, this perception could result in a lack of trust and engagement. For Google, skipping these aspects may well result in your site being listed lower on search results pages, effectively hiding your pages from the world. Which would be bad.

1. Discoverable. For Google and the other search engines, make sure you have an XML sitemap. For your users, use an SEO plugin to ensure your page titles and meta descriptions are consistent and accurate; these are used for your search engine page entries when users search for you.

2. Speed. Your site must be fast. Speed is a feature. Check out your site’s speed score on Google’s free PageSpeed tool.  Not just a good idea, but one you ignore at your own peril; Google penalizes sites for slow performance, especially slow mobile sites.

3. Mobile-friendly. Your theme must look and work great on your phone. This is the new normal. No longer a nice-to-have, it’s a must-have.  Open your website in your phone. Is it as compelling as it should be, compared to your favorite news or social site or app? Does it even render properly? Well, this is the new standard. (Many older WordPress themes don’t have responsive design built in, so check it out before you commit to a theme.) Again, Google will penalize sites that aren’t mobile-friendly.

4. Security. Your site must be secure. The new standard is secure by default. You might not have noticed, but all the major sites like Google, Yahoo, etc. are now using https — even on regular pages. No longer is security reserved for e-commerce or personal data forms. Free SSL certificates are now available via Let’s Encrypt, so there’s no excuse.  And yet again, Google will penalize sites that aren’t secure.

5. Social. Your site must be social. Or at least social-ish. With users spending increasingly more time with smartphone apps and in walled-garden communities (Facebook, SnapChat, Twitter, What’s App, LinkedIn, etc. ), the open web has a diminishing role in the lives of average people. Help people find you and engage with you by enabling social interactions.

Other than all of that, err, things went pretty quick.

What’s on your dream list of plugins? Did I miss anything?

Updates

2016-08-04 Added AMP

2016-05-06 Added Search & Replace

2016-05-04 Added EWWW Image Optimizer

2016-04-27 Added Lazy Load