Best plugins for WordPress security and backup

I will be the first to admit that I don’t know very much about internet security. It’s the main reason I steer clear of working on e-commerce websites and others that deal with highly sensitive information. Sure, I know enough not to use the same easy-to-guess password for everything, but when it comes to hackers, I don’t really understand how they do it, and I only partially understand why they do it.

When faced with any evidence of hacking, my usual response is to “nuke the entire site from orbit,” to use the famous quote from Aliens (1986). That is, to delete the entire website and restore from an off-site backup. Its kind of like demolishing your house when you find out you have roaches, but only if you could somehow keep a backup copy of your house and easily rebuild it once the rubble had been cleared away.

aliens-1986

Luckily for me, most of the website work I do is in WordPress, and WordPress has a large and enthusiastic community of developers who know a lot more about security than I do, and there are quite a few utility plugins available to help you detect, prevent and recover from the damage done by unauthorized use of your website.

These are the two that I recommend for just about any WordPress website:

Wordfence Security

Wordfence is my favorite WordPress security plugin. It is easy to install and use, and it has a lot of really useful features. It provides a live view of traffic to your website so you can see what countries and IP addresses visitors to your site are coming from, and it allows you to block individual IP addresses from accessing your website if you think they’re up to no good. It also has a feature that will limit the number of failed login attempts, which is helpful against hacking programs that keep throwing random passwords at your website until they find the right one.

But Wordfence’s most useful feature is a daily scan of all the files in your website, where it checks them against a database for changes, makes sure you have the most current versions of your core software and plugins, detects files containing possible malicious code, and sends you an email alert if it detects a problem. If nothing else, this serves as a great reminder when you need to update a plugin, but it might also help you detect a hacking attempt before it has a chance to get too far.

BackWPUp

Everyone knows that you should back up all your files and data on a regular basis. Everyone also knows what a hassle it is to remember to back up all your files and data on a regular basis. BackWPUp is a great automatic backup utility. You can set it up to make regular scheduled backup copies of some or all of your website files, as well as your database. It will save them wherever you like: in a directory on your website’s server, on a remote server via FTP, or to your DropBox account or a selection of other cloud storage services. Having an off-site backup of your website is a lot better than rebuilding it from scratch, and it’s really nice to have a simple utility that does the work for you.  

The Changing Face of Information

Designing for the web and designing for print are, of course, two very different animals, but not as different as you might think. Websites have a lot in common with magazines in the way they structure information on a page: leading with attention grabbing headlines, using boxes and color to call out important information, even organizing content into sections and pages. Those annoying subscription cards that fall out of magazines are certainly the paper equivalent of pop-up ads.

The differences mostly have to do with formatting. With a print piece, you know exactly the size and shape of the page, and you can completely control where everything appears and it what order. Websites are by nature more fluid; adjustments need to be made for different browsers and mobile devices, and viewers have more control over small details like font sizes, but you still have a fair amount of control over where content appears on your web page, the size of the images, font styles, and how the pages break up.

kindle-iconI recently completed formatting an ebook for the Amazon Kindle. The ebook format is like a bucket of fluid content, which the reader software pours into pages – what appears on each individual page depends entirely on the screen size and the reader’s choices of font style and size. Kindle users even have a small amount of control over the font and background colors. The format doesn’t really give the designer any control at all over font styles, colors, image placement… It was very difficult to even control where page breaks occur, which was essential for my project, a book of photographs.

In the end, creating a book for the Kindle was an exercise in patience and compromise. With ebooks, content really is king, to the point that you are forced to evaluate your content and the order it is presented in. Since you can’t rely on headlines, boxes and color to call attention to the important information, you have to make sure all your content is important.

There might be a lesson to be learned there, one that could be applied to websites and even print pieces as well.

Off the Rack: Using Pre-made Website Themes

I recently completed websites for three clients: Healthy Home Business, sculptor Todd Rau, and composer David Macbride. On all three projects I used pre-made, “off the rack” WordPress themes rather than coming up with custom designs. The benefit to the client is that most of the design and layout work is done, saving time and money. The down side is that most of the design and layout work is done, leaving little room for personalization.

In the course of selecting pre-made themes for these clients, I have identified a few things I think every WordPress theme should have:

Healthy Home BusinessTodd RauDavid Macbride

Responsive design. It should go without saying that we live in a world where tablets and smartphones are the internet browsing tool of choice. Yes, people still look at websites on their laptop and desktop machines (especially in the business world), but an ever growing number reach for their phone or tablet when they see a website address. If your website isn’t optimized for viewing on all devices, you risk alienating a large part of your potential audience.

Adapt, which I used for Healthy Home Business, is an excellent example of how to do responsive design for WordPress, with some elegant layout solutions that I have started to use for my custom website designs.

