The Swiftype Blog

How to Drive Users to Your Search Bar

Last week we wrote about how important strong site search is for ecommerce websites, but this week we got questions from several customers about what site owners can do to make visitors actually use the search bar on their site. To summarize our advice and share these tips with a broader audience, we thought it would be helpful to create a specific blog post with tips about how to tweak your site so that more visitors use your search bar as the primary navigation tool.

Make it easy to find. We’ve written before about how Amazon’s homepage has evolved to feature such a prominent search bar, and how users expect to find this same interface across the web. The logic behind this evolution is simple – a larger, more prominent search bar will quickly catch users’ eyes and draw them towards it when they first land on your site. The key here, however, is not to let this logic fall apart when it comes to the rest of your website. Users will arrive to your site from a wide range of locations, and you should be sure that the search bar is easy to find on all pages. You might even consider configuring your site so that when visitors land on new pages, their cursor automatically starts in the search bar. We particularly like the way Shopify positions the search bar on their support page.

Walk in your visitors’ (proverbial) shoes. Don’t just think about a visitor’s first interaction with the search bar on your homepage, think about how they might want to use the search bar as they move through every part of your website. Many users will want to perform multiple searches on your site, so consider placing your search bar in a static site-wide header, making it easy to find at any point. Facebook is a perfect example of this. As you scroll down your Newsfeed, the search bar remains fixed to the top of the screen so you can enter a search without needing to scroll back to the top of the page. Other examples include YouTube, LivingSocial, Business Insider, and Mashable.

Increase your search bar’s functionality. The better the search bar works for users, the more they will use it to find the content they are looking for. Consider implementing an autocomplete dropdown that quickly directs users to popular pages before they finish typing their query. The faster users find what they are looking for, the more satisfied they will be and the longer they will stay on your site. Dramafever provides a segmented autocomplete that lets users choose specific content types directly from the search bar.

Prepare your search for mobile. More and more people are browsing the web with their smartphones today than ever before, and whether they are reading news or shopping online, search needs to work well for these users as well. In ecommerce alone, IBM predicts that 48.2% of online traffic and 24.4% of sales will come from mobile devices this holiday season. Capitalize on this traffic stream by optimizing your mobile website or app for search.

Experiment! Test out the changes you make on your website to see what produces the most conversions. Try placing your search bar in different locations, test out multiple autocomplete styles, or change up the way your faceted navigation works. Optimizely does a great job of helping site owners run powerful A/B testing across their site, and these tests can drive key UI decisions.

These changes will ensure that both site owners and visitors are getting the most out of their site search. In fact, site owners who use Swiftype to power their search have reported up to a 4x increase in their monthly query volume after implementation. Get started today with free trial, or for more information, contact our sales department to hear more about what Swiftype can do for you.

The Unexpected Power of Swiftype Meta Tags for Mobile Applications

Two weeks ago we wrote about the power of Swiftype’s custom <meta> tags and how they allow site owners to pass our web crawler, Swiftbot, information about their pages in a highly structured format optimized for our search algorithm. In this post, we will talk about how a heavily trafficked and large scale music website, Bia2, leveraged their website’s <meta> tags to create a stellar search experience for users on their mobile application in one of the most creative, yet simple mobile implementations we’ve seen so far.

Swiftype for Bia2.com

Bia2 came to Swiftype three months ago because they wanted to create a powerful search experience for users on their website and improve upon the weak search system they had in place. As the premier source for Iranian music and music videos, Bia2 has a massive content library of over 20,000 songs that site visitors primarily navigate to using the website’s search bar. To gain tighter control over how Swiftype indexed this library, Bia2’s development team added <meta> tags to tell Swiftbot exactly what information to gather from their pages (for more on the specifics of how this works, check out our <meta> tags tutorial and see and a screenshot of Bia2’s source code below).

Screen Shot 2014-11-05 at 10.14.51 AM

After Swiftbot indexed Bia2’s content, the team went the extra mile and customized the look and feel of the search bar, adding a sectioned autocomplete dropdown with thumbnails. This created a vastly improved user experience, and CEO Amir Pakzadian observed a 40% increase in pageviews for their artist landing pages.Bia2 leverage Swiftype meta tags to create a sectioned autocomplete

