WordPress Usability

We had a great show with Frederick. The full transcript is below, but listening to the show might give you some more feeling for it!

Good evening everybody and welcome to the second episode of Press This. Tonight I have with me a guest that has become a friend even though we still have to meet in real life as opposed to online.

My guest tonight is Frederick Towne and he’s the founder of both W3 Edge and W3 Markup and he’s the CTO of Mashable and the designer of great looking sites like well mine and loads of others but we’ll probably hear a bit more about that tonight.

Frederick thanks for being here.

My pleasure, its’ great to be back on Webmaster Radio.

You’ve been here before and so you know the drill a bit. We tend to be annoying if you just talk too much and talk to the chat room all the time. We actually try to put in some content as well sometimes.

As I just told everyone, you designed my site and you designed quite a few others. Could you name a few?

It varies quite a bit as far as what the listeners might be interested in. But we’ve done some of the gossip sites out there, we’ve done a number of different social networks for like Awareness Networks, for example, Mashable I’ve done design work there over the years. Wow it’s difficult to really rattle them off. But I think mostly where I weigh in on most of the projects is just contributing creative direction and trying to optimize the user experience and conversion optimization and performance and all that kind of good stuff that hopefully we’ll touch on a bit in our chat here.

Sounds good. How do you start a design process like that? We started on my design it feels like ages ago but it’s actually just a short while ago. What are the main things you find important in a blog’s design?

For me I think probably the most important thing is just understanding what is unique about the blog. The blogosphere in general obviously saturated, saturated is the wrong word, it’s more dense and it’s difficult to differentiate, especially with the way content is commoditized these days.

So it boils down to what can we do visually that makes this blog appear unique, compliments and sort of develops the brand. Then from there we have to just work backwards towards making sure what we come up with still actually performs, scales, is usable and so on and so forth. Again, it’s really just figuring out first and foremost how to make that blog unique in a very big blogosphere.

Yeah I can honestly say that I think you did a great job on mine. But that is really the hard thing because it is really quite hard for bloggers to find what makes them unique. Do you have any quick tips or ideas on how people can be looking at that to do it for their own sites?

From a design standpoint you really just want to make sure you know what your brand is, you know what your slogan or tag line is and your look and feel of your blog as well as the content that you produce is consistent with that. It’s a very difficult thing to do, it’s easy to say but difficult to do.

As long as you have that in mind when you craft your content and when you work with your designer to produce your site you’ll be in good shape because it takes time to develop a brand and it takes effort to remain consistent.

So the quick tip is know what your slogan is, know what your brand is and what you want to be known for and just be consistent.

Yeah so you touched a bit on speed and usability as well. What are the main things you see bloggers do wrong there?

That is a really hairy question. I think wrong is maybe a strong word. I don’t think that bloggers really set out to slow…

Let me be politically correct, where can they improve?

Yeah because everyone wants to take a nice theme and plug ins off the shelf and try to get to work. The biggest things you want to do as far as keeping your site nice and zippy and making sure your readers are happy and want to continue to generate page views for you is make the site liked. If that means you have to use, you have to get a consultant to come in and clean up your plug ins so that you don’t have 30 java script files being loaded before anybody can read a page, so things like that. So making sure that the absolute, everything that is in your theme that has to be sent to the reader so they can actually view your blog has the smallest footprint possible, loads as quickly as possible so if that means you need a CD because you have global readership you need to look at that. (6:47 – tape skips)…that you’re not putting your functionality and look and feel ahead of what people came to your site to do which is read.

So you really have to work backwards there and either work with a consultant or if you like to get into your own Word Press theme really just open up Fire Bug or grab Why Slow from Yahoo and just see what is going wrong there and literally just work backwards and start with the things that are the most crucial. What is slowing you down? Then tackle those and try to avoid things with diminishing returns, try to optimize your database when database performance isn’t an issue.

Yeah. Usually you see this go wrong with java script and images?

