Distraction-Free Writing in WordPress 3.2
As a fan of WordPress, as soon as 3.2 was released, I found myself reading the changelog. While doing so, I noticed a very intriguing feature addition:
Start writing your first post in our redesigned post editor and venture to the full-screen button in the editing toolbar to enter the new distraction-free writing or zen mode, my personal favorite feature of the release
Zen mode? Distraction-free writing? Sounded good, so I proceeded to update all my WordPress installations. To fully impress upon you how significant of a feature it is, here’s what the typical WordPress WYSIWYG editor looks like:
It’s a full-featured page, that’s for sure – but it also has quite a lot of controls surrounding it. The text editor itself loses some screen space to these controls, even vertically – requiring a scrollbar. I often find myself resizing the editor by dragging the bottom right corner, until I have the maximum vertical space available to me. While this works, WordPress does not actually remember my preferences, forcing me to manually resize whenever I’m working on a post.
Now, with all that said, take a look at full-screen mode:
Full-screen mode is a highly simplified version of the regular WordPress editor. All you really have is the toolbar at the top, subtle outlines of your title and content sections, and a lot of free space.
Then, two seconds later:
The controls disappear, making it so only the content is visible. When this originally happened, it was a bit of a shock to me, as I realized that having the full WordPress interface around the content (as I typed) gave me some re-assurance. It kept telling me when it auto-saved, the word count, stuff like that. But in this new mode, I seemed to be on my own – what if I accidentally navigated away? I barely felt like I was in WordPress anymore – it almost looked like completely different application. It’s at this point that I tweeted a message to @wordpress:
@wordpress Good job guys, I really like the new dashboard design. Full-screen editor will take some getting used to, though – but it’s nice.
After writing that, I stepped away from the editor, and only returned to it a few days later – when it was time to write a blog post. It’s at that point that began to see how useful it was. The toolbar appears whenever you hover your mouse towards the top of the page, no matter how much you’ve scrolled. The same cannot be said about the regular editing mode, so this is a definite improvement. If I accidentally press Back in my browser, I get the usual warning that I might lose information – and I can cancel it. So, there’s really no need to worry about navigating away.
The other features I mentioned, namely, the auto-saving and the word count, are still accessible from this new editor. You can save whenever you want by making the toolbar appear, and click Save. I’m not sure it actually saves automatically, but I find it instinctual to save manually, so at least for now, this isn’t a problem. The word count can be found at the bottom of the page, right after the content. It’s at that location that you can also see a slogan, which says, quite simply, “Just write.” I really like this, as I feel it truly sums up the spirit of this new feature – it is meant to block out all excess interface noise, and let you write, distraction-free.
At this point in time, I exclusively use the full-screen editor when working on my posts. It’s a very refreshing feeling, having just my content to work with – and I commend the WordPress devs for adding such a feature.
Top 10 Blogging Tips (Part 2)
This article is the continuation of Top 10 Blogging Tips (Part 1).
It is highly recommended that you read Part 1 before this page.
5Respect Copyright Laws
Photo by Clyde Robinson
Everything you can find on the internet has some sort of author behind it, and it is important to respect the rights of those authors. For example, when I’m writing a post about a particular subject, I could easily hop on Google Images, and get some related images that I can use on my blog. This is easy to do, and I can get these images up on my blog fairly quickly – but is it legal? Most of the time, no. If the the guy that actually created those images ever realizes I’m using them, he has a valid reason to bring a lawyer into the mix. I’d be pretty much stealing his images, oblivious to the rights he has as the creator.
To ensure I don’t violate the rights of content creators, I specifically look for images with licenses that suits my needs. My favorite source is Flickr, as they have a really good way to display and search for image licenses. Their advanced search has an option called “
I usually check them both, which ensures that the images listed are all available for me to use, in whatever way I chose. There are still rules I have to follow, but Flickr does a good job of describing them… and I’m more than happy to comply.
The same goes for text, or other media. If you’re going to include someone else’s work, take steps to ensure you are respecting them in the process. Also, no matter what, make sure you always give proper credit to the creator.
4Leverage Social Networks to Attract Additional Visitors
There are three main areas that I would like to showcase in this section: auto-publishing, sharing, and social reactions. I’ll approach them in chronological manner, as it best reflects how my blog evolved in this department.
A while back, I installed a WordPress plugin called WordTwit. With it, I was able to have my blog automatically post a Twitter update whenever I released a new blog post. When people started visiting my blog from these automatic tweets, I realized that I had discovered a new, easy way to expand the number of readers I received. After all, it really wasn’t much trouble to set up, and it certainly couldn’t do harm. Since then, apart from adding my blog to Technorati, and a few other directories, I haven’t added more automatic posting mechanisms. I did, for a brief few weeks, try setting up auto-publishing on Digg v2, but it turned out to be so broken that I gave up on it. It took a long time to detect new posts, and even then, only half were being discovered properly. That said, I recommend auto-announcing content to social networking sites, wherever possible and functional -but care must be taken to ensure the audience doesn’t feel like they are receiving spam.
Beyond auto-publishing, I wanted to make sure that it was easy for readers to share my articles with their friends, if they wanted to. To do this, I installed a plugin called AddToAny, which supports a huge amount of social networking services. Sure enough, I eventually saw that readers were sharing my posts on Google Buzz, Facebook, and the like. Once more, supporting this was really trivial – and it benefits bloggers, as well as their readers. Eventually, after months of using Twitter actively, and years of using Facebook, I also added two prominent buttons to my posts: Twitter’s Tweet Counter, and Facebook’s Like Button. Together, they further encouraged sharing, while also providing me with visual feedback whenever readers approve of my content.
Finally, I recommend using a commenting system that supports Twitter reactions, as they are very similar to comments. Personally, I have recently started using Disqus for this.
Combined, the improvements I made in the three areas above have lead to increased readership, as well as improved personal satisfaction in the content I produce.
3Review Obsessively
Photo by Karen Chichester
As I write posts, I often take breaks to re-read the progress I have made so far. These multiple iterations allow me to spot problems early on, and also ensure my post is flowing in the right direction. Once I reach a point where I feel the post is complete, I treat it as a candidate. Before I deem it acceptable to post publicly, I load it on my phone, and step away from the computer. The physical disconnect from my computer allows me to view the article as if I was a reader, not the author. As I’m reading, I take note of problems I find, as they will all need to be corrected before the post goes live. I then use my browser’s Find feature (CTRL+F) to search for any double spaces that may have been mistakenly added to a post. Spell-check doesn’t normally look for such mistakes, so I have to check manually. Once I’ve done all that, I consider having another person review my post. Since they’re completely unfamiliar with it, they might see mistakes that I have been missing.
2Include Relevant Images
Back when I was simply a blog reader, rather than a blogging myself, I recall discovering the Wall of Text effect. That is, whenever I was faced with an article that contains a huge amount of text, I was discouraged from reading it. There are many factors that can help alleviate this effect, but the most useful I’ve found is simply adding relevant images. Even with good formatting, a large blog post can be intimidating… but images tend to space out the text, and make it seem like you’re not being assaulted. When doing this, make sure that the images themselves are relevant to the text, as opposed to random photos that exist purely to space out the text. Jeff Atwood of Coding Horror had a really great way of looking at this:
As the old adage goes, a picture is worth a thousand words. But you should no more insert a random image into your writing than you would insert a thousand random words into your writing. I don’t care how beautiful your photographs are, it’s a terrible, irresponsible practice that distracts and harms readability.
1Split Long Posts Into Multiple Pages
With long blog posts, sometimes including relevant images won’t be enough to ward off the Wall of Text effect. Personally, I find that when a post approaches 2000 words, it is better to release it as a two-parter (1000 per part), rather than one giant offering. Formatting and relevant images can only do so much in distracting users from the abundance of words on a given page. However, great care must be taken to ensure users aren’t angered by the multiple pages. All too often, I see web site splitting content across pages purely to increase the ads presented to the user. For me, nothing is more infuriating than having to step through an ad-infested post, with little valuable content per page. I usually give up on the second page, and make a mental note to never visit the website again. Performance is another key factor here – loading the next page shouldn’t interrupt the reader for too long, otherwise they might just get irritated.
When executed sensibly, I feel the multiple page approach can be beneficial on multiple fronts. It improves user experience, makes it easier for bloggers to write huge articles, and could potentially improve search engine rankings. Now, I haven’t found a conclusive article to confirm the search engine benefits, but the way I see it – more pages of quality content can’t be a bad thing.
Got tips? Feel free to share them in the comments below – I’m always interested in learning more.
Top 10 Blogging Tips
When a friend of my mine started blogging, I found myself offering him tips by e-mail. I realized that with 2+ years of blogging experience came some new knowledge, so I decided I should probably share what I’d accumulated. I normally avoid blogging about blogging at all costs – but I felt this would be a good moment to make an exception. The tips I’m sharing below are not meant to be seen as the true, all-powerful top 10 laws that a blogger must abide by. They are merely guidelines that I have deemed important for my own blog, and felt might be useful to others as well.
10 Avoid Bandwidth Theft
Some web authors find creative ways to punish bandwidth thieves. (Photo by Tom Raftery)
It is important to remember that anything found on the web is hosted by a computer somewhere, and that computer is connected to the internet through a service provider. This could be a computer owned by an individual, or one owned by a hosting company – either way, the constant is the service provider, which usually requires money.
So, for example, if you found an image at Wikipedia that you wanted to use, you could technically copy the path to that image, and reference it directly on your own blog or site. Even if you have the right to use that image according to its license, the fact that you are using the Wikipedia URL to access it means Wikipedia is hosting the image, not you. Unless you have explicit permission to use a direct URL to their image, it is considered bandwidth theft. Wikipedia pays to publish their content to the Internet, and therefore likely has bandwidth limits to respect.
Assuming I have the right to use a given image, there are two approach that I use to avoid stealing bandwidth:
- I download the image and host a copy on my own server. I can then use my own image path in my blog post, ensuring I’m the one paying for the bandwidth.
- I download a small version of the image, and host a copy on my own server. Then, if the user clicks on the image to expand it, they are brought to the Flickr page that represents it. I use this approach often when interacting with Flickr, as it helps control my bandwidth consumption, while offering readers the functionality of Flickr. The only downside, of course, is that if the image is removed from Flickr, I only have the small version on my blog.
Regardless of the method used, copyright laws must be respected – but I’ll cover more about that later in the Top 10.
As a content creator, if you want to prevent others from stealing your bandwidth, I suggest reading Blocking Image Bandwidth Theft with URL Rewriting from Coding Horror. If you’re not a developer, most blogging platforms have plugins that help in implementing such security measures.
9 Always Use Descriptive Link Text
It is common on the web to see words like “click here” or “this” used as a link, but it has no value from a search engine optimization perspective.
Search engine optimization (SEO) is the process of improving the visibility of a website or a web page in search engines via the “natural” or un-paid (“organic” or “algorithmic”) search results.
In fact, you’re missing out on an SEO opportunity whenever you do this. What I do is structure my sentences so that the link can be something descriptive, like this:
GOOD: If you want more information about the plugin, make sure to check the project page on my website. To download it, or see how my work on it has been progressing, see the All Due Credit page in the plugin directory.
Saying “click here” would definitely be easier:
BAD: If you want more information about the plugin, click here. To download it, or see how my work on it has been progressing, click here.
…but I avoid that at all costs. I rather have descriptive text hotlinked, as it tells the user and Google what to expect if they click the link. If the link can exist without the rest of the paragraph, and still be understandable, then you’re set. “click here” is meaningless without his paragraph. Also, the concept of “clicking” a link should be common knowledge at this point, so there is little value in repeating it.
8 Vary Wording Within Each Post
When I write posts detailing a problem I encountered, I often try to describe that problem in a few different ways. When I do this, I am specifically trying to mimic the different ways that users would describe the problem when they type it into Google. In doing so, I’m actually increasing the chances that people will find me through Google searches, and I’m also making sure my writing isn’t very repetitive. A good place to do this is in the image ALT, as it is normally not visible to visitors. The ALT is usually used when visitors are using screen readers, or when the browser doesn’t support images. One important thing to note is that the Google Crawler does not see images – so the ALT is pretty important, as it will be considered by Google. Also, when adding different wording, make sure that the choices you make don’t comprise the clarity of the message.
7 Ensure External Links Aren’t Helping Readers Leave Your Blog
Photo by Fox Wu
By default, when someone clicks a link found on a website, it will load in the same tab (or window). Web developers can change this behavior on a per-link basis, and so it is no surprise that blogging software allows this flexibility as well. When I author blog posts in WordPress, I configure all links pointing to external sites to open in a new tab, rather than load in the current tab. Launching a new tab ensures that the viewer can return to your blog if they want to, rather than truly navigating away from your page. This approach is especially valuable in my case, as I like to add multiple links to my posts, in case people want to know more.
6 Treat Posts as Private While Writing, and Public When Finished
Most blogging software I have encountered seem to treat new posts as drafts, and when published, they are immediately made public. WordPress is a good example of this – while this may be appropriate for some bloggers, I personally find it exceptionally annoying. Just because I’m creating a new post, doesn’t mean I will finish it in one shot. I’m the type of guy that makes multiple edits, some of which made be split across a number of days. I like being able to click “Update” to save a post in progress, rather than avoid the “Publish” button until everything is done. So, to ensure I never accidentally click “Publish” while editing an incomplete post, I change the visibility to “Private”, and immediately click “Publish”. Private posts are only visible to those that are logged into the blog, and in my case, that’s just me. Thanks to this approach, I know I will never accidentally publish an incomplete post to the public, and I will be able to click “Update” as many times as I wish.
This article is part of a series. Click below to continue reading.
Read Part 2 of Top 10 Blogging Tips
Archiving Tweets Using WordPress
Since I began using Twitter actively, I’ve been looking for a reliable way to ensure my tweets will be forever accessible. In my experience, Twitter never offered an easy way to locate old tweets. From a profile page, a user can keep loading tweets by simply scrolling down the page. That scroll-to-load approach works, but it takes a lot of time, and there’s no guarantee that Twitter will allow this mechanism to load thousands of additional tweets. As far as I can tell, there’s no simple way to find a tweet from June 2010, for example – even if you try to search by text, it won’t necessarily be found. It seems to me that Twitter prioritizes recent tweets, and eventually removes the older ones from their index. While I find this is somewhat appropriate for Twitter, I would prefer having the same confidence I have in Gmail. Regardless of how many e-mails I write, I know that Gmail will always keep them around.
After trying a few potential solutions, it eventually hit me: what if I could have one WordPress post per tweet? I would have no problems locating old tweets, as the WordPress search feature works quite well. The resulting database would be easy to manipulate, and completely under my control. Not to mention the huge amount of plugins available at WordPress.org. A couple hours later, I had the WordPress solution implemented, and am still using it today.
To get it working, I used two key WordPress plugins:
1) Twitter Importer by Brad Touesnard
I used Twitter Importer to retrieve all tweets that had already been published. This is necessary because the automatic tweet importer only handles new tweets.
2) Twitter Tools by Crowd Favorite
This plugin, among other things, is capable of automatically importing new tweets. To get it working, I had to register an application with Twitter, which is a bit odd – it seems like something only a Twitter application developer would need to do. In any case, once I got that configured, Twitter Tools began to import new tweets automatically. The rest is really a matter of preference: for example, I decided to disable comments, pingbacks, and other features that I felt weren’t inline with my intentions. I also downloaded and installed a WordPress theme that looked suitable for microblogging: P2, by Automattic.
The only imperfection I noted is a bug that I’ve first seen in Google Buzz. Twitter recently improved the re-tweet action, allowing users to simply click a Retweet button, instead of manually replying with the “RT @username” prefix.
Consider this tweet by Liana Maeby:
Being better off alone is super til you need to open the jar to trap the spider who’s crawling around where you’ve fallen & you can’t get up
— Liana Maeby (@lianamaeby) March 15, 2011
It is exactly 140 characters, the maximum allowed for a tweet. When re-tweeted, here’s how it looks:
Looks great; no “RT @username” pollution, instead, a clean icon in the top left corner. It seems like Twitter is handling it internally, rather than simply adding the “RT” prefix to the tweet. Yet, when you view the same re-tweet from outside Twitter, different story:
(as seen from Google Buzz)
(as seen from my WordPress-powered Twitter archive)
In these cases, the “RT @username” prefix is visible – and it actually uses up part of the 140 characters. If the tweet was 140 characters to begin with, this means the last few characters could be sliced off to make room for the prefix. Not only that, but an ellipsis is added to convey that the original text has been truncated. Since this is happening in Google Buzz, I’m ready to write this off as Twitter bug. It’s unfortunate, though, because it means my Twitter archive is truly imperfect. Tweets could be missing content, which sometimes means a URL gets chopped in half.
Imperfections aside, I believe I found a decent way to archive my tweets, all the while without changing the way I already use Twitter. Plus, my Twitter Archive includes links back to my other websites – so it should also be useful in bringing in new visitors.