Despite this new and improved search experience for their website, Bia2’s mobile application continued to use an old method, which involved downloading an .xml file to the user’s phone and conducting the search locally on their device. This posed two major problems:

  1. Search results were weak, only producing exact text matches and not ranking results based on a scored relevancy, as an algorithm would.
  2. These results didn’t match the results for the same query on the website – results which Amir and his team had spent time carefully customizing in their Swiftype dashboard.

To eliminate these issues, Amir needed to figure out how to bring the same great search experience to Bia2’s mobile application users. The solution was quite creative, and demonstrates the value of using <meta> tags to create a highly structured data format for your search engine.

Front-end focus, back-end solution

Because Bia2 already had a mobile app with a search functionality, the solution was as simple as redirecting the app’s search bar from talking to their old search engine to instead speaking with the Swiftype search engine that powered their online site. Because the development team created great <meta> tags for his website, the only work they had to do was connect the pages in their mobile app to the Swiftype search results (which you can do easily using our mobile SDKs). According to Amir, “the implementation time was about four hours.”

With this new search experience for their mobile app, Amir was able to focus his energy on completely redesigning the look and feel of Bia2’s app. On Wednesday of last week, the app went live in the Apple store with several new features highlighted – search being a major one of them.

Search is a major coponent of Bia2's new mobile app

Now, users can search from any page and see dropdown results just like on the website. But perhaps the most important part of all of this, is that now search results match across mobile and web, and any customization that Amir does through the Swiftype dashboard will immediately be reflected in search results. Furthermore, now that searches are being performed through Bia2’s Swiftype search engine and not locally on individual phones, Amir and his team can now see analytics for all of their users across all devices.

What were the alternatives?

If Bia2 did not have Swiftype’s web crawler indexing their content and powering their search algorithm, translating their website search experience to their mobile app would have required months of development work to create a similar system on their end. At Swiftype, we’ve spent nearly two years building this out and creating a user-friendly interface that allows site owners to harness this power for their own site. As you’ve seen in this article, this powerful back-end infrastructure allows front-end developers to focus on creating awesome user design. For more about Swiftype’s custom <meta> tags, see our by clicking on the link below.

Why Ecommerce Stores Can’t Afford to Ignore Site Search

According to a recent study by the National Retail Federation, 44% of shopping will take place online this holiday season – an increase from 40% last year and a record since the organization began the study in 2006. The key takeaway from this statistic should come as no surprise: online shopping has grown tremendously over the last decade, and is expected to overtake brick-and-mortar shopping in the near future.

Though this trend might seem to inspire optimism in online retailers, analysts estimate that there are well over 100,000 ecommerce websites on the web, making it exceedingly difficult for these sites to stand out from their competitors. In this environment, site owners need to seize any advantage they can – and a powerful site search is one of the easiest ways to gain a competitive edge.

Here’s why site search is so important for ecommerce stores, and why site owners can’t afford to ignore it:

  1. Visitors expect great search. As we’ve written before, when most people think of search, they think of Google. Google provides such a robust search experience that many people begin their browsing sessions with a Google search – and users expect that same experience when they land on individual websites (30% of ecommerce site visitors use search, and this is expected to rise as time goes on). Disappointing search will quickly frustrate users and make them leave your site, causing you to lose out on a huge percentage of your customers.The most successful ecommerce sites have adapted to these expectations by prominently placing a search bar on their homepage. Consider Amazon.com. Amazon has experimented with a range of homepage layouts, beginning with a sidebar listing categories and eventually moving towards a simple interface with a prominent search bar. Because Amazon is the undisputed leader in online retail, their use of such a prominent search bar has heightened user expectations for this interface across the web.December 31, 2007. Amazon’s search bar is buried at the bottom of their homepage, and the sidebar navigation is the primary way for users to find products.December 31, 2007. Amazon’s search bar is buried at the bottom of their homepage, and the sidebar navigation is the primary way for users to find products.
    July 31, 2008. The search bar is now prominently displayed, but the sidebar remains in place as a navigational tool.July 31, 2008. The search bar is now prominently displayed, but the sidebar remains in place as a navigational tool.April 30, 2012. Amazon eliminates the sidebar, offering instead a single search bar to serve as the primary portal for users entering the site.April 30, 2012. Amazon eliminates the sidebar, offering instead a single search bar to serve as the primary portal for users entering the site.
  2. Searchers are high value visitors. Customers who use the search bar typically have a clear idea of what they want, and are more likely to buy on your site if they can quickly find what they are looking for. In fact, customers who perform a search are 40% more likely to convert than users who don’t. By meeting these users’ expectations and providing a rich search experience with features like autocomplete and faceted navigation, site owners can capitalize and dramatically increase conversions.
  3. Most sites have weak search. In June, Baymard Institute conducted a comprehensive study of internal site search across 19 major ecommerce websites, concluding that, for the most part, “search doesn’t work very well.” Part of this study looked at the range of query types that ecommerce websites typically field, paired with an analysis of how well equipped the leading websites are to handle these queries. The results showed that most site search engines can only handle relatively simple query types, demonstrating the need for an advanced search algorithm to power your internal search.
    baymardFor an explanation of how these various queries differ, see the original article.
  4. Search bars generate invaluable user data. One of the major reasons why websites like Amazon have moved towards featuring such a prominently displayed search bar is because user generated queries provide such valuable insight about what users hope to get from your website. When intelligently collected and organized, site owners can leverage this data to make key business decisions, such as what items to promote, what items to order more of, or how to move forward on your SEO/SEM campaigns.