Exactly it’s usually java script with your plug ins because in generally a lot of plugs ins refer to (7:50 – tape skips) who sees ads and things like this which are becoming popular as people try to commoditize their blogs and the user experience. They have to use java script because you can’t necessarily at least in a simple way, you can’t detect different things as far as who is visiting your site from the server side, it has to be done on the client side.

So it means that a lot of plug ins are introducing java script and while you certainly need it, your goal is to engage the user and hopefully monetize your blog and get a little bit better. You ultimately end up adding seconds to your page load and the bottom line is why does all this matter. It matters because the longer it takes for your site to load the more likely you’re going to suffer from attrition. People are going to come to your site once and never want to visit again. Maybe that’s fine if you want a lot of RSS subscribers. But in general people still like to visit sites and if you have a lot of java scripts or you’re not using sprites in your imagery or you’re just not optimizing your imagery at all, just because you want to have a great image in your post, you’re still going to be alienating people when they still try to pull that up in their feed reader.

So there really is no escape from making sure that you’re doing everything possible on your part even though everybody has broadband and everything else to make sure your site is fast. Let’s face it when a site is fast we all want to spend time on it, more time on it and as far as applications are concerned and rich user experiences on blogs today which is happening more and more, people learn how to use your website faster if it responds faster to them. So the learning curve is reduced when your site performs better.

So there are really critical issues that people need to be aware of if they want to have a rich user experience.

For the listeners out there that don’t know what sprites are, could you give a 2 line explanation?

Sure basically what you do is instead of having numerous small images; you combine them into a single image and use CSS to position them in the page.

Okay and you say request but you still have to load all these images of course as one file instead of 20?

Exactly so you’re speeding up your site tremendously because every time you have to download a file, especially a very small file there is all that, for lack of a better word, hand shaking that goes on to actually download that file which is actually ultimately wasted time.

Yeah. We’re going to break and after that we’ll come back with Frederick and talk a bit more about optimizing Word Press for speed and usability.

(ADVERTISEMENT)

Welcome back and we’re with Frederick Towne talking about designing usability of Word Press blogs. Frederick, one of the things I would like to get into is how do you design a great subscribe button for RSS or email? That is the kind of thing I keep telling people that your RSS button can’t be big enough, which probably isn’t true. I always tell them to emphasize those buttons more then they usually do.

I think the 2 biggest probably factors for lack of a better word to calling out those things are literally the positioning and the call to action that you use, the actual copy or text you use around those buttons. More than likely I think it’s safe to assume that people are very, very familiar with RSS and email subscription. So how that button looks and things of that nature, making it red and all those kinds of things are really up to you and your discretion.

But I think positioning, depending on the layout of your site, positioning that RSS or subscribe button or form on the left and (14:31 – tape skips) nice crisp copy that says why they would want to subscribe or join is absolutely vital. That is something that you and I discussed about your site quite a bit and I think we had some great results just tweaking the copy a bit and making sure the button isn’t, the RSS button isn’t the most pronounced thing on the site but it’s easy to find and people know why they want to go ahead and click on it.

Yeah and one of the things I always tell people is to put text below posts as well because that’s when people are finished reading and might want to stop reading and come back for more later. The thing is you want to squeeze as much info in the area just below the post between the comments. What do you think are major important factors there?

That is a great point. That is the balance to the main button you have featured throughout your site is to literally have various point where you call them to action. So again a great plug in is Who Sees Ads and with that you can introduce your own copy. So if people are coming from various places like search engines or Digg or things of this nature you can literally say hey I know you want to subscribe to my content or whatever it is and call them to action in that way.

Also like you’re saying literally positioning, it depends on how your site is organized but definitely between comments or on your home page post roll possibly between posts are great positions to literally call the people to action and say subscribe here or join the newsletter mailing list.

It really depends on your layout but in general those are the bread and butter.

Yeah and as far as social buttons go, I see Pat from (16:43 – inaudible) in the chat room and a shout out to him but which kind of buttons would you usually go for? Would you pick like 5 or 6 for a site or go with 20? What works best in your experience?

