{"id":58,"date":"2019-12-23T19:31:41","date_gmt":"2019-12-24T03:31:41","guid":{"rendered":"http:\/\/wordpress-210328-1057968.cloudwaysapps.com\/?p=58"},"modified":"2020-01-02T04:17:36","modified_gmt":"2020-01-02T12:17:36","slug":"testing-html5-geo-location","status":"publish","type":"post","link":"https:\/\/wordpress-210328-1057968.cloudwaysapps.com\/testing-html5-geo-location\/","title":{"rendered":"Testing HTML5 geo-location at scale – Store locator example"},"content":{"rendered":"\n

If you want to get very precise geolocation information about your website’s visitors, the HTML5 Geolocation API<\/a> is a very reliable method for fetching real-time location information. Most browsers support the JavaScript API and there are many tools for implementing it.

Many sites use the Geolocation API to fetch the user’s information. For example, McDonalds.com prompts the user for permission to access the browser’s API. Without explicit permissions, it will show an input box for a user’s address.<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

Other sites like Starbucks.com use a hybrid approach of GeoIP and HTML5 geo-location. By using GeoIP as the default provider, they pre-populate their list with relevant store information and improve the precision of the targeting once the user grants privileges.

Example:
<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

<\/p>\n\n\n\n

<\/p>\n\n\n\n

Once granted, it will show a populated results page with the nearest locations.
<\/p>\n\n\n\n

Starbucks.com
For a tutorial on how to implement HTML5 geo-location, please go here.<\/a>
<\/p>\n\n\n\n

Testing HTML5 Geo-location – Starbucks Store Locator<\/h2>\n\n\n\n
  1. Log in to your GeoScreenshot account<\/li><\/ol>\n\n\n\n

    https:\/\/www.geoscreenshot.com\/login<\/a><\/p>\n\n\n\n

    2. Go to the capture page, enter the URL, make sure “HTML5 Geolocation” is enabled <\/p>\n\n\n\n

    \"\"<\/figure>\n\n\n\n

    3. You should see a grid of results<\/p>\n\n\n\n

    \"\"<\/figure>\n\n\n\n

    4. Click on a specific screenshot to look at the details<\/p>\n\n\n\n

    \"Screenshot\"\/<\/figure>\n\n\n\n

    <\/p>\n","protected":false},"excerpt":{"rendered":"

    How to test your HTML5 Geo-location implementation using GeoScreenshot<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[1,6],"tags":[],"acf":[],"yoast_head":"\nTesting HTML5 geo-location at scale - Store locator example - GeoScreenshot<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"http:\/\/wordpress-210328-1057968.cloudwaysapps.com\/testing-html5-geo-location\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Testing HTML5 geo-location at scale - Store locator example - GeoScreenshot\" \/>\n<meta property=\"og:description\" content=\"How to test your HTML5 Geo-location implementation using GeoScreenshot\" \/>\n<meta property=\"og:url\" content=\"http:\/\/wordpress-210328-1057968.cloudwaysapps.com\/testing-html5-geo-location\/\" \/>\n<meta property=\"og:site_name\" content=\"GeoScreenshot\" \/>\n<meta property=\"article:published_time\" content=\"2019-12-24T03:31:41+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2020-01-02T12:17:36+00:00\" \/>\n<meta property=\"og:image\" content=\"http:\/\/wordpress-210328-1057968.cloudwaysapps.com\/wp-content\/uploads\/2019\/12\/image-2-1024x582.png\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Eyasu Kifle\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"1 minute\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebSite\",\"@id\":\"https:\/\/wordpress-210328-1057968.cloudwaysapps.com\/#website\",\"url\":\"https:\/\/wordpress-210328-1057968.cloudwaysapps.com\/\",\"name\":\"GeoScreenshot\",\"description\":\"Test your website from 100s of locations worldwide\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/wordpress-210328-1057968.cloudwaysapps.com\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"ImageObject\",\"@id\":\"http:\/\/wordpress-210328-1057968.cloudwaysapps.com\/testing-html5-geo-location\/#primaryimage\",\"inLanguage\":\"en-US\",\"url\":\"https:\/\/wordpress-210328-1057968.cloudwaysapps.com\/wp-content\/uploads\/2019\/12\/image-2.png\",\"contentUrl\":\"https:\/\/wordpress-210328-1057968.cloudwaysapps.com\/wp-content\/uploads\/2019\/12\/image-2.png\",\"width\":1753,\"height\":997},{\"@type\":\"WebPage\",\"@id\":\"http:\/\/wordpress-210328-1057968.cloudwaysapps.com\/testing-html5-geo-location\/#webpage\",\"url\":\"http:\/\/wordpress-210328-1057968.cloudwaysapps.com\/testing-html5-geo-location\/\",\"name\":\"Testing HTML5 geo-location at scale - Store locator example - GeoScreenshot\",\"isPartOf\":{\"@id\":\"https:\/\/wordpress-210328-1057968.cloudwaysapps.com\/#website\"},\"primaryImageOfPage\":{\"@id\":\"http:\/\/wordpress-210328-1057968.cloudwaysapps.com\/testing-html5-geo-location\/#primaryimage\"},\"datePublished\":\"2019-12-24T03:31:41+00:00\",\"dateModified\":\"2020-01-02T12:17:36+00:00\",\"author\":{\"@id\":\"https:\/\/wordpress-210328-1057968.cloudwaysapps.com\/#\/schema\/person\/9943ebb4ffce50002d279948ddcfa489\"},\"breadcrumb\":{\"@id\":\"http:\/\/wordpress-210328-1057968.cloudwaysapps.com\/testing-html5-geo-location\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"http:\/\/wordpress-210328-1057968.cloudwaysapps.com\/testing-html5-geo-location\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"http:\/\/wordpress-210328-1057968.cloudwaysapps.com\/testing-html5-geo-location\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/wordpress-210328-1057968.cloudwaysapps.com\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Testing HTML5 geo-location at scale – Store locator example\"}]},{\"@type\":\"Person\",\"@id\":\"https:\/\/wordpress-210328-1057968.cloudwaysapps.com\/#\/schema\/person\/9943ebb4ffce50002d279948ddcfa489\",\"name\":\"Eyasu Kifle\",\"url\":\"https:\/\/wordpress-210328-1057968.cloudwaysapps.com\/author\/eyasu-kifle\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Testing HTML5 geo-location at scale - Store locator example - GeoScreenshot","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"http:\/\/wordpress-210328-1057968.cloudwaysapps.com\/testing-html5-geo-location\/","og_locale":"en_US","og_type":"article","og_title":"Testing HTML5 geo-location at scale - Store locator example - GeoScreenshot","og_description":"How to test your HTML5 Geo-location implementation using GeoScreenshot","og_url":"http:\/\/wordpress-210328-1057968.cloudwaysapps.com\/testing-html5-geo-location\/","og_site_name":"GeoScreenshot","article_published_time":"2019-12-24T03:31:41+00:00","article_modified_time":"2020-01-02T12:17:36+00:00","og_image":[{"url":"http:\/\/wordpress-210328-1057968.cloudwaysapps.com\/wp-content\/uploads\/2019\/12\/image-2-1024x582.png"}],"twitter_card":"summary_large_image","twitter_misc":{"Written by":"Eyasu Kifle","Est. reading time":"1 minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebSite","@id":"https:\/\/wordpress-210328-1057968.cloudwaysapps.com\/#website","url":"https:\/\/wordpress-210328-1057968.cloudwaysapps.com\/","name":"GeoScreenshot","description":"Test your website from 100s of locations worldwide","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/wordpress-210328-1057968.cloudwaysapps.com\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"ImageObject","@id":"http:\/\/wordpress-210328-1057968.cloudwaysapps.com\/testing-html5-geo-location\/#primaryimage","inLanguage":"en-US","url":"https:\/\/wordpress-210328-1057968.cloudwaysapps.com\/wp-content\/uploads\/2019\/12\/image-2.png","contentUrl":"https:\/\/wordpress-210328-1057968.cloudwaysapps.com\/wp-content\/uploads\/2019\/12\/image-2.png","width":1753,"height":997},{"@type":"WebPage","@id":"http:\/\/wordpress-210328-1057968.cloudwaysapps.com\/testing-html5-geo-location\/#webpage","url":"http:\/\/wordpress-210328-1057968.cloudwaysapps.com\/testing-html5-geo-location\/","name":"Testing HTML5 geo-location at scale - Store locator example - GeoScreenshot","isPartOf":{"@id":"https:\/\/wordpress-210328-1057968.cloudwaysapps.com\/#website"},"primaryImageOfPage":{"@id":"http:\/\/wordpress-210328-1057968.cloudwaysapps.com\/testing-html5-geo-location\/#primaryimage"},"datePublished":"2019-12-24T03:31:41+00:00","dateModified":"2020-01-02T12:17:36+00:00","author":{"@id":"https:\/\/wordpress-210328-1057968.cloudwaysapps.com\/#\/schema\/person\/9943ebb4ffce50002d279948ddcfa489"},"breadcrumb":{"@id":"http:\/\/wordpress-210328-1057968.cloudwaysapps.com\/testing-html5-geo-location\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["http:\/\/wordpress-210328-1057968.cloudwaysapps.com\/testing-html5-geo-location\/"]}]},{"@type":"BreadcrumbList","@id":"http:\/\/wordpress-210328-1057968.cloudwaysapps.com\/testing-html5-geo-location\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/wordpress-210328-1057968.cloudwaysapps.com\/"},{"@type":"ListItem","position":2,"name":"Testing HTML5 geo-location at scale – Store locator example"}]},{"@type":"Person","@id":"https:\/\/wordpress-210328-1057968.cloudwaysapps.com\/#\/schema\/person\/9943ebb4ffce50002d279948ddcfa489","name":"Eyasu Kifle","url":"https:\/\/wordpress-210328-1057968.cloudwaysapps.com\/author\/eyasu-kifle\/"}]}},"_links":{"self":[{"href":"https:\/\/wordpress-210328-1057968.cloudwaysapps.com\/wp-json\/wp\/v2\/posts\/58"}],"collection":[{"href":"https:\/\/wordpress-210328-1057968.cloudwaysapps.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wordpress-210328-1057968.cloudwaysapps.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wordpress-210328-1057968.cloudwaysapps.com\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/wordpress-210328-1057968.cloudwaysapps.com\/wp-json\/wp\/v2\/comments?post=58"}],"version-history":[{"count":0,"href":"https:\/\/wordpress-210328-1057968.cloudwaysapps.com\/wp-json\/wp\/v2\/posts\/58\/revisions"}],"wp:attachment":[{"href":"https:\/\/wordpress-210328-1057968.cloudwaysapps.com\/wp-json\/wp\/v2\/media?parent=58"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wordpress-210328-1057968.cloudwaysapps.com\/wp-json\/wp\/v2\/categories?post=58"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wordpress-210328-1057968.cloudwaysapps.com\/wp-json\/wp\/v2\/tags?post=58"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}