Successfully reported this slideshow.
Your SlideShare is downloading. ×

iPullRank Webinar - Automated Testing For SEO With Hamlet Batista

iPullRank Webinar - Automated Testing For SEO With Hamlet Batista

Download to read offline

Welcome to iPullRank's Webinar featuring Hamlet Batista to discuss the topic "Automated Testing for SEO."

With so many cooks in the kitchen on any development project, it’s incredibly difficult as an SEO to know everything that is going on to troubleshoot what could go wrong.

Automated Testing is a way to put some safeguards in place so that if anything new in your code is rolled out, it doesn’t break something that previously existed in the code, like some previous functionality or something to that effect.

In this webinar, we will be touching on important topics such as:

-- What is automated testing and why is it important
-- The different types of automated testing
-- Different automated testing tools
-- Expert insights by Mike & Hamlet

Signup for our expert newsletter here:
https://pages.ipullrank.com/iprnewslettersignup

Welcome to iPullRank's Webinar featuring Hamlet Batista to discuss the topic "Automated Testing for SEO."

With so many cooks in the kitchen on any development project, it’s incredibly difficult as an SEO to know everything that is going on to troubleshoot what could go wrong.

Automated Testing is a way to put some safeguards in place so that if anything new in your code is rolled out, it doesn’t break something that previously existed in the code, like some previous functionality or something to that effect.

In this webinar, we will be touching on important topics such as:

-- What is automated testing and why is it important
-- The different types of automated testing
-- Different automated testing tools
-- Expert insights by Mike & Hamlet

Signup for our expert newsletter here:
https://pages.ipullrank.com/iprnewslettersignup

More Related Content

Related Books

Free with a 30 day trial from Scribd

See all

