Author: David Tiong

WordPress image sliders – home page slider – good or bad?

image sliders good or bad on websites

Sliders and website design

Also referred to as image carousels and slideshows, sliders are a common design aspect on many websites. Seen as a way to visually present images, or other content including text and videos, the concept of a slider is based on the idea of using a slide show to present to your audience.

There was a time when image sliders were very popular, like anything new and shiny. However many online marketing experts would now argue that sliders are ineffective and even “suck” – that they contribute to confusion (visitors miss your messages) and hinder conversion (difficult to use) on websites.

Others say that a slider can improve the initial interest in a website – kind of cover page for your website, or a way to introduce your business.

Whichever way you look at it, sliders and any other design ideas that are used on websites, must be considered on a case by case basis, not just whether they are popular or not, or whether they worked for one type of website, but not another.

My opinion is that image and content sliders can be a valuable visual asset on a page, especially on the home page, but to be effective one must do more than just adding images, setting a transition speed and choosing an transition effect.

How to decide if a slider is right for me?

Going back to what a slider is, a simplified web version of a slideshow, making a decision should be based on whether the slider can offer something that is useful to the design and functionality of your web page.

Questions you should ask yourself include:

  • how will a slider benefit the person viewing?
  • should I use images only, or images and text?
  • will each slide link to a key page on my website?
  • will a slider cause confusion?
  • how does the slider help user pathways?
  • does a slider fit in with the rest of the design?
  • what impact does a slider have on the position of other page content?

Also it is important to consider your audience and what they might expect to see on your website. What first impressions are you looking to give? What kind of business are you in? If people landing on your website are expecting to see plenty of visual media and photos, then a slider can also be a great tool to display this.

Forgotten considerations when using a slider

If you decide that a slider is a good fit for your home page, then there are some other very important things to consider that are often overlooked.

Will you display your slider on mobiles and tablets, or just at full size on desktops and laptops?
– If you are considering using a slider then make sure you are using a responsive slider
– Test it on smartphones and tablets to be sure that it works effectively
– If you are using text overlay, then reduce the amount of text on smaller devices, or better still replace the slider with a static image banner on mobile phones

How long does your home page take to load?
– Test the loading speed of your website’s home page before and after implementing a slider
– Optimise images before uploading (see point below)
– Use less slides rather than more
– A slow loading page increases “bounce rate”

What did you do with your images before uploading to the slider?
– Never just purchase an image without optimising first
– Resize to the maximum dimensions of the slider
– Compress to the minimum resolution that doesn’t impact image appearance
– Rename all image files with search engine friendly filenames, not something like image1834509345053480803.jpg, but rather business-team-member-support.jpg

How to choose a slider?

Many great themes already have a jQuery slider built in. By choosing a theme where the slider is included, you don’t have to then try to integrate one manually. You can see how it will look on the page, and also this saves on issues that can arise with 3rd party slider plugins that may conflict with theme scripts.

If you are concerned about a slider making your home page too slow to load, then grab the URL of the theme’s demo page and plug it into something like GTMetrix to test how long the page takes to load.

Some themes include a copy of a premium 3rd party plugin slider, that you can implement. Or you might have to find one yourself. Either way it is important that the slider is the best WordPress slider for the job.

You can find out some stats on slider loading times by viewing a recent article and tests by Chris Lema titled “How do you find the best WordPress slider” – He tested 20 and found some interesting results.

If you do choose a slider plugin, then make sure that the developer is maintaining the plugin, and also check what support is included. With so many updates and upgrades in WordPress each year, compatibility is really important.

What is your experience with sliders?

I’d love your feedback by answering one question in my survey – What are your thoughts on image sliders to show off content on a website?

If I get enough responses, I’ll publish the results back here in the near future.

Filed under: DesignTagged with: ,

4 rules you must follow if you want to succeed

4 steps for success

Life is becoming too complex. There is too much going on, too much information overloading our lives. Our minds are wandering aimlessly in the digital clouds, following every aspect of the lives of others and keeping up with what’s trending daily.

And if we continue this way our heads will explode. Well probably not literally, but certainly we cannot possibly filter the constant and never-ending stream of information, and somehow hope to maintain productivity in our own lives.

You may disagree, but I observe that people are doing more and more, yet seemingly achieving less and less. I hear people constantly saying how busy they are, that they don’t have time to exercise, don’t have time to spend with their families, don’t have time to sleep, don’t have time to do the things they’d really love to do.

Why are we so busy? Technology was meant to make life easier, not more complicated.

I myself am guilty of this! So what can be done to make sure that we achieve the things in life that are important to us?

Well I have a challenge for you. Try to follow these 4 rules for the next few months. Don’t forget to use the hashtag when sharing your ideas, photos and experiences on social media. If you have a great tip to share with others then make sure to include the hashtag. If you mention @mrdavidtiong in your tweets then I can retweet as well.

Rule 1: Be Now – use the hashtag #BeNow

Be Now

Life is getting more complex. Apparently we must do this, and we must do that. With no time to stop, breathe and reflect, how do we know where we have been, where we are now, or where we are going?

“Be Now” is about stopping right now and looking at where you are. It’s about being aware of what is happening around you. Aware of what is happening in your own life. Aware of your momentum.

Are you moving forwards, are you moving backwards, or do you think you are moving but really you are staying in the same spot, like running on a treadmill?

Decide where you want to be this time next year, and think backwards from that goal to see the path that joins where you are now, with that place you want to be. Do you really want to be in the same spot you are now, or perhaps you would like to be closer to reaching your dreams and aspirations?

Life is short, so don’t just show up. Be present, be where you want to be. Don’t waste your time or the precious time of others. Do you really need to read each article, do you really need to understand every concept, do you really need to learn that latest trick?

If you think you do then you will never have enough time in the day or night to get to where you want to be.

#BeNow is all about continuously being aware of exactly where you are at each moment in time. Being aware of how you feel. Being aware of the people around you and your relationships with them. Being aware of what is filling your day. This is the only way to keep on track with your purpose and your why.

Rule 2: Be Short – use the hashtag #BeShort

Be Short

This is not an excuse to be rude to others by being short with them, nor the permission to take shortcuts when you shouldn’t.

No, this is all about not over-complicating things. Think simplicity and minimalism. What 3 steps do you need to reach that dream or goal?

Keep procedures simple!

Obviously some projects and activities require many little tasks, however keep on track by trying to break each task into 3 steps. If you think in 3 steps then it’s easier to keep from running on the spot or chasing your tail in circles. Layout the 3 steps. Write them down. Tick them off when you are done.

Start today with your first step. Whenever you are faced with a new task, stop and decide if it’s really important. Is it really necessary? Is it really going to get you where you want to be?

Note that I’m not saying to be selfish and neglect others if they don’t fit into your goals. What I am saying is that we often decide to take on tasks that we think are important to our businesses and to our lives, however if we consider how they actually fit into the bigger picture, then we might see that often they are not actually important at all.