Typically what happens is I recommend people actually try to add to any or share this and literally just keep an eye on what their reader’s are actually using. Then once you know focus on those buttons so you can get more use of them. So instead of using share this or add to any, maybe tuck that away and put it somewhere less pronounced and then have your key buttons your Share, Facebook, your retweet, and your Digg button obviously, have those, call those out and use those in a branded format. In other words, don’t use custom buttons unless your site is very high profile or you know the way you’ve designed your custom buttons is going to get clicks.

So that is usually what I recommend, try it all, figure out what works and then once you know what works use those things to make your readers happy.

Cool. I see someone else in our chat room complaining about his Admin, his Word Press Admin is slow as Word Press Admin gets loaded with more java script on each release it seems. Do you have any tips on improving that?

That is a really tricky one. The WP Admin has actually gotten faster over the last releases, especially major releases. But really in my experience I see WP Admin speed up when the actual performance of your front end, of the actual blog itself is improved. So when your blog itself is actually less demanding on the server you find that WP Admin is more responsive. Is that your experience too?

Yeah on my site it is absolutely. When we’ve been optimizing Yoase.com. As my blog got faster and faster at the back end, I do have to say using the turbo option, so using Google’s what is it called?

Google Gears?

Google Gears yeah actually helps a lot if you’re on slow connections. So I usually use that and especially on my own dashboard. But there are some plug ins which make it awfully slow so I just try to avoid those.

It’s difficult right because you want that functionality because you want your site to be engaging or you… I know what it’s like. If someone comes out with a great plug in and you want to drop it in but you really have to be judicious and make sure that you don’t undo everything you’ve worked on.

So which plug ins would you recommend?

Wow I’m excited about a lot of them out there. Maybe we should pick a genre?

Let’s go for speed and the speed optimization stuff. Do you like WP Super Cache for insTance?

That is a staple and a bread and butter for a lot of blogs out there as you can probably see from the stats on Extend. But I recently just came out with a plug in that is in 0.5 or Beta basically right now and hopefully another update coming out this week. And it goes far beyond what anyone has ever done for Word Press thus far combining CDN functionality with minification which is reducing the weight of various objects including pages, java scripts, and also has memory caching for your pages, for your minified java script and CSS and database caching. So it’s really, really robust and hopefully by version 1.0 I’ll have this for all those folks out there with shared hosting environments, etc.

Are you using that on Mashable?

Actually we did try it out on Mashable earlier today and we had some issues because we’re actually saturating our network right now which is a problem. So we have to solve that issue before we can get back to this one. So we’re going to have to look at some upgrades.

But for my blog it actually took us from I think an 8 second load time to about 2.8 testing, so it’s huge and I don’t even use a CDN, I just use a sub domain to improve pipeline, it helps your progressive render. So I’m not trying to say too much jargon and basically the point is that you can bake in these little tricks that shave just full on seconds off your load time and make your site just amazingly fast.

Someone was asking in the chat room how many plug ins Mashable uses? I don’t know if you can answer that.

I can’t really answer that, it’s not a lot though. When we look at a great plug in we try to test it out. If it really addresses a business need, we will run it. a lot of times we work with the plug in authors to get things the way we like if we can and if we can’t often times we end up just writing things ourselves.

So I would venture to guess that most bloggers have more plug ins then Mashable does.

I know I have way too much of them. At last count I was over 50 and then I stopped counting, which is probably a bad idea for most people to do.

Yeah I mean you really have to know what you’re doing.

Another plug in I have blogged about a while back I think Don’t Smush It and Smush It Circus from Yahoo as well I think is that included in your plug in as well?

No I don’t think I really get into imagery although I’ve been experimenting with deflate and PNG files but nothing there too interesting yet. So no nothing with imagery but I think Smush It is phenomenal actually.

Yeah it is. I’ve seen weird things happen to especially jpegs on my site. Another question from the chat room and honestly have to chuckle a bit about it. ... is saying he had like 250 visitors on his site at the same time and that caused his blog to crash. How many visitors should a blog be able to handle at one time?

