Mobile-Friendly Web Design for Writers

Snail

by C.K. MacLeod

Writers and editors are encouraged to build platforms—websites and blogs—to connect with readers and showcase books and services. After running analytics on my site, I learned that a surprising number of readers were accessing this site on a smartphone. Your readers may be interacting with your site on a smartphone, too. Is your website mobile friendly? Try Google’s Mobile-Friendly Test to find out.

A Smartphone-Savvy Site

How does your site behave on a smartphone?

  • Is it easy to navigate?
  • Does it load quickly?
  • Is the font large enough so readers can read your content, without having to pinch and spread?

A surprising number of sites don’t meet this “mobile-first” design criteria (mine didn’t). Why? Many sites have been designed for desktops and laptops and haven’t yet adapted for small-screen viewing.

Below are a few tips to help you make your site small-screen savvy. Don’t worry, you don’t need to be a web developer to execute these ideas.

Choose A Responsive Theme

Many writers use WordPress to build websites. WordPress comes with a multitude of beautifully designed themes that you can choose from. But here’s what I didn’t know: not all themes perform well. Some themes, while pretty, can make your site run slow, and others are not necessarily designed with small screens in mind. When searching for a theme for your site, choose a responsive theme that will work on desktops, tablets, and smartphones. Type “responsive” into the WordPress search box while searching for themes to see your options.
Note: Weebly offers free responsive design themes, too.

Choose Function over Form

What’s more important than a pretty, multi-column visual feast is a website that’s easy to navigate. I’ll admit it, the current design for this site is pretty no-frills when viewed on a desktop computer. But it works surprisingly well on a smartphone. Consider sacrificing some “splash” if it means a better reading experience for readers.

Consider the Default Theme

Each year, WordPress developers design a new default theme for WordPress users. The latest theme is aptly named 2015. In the past, I’ve tended to ignore the default themes, not realizing that the current year’s theme is—according to Morten Rand-Henrickson, the instructor of WordPress Essentials at Lynda.com—the most stable free theme available from WordPress developers. It incorporates the most up-to-date features in web design, including smart design features for small screens.

Cellular networks are slower than wifi networks. After installing the WordPress 2015 theme, my site speed improved on a smartphone. If you want to keep your smartphone readers engaged, finding ways to improve your site’s speed will matter. While there are lots of ways to do that (I’m only beginning to discover other improvements I can make), selecting a light and stable theme is a great place to begin.

Mobile-first design is the way things are heading. Have you discovered any tips to make your site work for an audience of smartphone users?

Image by Vasile Hurghis

6 Steps for Building an Author Website

Building blocksby C.K. MacLeod

Creating a website involves a few steps that can be a little confusing at first. Here are the basics:

1. Choose a domain name.

Your domain is the web address people will use to find your publishing company. Put a great deal of thought into what you’ll name your site, and make sure it’s easy to remember. There are many do’s and don’ts for naming a web site; you may want to consider all of them.

When you decide on the name of your website, you’ll need to see if that domain name is already taken. You’ll then need to purchase your domain name from a site that offers domain names for sale. Go Daddy is a popular domain registrar, but it isn’t the only choice. You may be able to purchase a domain name through your web host (see below).

2. Choose a web host.

A web host is a company that hosts your website. Think of hosting as space you rent on the Internet. Again, there are many web hosts to choose from, so do your research. I use Bluehost because it

  • offers 24/7 support for the first year,
  • has some great website building tools,
  • offers a free domain name for one year,
  • will allow us to build more than one website with the same account, and
  • offers five free email addresses.

3. Choose a website building tool.

Website building tools are designed to make setting up a website easier. Gone are the days when you’d have to hand code your website in HTML.

WordPress is a popular open-source website building tool with lots of features, but if this is your first website and you’re looking for something easy to use, the Weebly website building tool is by far the easiest way to begin.

Building a site with Blogger is an option, too, if you’re interested in blogging or setting up an author website, and not selling anything from your website.

I recently switched over to WordPress so I can make use of some of WordPress’ time-saving plug-ins. Both WordPress and Weebly have options for setting up an online store, or using plug-ins that will let you to sell books from your website.

4. Follow a tutorial.

Weebly is pretty intuitive, and I found I could just experiment with Weebly’s drag-and-drop features to set up a website with little frustration. WordPress was another story. It’s packed with features, and it can take some getting used to. I followed this tutorial by Simon Whistler to set up my Wordpress site.

5. Use a website checklist.

Once you have your website set up, you’ll want to consider what features you’ll need. A website checklist can help you to make decisions and keep you on track.

6. Build anticipation.

Your website doesn’t have to go live right away. It can go live when you’re ready. See if your website building tool has a “coming soon” page template or plug-in that you can mount while you work on your website in the background.

For more information on the ins and outs of setting up a website, see Jane Friedman’s post, Self-Hosting Your Author Website: Why and How to Do It.

Image by André Hofmeister

Updated. Originally posted at Beyond Paper Editing.

Blogging in Markdown—Without a Plug-in

Go around please sign

by C.K. MacLeod

Writing in markdown can make your blogging process more efficient. If you’ve been blogging in WordPress, until now, you’ve been able to use a markdown plug-in, such as Markdown Quicktags, to convert markdown to HTML for reliably formatted blog posts.

Unfortunately, Markdown Quicktags no longer works with WordPress 4.0, and the developers have no plans to update the plug-in (thanks to Nina Amir for this information). What’s a blogger to do? Until better options become apparent to me, it’s time for a temporary workaround.

A Workaround

This workaround involves a few extra steps, but it’ll work.

  1. Write your blog post in markdown, in a word processor of your choice.

  2. Copy and paste your post into the left pane of the Jon Combe markdown editor.

Text written in markdown is on the left; the formatted version is on the right

 

 

  1. Download the HTML file generated by the Jon Combe markdown editor by clicking on the button with the angle brackets (highlighted in yellow).

Jon Combe HTML button

 

  1. Open the HTML file in a code editor like Notepad++ (free). Open the code editor first, then open the file from within the code editor. Note how you’re now able to see the HTML tags in blue.

HTML in Notepad++

  1. Select the text with HTML tags and paste it into the Text tab in WordPress’ editor.

This workaround works for Blogger, too. In Blogger, you’ll paste the text with HTML tags into the HTML tab.

Do you write in markdown? Have you discovered a new markdown plug-in that works with  Wordpress 4.0? Do you have another workaround?

Image by Taber Andrew Bain