Compatibility with IE7 & 8. On the other end of the scale, it is a sad truth that many people are still using Internet Explorer 7 and 8. This is often the case in offices that bought their computers during the PC boom in the mid-1990s and haven’t upgraded since. It’s tempting to chuckle and maybe put in a “please upgrade your browser” message, but again, why risk alienating part of your potential audience?

Portfolio Press, the theme I used for Todd Rau’s sculpture website, fell down a bit here – I had to add the IE condtional code that should be standard for any theme.

Customization options. Granted, the point of choosing a pre-made WordPress theme would seem to be that the design decisions have been made by the theme designer, but just about everyone wants to customize a little bit. At the very least, controls for changing colors (especially backgrounds and link colors), a few different page layout templates, and the ability to place a logo in the header, should be standard with any theme.

I used Weaver II for David Macbride’s website, and it absolutely excelled at this. In addition to several pre-made sub-themes with different color schemes and design options, it has a simple interface that allows customization of almost every part of the theme, and it even has an advanced options page that allows additions to the CSS code without editing the style sheet directly.

Using WordPress with a pre-made theme is an excellent low-cost option for your website, and there are thousands of themes out there to choose from. But not all themes are created equal, so make sure you choose one that will give you all the options and functionality you need.

As a standard service I can set up your WordPress website for you, including helping with organizing your content and choosing the right pre-made theme (with minor alterations where needed). Contact me to learn more.

That Monkey is Everywhere

One of the things I like about designing logos is seeing the wide variety of things they end up on. In 2005 I created the logo for Danger Monkey, a signature coffee blend at Pablo’s Coffee in Denver. Over the years it’s been fun to see the Danger Monkey turn up on t-shirts, travel mugs, chocolates and the like, and now that pesky monkey is bigger than life on the side of their delivery van!

You can pick up a Danger Monkey coffee mug here, but as far as I know the Danger Monkey van isn’t available for purchase…

Website Font Freedom

Until fairly recently, website designers have been limited to designing with a handful of fonts that came standard on most computers. Any use of an interesting display font required the designer to create an image using Photoshop or something similar, and any change to the text would need the image to be re-done.

But no longer! The recently developed @font-face CSS property has made possible to embed font files into a website itself, so now designers can use whatever fonts we want.

Or can we?

The legalities surrounding the use of fonts have always been complicated, and probably always will be. Most importantly, just about every font out there was created by a designer who needs to be paid for his or her work, a concept that the world of computer use is still coming to grips with.

Additionally, the font files on your computer are software, and as such are subject to the same ownership and copyright laws as any other piece of software. This is what can potentially limit a website’s use of a particular font – if a designer wants to embed a font, the use of the font software needs to be cleared.

Many type foundries (the companies that create and release commercial fonts) have responded to this development by offering complicated membership schemes where they host your web fonts for you. This is not optimal as your website is now reliant on an outside link to display its fonts properly. One alternative is to use one of the many free tools out there to convert your font files to the web font format and host them with the rest of your website, which is fine unless those font files are under copyright. Some font websites, like the excellent FontSquirrel.com, offer free full web font packages that include all the files you need.

So, while designers have much more freedom to design for the web using whatever fonts they choose, we still need to look at the legalities and practicalities. I think the best bet is to build up a library of copyright cleared, embeddable fonts to use. With thousands of fonts available, it will still be much better than the handful we used to be stuck with.

The Importance of Being Responsive

According to a recent Nielsen poll, smartphones are in use by just over half of U. S. consumers. I only recently got one myself, but I find myself using it and my Amazon Kindle to surf the internet a lot more often than I use my laptop or desktop machines, and I can’t be alone in that habit. More and more internet users are going to be interacting with your website via phones and tablets, and you should be ready for them.

Luckily that’s not as difficult as it might seem. Thanks to some recently developed, and quite simple, CSS code, optimizing your website for mobile devices has never been easier. Just in case you aren’t familiar with the inner workings of websites, most of them consist of essentially two components: html code that determines the content of your site, and one or more Cascading Style Sheet files that tell the browser how to display that content. A relatively new bit of CSS code can now detect the width of the browser window, so you can change your website’s appearance based on the size of the viewer’s screen, and make it easier to interact with on smaller devices like phones. The web development world is calling it responsive design, and it is fast becoming an indispensable part of website design.

And yet it’s amazing how many websites aren’t doing this yet. A website without responsive design will usually display full screen on a mobile device, resulting in text that is too small to read without a lot of awkward zooming in and scrolling around. 

So if you’re thinking about a new website, or refreshing an old one, make sure you have more than just a desktop monitor or laptop screen in mind.