It probably really depends on the server you’re running on. I know the server I’m on should easily handle 250 visitors at the same time but it really depends on your configuration. What do you reckon about that?

That is a really, really complicated question. In general, like a virtual host from let’s say Media Temple or something, in general they can’t really sustain that with how they’re put together. If you were doing a good job with memory caching maybe you could squeeze that performance out. But if you had a dedicated server sure you should be able to do that.

The things that are going to slow you down are the same things that Yoase and I already talked about which is using sprites and using as few images as possible and using your CSS properly, reducing the number of objects in your page, take your 50 java script files and make them into 1 if you can and compress them as well so on and so forth. Those are the things that ultimately reduce your server from scaling because it keeps having to deal with these transactions as opposed to, instead a visitor being 15 transactions its 70 so of course your server can’t scale and you end up getting multiple servers. When really all that you needed was to just streamline that and reduce the weight of things.

I see that happening a lot. I’ve got some more questions from the chat room so we’ll just be going through them. Jethro who is actually from WP Tavern and has his own webcast podcast as well which is great if you want to hear the latest news about Word Press, definitely check him out.

He is asking whether someone who manages Mashable full time goes up against scrapers? He says if I’m linked from Mashable I get spam track backs from sites scrapping your content. I know I’ve had loads of issues with that on Yoase.com as well. I get like usually 20 to 30 blogs scrapping my content within 10 minutes of me posting something.

Well the bots are really rough. There are a lot of ways to deal with them. For the most part if they’re really just taxing your service just pop into you AC Access file and figure out their user agent and just redirect them all to an HTML page and you’ll find that your server can deal with that quite nicely.

But in general you do want the traffic. The scrapers aren’t really so bad, you’re getting your content out there and it’s getting picked up and it’s a good thing. So just make sure your theme can sustain the traffic and you’re in good shape.

Let’s keep going with questions as I got one more. Sweet is asking whether writing a function.php is better or worse than writing a plug in. To be honest I don’t think it really matters. I don’t know whether your experience is different Frederick?

Well it is a good question. Really if you’re writing something to funciotns.php it is something you don’t really need to modify. It doesn’t have any settings to deal with, it’s already nice and crisp well performing code and you just need it to run to make your theme happen. So if it’s that simple go ahead and put it in functions.php and keep things simple, why not? If you run something like an (27:44 – inaudible) like I don’t know, APC for example just go ahead and drop it in there and don’t use the plug ins if you don’t have to that’s my recommendation.

Okay as we seem to be getting a lot of questions and absolutely keep them coming we’re going to take a quick break and then after that come back and ask some more questions from the chat room.

(ADVERTISEMENT)

Here we are and another question from Jethro which is not reoptimization related but it’s a good question so I’m going to ask it, he asks what the time span is between an upgraded Word Press versus in doing the upgrade on big sites like Mashable?

In general it depends really on what is addressed in the update but usually they’re rolled out as soon as they’re available and the latest version of Word Press 2.8, 2.7 it’s very, very easy to put those updates in play right in production without obviously having to take your site down or things like that. So Word Press is great and everyone should roll out those updates as soon as they can.

Do you do those upgrades on a (31:41 – inaudible) first or do you just do it and roll back if it’s gone bad?

The process has improved so much but we will always test before we just roll it out to production but in general there is very little to fear although we are always optimistically cautious.

Yeah my experience is that even though I am, I mean I’ve had a couple of downloads go bad on the updates. And then something goes wrong and you’re searching for hours to find out what went wrong and then you do the update again and it’s actually just fine because something just went wrong in unzipping or downloading the file.

Exactly.

We’re getting a lot of questions which I absolutely don’t know the answer to and you might, in North Texas, Steve is asking he has a mid size feed belt forum and he wants a Word Press landing page added to that. (32:49 – inaudible) and he asks if you have any suggestions on that? I’ve never used feed belt so I don’t really know and I don’t know whether you have.