iPullRank Webinar - Automated Testing For SEO With Hamlet Batista

  1. 1. 1
  2. 2. 2 Your Speakers AutomatedTestingforSEO Hamlet Batista CEO at RankSense Mike King Managing Director at iPullRank
  3. 3. 3 Has this ever happened to you? AutomatedTestingforSEO
  4. 4. 44 AutomatedTestingforSEO https://twitter.com/iPullRank/status/1045435603851063296
  5. 5. 55 AutomatedTestingforSEO https://twitter.com/iPullRank/status/1045435603851063296
  6. 6. 66 AutomatedTestingforSEO https://twitter.com/iPullRank/status/1045435603851063296
  7. 7. 77 AutomatedTestingforSEO https://twitter.com/iPullRank/status/1045435603851063296
  8. 8. 88 AutomatedTestingforSEO https://twitter.com/iPullRank/status/1045435603851063296
  9. 9. 99 AutomatedTestingforSEO https://twitter.com/iPullRank/status/1045435603851063296
  10. 10. 1010 PlanningSEOfor2021
  11. 11. 1111 PlanningSEOfor2021
  12. 12. 12 What is Automated Testing? AutomatedTestingforSEO
  13. 13. 13 So first, let’s talk just a little bit about modern web development and how it works.
  14. 14. 1414 Why Does This Matter? AutomatedTestingforSEO A lot of modern software frameworks follow this design pattern that allows for a separation of concerns between data, logic and frontend.
  15. 15. 1515 Why Does This Matter? AutomatedTestingforSEO In this example the PHP framework Laravel manages the Model and the Controller and the JavaScript framework React acts as the View.
  16. 16. 16 A URL is Converted into a Route AutomatedTestingforSEO URLs point to controllers which then return the right views featuring data from the right models. This is why segmented crawls are important to developers being able to implement recommendations.
  17. 17. 17 Waterfall Rarely Makes Sense Anymore AutomatedTestingforSEO It’s unlikely that the websites you work on will follow a waterfall methodology. Everything is agile now.
  18. 18. 18 Most Dev Teams Follow Agile Methodology AutomatedTestingforSEO Small pieces of functionality are tackled in short time frames or “sprints.”
  19. 19. 1919 Continuous Integration AutomatedTestingforSEO Often engineering teams are following a Continuous Integration model where teams and individuals are autonomously pushing their code as they complete it.
  20. 20. 2020
  21. 21. 2121 Deployment Pipelines feature Automated Tests AutomatedTestingforSEO Deployment pipelines allow for safeguards to be put in place to ensure that everyone is following the same process to get things deployed.
  22. 22. 2222 Tests Can Make the Build Fail AutomatedTestingforSEO Certain tests are deemed as critical to the infrastructure of the website and will cause the deployment process to fail and the developer has to go back and fix it before they can continue with their work.
  23. 23. 2323
  24. 24. 24 Automated Testing AutomatedTestingforSEO There are three flavors of testing that are most relevant to us as SEOs: Unit Tests, Integration Tests and GUI Tests.
  25. 25. 2525 Unit Testing AutomatedTestingforSEO With Unit tests you are testing an individual function or procedure to ensure that it works. These are generally small and fast. Codebases can have many of these. Unit tests can be used to determine the presence of tags and attributes in structure of code to be served to the client, but not the rendered code.
  26. 26. 26 Integration Testing AutomatedTestingforSEO With integration testing you’re testing how your logic comes together to build the bigger system. It can involve external data such as APIs and databases or how the various pieces of the systems work together. This is significantly slower than unit testing, but depends on how much of the system needs to be rendered in order to complete the test. Integration tests can be used to determine tags, features and content of completed HTML source being served to the client. However, there can be overlap with what can be viewed in an UI test.
  27. 27. 2727 Integration Testing AutomatedTestingforSEO UI Testing is the testing of the frontend interface of your website. This is largely used for ensuring front end components work as intended. This is the slowest version of testing because it requires the page to be fully rendered. UI tests can be used to determine tags, features and content of the rendered DOM being served to the client.
  28. 28. 2828 This is What Headless Browsers are Actually For AutomatedTestingforSEO Certain tests are deemed as critical to the infrastructure of the website and will cause the deployment process to fail and the developer has to go back and fix it before they can continue with their work.
  29. 29. 2929 Test Driven Development AutomatedTestingforSEO Some modern developers follow this methodology wherein they write their tests first and then write their code until the tests pass. Unit tests are primarily used for this, but any type of test could be used. Note: UI Tests will dramatically slow down deployment.
  30. 30. 30 How Does This Apply to SEO? AutomatedTestingforSEO
  31. 31. 31 @BritneyMuller brings up a great point AutomatedTestingforSEO My goal with that post and talk is to introduce you to another way to integrate developers and ensure we’re all moving towards working better together.
  32. 32. 32 Let’s go back through those horror stories.
  33. 33. 3333 A Test Can Catch This AutomatedTestingforSEO Unit Test Failure Condition – Presence of meta noindex tag on functions that impact the <head>. Integration Test Failure Condition – Presence of meta noindex on routes that should not have them. This is a critical issue so this test should fail the build.
  34. 34. 3434 Robots.txt Test AutomatedTestingforSEO Unit Test Failure Condition – Presence of “User-agent: * Disallow: /” on prod in a function for the robots.txt route. Integration Test Failure Condition – Presence of “User-agent: * Disallow: /” on prod in robots.txt URL. This is a critical issue so this test should fail the build.
  35. 35. 35 SSR Test AutomatedTestingforSEO Integrated Test/UI Test Failure Condition - Key body content is not available in the HTML version. This one requires the rendered DOM as a comparison so it technically could be a UI and/or Integrated Test. This should definitely fail the build.
  36. 36. 3636 Rel-canonical AutomatedTestingforSEO This is a critical issue so this test should fail the build. UI Test Failure Condition – URLs that should have a self-referencing canonical do not in the DOM. Integration Test Failure Condition – URLs that should have a self-referencing canonical do not in the HTML. Unit Test Failure Condition - Route does not set canonical tag on the server side.
  37. 37. 37 Invalid Tag Tests AutomatedTestingforSEO This is a critical issue so this test should fail the build. UI Test Failure Condition – Rendered DOM features tags in the <head> sub-tree that are invalid. Integration Test Failure Condition – HTML features tags in the <head> that are invalid or HTML does not pass W3C validation. Unit Test Failure Condition - Function that returns the <head> features tags that don’t fit a list of valid <head> tags.
  38. 38. 3838 But Testing is Not a Magic Bullet AutomatedTestingforSEO Sure, we can develop tests for to look for the presence of structured markup and to enforce metadata specifications, but when things go this wrong, you have to put your team member, project management, consultant, management hat on and get to the bottom of what went wrong.
  39. 39. 3939 Who Usually Does this Work? AutomatedTestingforSEO https://searchengineland.com/get-developers-implement-seo-recommendations-280318 Developer QA Engineer
  40. 40. 4040 How Can We Split the Responsibility for Unit Tests? AutomatedTestingforSEO https://searchengineland.com/catching-seo-errors-during-development-using-automated-tests-322365
  41. 41. 4141 How Can We Split the Responsibility for End to End Tests? AutomatedTestingforSEO https://searchengineland.com/catching-seo-errors-during-development-using-automated-tests-322365
  42. 42. 42 Doing an SEO Audit is basically doing similar work to that of a QA Engineer.
  43. 43. 43 Crawling HTML is Somewhat like Integration Testing AutomatedTestingforSEO You’re looking at the results of what the software spits out when all the systems come together.
  44. 44. 4444 Crawling JavaScript is more like UI Testing AutomatedTestingforSEO You’re looking at the results when the user interface is rendered.
  45. 45. 4545 …And you should be comparing the differences AutomatedTestingforSEO John Hogg from iProspect shared his diff comparison Chrome extension that computes the DIFF between HTML and rendered DOM. When it’s released I encourage you to check it out.
  46. 46. 4646 Your Role is To Help Plan the Tests AutomatedTestingforSEO You’ll want to work with a QA Engineer, a Product Manager or a Developer to develop test cases that can then be built into.
  47. 47. 4747 Here are Few Examples AutomatedTestingforSEO These examples of tests should be enough to get you started on defining your own potential tests for SEO. Test Case ID Test Scenario Test Type Test Steps Test Data Expected Results Actual Results Pass/Fail SEO01 Presence of Meta Descriptions Unit Test Check for presence of meta description tag in HTML Page template code All URLs should have meta description Product Detail Page is missing meta description PASS SEO02 Viable Internal Links Functional Test 1.Render pages 2.Open all internal links 3.Review response codes Crawled URL data All links return 200 response code Many links to redirects and 404s FAIL SEO03 Average Page Speed Less than 2 Seconds Functional/Integ ration Test 1.Render pages 2.Capture page speed 3.Determine average page speed per page type Render all page types from URL list All page types should return an average of 2 seconds load time Homepage takes 5 seconds to load FAIL
  48. 48. 48 Tools Some tools you can use to get your automated testing for SEO off the ground AutomatedTestingforSEO
  49. 49. 49 Meet Jenkins, Github Actions, CircleCI AutomatedTestingforSEO If your developers are doing Continuous Integration or Continuous Delivery, it’s likely that they are using Jenkins, Github Actions, CircleCI or similar tools. https://jenkins.io/ https://circleci.com/ https://github.com/features/acti ons
  50. 50. 5050 Get Failure Alerts in Slack AutomatedTestingforSEO https://plugins.jenkins.io/slack
  51. 51. 5151 Or in Jenkins’ logs AutomatedTestingforSEO You could also just regularly the logs that Jenkins provides.
  52. 52. 5252 Or Pipe it into MySQL AutomatedTestingforSEO Sending the Jenkins logs into MySQL gives you the opportunity to monitor and visualize failures and successes of builds with respect to SEO in a variety of ways such as through Google Data Studio.
  53. 53. 5353 You’ll Also Need a Crawler AutomatedTestingforSEO You’ll want a headless crawler and a text-based crawler to spin up pages and run tests on and a fixed list of pages that represent all of the public-facing routes. https://github.com/yujiosaka/headless- chrome-crawler https://github.com/antivanov/js-crawler
  54. 54. 5454 You’ll Also Need a Crawler AutomatedTestingforSEO Building your crawler with AWS Lambda, Azure Functions or Google Clouds Functions may be a great way to enjoy scale without having to manage additional servers.
  55. 55. 5555 Tips On Testing AutomatedTestingforSEO Make only mission critical SEO tests potentially fail the build. Most SEO issues will be spotted in your integration tests. Include your SEO tests in every build. Keep your testing suites separate. Do all crawling in parallel. Crawl/check only one or two URLs per template to speed up checks and avoid slowing down the build
  56. 56. 56 Let’s Code Some Tests ... AutomatedTestingforSEO
  57. 57. 5757 AutomatedTestingforSEO Here is a simple AngularJs app that we will use to illustrate the ideas in this presentation https://github.com/ranksense/gtrends-watch Let’s Code Some Automated SEO Tests! Here is a simple AngularJs app that we will use to illustrate the ideas in this presentation https://github.com/ranksense/gtrends-watch
  58. 58. 58 IPULLRANK.COM AutomatedTestingforSEO
  59. 59. 59 IPULLRANK.COM AutomatedTestingforSEO
  60. 60. 6060 AutomatedTestingforSEO jasmine.github.io
  61. 61. 6161 Using Unit Tests to Catch Missing Meta Tags AutomatedTestingforSEO Unit tests help check every component individually performs as expected. https://github.com/ranksense/gtrends-watch/blob/master/src/app/category-topics/category-topics.component.spec.ts#L52 https://github.com/ranksense/gtrends-watch/tree/seo-tests
  62. 62. 6262 Which Components Require SEO Unit Tests? AutomatedTestingforSEO Not every component is in scope of SEO (might be invisible to bots)
  63. 63. 6363 The Role of End to End SEO Tests AutomatedTestingforSEO https://www.protractortest.org/ End to end/integration tests help check overall operation. User them to simulate logical crawler paths and actions.
  64. 64. 6464 Which Actions Require SEO End to End Tests? AutomatedTestingforSEO Many user actions are not in scope of SEO (clicking/saving)
  65. 65. 65 Checking for Rendering Problems AutomatedTestingforSEO End to end tests are ideal to check for rendering problems.
  66. 66. 66 A Tricky Test: BODY HTML tags in the HEAD Does this affect Googlebot? If it does, does the fix work too? Let’s see! AutomatedTestingforSEO
  67. 67. 6767 BODY HTML tags in the HEAD AutomatedTestingforSEO If the page is missing the BODY tag, Google adds it back. Good.
  68. 68. 6868 BODY HTML tags in the HEAD AutomatedTestingforSEO If we add a <DIV> manually to the HTML HEAD, Google pushes our canonical to the BODY. Same as in the browser.
  69. 69. 6969 BODY HTML tags in the HEAD AutomatedTestingforSEO If we add a <DIV> to the HTML HEAD using a script, the URL Inspection Tool gives an error and the page doesn’t get indexed. The browser can handle the page.
  70. 70. 7070 BODY HTML tags in the HEAD AutomatedTestingforSEO If we move the SEO tags to the top of the HTML and leave the invalid <DIV>, the canonical remains in the HTML HEAD.
  71. 71. 7171 BODY HTML tags in the HEAD AutomatedTestingforSEO It is properly detected. Good.
  72. 72. 7272 BODY HTML tags in the HEAD AutomatedTestingforSEO The optimal solution is to move the invalid scripts and tags to the HML BODY.
  73. 73. 7373 How do We Detect it? AutomatedTestingforSEO https://gist.github.com/hamletbatista/ad99891ecbcc3f56e7e65e6d01311225 Here is the Python code! https://gist.github.com/hamletbat ista/ad99891ecbcc3f56e7e65e6d 01311225 It searches for a canonical anywhere in the DOM, and prints the path where it found it. If it is not in the HEAD, we can fail the test.
  74. 74. 7474 Test Coverage: Tracking Down Code Without Tests AutomatedTestingforSEO Writing tests is half the battle The other half is making sure the relevant code is always covered with tests.
  75. 75. 7575 Test Coverage: Tracking Down Code Without Tests AutomatedTestingforSEO Tools like Istanbul help with this in JavaScript-driven apps. https://istanbul.js.org/
  76. 76. 76 Wrapping up. Who are we and where am we from?
  77. 77. 7777 PlanningSEOfor2021
  78. 78. 7878
  79. 79. 7979 Mike King Founder & Managing Director at iPullRank @iPullRank PlanningSEOfor2021
  80. 80. 8080 Hamlet Batista CEO & Founder at RankSense @hamletbatista PlanningSEOfor2021
  81. 81. 8181
  82. 82. 8282 PlanningSEOfor2021 @RankSense ranksense.com 33 Wood Ave South Suite 600 Iselin, NJ 08830 USA +1 866.882.2983
  83. 83. 83 Q&A / Thank You! Twitter: @ipullrankagency Email: hello@ipullrank.com Website: https://ipullrank.com Get in touch if you need some help! PlanningSEOfor2021 Mike King Managing Director at iPullRank Hamlet Batista CEO & Founder at RankSense

×