#BeShort is all about seeing the bigger picture and thinking what can I eliminate to simplify. Eg. If you type an email, before you hit the send button, stop and think about the purpose of that email. Will this purpose be clear and obvious to the receiver? Can this email be read and responded to in 3 minutes? Remember that people have limited time and limited concentration so #BeShort

#BeShort is about seeing the shortest path between 2 places – where you are and where you want to be, the start of a project and the end of a project, the pain of a problem and the joy of a solution.

Rule 3: Be Bold – use the hashtag #BeBold

Be Bold

A boy and his dad were walking along a path one afternoon. Ahead they could see that there was water across the path. The boy turned to his dad and asked “What chance do you think I have of jumping all the way across that big puddle?”

The dad paused for a moment and then replied “It’s a big jump, do you think you would make it?” The boy then decided that he wouldn’t try because he might land in the water. So the pair walked around the puddle and continued on their way.

Suddenly the dad burst out “You had no chance of making that jump”. To this the boy glared at his dad in disgust, then turned around, took a run up and leapt over the puddle with ease. “See you were wrong dad”.

The dad smiled, “No I wasn’t wrong son. As long as you thought that you couldn’t make it, you had no chance whatsoever. But when you changed your mind and decided that you could do it, then you took a chance and made it happen.”

This is what #BeBold is all about. Taking risks, making mistakes, realising that sitting safely on the sidelines watching the game go by doesn’t get you anywhere.

So be bold, be brave. Remember that if you are failing, then you are actually getting somewhere. “It is better to fail at doing something, than succeed at doing nothing”.

The following comment, from possibly the greatest basketball player of all time, sums up #BeBold

“I’ve missed more than 9000 shots in my career. I’ve lost almost 300 games. Twenty-six times I’ve been trusted to take the game winning shot and missed. I’ve failed over and over and over again in my life. And that is why I succeed.” ~ Michael Jordan

Rule 4: Be True – use the hashtag #BeTrue

Be True

What does it mean to Be True? In simple terms it means to be a real and genuine person- authentic, not a faker, not a hypocrite.

Often in our quest to reach our destination, we start to lose our originality and our individuality. So remember who you are. Don’t strive to be someone else, someone you’re not.

I stay true to myself and my style, and I am always pushing myself to be aware of that and be original ~ Aaliyah

Remember who you are and why you have chosen your path, make time to reflect, to breathe and to share with others. Being true is about being you and being thankful for what you have – both your talents and your imperfections.

People will tell you what you should or shouldn’t do. It’s easy to get caught up in what is trivial or superficial. Be sure to stay true to your core values. Follow your instincts and let your values determine your choices in life and business. Don’t be afraid to be honest.

Being true is also essential in your relationships. True friends can be relied on whether you’re happy or sad, whether times are good or times are tough. Be a true friend.

Be True is also about doing what is right – Give more than you take. Be Generous. You can apply this philosophy in so may areas of life, in relationships and in work.

Getting Started

Start today. #BeNow #BeShort #BeBold #BeTrue. Try the challenge and take back control of where you are and where you are going. Share the images above by hovering over them and share to your Social streams.

Filed under: LifestyleTagged with: , , , ,

Add Nivo Lightbox to WordPress using shortcode function

jQuery lightbox Nivo

A popular jQuery plugin for displaying images, galleries and videos in a lightbox is the Nivo Lightbox. It’s simple to use and responsive which is great for making sure that your photos look great on any device including phones and tablets.

There are some easy to follow instructions on the Dev7Studios website for how to setup, otherwise they also offer a WordPress plugin for purchase.

But if you feel like adding Nivo Lightbox to your WordPress website without using a plugin, you can create a shortcode function and include the required jQuery files following the procedure below. Before you start though, make sure that your theme doesn’t already have a lightbox feature that you can use.

How to add lightbox to your WordPress website

Step 1: Download the files

Download zip file from https://github.com/gilbitron/Nivo-Lightbox

Step 2: Extract files and add to your website

Create a folder called “js” inside of your childtheme folder (if you have followed along in some of my other tutorials you might have already setup this folder). Inside this “js” folder create a new folder called “nivolight”, where you will be adding the required Nivo Lightbox files.

Extract the downloaded zip file. Find the following:

  • “themes” folder
  • “nivo-lightbox.css”
  • “nivo-lightbox.min.js”

and FTP upload them to your “nivolight” folder.

Step 3: Setup options

Create a javascript file to setup the lightbox options and choose the selector for Nivo Lightbox. Inside the file put the following code, and amend as you feel like based on the options available.

/* Nivo Lightbox Scripts */
var nivoeffect = nivolightboxing2.effect;
jQuery(document).ready(function ($) {
    $('a.nivolight').nivoLightbox({
        effect : nivoeffect
    });
});

Save the file as “nivolightboxjs.js” and then FTP upload that file into the “nivolight” folder also.

Notes: the selector ‘a.nivolight’ is to target the <a> links with a class of “nivolight”, and the variable “nivoeffect” is being set to contain a parameter passed from shortcode using wp_localize_script.

Step 4: Create shortcode function

You will need to setup 2 functions, one is for registering the scripts and styles. The second one is for creating the shortcode. Add these functions to your childtheme’s “functions.php” file, or otherwise an mu-plugin file.

function nivolightbox_scripts() {
    wp_register_style('nivolightboxcss',get_stylesheet_directory_uri().'/js/nivolight/nivo-lightbox.css');
    wp_register_style('nivolightboxdefaultcss',get_stylesheet_directory_uri().'/js/nivolight/themes/default/default.css');
    wp_register_script('nivolightbox',get_stylesheet_directory_uri().'/js/nivolight/nivo-lightbox.min.js',array('jquery'),'',true);
    wp_register_script('nivolightboxjs',get_stylesheet_directory_uri().'/js/nivolight/nivolightboxjs.js',array('nivolightbox'),'',true);
}
add_action('wp_enqueue_scripts','nivolightbox_scripts');

function nivolightbox_sc($atts, $content = null){
    $nivolightboxing = shortcode_atts(array(
    'effect' => 'fade',
    'url' => '',
    'thumb' => '',
    'alt' => '',
    'title' => '',
    'type' => '',
    'gallery' => '',
    'text' => ''
    ),$atts);
    wp_enqueue_style('nivolightboxcss');
    wp_enqueue_style('nivolightboxdefaultcss');
    wp_enqueue_script('nivolightbox');
    wp_enqueue_script('nivolightboxjs');
    wp_localize_script('nivolightboxjs','nivolightboxing2',$nivolightboxing);
    $n_effect = esc_attr($nivolightboxing['effect']);
    $n_url = esc_url($nivolightboxing['url']);
    $n_alt = esc_url($nivolightboxing['alt']);
    $n_thumb = esc_url($nivolightboxing['thumb']);
    $n_title = esc_attr($nivolightboxing['title']);
    $n_type = esc_attr($nivolightboxing['type']);
    $n_gallery = esc_attr($nivolightboxing['gallery']);
    $n_text = esc_attr($nivolightboxing['text']);
    if ($n_type === '' && $n_gallery === '') {
        $lightboxoutput = '<a class="nivolight" href="'.$n_url.'" title="'.$n_title.'" ><img src="'.$n_thumb.'" alt="'.$n_alt.'" /></a>';
    } 
    elseif ($n_type === '' && $n_gallery !== '') {
        $lightboxoutput = '<a class="nivolight" href="'.$n_url.'" title="'.$n_title.'" data-lightbox-gallery="'.$n_gallery.'" ><img src="'.$n_thumb.'" alt="'.$n_alt.'" /></a>';
    }
    elseif ($n_type == 'iframe' || $n_type == 'inline') {
        $lightboxoutput = '<a class="nivolight" href="'.$n_url.'" title="'.$n_title.'" data-lightbox-type="'.$n_type.'" >'.$n_text.'</a>';
    }
    else {
        $lightboxoutput = '';   
    }
return $lightboxoutput;
}
add_shortcode('nivobox','nivolightbox_sc');