If you’re ready to take your site search to the next level, Swiftype is here to help. Sign up for an account today or contact sales to schedule a demo.

Mastering SEO & SEM with Site Search Data

Consumer interests and behavior are always changing, making the best approach to search engine marketing and optimization a continually moving target. In the face of this uncertainty, the best strategy to adopt is to stay ahead of the curve by forecasting what your target consumers will be searching for in the future. But how can you best make these predictions? and what tools do you have at your disposal to inform these decisions?

live_analytics_2x

The traditional model for making these predictions is, at its core, educated guesswork. Experienced site owners rely on website traffic data or consumer spending habits to anticipate changing seasonal or topical interests, but this strategy places too much focus on past consumer behavior. To stay ahead of the curve, site owners need to tap directly into the pulse of their visitors to understand their real-time needs and wants. One of the easiest and most overlooked ways to find this pulse is by looking at what users are searching for on your website.

analytics

Below are the key pieces of data that site owners should know about user search behavior, paired with suggestions of how to use these analytics to improve search engine optimization and marketing campaigns:

  1. Top searches. What are users searching for most? This data reveals your users’ intent and identifies the most valuable and popular content on your website. Because you know that users are already looking for this content on your site, these top queries should form a central part of your keyword strategy.
  2. Top searches with no results. Where are users hitting dead ends on your site? If a user searches for something but finds no results, they will assume your site doesn’t have what they are looking for and leave your site to find the content elsewhere. The simple solution to this problem is to create content for those queries – a strategy which will not only help users already on your site, but can also improve rankings for long-tail search queries.
  3. Top autocomplete conversions. What are users clicking on before even seeing a full results page? This data gives you a laser focused understanding of what users hope to find when performing particular queries. Harness this data for your search marketing campaigns by using more targeted, page specific keywords.

By tapping into this rich, user generated data, site owners can find a new source of inspiration for their SEO and SEM efforts and ultimately drive increased traffic to their site.

How Agencies & Web Development Firms Can Leverage Swiftype

Agencies and web development firms have a simple goal when developing digital and mobile properties: help develop a digital experience that looks great and works well for the client. When it comes to actually creating a website, developers are always on the lookout for new solutions that both help clients and make their work easier. Internal search is often one of the most time-consuming parts of implementation, and Swiftype provides a powerful solution to create a great search experience for site visitors and an easy implementation process for site developers.

Swiftype_Partners

At Swiftype, we’ve worked with many Agencies and Web Development Firms (including Digitaria,Code And Theory, 10up, Integrity, and Upstatement) who have identified Swiftype as a valuable solution to provide customized, powerful site search implementations. For them, Swiftype is a solution that makes both clients and development firms happy. Here’s why:

For clients:

  • Powerful Search. Swiftype dramatically strengthens a website’s internal search with fast processing, rapid and customizable autocomplete, smart spellcheck, and rich content indexing. This rewarding search experience will quickly satisfy visitors and keep them on the site.
  • User-friendly customization. Swiftype offers rich customization features, allowing non-technical site owners to reconfigure their search relevancy algorithm and custom rank search results all from a user-friendly dashboard.
  • Actionable analytics. The dashboard also provides detailed analytics on what users are searching for, allowing site owners to see what users want most out of the site and where they could expand their offerings.
  • Built for mobile. Swiftype’s search solution is built for any device, and can be easily customized for your client’s mobile site or app. No need to build a separate search engine.

For development agencies:

  • Quick implementation. After our web crawler indexes your client’s site, the install can be done by in less than half an hour by pasting a few lines of HTML into the website’s template. For tighter customization, insert Swiftype’s custom set of <meta> tags to tell our crawler exactly how to index your client’s website. Integration can also be done via our API.
  • Real-time indexing. Our powerful web crawler will detect any changes that your client makes to their website and immediately reindex those pages to impact real-time search results.
  • Focus on aesthetics. Swiftype’s template frees you from worrying about the back end and allows you to make the search experience and visual appearance look great. Notable examples include Qualcomm, Dr. Pepper, and Harvard Law Review.
  • Analytics. With the client’s permission, you can check Swiftype’s Analytics Dashboard for insights about how clients might improve their website, providing great talking points or presentation materials for quarterly meetings.

We’ve had great success partnering with agencies and web development firms, and we are always interested in hearing from firms that want to work together and receive commissions for Swiftype implementations. If you are interested in working closely with Swiftype to power your clients’ internal search, please get in touch with us—we’d love to see what we can do to help you out. Email us today at [email protected] to get the conversation started.

 

Optimizing Your Site Search with Swiftype Meta Tags

Global Search and Googlebot

When most people think of search, they think of Google. With a fast, intuitive, and highly accurate search engine, Google has become the primary tool for navigating the global web. To deliver such a powerful search experience, Google relies on Googlebot.

Googlebot explores billions of web pages each day, following each link it finds and indexing every page’s content by scanning the HTML and extracting specific elements. While Googlebot is programmed to understand and record standard HTML elements (such as <title>, <h1>, <h2>, <body>,  and so on) Googlebot also understands <meta> tag elements.  Google created these <meta> tags to let site owners provide additional information about a page that may not otherwise be clear from standard tags. As Googlebot scans a page, both <meta> and standard elements are filed in a consistent structure that is optimized for Google’s search engine algorithm, allowing Google to draw upon a richer body of material when delivering results for a particular query.

Internal Search and Swiftbot

When it comes to internal website search, only Swiftype offers a system of <meta> tags to index pages at a similar speed and depth as Googlebot. Most site search providers require some sort of data feed via .xml, .csv or an API to update results—all of which are cumbersome to set up or difficult to maintain. To solve this problem, Swiftype has worked for over two years to build Swiftbot—an extremely powerful web crawler that passes through individual websites and quickly indexes their content. Swiftbot, like Googlebot, understands standard HTML tags, and can also read custom <meta> tags, which allows site owners to create their own system of <meta> tags to completely reconfigure what information they want visitors to discover through search.

For instance, let’s say an ecommerce site wants to let visitors search and sort products by price, color and average review rating. All they need to do is create a <meta> tag for each of these features in the page header:

<head>
  <title>page title | website name</title> 
  <meta class="swiftype" name="name" data-type="string" content="page title" />
  <meta class="swiftype" name="description" data-type="text" content="this is the description" />
  <meta class="swiftype" name="price" data-type="float" content="3.99" />
  <meta class="swiftype" name="color" data-type="string" content="green" />
  <meta class="swiftype" name="review_avg" data-type="integer" content="4.5" />
</head>

With this model, site owners can create as many features as they want Swiftbot to index. Because Swiftbot is programmed to understand and file these <meta> tags when it passes over a page, these elements become central pieces of the site’s data structure and allow site owners to customize search results with faceting and functional boosts.

By offering these custom <meta> tags, Swiftype empowers website owners to tightly control their user search experience and help visitors quickly find the information they need.  Website owners can even see all their extracted metadata from the Swiftype dashboard. For more information on how to format and install Swiftype Meta Tags please follow our documentation. Also, check out how you can use <meta> tags to add multiple values for location attributes.

Click here to get started with Swiftype and create a powerful search engine for your site today.