I have used it but I have not tried to bridge them. I’m assuming he’s just talking about making the user base available in Word Press from his V Bulletin install. I don’t really know of any plug ins that do that. I don’t mean to discourage him but I would say hey have a look at Buddy Press and actually moving over everything to BB forum as possible as well. It should be possible to get a consultant who can make those 2 databases talk and pull the content around. But no I don’t have a more direct answer for that one. That’s a good one.

No me either, it’s a hard question. Sorry to dodge that bullet. Some of the other stuff we’ve talked about regarding design. What section do you think is the section that most people forget during their design that they should be paying more attention to?

What section of a page? That’s a good question. I think the sidebar is often neglected. When you look at a lot of blogs the sidebar is kind of like a dumping ground for various widgets and what not. That is really not what your sidebar is for. Your sidebar really needs calls to actions, it need to direct people to whatever information or actions you want them to take and I’m not trying to bash any particular plug in but it’s not just supposed to be full of Google Friend Connected, avatars and things like that.

You really should think through what you want to do with it and there is nothing wrong with Google Friend Connect that’s just the first thing that popped into my mind. But that is usually what is neglected. A lot of time we spend time with the masthead, navigation, color choice and how big the logo is and stuff like that and topography and so on. But the sidebar often like I said is a dumping ground.

Yeah I always tell people to take out 20 widgets from the sidebar and then come back complaining about performance.

Exactly.

I think it’s insane how many widgets people can put up there sometimes. There is a lot of good content in the chat room but Sweet is asking if there is a good place to find plug ins, themes, and functions for Word Press MU. I don’t know how much you’ve used MU right now. I’ve been using it quite a lot lately and I can only give one more shout out and that’s to the guys as WPMuteOut.org who do the most fantastic premium stuff at WPMuteOut.org and have a couple of great themes there and plug ins I couldn’t live without anymore. It is just absolutely great stuff. So that is some of the stuff I would recommend.

The good thing about it actually starting with Word Press 2.8 just plain vanilla Word Press, Word Press has started loading WPMU plug ins, so if you create an MU Plugs ins directory in your Word Press install from WPMU Plug ins in there or other plug ins that don’t need configuration it will automatically load them without you activating them in the back end, which is probably going to be abused at some point but it works fine.

Do you have any other areas people should go for WPMU?

To be honest no. I was actually thinking about the instrumental in the WPMute.org contest which is (37:10 – inaudible) and off the top of my head I don’t really look elsewhere beside Extend itself if I need to.

Yeah same here. I see we’ve gotten through all the questions, well one more came in so we’ll take one more and wrap up. They’re asking if we’ve got some plug ins to prevent us from getting hacked? The best thing you can do in my experience to prevent getting hacked is for starters rename your Admin user and give it a proper password and I neglect to do that myself to be honest. Any other stuff you do?

There are a lot of little ones. It depends on how far under the hood you would like to go. I (38:07 tape skips) Apache can fix things that you can do as far as making sure it’s not too obvious what version of software you’re running, in addition to making sure that any kind of injections or compromises wouldn’t have the same rights to the data on the server as an authenticated user would have. There are little nitpicky kinds of things but in general it all boils down to how solid of an application Word Press is and so on and so forth as well as keeping your install up to date. I really never see anything, I mean like this latest thing going around with all these forgotten password request and everything else, if that is the best the hackers can come up with…

Yeah well if they can reset my password without actually getting it themselves, if that’s the base issue we have, we don’t have a real issue there any more.

Exactly.

Frederick I want to thank you. This has been a great show and we’ll probably have you back at some point to take more of these questions. But thanks for now and we’ll talk more soon.

My pleasure thanks for having me. Cheers.

So thanks everyone, next week if all goes well we’ll have Carl Hancock of Gravity Forums here talking about the new plug in which I hope will be released by then. And the week after that and yes we have a show plan actually, we’ll have Mark Jaquith, the Word Press leader talking about the future developments of Word Press. So we’ve got some nice shows coming up. Be sure to tune in next week and see you then.