Notes: the first function registers the scripts and styles, which are only enqueued when the shortcode is included on a page.

Step 5: Using the shortcode

If you simply want to add an image onto your page that will open in the lightbox, then use:

[nivobox url="IMAGE URL" title="TITLE" alt="ALT TEXT" thumb="THUMBNAIL URL"]

Clicking on the thumbnail below shows an example.
[nivobox url=”https://www.davidtiong.com/wp-content/uploads/2015/07/bridge-pic1.jpeg” title=”Scenery with bridge – Single Picture” alt=”bridge scenery” thumb=”https://www.davidtiong.com/wp-content/uploads/2015/07/bridge-pic1-288×192.jpeg”]

If you want to create a gallery of images, then include a classname for eg, “gallery1”:

[nivobox url="IMAGE URL" title="TITLE" alt="ALT TEXT" thumb="THUMBNAIL URL" gallery="gallery1"][nivobox url="IMAGE URL" title="TITLE" alt="ALT TEXT" thumb="THUMBNAIL URL" gallery="gallery1"][nivobox url="IMAGE URL" title="TITLE" alt="ALT TEXT" thumb="THUMBNAIL URL" gallery="gallery1"]

Clicking on a thumbnail below shows this example.
[nivobox url=”https://www.davidtiong.com/wp-content/uploads/2015/07/food-pic1.jpg” title=”A food bowl – 1 of 3″ alt=”Lightbox food bowl” thumb=”https://www.davidtiong.com/wp-content/uploads/2015/07/food-pic1-188×188.jpg” gallery=”gallery1″][nivobox url=”https://www.davidtiong.com/wp-content/uploads/2015/07/tea-brewing.jpg” title=”Tea brewing – 2 of 3″ alt=”Lightbox tea brewing” thumb=”https://www.davidtiong.com/wp-content/uploads/2015/07/tea-brewing-188×188.jpg” gallery=”gallery1″][nivobox url=”https://www.davidtiong.com/wp-content/uploads/2015/07/flowers-pic2.jpg” title=”Flowers – 3 of 3″ alt=”Lightbox flowers” thumb=”https://www.davidtiong.com/wp-content/uploads/2015/07/flowers-pic2-188×188.jpg” gallery=”gallery1″]

If you want to include video(s) in the gallery such as a YouTube or Vimeo URL, then use:

[nivobox url="IMAGE URL" title="TITLE" alt="ALT TEXT" thumb="THUMBNAIL URL" gallery="gallery2"][nivobox url="VIDEO URL" title="TITLE" alt="ALT TEXT" thumb="THUMBNAIL URL" gallery="gallery2"][nivobox url="VIDEO URL" title="TITLE" alt="ALT TEXT" thumb="THUMBNAIL URL" gallery="gallery2"]

Clicking on a thumbnail below shows this example, the first one is an image, the second two are videos.
[nivobox url=”https://www.davidtiong.com/wp-content/uploads/2015/07/food-pic1.jpg” title=”A food bowl – 1 of 3″ alt=”Lightbox food bowl” thumb=”https://www.davidtiong.com/wp-content/uploads/2015/07/food-pic1-188×188.jpg” gallery=”gallery2″][nivobox url=”https://www.youtube.com/watch?v=Sz_xVeHV8LI” title=”GoldCoast Video – 2 of 3″ alt=”GoldCoast video” thumb=”https://www.davidtiong.com/wp-content/uploads/2015/07/screenshot11-188×188.jpg” gallery=”gallery2″][nivobox url=”https://www.youtube.com/watch?v=P_q3BdrFsLI” title=”Singapore Video – 3 of 3″ alt=”Singapore video” thumb=”https://www.davidtiong.com/wp-content/uploads/2015/07/screenshot12-188×188.jpg” gallery=”gallery2″]

If you want to include an iframe to another page, then use:

[nivobox url="WEB PAGE URL" title="TITLE" text="LINK ANCHOR TEXT" type="iframe"]

Clicking on the link below loads a page in the iframe lightbox.

[nivobox url=”http://www.example.com” title=”Iframe on a webpage” text=”This link opens up in an iframe lightbox” type=”iframe”]

If you want to include some inline content, such as content in a hidden div, then use:

[nivobox url="DIV ID" title="TITLE" text="LINK ANCHOR TEXT" type="inline"]

Clicking on the link below loads the hidden div content in the lightbox.

[nivobox url=”#inline-div-lightbox” title=”Shows inline hidden content” text=”This link opens up a hidden div” type=”inline”]

A lightbox can be a great tool when used on a website, especially when it comes to displaying photo galleries. Do you use a lightbox on your website?

Filed under: WordPressTagged with: , ,

Local Business Internet Marketing ideas

Improve your local business internet marketing

Running a local small business can be a stressful exercise. You have so many jobs that you are doing, from selling your products and services, to promoting through advertising, to managing staff and systems, to merchandising and window displays and so forth. Especially when just starting out.

Your business not only needs to have the right mix of products displayed effectively, but you need to attract customers and clients through your doors. If you have plenty of passing traffic such as in a CBD main street or perhaps a popular shopping centre, then you need to focus on ways to get them to stop at your shop or store.

But if you are in a quiet strip, or a location where passing traffic isn’t enough, then you MUST focus on other types of marketing including internet marketing.

So how do you do local business internet marketing?

Start with a website, if you don’t have one yet then David Tiong Web Consultancy can help. Promoting your local business online only through a Facebook page, or through a local business online directory, should be part of your local online marketing strategy, but not replace the essential starting point of setting up your own business website.

If your website is live and well, then next up is to help people find it. Read this article to find out what you should be doing to promote your website by doing some of your own local SEO.

A recent article published on Business2Community titled “6 Internet Marketing Ideas for Your Local Small Business” give some great tips to get you started with internet marketing.


1. Verify and Promote Your Google Business Listing
2. Run Facebook Ads for Your Location
3. List Your Local Small Business On Industry-Specific Portals
4. Organise Events and Post Them On Facebook
5. Create a Meetup Group
6. Create With Locals On Twitter

Read more at B2C – Business 2 Community

Here are some other quick and easy local SEO tips to add to your marketing to do list.
Write a blog on your website, include descriptive text in your web page image ALT tags, ensure consistent NAP (name, address, phone number) on all online listings of your business, create a Facebook page for your business, create “community focused” content on your website, try getting online reviews, donate to local charities and participate in local communities and forums, create an XML sitemap and submit it to Google Webmaster Tools, and make sure your website is mobile friendly.

That should get you started with your local online marketing ideas, if you need more support or don’t have time to manage your own internet marketing, then checkout our helpful services here.

Filed under: SEO and MarketingTagged with: , ,

How to add estimated reading time to your WordPress posts

how to add Estimated Reading Time to your website

Not everyone will agree with the subheading of this article, but hear me out. How often does a child say “Are we there yet?” when on a driving holiday. How often do we type into Google “How long does it take to fly from point A to point B?”

Or how often do we stand in a queue wondering how much time will pass before it’s our turn. How often do we ask “how long will it take”?

You get the point! No one wants to wait, we live in a society where time is our most limited resource.

So when I see websites like Medium.com that include the estimated time to read an article, I understand why they think that it’s important.

Reason 1: Time Management

We are constantly fighting the hands of the clock. This is why time management ideas are so popular. Possibly the most limiting resource we have is time. We are often on the lookout for ways to save time.

If I only have half hour lunch break, I’m not going to sit down to a banquet. If my bedtime is in an hour, I’m not going to start watching an epic 3 hour movie.

However, if I have 5 minutes to spare before my next appointment, I might decide to read a quick blog post. But how do I know how long it’s going to take me to read?

Well my first instinct would be to scroll to the bottom of the page to see how much content is in the article.

So if I land on a blog post and the estimated reading time is shown to me, then this might be what either makes me decide to keep on reading, or save it for later or immediately bounce off the page.

Reason 2: How deep is the article

This one is definitely subjective, and each person will interpret quantity vs quality differently, but this can be indicative of how informative the post might be. Of course it is up to you to make sure that your posts are good quality, as this is more important than how big a post is.

A technical tutorial might be seen as more extensive if the reading time is higher, so this could appeal to someone looking for more indepth articles. Whereas a quick and easy guide would attract those who want something short and simple to follow.

“Reading time can help a reader draw these conclusions and actually increase time spent on site.”

How to add estimated reading time to your website articles

Well option 1 would be to go down the path of adding a WordPress plugin, a quick search will reveal some options here.

Option 2 could be to count up how many words on your page, estimate how many words you can read in a minute, and then divide by this. Or you could also time yourself reading the article. Then just add it manually to the start of your blog article.

However I prefer something a little more automated (saves time) so here is my preference – option 3. I chose with my website to try out a jQuery script called “Reading Time” by Michael Lynch, which is a lightweight script for estimating reading time and adding it to your website.

It’s a relatively simple procedure to include the script using the WordPress enqueue scripts function, customising the script settings and adding to the pages you want to display “time to read”, and then including a little code in your template where you’d like it to appear.

Step 1: Download the jQuery file readingTime.js from github.com/michael-lynch/reading-time, then FTP upload to your theme folder. To keep your jQuery scripts organised I always recommend adding them into a “js” folder inside your childtheme folder. I added the file into a folder called “readingtime” and then added that into “js” folder.

Step 2: enqueue the script by adding the following PHP function to your childtheme’s functions.php file.

function enqueue_readingtime() {
    wp_enqueue_script(
        'readingtimejs',
         get_stylesheet_directory_uri().'/js/readingTime/readingTime.js',
         array('jquery'),
         '',
         true);
}
add_action('wp_enqueue_scripts','enqueue_readingtime');

Make sure to amend the path to your readingTime.js file, if you uploaded into a different folder location. We include a dependency of “jquery” so the script loads after jQuery, and set to true so that it loads in the footer.

Step 3: setup the script settings.
Here you can customise to suit your preferences. You can choose things like whether you want to include word count, the text displayed before the time shown, the word count, the ids or classes that you will target for displaying the output, and other cool stuff. Read up more about it on the author’s page.

For this blog I decided to only display the reading time only on my posts, and to count the number of words in the main div which has a class of “post-content”. For reading speed “wordsPerMinute” I decided that since my blog is more technical than say a food blog or a travel blog, therefore people will read slower to comprehend so I went with a reading speed of 180 wpm, rather than the default of 270 wpm.

Here is my code below, again you need to add this to your functions.php file. Be sure to modify for your website.

function readingtime_posts() {
    if (is_single() && wp_script_is('readingtimejs','done')) {
        ?><script type="text/javascript">jQuery(document).ready(function($) {
$('.post-content').readingTime({
    readingTimeTarget: '.reading-eta',
    wordCountTarget: '.word-count',
    wordsPerMinute: 180,
    round: true,
    prependTimeString: 'Time to Read: '
});
});</script><?php
}}
add_action('wp_footer','readingtime_posts',100);

Step 4: add some code where you’d like to show your reading time display.
This is the final step in the process and we’ll add some selectors based on our script code above.

<?php if (is_single()) {
    echo '<div style="clear:both;"><span class="reading-eta"></span> (<span class="word-count"></span> Words)</div>';
} ?>

The first span class of “reading-eta” is for the time display, and needs to match “readingTimeTarget” value in the previous code. The second span class of “word-count”, needs to match the value for “wordCountTarget” and is obviously the number of words in your content. Your content will be the div class that you chose for your selector, so in my code above I used “.post-content” but you should choose the div class that your post content is contained in. It could be “.entry-content” or “article” or maybe something else.

So that’s how you do it. Be sure to adjust your reading speed based on your type of content that you write about on your blog.

What do you think? Is this something you’d like to implement on your own website. Do you find it useful on websites like Medium that use reading time estimates?

Filed under: WordPressTagged with: , ,

Protecting against scams – [video]

Scams and Online Security

Online security should be a high priority for both individuals and businesses. Rather than being unconcerned, we should be proactive in reducing our risk. In 2015, cyber security threats are very real and could come in the way of ransomware, cyber espionage, cyber theft and password cracking.

In 2014, “advanced attackers targeted 5 out of 6 large companies”, and “60% of all targeted attacks struck small – medium sized organizations”. “Ransomware attacks grew 113 percent in 2014, driven by a more than 4,000 percent increase in crypto-ransomware attacks … The victim will be offered a key to decrypt their files, but only after paying a ransom that can range from US$300-$500 with no guarantee that their files will be freed”. (Source: Symantec Blog)

National Consumer Fraud Week 2015 was held recently here in Australia, and the Australian Competition and Consumer Commission and the Institute of Public Accountants hosted a free forum on small business scams and cybercrime. You can watch the replay below, it goes for a while so make yourself a cuppa before you sit down. It is interesting, and scary to learn about the risks we are dealing with each day.


“Are you leaving your personal data wide open for scammers to find and use for fraudulent purposes? Sadly, identity theft is now one of the most common crimes in Australia, and can lead to all sorts of associated illegal activities.

Scammers steal your personal details to commit fraudulent activities. They may make unauthorised purchases on your credit card, or use your identity to open accounts such as banking, telephone or energy services. They might take out loans or carry out other illegal business under your name. They may even sell your information to other scammers for further illegal use.”

SCAMwatch

Although it may be difficult to stop an attacker who decides to target you, there are some simple steps you can take to substantially reduce your risks of falling prey to scams:

Update your software and systems, stay on top of updates

Don’t click links in unsolicited email or messages

Use very strong and unique passwords for each login. Use unique login names and try two-factor authentication when available

Don’t tell people your passwords, don’t leave them written down in public display

Call the person to verify an unusual or unexpected email, or a change in banking details or invoicing methods, don’t respond to unexpected email requests

Be prepared for the worst – so make sure you can restore your systems. Apply the 3-2-1 backup system – 3 backups, on 2 different media and 1 offsite

Filed under: TechnologyTagged with: , ,

Hidden danger of using free digital photo websites

copyright dangers using free photos

Before you use another “free” digital image, you must read this

Do you use free digital photos on your blog or your website? Well you might be sitting on a ticking time bomb!

DISCLAIMER: The information contained in this article is based on my interpretation of my findings. I am not an expert in legal matters, so recommend that you do your own research in this area and consult legal advice if needed. The purpose of this article to raise awareness and provide a warning to those using free digital imagery.

With all the free services popping up across the internet to solve the issue of finding stock photography for each blog post we churn out, it seems like it has become so much easier to find that ideal image. And yes it makes life easier for us designers, internet marketers and bloggers. But what happens when Getty Images lets Dun & Bradstreet loose on you?

Think this won’t happen? Well how do you prove where you downloaded a free image from 5 years ago, that now only seems to be available on GettyImages, when free images don’t actually come accompanied with a licence?

If you buy an image, you should receive a copy of the licence that you can download with the image. Also you generally need an account with that image provider, so there is usually a record then of the images you have purchased. But when you download a free image, you get nothing. You are told that the image is “Public Domain” or “Creative Commons CC0”, but you don’t get a copy of this attached to the image to prove that. You also don’t have a record of downloading that image from the website either.

But it says it is free to use, even for commercial purposes

This is true. But what if I told you that the free image websites waive responsibility for checking that an uploaded image isn’t actually someone else’s work? What if I told you that an image can be removed by the author for whatever reason – how would you then prove that the image existed on that website in the first place? That’s if you can remember which website you downloaded it from in 5 years time (especially if you use a few image sources)!

What if I told you that a free photos website can remove an image if they find out it has breached copyright? How would they notify people who have already downloaded that image and are using it on their own websites – that they are now infringing on copyright? THEY DON’T TELL YOU THIS – THEY CANNOT TELL YOU THIS.

It is happening at this moment and you could be next!

A website client of mine recently received a bill for over $600 for use of a small “unlicenced” image on their website. It was an old image downloaded several years ago from a free photo source, and so no licence could be shown to prove this. Searching on the internet it was discovered that this image was being used on many different websites, but that the only “official” place to obtain the image now was through GettyImages. As a result they had no option but to pay the fee for “copyright infringement”.

Following the incident, I took a moment to view the terms of use for some well known free image websites, to see what they were doing to protect their users. I guess I expected to find what I did, but I was still a little disappointed.

“In this regard, all Users acknowledge that the Company is not verifying the Pictures, and therefore the use of such Pictures in any way is at each User’s own risk, and same are being provided on the Website “as-is, where-is”, without any representations or warranties whatsoever by the Company.”

Unsplash

“Pixabay cannot be held responsible for any copyright violations, and cannot guarantee the legality of the Images stored in its system. If You want to make sure, always contact the photographers. You use the site and the photos at your own risk!”

Pixabay

“To the extent possible under law, Public Domain Archive has waived all copyright and related or neighboring rights to all images published on publicdomainarchive.com”

Public Domain Archive

“Copyright Infringement and DMCA Policy. As morguefile.com asks others to respect its intellectual property rights, it respects the intellectual property rights of others. If you believe that material located on or linked to by morguefile.com violates your copyright, you are encouraged to notify morguefile.com at admin at morguefile.com in accordance with the Digital Millennium Copyright Act. morguefile.com will respond to all such notices, including as required or appropriate by removing the infringing material or disabling all links to the infringing material.”

MorgueFile

“You agree to indemnify, defend, and hold harmless freeimages and its officers, employees, shareholders, directors and suppliers against all claims, liability, damages, costs and expenses, including reasonable legal fees and expenses, arising out of or related to a breach of this Agreement, the use of this site and the use or the inability of use of any Image, your failure to abide by any restriction regarding the use of an Image, or any claim by a third party related to the use of an Image.”

Free Images

It might seem reasonable that if a website, especially a small business, were to find themselves in a situation where an image appeared on their website and they had unknowingly and unintentionally used an image they believed to have been free, that a request and warning to remove it from their website would be fair. But it seems that the first notification is by way of compensation ordered to pay by debt collectors.

So what next?

Well my recommendation is that if you use free images on your website or blog, try to credit the source of the image in your blog post (so that you have a record of where the image came from), or record the URL of the image you download, or otherwise purchase an image that is accompanied by an actual downloadable copy of the licence to use that image.

I’d welcome any comments from anyone who has encountered any issues with using free images, or any representatives of the free image sources that would like to reassure users of their free stock photos, or any other useful advice. Feel free to share below.

Filed under: DesignTagged with: , ,

Increase your search appearance on Google – what you should be doing

search engine ranking and marketing your website

SEO, Content Marketing and the Google Algorithm

The role that SEO, or search engine optimisation, plays in today’s online search world where Google is king, has changed completely in recent years. Google has a secret formula called the Google Algorithm that they use to determine what to display when someone types a query into the Google search bar.

“Google’s aim is to provide the most relevant results for each search based on the actual end user – i.e. the person typing in the actual search”

If you mention SEO, many people immediately think of keywords, especially ranking number 1 for popular keywords to do with their business. But what most people don’t realise is that search results now vary continuously and different results show from one search to another. Search results are not static, they are changing all the time.

The Google Algorithm is actually smart enough to know about you and how you search. Factors such as your geographic location, personal search history, social connections, and computer/mobile device you are using, all contribute to why you will see different search results to another person doing the exact same search query at the exact same time.

“SEO is an evolving process of optimising your website and webpages to be found for search queries that are relevant to your business, your brand or your target market. SEO must adjust and be responsive to changes in the way search engines work, or otherwise SEO ceases to be effective.”

As search engines grow larger and larger, the amount of information they consume is increasing. To remain relevant, current and trusted your website content must also increase. This is where Content Marketing comes into the picture, and is essentially deciding on what content your customers, clients, followers and fans need and want, creating this content, and then publishing it onto your website, your social channels and your brand outlets.

The SEO landscape has changed completely.

Search engines update continuously and the Google Algorithm undergoes tweaking and updates more frequently than most people realise, but the major updates are given names like Panda and Penguin. Online marketers and SEO companies are constantly having to adapt their strategies according to these changes to remain effective in driving traffic to websites. What worked in the past to make your website rank higher, could actually now have the opposite affect and negatively impact your search engine rankings.

SEO changing landscape

You might be wondering how to go about achieving a first page ranking, and how to rank as high as possible for as many relevant search queries. But what is often overlooked is the fact that there is no point ranking in the top spot if this doesn’t lead to conversions, especially if you’re paying big dollars to be there.

A conversion is someone who actually becomes a customer and often follows a lengthy process of multiple “touch points” or interactions. Finding your business online through a search, reading a review or testimonial about you, visiting your website, a referral, seeing one of your online ads, looking at your Facebook page, reading a blog post on your website, or a blog post about your business on another website, and any social or brand interactions are all touch points that work together to turn prospects into leads and ultimately into clients and customers.

To convert you need to be relevant and have content on your webpage that fulfills the search query. So how do you make your website rank higher on Google search for a search query? Well keyword stuffing, listing your website on hundreds of global directories for back-links, and other “black hat” tactics are no longer effective, and can lead to a Google penalty that will see all of your search traffic drop. Yet many SEO companies still make wild claims like “We’ll get you to number 1 on Google” – You’ve probably had many phone calls and emails telling you that you are missing out on hundreds of visitors or that you don’t even rank on the first page of Google.

What factors contribute to SEO that are relevant today?

There is an extensive list of actions you can take to improve your rankings. But the best approach is simply to concentrate on putting yourself into the shoes of the person doing the search. Remember afterall, that this is what Google is trying to do – provide the most contextually relevant results – to serve up on the plate what the end user actually wants to eat.

The way that a user interacts with your webpage is analysed by search engines. This is called engagement metrics and includes statistics such as how long they visited your webpage after clicking through from the search page and whether they visited other pages. If they left your website immediately then this suggests that your page did not have what they wanted, what they typed into the search query. In other words – you were not a good match for that keyword phrase. This is an important aspect of being competitive in the search results and if users find your content useful then a search engine has done its job and will be more likely to show your result next time, and maybe higher up the ranking. But the opposite is also true.

So what actions should you take?

“Well make sure that your website is user friendly – easy to navigate, use good headings and titles, write text that is easy to read and understand, make the page visually appealing with quick loading graphics, photos and images, design for multiple devices including mobiles and tablets, keep the website fresh with new content, engage people on your webpage, lead them to the content they are looking for and to the actions you want them to take. And naturally include your important and relevant keyword phrases inside all of this great content.”

Forget about a single minded focus on rankings and concentrate instead on engagement and targeting your ideal audience. Provide value to your audience both on your website and at all of your brand’s touch points by integrating content marketing into your weekly business activities. Think about the overall online branding experience and don’t just focus on one area.

Keywords for content marketing

We are starting to realise that ranking for long tail keywords (search phrases with 4 or more words) is more profitable even though there is less search traffic. Why is this?

“Because a more specific search phrase usually indicates that a user is more likely to buy or more likely to engage.”

If someone walks into a department store and asks “Where is menswear?” then they may just be looking in general. However if they ask “Where are mens business shirts?” then you know they are actually looking for something specific that they possibly want to buy today.

Here is an example of how to create keyword phrases for generating effective content for users and search engines:

Lets consider how people search on Google? If a person in the UK has heard about a place called the Gold Coast in Australia, and is curious where it is, they would type a simple search query into Google “Gold Coast Australia”. They would be expecting to find a map and some information about the area, and would learn that the Gold Coast is a city in Queensland, that stretches across 57 kilometres of beautiful beach coastline and is famous for its surf, sand and sunshine.

Now if you own a small private resort on the Gold Coast at the southern town of Coolangatta, would there be any point trying to rank for “Gold Coast Australia”? Probably not.

If a person living in Melbourne, Australia wants to go for a beach holiday to the Gold Coast, their search query might be “Gold Coast accommodation”. Most likely if your resort appeared on the first page, they would click your link, but also possibly any other links on that page. However you would spend a ridiculous amount of money trying to rank on page 1 for such a highly competitive search query, as you are competing against large accommodation booking companies. If you did get there, then your site’s traffic would increase significantly, but most likely the conversion rate would not be high enough to offset the amount spent on SEO to gain and then maintain that position. Especially if a large percentage of people typing in that search query were actually looking for the accommodation directories or the most popular town of “Surfers Paradise”. Many people would quickly “bounce” off your page, back to the search results.

Now consider a longer keyword phrase or a “targeted keyword phrase”. Your resort is located in Coolangatta beach on the Gold Coast with beach front views and is family friendly. Perhaps your facilities include kids clubs and swimming pools with waterslides and childrens pools… etc.

Publish content on your website including text phrases such as “Family friendly resort on Coolangatta beach” and “Coolangatta Resort with waterslide” and “Relaxing beachside family getaways in Coolangatta“, and you will be more likely to naturally appear on Google search for these lower competition phrases, and similar related phrases containing those keywords.

Also make sure that your web pages have great photos showing families enjoying the pool, testimonials from happy customers, facts about your facilities, and you regularly share similarly related content on your brand’s social media pages that links back to these pages on your website.

“Creating great content that is engaging for a visitor, will actually lead to an increased presence on Google search.”

The idea is to think backwards. Instead of working out a bunch of keywords to rank for and then deciding where to add them onto your website, keep your website fresh and optimise your current pages with content that is going to be useful, valuable and engaging for someone who is on your web page. Make sure that your page content contains a good mix of words about your topic, to ensure that Google fully understands semantically what your page is all about. Google will then index what your webpage is all about and include it in a search results when it “believes” it will be useful to the search query.

Headlines and Click Through Rate (CTR)

When a user types a search query into Google, the results page displays a list of snippets, each one made up of a headline, a web page URL link and a short description. To make your snippet appealing, you should think about how it looks to the person doing the search, and how it looks in amongst other snippets.

If your website appears in the search results, then this is recorded by Google as an “impression”. If a person then clicks on your link and visits your website, this is recorded by Google as a “click”.

“Click Through Rate or CTR, is a measure of the ratio of clicks to impressions and is one of the engagement metrics that is recorded by Google and used as a popularity ranking factor.”

The higher the CTR, the more often people are choosing your website in the search results, and the more traffic you have going to your website, so when you appear in a search result you really want to make your listing snippet as appealing as possible. How do you do this?

good headlines for Google click through rate

A good article should always have a great headline. The headline draws the attention of the reader, and a person’s reaction to the headline determines whether they read the article or move onto the next one. Interestingly when it comes to web pages, the headline is actually something different to the main heading on your page, but both are very important.

Your page headline is also referred to as your page title. This title is not displayed on the actual web page, but instead in the top of the browser tab.

“But most importantly, your page title appears as your headline in the Google search results page in big blue bold letters.”

It is also sometimes displayed on external websites that link to your page, such as in social media. To set your page title it must be specified in the meta <title> tag in the header of your web page, and should be descriptive, concise, and unique. Consider keeping the length of your titles to less than 60 characters, placing important keywords towards the start, and including your branding when possible and practical.

Snippets in Google search

 

Your headline needs to encourage someone to read the rest of your snippet and hopefully to then visit your website, so you must write informative and interesting titles for your web pages. As an example, lets say someone types a query into Google such as “how to learn guitar by myself“. You could make your page title / headline interesting by writing something like “Learn Guitar in 20 minutes a Day“, or “Teach Yourself to play Guitar – Learn Online”. Of course it must be relevant to your page content, but make it sound good and try to appeal to reader’s emotions.

Another aspect of your listing that is worth considering is your description, that appears under your headline and URL link. Google will often display your meta description here, otherwise some text it extracts from your website page. Include a meta description that evokes curiosity in the reader to visit your web page to read more. Make sure that the meta description is an accurate description of your page, unique, no more than 160 characters and include your important keywords.

Note that your keywords will appear in bold if they match the search query. Also Google will sometimes display the starting lines from your page’s body content rather than your meta description, so always consider what you include in your first few lines of body text on a page.

Backlinks, Links and Broken Links

What is a link? Quite simply it is a relationship between two things. If you have a link on a page then it is a reference to another location, whether that is another webpage, a file or a document. A backlink, or an inbound link, is a link from another website to your website or webpage. Broken links, as the name suggests, are links that reference a destination that no longer exists, or perhaps never did exist.

When it comes to search engines, links help create paths for discovering new content on the web as well as helping to determine a page’s popularity, so a link to your website is a vote for you. The more high quality backlinks that you have, the more popular your site is seen to Google, and so the more likely you are to appear for your keywords. Conversely if you have very few links to your website, then this suggests that your website is unpopular, or not recommended by others, so it is harder to rank for your keywords.

Google does not see every link as equal however, so some links are worth more than others and some links can even hurt your website rankings. Here is a brief outline of some link facts to be aware of (note these may change as Google changes its algorithm):

external links are stronger than internal links

links from unique domains are more valuable than more links from a website that already links to you

links from highly trusted domains or from sites that are linked to by highly trusted domains pass more value in a link to your website

create linkable content that encourages natural links from other bloggers and websites, rather than asking for links

article submissions and directory listings have been abused and overuse may lead to search engine penalties

order of links that appear on a page (links that appear earlier in a page’s code pass more ranking than links appearing later)

links inside noscript tags pass little or no value

Now what ?!??!

This hopefully gives you some insights into how you might go about improving your own rankings on Google. It’s a brief overview, but looks at the bigger picture to help you realise that marketing your website starts with you, not with paying an SEO company to “get you on Google”.

Ranking on search engines is actually really easy to do, if you forget about the “number 1” mindset and simply start creating something of value for your audience. That might be a resource information page, an instructional video on how to use one of your products, an inspiring story, an interview with an expert in your field, a collection or list that your readers would refer to often, a downloadable worksheet, or even just something really interesting and relevant.

Start brainstorming today with your team, your marketer, your friends, your family and start publishing more awesome content.

Filed under: SEO and MarketingTagged with: ,

Hints to improve your Content Marketing strategy

Tips for content marketing
For a business or brand to be found online – publish quality content online regularly

Your content must be communicating effectively, so consider what is relevant for your audience – Answer real questions, provide product and services information, talk about the latest news, be interesting and entertaining.

Adding fresh new content to your website with the aim to target your audience and increase “eyes” on your website is known as “Content Marketing”. It is as important as SEO – they go hand in hand. Since Google indexes content continuously, to enable it to provide the best response to a search query, if you want your website to appear in the search results you need to not only add fresh new content regularly, but you need to use a plan.

Here are some questions to consider when formulating your content marketing strategy.
 

Question 1: Does your headline create curiosity?

headline create curiosity for better content marketing

Hints:
When creating an effective headline, ask yourself whether or not it is “clickable”. If someone did a Google search and your headline appeared on the search results page, would it evoke enough curiosity for them to take the action of clicking on your link?

Is the headline short and clear? Try triggering emotional responses. Also include your keyword phrase if possible, as the words in your headline or title are used by Google.
 

Question 2: Where is your introduction?

every blog post should have an introduction

Hints:
Just like any piece of great writing, blog posts should contain an introduction. If you enticed your reader with your headline, then the next hurtle is to actually get them interested enough to read your article. So hook your readers in by making a bold statement, or by asking a question in your introductory paragraph.

Keep your intro short, no more than 2-3 paragraphs, and give them a taste of what to expect. Add in a picture to make it visually appealing also.
 

Question 3: How is your body looking?

content strong body
Hints:
When writing an article or body of your webpage, keep in mind the following:

  • use subheadings – many readers will not actually read your article from start to finish, they might only skim over the article, so provide informative subheadings for scanning
  • avoid big blocks of continuous text – use short paragraphs and no more than 3-4 paragraphs in a block of text
  • use questions, tell stories and write as though it were a conversation with an actual person in front of you
  • use different forms of content such as images, charts, videos and other interesting types
  • keep your content as concise as possible – not wordy
  • use emotions to appeal to the reader
  • make sure you check your spelling and formatting before publishing
  • refer to other experts and sources, and if using facts provide the evidence

 

Question 4: Have you effectively ended your article?

writing effective conclusions

Hints:
Don’t just end your blog post without wrapping up the aim of the article. You wouldn’t start a conversation, say what you have to say, and then walk off on the other person. So why do this in your blog post.

Write a short conclusion (less than a paragraph or two) that sums up the most important points, lead the reader into the next step that you want them to make, ask a question to keep the conversation going in the comments, provide links to related content, offer them a bonus, whatever it is don’t just walk out on them and hope they know what to do next.
 

Question 5: What about after you hit publish?

Promotion after publishing new content

Hints:
Ok so you went to all the effort to publish your masterpiece, so what now? Don’t sit back and admire your work, it isn’t finished.

Now is the time for promoting. This may include sharing your new page on social media, sending an email or tweeting to a person that you mentioned in your article, or perhaps someone who you know would enjoy or benefit from reading your article.

Some more ideas might include:

  • create short snippets from the article for sharing – you could use your subheadings or quotes – and auto schedule more social mentions of the article over the next month or so – using a service like Hootsuite or Buffer
  • design a graphic for Instagram or Facebook, include an interesting quote from your article, and share your graphic with a link back to the blog page.
  • make a video that relates to your article, for example if you wrote about a new product, you could produce a short video demonstrating a key feature, then post it to your YouTube channel and link back to your article
  • create a PDF of your page content and print it out as a leaflet
  • send out an update to your email subscribers and provide a snippet from the article with a link to read more

 

Wrapping it up

There are some hints to get you started to more effective content marketing. It’s important to realise that getting the perfect mix in online marketing requires more than just following a series of steps to creating some web content. You need to continue to invest time and effort into your website and web presence.

Sometimes the difficulty lies in finding content to talk about on your website. Start with your audience, either think about your business from their perspective, or ask them, to decide what they want to read more about.

If you found something useful in this article, then why not share it with your community by clicking on your favourite social place below.

Filed under: SEO and MarketingTagged with: ,

Is my WordPress responsive website mobile friendly?

mobile ready responsive websites

This is the question I was asking myself a couple of days ago. I have a WordPress responsive website, and I know that it works well on mobile devices. So why would Google’s mobile friendly tester show my website as NOT friendly?

Firstly let’s explore why you need a mobile friendly website.

Google’s upcoming algorithm change

Well according to the Google Webmaster blog in a post titled “Finding more mobile friendly search results“, Google will very soon be making a change to the search results displayed on a mobile device.

From the article:
“Starting April 21, we will be expanding our use of mobile-friendliness as a ranking signal. This change will affect mobile searches in all languages worldwide and will have a significant impact in our search results. Consequently, users will find it easier to get relevant, high quality search results that are optimized for their devices”

The key words here are “… will affect mobile searches … worldwide … will have a significant impact in our search results …”

I think you get the picture that if you want to appear when someone is doing a Google search on a mobile device after 21st April 2015, then you need to be mobile friendly.

How to be mobile friendly

Well the preferred way to be mobile, according to Google is to have just one version of your website that is a Responsive Website Design.

What reasons does Google give for this (source: why responsive design):

easier for people to share a single link to a page on your website, rather than multiple links to the same content

easier for Google to index a single url than a separate desktop and mobile url

only have one page for the webmaster to maintain

saves on load time when redirection is required based on device type

improves Googlebot’s crawling efficiency as only one version of a page to be crawled and indexed so “can indirectly help Google index more of your site’s content and keep it appropriately fresh”

So if you are running a WordPress website, then simply choose a responsive theme. You can also use a mobile plugin that creates a mobile version of your website, however given the reasons listed above you would be better off using a responsive theme. There are plenty to choose from and sometimes the theme you are using may actually have a setting to turn on responsive design, so if you are not sure then check the documentation that comes with your theme, or alternatively contact your theme provider.

How to test if your website is now mobile friendly?

This step is nice and easy, since Google have provided us with a really easy tool to use. Simply visit test here and enter your home page url for Google to test.

Another way to test is by setting up your website with Google Webmaster Tools, and view the “mobile usability” section for any errors that Google has found.

What if I have a responsive website and Google is showing it as “not friendly”?

Well this is what I found out the other day. Even though my website is mobile friendly through testing on a range of mobiles and tablets, Google seems to be of the opinion that it is not.

Why is it so?

So I checked using the Chrome developer tools, and switched on the device mobile emulator to verify that the website was still appearing correctly on mobile devices. Yes that checked out ok.

Then I considered why the mobile testing tool might be showing a different result to Google. Reading on the page I realised that Google is trying to view the website exactly as a typical mobile user might see the page. So that means it needs access to all the stylesheets and javascript, images and other resources that might effect how a page looks.

Then it made sense. Based on the way that used to be recommended for WordPress websites, we use the robots.txt file to help prevent crawling and indexing of content that isn’t relevant for search results. In other words, we simply wanted Google and other search engines to crawl the text content of our websites, not all the other files. So the Googlebot was being blocked from crawling all the stylesheets and javascript, so it cannot therefore see the website exactly how it actually appears on a mobile device.

So even though the website is fully responsive, the reason why Google believes it is not is because the robots.txt file blocks the files that Google now wants to be able to view.

So what to do? Do I simply remove the robots.txt file and allow all crawling of the website? Do I amend the file and stop blocking all the files?

A new robots.txt file for Googlebot

I decided that the reason for blocking certain resources on the website is still relevant at this stage, though in the future this may change again. So the best way to fix the issue with Googlebot is to allow it to crawl the javascript, css, images and other important files. However I still may have some files loaded in my website that I don’t want crawled.

Thankfully we can target Googlebot in our robots.txt using “User-agent: Googlebot”. Also although the directive “Allow” is not recognised across all crawlers (so it shows as an error in robots txt testing tools), Google does actually recognise it, provided that it is “the URL path in of a subdirectory, within a blocked parent directory, that you want to unblock” (source: Webmaster tools help).

This is my revised robots.txt tool with an explanation below:

User-agent: Googlebot
Disallow: /cgi-bin/
Disallow: /wp-admin/
Disallow: /wp-content/plugins/
Allow: /wp-content/plugins/*.css
Allow: /wp-content/plugins/*.js
Disallow: /wp-content/mu-plugins/
Disallow: /wp-content/cache/
Disallow: /wp-content/themes/
Allow: /wp-content/themes/*.css
Allow: /wp-content/themes/*.js
Allow: /wp-content/themes/*.gif
Allow: /wp-content/themes/*.png
Allow: /wp-content/themes/*.jpg
Disallow: /*.php$
Disallow: /*.inc$
Disallow: /*? 

User-agent: *
Disallow: /cgi-bin/
Disallow: /wp-admin/
Disallow: /wp-includes/
Disallow: /wp-content/plugins/
Disallow: /wp-content/mu-plugins/
Disallow: /wp-content/cache/
Disallow: /wp-content/themes/
Disallow: /*.php$
Disallow: /*.js$
Disallow: /*.inc$
Disallow: /*.css$
Disallow: /*?

Sitemap: https://www.davidtiong.com/sitemap.xml

Explanation:

  • Lines 1-17 are for Googlebot
  • Lines 19-31 are for all other bots
  • Line 33 is to inform search engines where my sitemap is located
  • Line 4 blocks the directory “plugins”, but lines 5-6 allow Googlebot to access css and js files in there
  • Line 9 blocks the directory “themes”, but lines 10-14 allow Googlebot to access css, js and image files in there

You can add other allow or disallow rules in there as needed using the same pattern, however remember that your robots.txt file is publicly available so be careful what you put in there, eg: don’t put important pathways in there to hidden files.

Submitting the new robots.txt file to Google and testing

Once you have uploaded your new robots.txt file to your website, you want to do the following:

1. Clear any caches to ensure your new robots.txt file is available

2. Purge any old copy of your robots.txt file from your CDN or Cloudflare if applicable

3. Test your robots.txt file for errors – try tool.motoricerca.info/robots-checker.phtml (remember that the allow directive will show as errors)

4. Tell Google about your new robots.txt file by going into your Google Webmaster Tools account, then navigate to Crawl > Robots.txt tester. Then click on the submit button, then next to 3 ask Google to update – click submit (see images below).

Submit robots.txt to Google

mobile friendly changes to robots.txt

5. Check that css, js and image files are not being blocked by Googlebot anymore by using the Robots.txt tester, view the images below as an example.

robots.txt tester

check Googlebot not blocked


6. Check that your website is now mobile friendly using the mobile friendly tester – www.google.com/webmasters/tools/mobile-friendly/.

7. Keep an eye on your Google webmaster tools account over the next couple of weeks to make sure that no new errors are showing up.

How did you go? If you need to print out this page to refer to, then click the button below.

Print a copy

Are you ready now for April 21?

Filed under: Design, WordPressTagged with: , , ,