WordPress Search Plugin Updated for WordPress 4.0

Last week, WordPress released their newest version – WordPress 4.0, named “Benny”. As we know how valuable great search is for WordPress site owners, we’re happy to announce that the Swiftype WordPress Search Plugin has officially been updated for WordPress 4. If you are updating your site, you should see no issues continuing to use the Swiftype WordPress Search Plugin while still getting all the same great features you are accustomed to. If you’re just getting started with WordPress or Swiftype, we now support the latest version.

We’ve got some more WordPress updates coming in the near future, so make sure you check the blog regularly so you don’t miss out. Also, if you have a WordPress site and are looking for a better search solution, go ahead and check out the plugin.

Why We Updated Our Site Search Algorithm

Since we launched Swiftype back in 2012, we’ve worked tirelessly to build the best website search product around. Our founders, Matt & Quin, started Swiftype after discovering site search has been broken for a long time. Of course, the single most important element to search from the searcher’s perspective is relevance of the results. Many of our key features are centered around making it easy to ensure your website’s search results are relevant, from the search engine we build for you providing relevant and up to date results from the moment of your first crawl to allowing heavy customization of your results if you feel they aren’t quite right (by the way – keep an eye out, we’ve got some really exciting stuff coming on the customization front).

However, just because we’ve built a great product doesn’t mean we’ll quit making it better. Quin, our CTO has mentioned that one of the things that makes search so interesting is that he considers it a moving target – something that can always be improved on. In that spirit, we’re incredibly excited to announce a major update to our search algorithm, which now features phrase scoring! This means that our algorithm will now focus on better matching of your search results to the meaning of your entire query, rather ranking based on relevance to each individual keyword in the query. It’s a bit of a subtle difference, but it has some major implications on search results relevance.

A common misconception about most site search products is that the search engines generally understand queries as humans do. For example: if I told you I needed to buy a pair of dress shoes, you would immediately recommend a shoe store, not a dress shop. However, most website search engines use simple keyword matching, which means they rank documents based on their relevance to the individual keywords in the query, rather than the meaning of the query as a whole. In the given example, this likely wouldn’t pose a huge problem, as the most relevant results would be the ones that included both dress and shoes – although there might be some unexpected products further down your result set! However, imagine if you had searched for “black dress shoes.” Without phrase scoring, black dresses are about as likely to show up as dress shoes.

For another illustration, let’s go through an example that we’ve seen in some of our clients.

A very common relevance signal considered in ranking documents against queries is recency. For an illustrative example, consider TechCrunch. Some of their most popular content is news about the iPhone. As TechCrunch is a news site, recency is one of the most important relevance factors, so a search for iPhone will rank news on the new iPhone 6 highly. However, what if you are researching the history of the iPhone, and are looking for press on the iPhone 3? Since most site searches don’t offer phrase scoring, they’ll likely rank results based on relevance to each individual keyword, as well as recency. Since 3 is an extremely common keyword, the results will again be heavily weighted towards recent stories on the iPhone.

Now, with Swiftype, performing a search for “iPhone 3” will consider the sets and order of words. Our results ranking is based on how closely the result matches the set of words, so the results will be much more likely to be relevant to the actual meaning of the search. We’ve been beta testing this feature for a few months with select clients, who have seen improved click-through rates, conversion rates, and retention rates, as their visitors are finding what they are searching for much more often.

Now that we’ve rolled the new algorithm out to all our users, you’ll see immediate improvements to your results. The impact will be felt most by websites that contain large amounts of text, as this is when considering the meaning of the entire query is most meaningful, but all our users should see improvements. For an example of the impact Swiftype’s phrase scoring can have on search results, compare TechCrunch’s search to Mashable’s search. Since those are live search links, I went ahead and took screenshots in case your results look a bit different:

Swiftype-Search-v-Other-Site-Search

All of TechCrunch’s results are clearly about the internet of things (and check out the great faceting they’ve implemented). However, none of the top results on Mashable are at all related to the internet of things, instead being ranked on relevance to the term “internet,” or if I had grabbed the sixth result (The 7 Most Worthless Things at Your Garage Sale), the term “things” (by the way, if anyone from Mashable reads this, go ahead and contact us, we’d love to help).

