You need to have nice-looking snippets to get more clicks. One way to ensure your site looks good when it appears in the search results is to use Yoast SEO’s Google snippet preview. It simulates what a search result for your page would look like and allows you to edit the tile, slug, and description! Here, we explain how to use the Google snippet preview to create great-looking snippets! And, we clarify why this snippet preview might sometimes not match what you see in the search results.
What is the Google snippet preview?
Yoast’s Google snippet preview is a feature of the Yoast SEO plugin. It allows you to preview and edit what your page or post will look like in Google’s search results. It has a mobile and desktop view and shows elements like the slug, SEO title, and meta description. In this preview, you can edit those elements to make sure your site looks good in the search results.
Where do you find the Google snippet preview?
In Yoast SEO, there are two ways to preview your snippet. You can either get there from the Yoast SEO sidebar or the Yoast SEO meta box at the end of your post (in editing mode).
The Yoast SEO sidebar
You can activate the sidebar by clicking on the Yoast icon on the top right of your screen. In the sidebar, you’ll see the “Google preview” tab:
A modal will pop up and show you a preview of your post or page in Google’s search results, where you will be able to edit your snippet.
The Yoast SEO meta box
You can also get a Google preview of your post below your post in the Yoast SEO meta box. Just scroll down in your post until you see the Yoast SEO meta box. It’ll be the first thing you see just below the Focus keyphrase input field.
Mobile result or desktop result
In the screenshots above, you might have noticed you can choose between two versions of the snippet: the mobile and the desktop. Since Google presents the results differently on a desktop and a mobile device, it makes sense to check both previews before you publish a post. The radio buttons above the snippet let you switch between the two, so you can make sure they both look good.
The components of the snippet preview
In our Google or snippet preview, you’ll see the following elements:
- The SEO title
- The meta description
- The URL, slug or breadcrumb (or a combination)
- The emoji picker
In the mobile preview, we’ve added a favicon and image too. Here, we’ll discuss these elements step by step. Please note that Google regularly experiments with elements like favicons, breadcrumbs, emojis, and images, so the preview might slightly differ from what you see in the search results.
The SEO title
The title is the first thing people see in the search results for your posts and pages, and in many, many cases, it’s the only thing – so it’d better be good!
What is the SEO title?
The SEO title is the title of your page you’ll see in Google’s search results. That’s different than the post name! Besides the page’s title, the SEO title contains additional elements like a separator or the site’s name.
The SEO title template
The title in the snippet preview is determined by the title template you’ve set in the Search appearance section of Yoast SEO. To access it, click Yoast SEO in your WordPress dashboard’s admin menu (the left-hand menu). Then go to Search appearance and select Content Types. There you can set a template for posts, pages, or other content types you might have. This is the default template for posts:
By default, the plugin takes the Post title and adds the Separator (in our example, a dash) plus the site name. The Page number parameter is only used when you have a paginated post. The Site’s title is included, and removing it is not a good idea. Google might rewrite your SEO titles if they don’t contain branding. You can play with this template, for instance, by adding a category. You can read all about that in this post on snippet variables.
Write a proper SEO title
Having a template means that your SEO title is created automatically. This might be sufficient to show a good title in the search results. But we always recommend checking the title in our Google preview tool. When checking it, ask yourself: Is this title accurate? Does it communicate what this post is about? Does it set the right expectation?
Perhaps you’ve done some keyword research to determine the focus keyword for your page, and you’ve noticed there are several variations of that keyphrase. In the SEO title input field, you can edit it to ensure it matches people’s queries and expectations. The right wording will convince users to click on your result instead of others’, so this post by Joost on how to craft an accurate and enticing SEO title may be worth your while!
In addition, make sure that your title is not too long. Otherwise, it might get cut off in the search results. Pay attention to the bar below the SEO title input filed. The bar will turn orange or red if the title is too long.
The meta description
Now that your title is up to snuff, let’s work on the second-biggest item in the snippet preview: the meta description. The meta description is the short text you see below the SEO title.
Why add a meta description (with the focus keyphrase)?
If you search for a specific phrase, Google will make that phrase bold in the meta description it displays. And it goes one step further. Once it has decided which pages will rank for your search, it tries to find the part of the page that includes that exact term. If your meta description doesn’t contain the keyword searched for, it’ll grab a “random” snippet from the page that does contain the keyword.
This is one of the reasons why it helps tremendously if you know what the most searched keyword for a page is likely to be. Then you can create a great meta description with the focus keyphrase, and increase the chances of Google showing your own meta description in the search results. You’ll be able to promote what’s on your page directly in the search results!
Write an awesome meta description
If you want to write a good meta description, there are some points you should pay attention to. It should accurately describe the post’s or page’s main content, include the focus keyphrase, and entice people to click on your result. If you want to avoid repetition, you can play with synonyms or related keywords in your meta description.
You should know that there is a limit to the number of characters you can use in the meta description. So, just like with the SEO title, pay attention to the bar below the description input field. It will turn orange or red if the description is too long!
Read more: How to create the right meta description »
The emoji picker
In the Google snippet preview, you can add some liveliness to your titles and meta descriptions with the emoji picker. Just click on the emoji button on the right side above the SEO title or the Meta description input fields. You’ll immediately see the library of emojis to choose from!
Emojis can be a great way to communicate with your audience and express yourself beyond words. Google sometimes even shows emojis in the search results, which can make your snippets stand out (see example below). But be careful how you use them! First, ensure they fit your brand and your audience. Secondly, try to add just one emoji in the title or the meta description. Otherwise, your content may appear spammy and discourage people from clicking on it.
In its snippets, Google includes a reference to where the page sits on your site. This could be a URL, a breadcrumb trail, or a slug. Which one it picks might vary, it’s something Google seems to experiment with regularly. Currently, they show a breadcrumb trail on desktop and the site’s URL plus the slug on mobile. In our Google preview, we show the URL on desktop and the site’s URL plus the slug on mobile.
The slug is the part you can optimize in the snippet preview. In general, we’d advise to make the slug as short as possible but to include the most essential words and, at least, the keyphrase. A short keyphrase means it’s easier to share, and including the keyphrase will help Google and users to identify the topic of your post or page.
The favicon (the little icon next to the URL) has only been added recently to the snippets in the search results. A while ago, Google added it to mobile search results. And, it has been experimenting with showing the favicon for desktop results, too. In WordPress, you can easily set this favicon. We’d advise doing that because although it’s a small icon, it can mean a lot for your site’s branding and click-through rate. In our tool, you can check if it’ll look good in Google’s search results.
You’ll find an image in the mobile version of our tool. Sometimes, Google adds this image to its search results snippets on mobile. To mimic this behavior, we automatically add your post’s featured image to Yoast’s Google preview.
But, I see something else on Google?!
Unfortunately – or maybe not – we cannot fully control what Google shows in the search results. You can set a title and meta description, but in the end, Google decides. In some cases, Google chooses another meta description or changes the title for you. That doesn’t mean you shouldn’t put any effort into writing those. Although there’s no guarantee, they offer you the chance to shine in the search result. So grab that opportunity!
Use the Google snippet preview to optimize your posts
I hope this post has made it clear how you can use the Google preview feature to increase click-throughs from the search results. This functionality is available in our Yoast SEO plugin for WordPress and Shopify and, of course, in Yoast SEO Premium as well.
Become a Yoast SEO pro series
Coming up next!
- Event September 27 - 28, 2023 Team Yoast is Sponsoring WordPress Accessibility Day 2023, click through to see if we'll be there, who will be there and more! See where you can find us next »
- SEO webinar 21 September 2023 Learn how to start your SEO journey the right way with our free webinar. Get practical tips and answers to all your questions in the live Q&A! All Yoast SEO webinars »