This is just one example of how we’re continuing to innovate and build in the website search world. This isn’t a feature widely available in website search solutions, or in the out of the box search you get from a third party website platform. We’re looking to fix site search for the broadest possible audience, which is very difficult and complex task. Sometimes it means building a drag-and-drop results customization tool, other times it means releasing feature updates for those of you using our WordPress Plugin. But at its core, search is about relevant results and ensuring your users find what they are looking for, and we are constantly working to make sure we offer the best solution you can find.

To find out more about how Swiftype can fix your search problems, drop us a line.

New Feature: Location Attributes Can Now Have Multiple Values

We’ve made a small change in how location attributes are handled within Swiftype. Now you can have multiple values for location attributes associated with one document. This is great news for many of our customers, because now, if you have a page listing all your store locations, that page can now be associated with all of those locations. Previously, to make sure searchers would be able to find all your locations, you’d need a unique page for each location.

Here’s how to do it using Meta Tags:

<head>
  <title>page title | website name</title>
  <meta class="swiftype" name="title" data-type="string" content="page title" />
  <meta class="swiftype" name="body" data-type="text" content="this is the body content" />
  <meta class="swiftype" name="url" data-type="enum" content="http://www.swiftype.com" />
  <meta class="swiftype" name="store_location" data-type="location" content="25,-10" />
  <meta class="swiftype" name="store_location" data-type="location" content="20,-15" />
  <meta class="swiftype" name="store_location" data-type="location" content="40,-10" />
  <meta class="swiftype" name="store_location" data-type="location" content="20,-20" />
  <meta class="swiftype" name="tags" data-type="string" content="tag1" />
  <meta class="swiftype" name="tags" data-type="string" content="tag2" />
</head>

As you can see, there are 4 store_location fields. You can also add the attributes to existing elements if you’d prefer. You can find out more in our Meta Tags 2 documentation.

You can also use repeated location fields with the Swiftype API. For example, to create a Document with multiple locations similar to the Meta Tags example above:

Swiftype.api_key = 'your_api_key'
client = Swiftype::Client.new
client.create_document('your_engine', 'your_document_type', {
  :external_id => 'unique_id',
  :fields => [
    {:name => 'title', :type => 'string', :value => 'document title'},
    {:name => 'store_location', :type => 'location', :value => {:lat => 25, :lon => -10}},
    {:name => 'store_location', :type => 'location', :value => {:lat => 20, :lon => -15}},
    {:name => 'store_location', :type => 'location', :value => {:lat => 40, :lon => -10}},
    {:name => 'store_location', :type => 'location', :value => {:lat => 25, :lon => -20}},
  ]
})

We’re looking forward to this feature helping out a lot of our customers, so please, reach out with any questions or comments.

Feature Announcement: Cross Origin Resource Sharing

cors-03

We’ve got some exciting news: we now offer Cross Origin Resource Sharing (CORS) for our public API. For a detailed explanation, the linked Wikipedia page is a good place to start. In layman’s terms, you can now access our read-only public API using Javascript from another site. In other words, your website can now pull information from our public API for use on that website without using JSONP. We’ve had a few customers request this instead of the previous JSONP method to deal with situations where the request is too large for a GET. It’s also bit cleaner of an implementation, so we went ahead and rolled it out across the board. It shouldn’t change anything on your end if you weren’t having issues with JSONP before.

Here’s an example of how to execute a search query with the Swiftype Public API with JSONP with jQuery:

var params = {
  q: "your search terms",    
  engine_key: "YOUR_ENGINE_KEY"
};

function handleSearchResults(data) {
  // do something with the search results  
  console.log(data);
}

$.getJSON("https://api.swiftype.com/api/v1/public/engines/search.json?callback=?", params).success(handleSearchResults);

And here is the same query using CORS:

$.getJSON("https://api.swiftype.com/api/v1/public/engines/search.json", params).success(handleSearchResults);

(Note there is no callback parameter.)

We hope this makes using the Swiftype public API easier for those of you who can rely on it. JSONP will continue to be supported, of course!

NOTE: Like JSONP, CORS is only supported from our public API, as it isn’t secure to use your secret API key in front-end JavaScript.

Keep an eye on the blog for more engineering features, and as always, feel free to reach out for support.

Subscribe to our blog