{"id":139841,"date":"2020-10-14T14:31:28","date_gmt":"2020-10-14T19:31:28","guid":{"rendered":"https:\/\/getflywheel.com\/layout\/?p=42365"},"modified":"2024-06-30T15:12:29","modified_gmt":"2024-06-30T20:12:29","slug":"quality-control-process","status":"publish","type":"resource","link":"https:\/\/wpengine.com\/case-studies\/resources\/quality-control-process\/","title":{"rendered":"How to Clean up Your Quality Control Process"},"content":{"rendered":"\n<p><em>This guest post was written by Chris Andujar a WordPress Maintenance Manager at TinyFrog Technologies, a WordPress Design Agency. To learn more about TinyFrog, <a rel=\"noreferrer noopener\" href=\"https:\/\/tinyfrog.com\/wp-secure\/\" target=\"_blank\">visit their website<\/a><\/em>.<\/p>\n\n\n\n<p>Quality control (QC) can make or break your project. Nonetheless, this essential process can be a bit daunting as WordPress clients expect sites to function and look great on every device type from mobile to smart HDTVs.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-large\"><img decoding=\"async\" src=\"https:\/\/getflywheel.com\/layout\/wp-content\/uploads\/2020\/10\/2020-01-10_Product-Hype-Video_Stills-2458-784x523.jpg\" alt=\"A web developer runs quality assurance tests for WordPress clients\" class=\"wp-image-42378\"\/><\/figure>\n\n\n\n<p>High-end quality assurance involves a consistent approach, the right tools, and collaboration between designers and developers. And, don\u2019t forget to clearly communicate the process to your client so they know what to expect and when to participate.&nbsp;<\/p>\n\n\n\n<p>[article_callout]<\/p>\n\n\n\n<p><strong>Five tips to clean up your quality control process:<\/strong><\/p>\n\n\n\n<p><strong><a href=\"#1\">1. Follow a consistent process<\/a><\/strong><\/p>\n\n\n\n<p><strong><a href=\"#2\">2. Utilize browser and testing tools<\/a><\/strong><\/p>\n\n\n\n<p><strong><a href=\"#3\">3. Include your designer\u2019s feedback<\/a><\/strong><\/p>\n\n\n\n<p><strong><a href=\"#4\">4. Focus on performance and accessibility&nbsp;<\/a><\/strong><\/p>\n\n\n\n<p><strong><a href=\"#5\">5. ECommerce and complex development checks<\/a><\/strong><\/p>\n\n\n\n<p>[\/article_callout]<\/p>\n\n\n\n<hr id=\"1\" class=\"wp-block-separator\">\n\n\n\n<h2 class=\"wp-block-heading\"><strong>1. Follow a Consistent Process<\/strong><\/h2>\n\n\n\n<p>For best results on a new website build, use the waterfall approach with multiple rounds of quality assurance and control \u2014 properly timed, of course.<\/p>\n\n\n\n<p>All of the content should already be added to the site and any major development work completely done when you start quality control. If you\u2019re not done building the site yet and you end up making tons of changes, you\u2019ll have to start the process all over again.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-large\"><img decoding=\"async\" src=\"https:\/\/getflywheel-images.s3.us-east-2.amazonaws.com\/uploads\/2020\/10\/2019-06-14_Sales-Enablement_Audience-Personas_Developer-8067-784x523.jpg\" alt=\"Web developers creating a consistent quality control process.\" class=\"wp-image-42376\"\/><\/figure>\n\n\n\n<p>QC will take more than a few hours, so make sure to leave enough time for this essential phase. Typically, a comprehensive QC can take 5-7 business days if you are reviewing everything. The process may take longer for larger sites with numerous pages or for eCommerce and membership sites.<\/p>\n\n\n\n<p>If you are doing two or three rounds of quality control, you can involve different team members at each stage. The first round typically involves the developer and designer reviewing the site and cross checking that everything matches the design and scope.&nbsp;&nbsp;<\/p>\n\n\n\n<p>The second round is typically the most in-depth step and can involve browser testing and reviewing the site on numerous device sizes, while the final round involves the client. Hopefully, by this point, there won\u2019t be any more issues left for the client to point out!<\/p>\n\n\n\n<hr id=\"2\" class=\"wp-block-separator\">\n\n\n\n<h2 class=\"wp-block-heading\"><strong>2. Utilize Browser and Testing Tools<\/strong><\/h2>\n\n\n\n<p>The right tools will make QC way more efficient. Here are a few of the best to streamline the process.<\/p>\n\n\n\n<p><a href=\"https:\/\/www.browserstack.com\/\" target=\"_blank\" rel=\"noreferrer noopener\">Browser Stack<\/a> is a popular website and mobile testing platform that allows you to test and simulate a website on 2000+ devices and browsers. You can also easily capture screenshots of bugs or fixes as you review the site. With so many different mobile phone and tablet devices and sizes, it\u2019s very difficult to QC a website without utilizing such a platform. After all, your team most likely doesn\u2019t own every variation of iPhone and Android to adequately test the site without the help of a testing platform.<\/p>\n\n\n\n<p>Of course, it\u2019s always a good idea to check the website on as many different browsers on live computers (and mobile devices) as possible. While testing simulations can provide very accurate representations of the site, checking on the device itself gives another layer of certainty, and may just uncover something that would have otherwise been missed.<\/p>\n\n\n\n<p>Two other great resources are ChromeDev Tools and the <a href=\"https:\/\/developers.google.com\/web\/tools\/lighthouse\" target=\"_blank\" rel=\"noreferrer noopener\">Chrome Lighthouse<\/a> audits. With Google Chrome Lighthouse, you can audit performance, accessibility, and best practices. But, regardless of the tools that you select, make sure your team follows a clear checklist on which browsers, devices, and resolutions you intend to test \u2014 and keeps track of the results.<\/p>\n\n\n\n<p>At the beginning of the project, establish clear guidelines with clients on which browsers and resolutions your team supports. For instance, certain browsers such as Internet Explorer are no longer well supported, so there\u2019s no point in spending hours on an unstable platform.<\/p>\n\n\n\n<hr id=\"3\" class=\"wp-block-separator\">\n\n\n\n<h2 class=\"wp-block-heading\"><strong>3. Include Your Designer\u2019s Feedback<\/strong><\/h2>\n\n\n\n<figure class=\"wp-block-image aligncenter size-large\"><img decoding=\"async\" src=\"https:\/\/getflywheel-images.s3.us-east-2.amazonaws.com\/uploads\/2020\/10\/2019-03-21_Establish-Marketing-KPIs-5964-784x523.jpg\" alt=\"A designer and web developer review design feedback together\" class=\"wp-image-42377\"\/><\/figure>\n\n\n\n<p>Quality control and assurance is not just a task for the development team. There are numerous issues that might come up that the web designer is best suited to notice.<\/p>\n\n\n\n<p>A designer can review the form designs, color choices, and hover overs on the site, making sure everything matches the mockups. They can also help with any responsive issues on the site. If the developer is struggling with an issue on mobile, a designer can offer valuable feedback on how elements should collapse to be positioned on smaller devices. If the site includes any micro-animations and scroll animation, a designer can review and make sure these match their vision, too.<\/p>\n\n\n\n<p>Lastly, a designer can watch for the quality and resolution of images and design elements on the built site. A developer is often optimizing images for performance during the build, and sometimes the optimization work can reduce the resolution too much and hurt the quality of the design.<\/p>\n\n\n\n<p>As designs get more complex and involve more dynamic elements, there\u2019s definitely a lot of areas for collaboration between designers and developers. With this in mind, a web designer can reduce some of the back and forth during the QC process by preparing a <a href=\"https:\/\/tinyfrog.com\/what-is-a-website-style-guide\/\" target=\"_blank\" rel=\"noreferrer noopener\">website style guide<\/a> and designer notes for the development team.<\/p>\n\n\n\n<p>It can be helpful, too, to have the designer prepare a mobile mockup for the home page or part of the mobile menu, in order to reduce tons of mobile changes during QC.<\/p>\n\n\n\n<hr id=\"4\" class=\"wp-block-separator\">\n\n\n\n<h2 class=\"wp-block-heading\"><strong>4. Focus on Performance and Accessibility<\/strong><\/h2>\n\n\n\n<p>Today, all website teams need to consider performance at every step of the project. By addressing performance problems during the QC process, you can avoid major optimization work post-launch and client complaints.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" src=\"https:\/\/getflywheel.com\/layout\/wp-content\/uploads\/2020\/10\/2020-01-10_Product-Hype-Video_Stills-2370-784x523.jpg\" alt=\"A web developer focuses on quality control performance and accessibility\" class=\"wp-image-42379\"\/><\/figure>\n\n\n\n<p>For several years now, performance and page load times have been a ranking factor for search engine optimization and it\u2019s not just about rankings. Page load times also impact the user experience on the site. When making decisions in the development process, consider the performance ramifications, from the plugins selected to the parent theme.<\/p>\n\n\n\n<p>Web accessibility is another important consideration for QC. Following development best practices and the <a href=\"https:\/\/www.w3.org\/WAI\/standards-guidelines\/wcag\/\" target=\"_blank\" rel=\"noreferrer noopener\">Web Content Accessibility Guidelines<\/a> can minimize other errors on the site. For accessibility, you\u2019ll want to review the keyboard navigation capabilities, the color contrast in design layouts, and the error messages on any forms. You can utilize <a href=\"https:\/\/webaim.org\/resources\/contrastchecker\/\" target=\"_blank\" rel=\"noreferrer noopener\">WebAIM\u2019s color contrast<\/a> tool to check the contrast ratios on the site.<\/p>\n\n\n\n<p>During the QC process, make sure to run some baseline <a href=\"https:\/\/tinyfrog.com\/how-to-run-wordpress-speed-tests\/\" target=\"_blank\" rel=\"noreferrer noopener\">WordPress speed tests<\/a> &#8211; and repeat them again after launch. If you are building the new site on a production server environment, you may not get accurate results if there\u2019s no caching enabled or if the site will eventually be hosted on a different platform.<\/p>\n\n\n\n<hr id=\"5\" class=\"wp-block-separator\">\n\n\n\n<h2 class=\"wp-block-heading\"><strong>5. ECommerce and Complex Development Checks<\/strong><\/h2>\n\n\n\n<p>In addition to checking for visual issues during the QC process, you\u2019ll need to allocate more time for complex builds, such as eCommerce or membership sites.<\/p>\n\n\n\n<p>It\u2019s helpful to have a specific process for these types of projects so you don\u2019t miss any pivotal testing. In addition to the normal QC items above, you\u2019ll need to test the shopping cart, review shipping settings, and check any product filtering or search options for an e-commerce website. You\u2019ll also need to watch for integration issues with the email platform and\/or CRM.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-large\"><img decoding=\"async\" src=\"https:\/\/getflywheel-images.s3.us-east-2.amazonaws.com\/uploads\/2020\/10\/2019-03-22_Relaunching-the-Layout-7993-1-1-784x523.jpg\" alt=\"A web developer sits at his desk for the quality control work.\" class=\"wp-image-42381\"\/><\/figure>\n\n\n\n<p>For membership sites, you\u2019ll want to test the steps for new membership sign up, payment processing (if applicable), and renewal steps. Most payment gateways like PayPal and Stripe offer ways to do test payments on a production site without having to process a payment and then a refund.<\/p>\n\n\n\n<p>All of these elements can add several days to the quality control process for these types of sites. The quality control steps are even more critical for an eCommerce site, though, because any major issues will directly affect sales and revenue.<\/p>\n\n\n\n<p>If your client will be adding products to the site before launch, it\u2019s helpful to hold off on quality control until all of the content and products are set up on the site.<\/p>\n\n\n\n<hr class=\"wp-block-separator has-css-opacity\"\/>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Getting Close to Perfection<\/strong><\/h2>\n\n\n\n<p>There may be a lot of details to take care of during the QC process, but it all comes down to consistency, collaboration, and well-supported tools.<\/p>\n\n\n\n<p>And of course, establishing clear boundaries about when your team\u2019s responsibility ends. After a client gets access to the site or moves the site to a different hosting platform, it can be very challenging to anticipate errors.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>This guest post was written by Chris Andujar a WordPress Maintenance Manager at TinyFrog Technologies, a WordPress Design Agency. To learn more about TinyFrog, visit their website. Quality control (QC) can make or break your project. Nonetheless, this essential process can be a bit daunting as WordPress clients expect sites to function and look great<span class=\"tile__ellipses\">&hellip;<\/span><span class=\"tile__ellipses--animated\"><\/span><\/p>\n","protected":false},"author":297,"featured_media":42374,"template":"","resource-topic":[],"resource-role":[],"resource-type":[916],"class_list":["post-139841","resource","type-resource","status-publish","has-post-thumbnail","hentry"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v20.9 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>How to Clean up Your Quality Control Process | WP Engine<\/title>\n<meta name=\"description\" content=\"Quality control (QC) can make or break your project. Nonetheless, this essential process can be a bit daunting as WordPress clients expect sites to function and look great on every device type.\" \/>\n<meta name=\"robots\" content=\"noindex, follow\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"How to Clean up Your Quality Control Process | WP Engine\" \/>\n<meta property=\"og:description\" content=\"Quality control (QC) can make or break your project. Nonetheless, this essential process can be a bit daunting as WordPress clients expect sites to function and look great on every device type.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/wpengine.com\/case-studies\/resources\/quality-control-process\/\" \/>\n<meta property=\"og:site_name\" content=\"WP Engine\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/wpengine\" \/>\n<meta property=\"article:modified_time\" content=\"2024-06-30T20:12:29+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/wpengine.com\/case-studies\/wp-content\/uploads\/2024\/05\/WPE-IMG-Thumbnail-1200x630-1.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1200\" \/>\n\t<meta property=\"og:image:height\" content=\"630\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:site\" content=\"@wpengine\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"7 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/wpengine.com\/case-studies\/resources\/quality-control-process\/\",\"url\":\"https:\/\/wpengine.com\/case-studies\/resources\/quality-control-process\/\",\"name\":\"How to Clean up Your Quality Control Process | WP Engine\",\"isPartOf\":{\"@id\":\"https:\/\/wpengine.com\/case-studies\/#website\"},\"datePublished\":\"2020-10-14T19:31:28+00:00\",\"dateModified\":\"2024-06-30T20:12:29+00:00\",\"description\":\"Quality control (QC) can make or break your project. Nonetheless, this essential process can be a bit daunting as WordPress clients expect sites to function and look great on every device type.\",\"breadcrumb\":{\"@id\":\"https:\/\/wpengine.com\/case-studies\/resources\/quality-control-process\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/wpengine.com\/case-studies\/resources\/quality-control-process\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/wpengine.com\/case-studies\/resources\/quality-control-process\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/wpengine.com\/case-studies\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Resources\",\"item\":\"https:\/\/wpengine.com\/case-studies\/resources\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"How to Clean up Your Quality Control Process\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/wpengine.com\/case-studies\/#website\",\"url\":\"https:\/\/wpengine.com\/case-studies\/\",\"name\":\"WP Engine\",\"description\":\"Managed Hosting for WordPress\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/wpengine.com\/case-studies\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/wpengine.com\/case-studies\/#\/schema\/person\/3a22232b01de39dcf588fb8e421c0521\",\"name\":\"Erin Myers\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/wpengine.com\/case-studies\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/cd881e115bc28c81642ec61752db9981ece9ee8b4c81498a9b6276b9cdcaf5e6?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/cd881e115bc28c81642ec61752db9981ece9ee8b4c81498a9b6276b9cdcaf5e6?s=96&d=mm&r=g\",\"caption\":\"Erin Myers\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"How to Clean up Your Quality Control Process | WP Engine","description":"Quality control (QC) can make or break your project. Nonetheless, this essential process can be a bit daunting as WordPress clients expect sites to function and look great on every device type.","robots":{"index":"noindex","follow":"follow"},"og_locale":"en_US","og_type":"article","og_title":"How to Clean up Your Quality Control Process | WP Engine","og_description":"Quality control (QC) can make or break your project. Nonetheless, this essential process can be a bit daunting as WordPress clients expect sites to function and look great on every device type.","og_url":"https:\/\/wpengine.com\/case-studies\/resources\/quality-control-process\/","og_site_name":"WP Engine","article_publisher":"https:\/\/www.facebook.com\/wpengine","article_modified_time":"2024-06-30T20:12:29+00:00","og_image":[{"width":1200,"height":630,"url":"https:\/\/wpengine.com\/case-studies\/wp-content\/uploads\/2024\/05\/WPE-IMG-Thumbnail-1200x630-1.jpg","type":"image\/jpeg"}],"twitter_card":"summary_large_image","twitter_site":"@wpengine","twitter_misc":{"Est. reading time":"7 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/wpengine.com\/case-studies\/resources\/quality-control-process\/","url":"https:\/\/wpengine.com\/case-studies\/resources\/quality-control-process\/","name":"How to Clean up Your Quality Control Process | WP Engine","isPartOf":{"@id":"https:\/\/wpengine.com\/case-studies\/#website"},"datePublished":"2020-10-14T19:31:28+00:00","dateModified":"2024-06-30T20:12:29+00:00","description":"Quality control (QC) can make or break your project. Nonetheless, this essential process can be a bit daunting as WordPress clients expect sites to function and look great on every device type.","breadcrumb":{"@id":"https:\/\/wpengine.com\/case-studies\/resources\/quality-control-process\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/wpengine.com\/case-studies\/resources\/quality-control-process\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/wpengine.com\/case-studies\/resources\/quality-control-process\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/wpengine.com\/case-studies\/"},{"@type":"ListItem","position":2,"name":"Resources","item":"https:\/\/wpengine.com\/case-studies\/resources\/"},{"@type":"ListItem","position":3,"name":"How to Clean up Your Quality Control Process"}]},{"@type":"WebSite","@id":"https:\/\/wpengine.com\/case-studies\/#website","url":"https:\/\/wpengine.com\/case-studies\/","name":"WP Engine","description":"Managed Hosting for WordPress","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/wpengine.com\/case-studies\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/wpengine.com\/case-studies\/#\/schema\/person\/3a22232b01de39dcf588fb8e421c0521","name":"Erin Myers","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/wpengine.com\/case-studies\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/cd881e115bc28c81642ec61752db9981ece9ee8b4c81498a9b6276b9cdcaf5e6?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/cd881e115bc28c81642ec61752db9981ece9ee8b4c81498a9b6276b9cdcaf5e6?s=96&d=mm&r=g","caption":"Erin Myers"}}]}},"acf":[],"grid_image_url":"https:\/\/wpengine.com\/case-studies\/wp-content\/themes\/wpengine-breakthrough\/images\/fallback\/default-grid-resource.jpg","media-type":{"term_id":916,"name":"Article","slug":"article"},"role":false,"topic":false,"_links":{"self":[{"href":"https:\/\/wpengine.com\/case-studies\/wp-json\/wp\/v2\/resource\/139841","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wpengine.com\/case-studies\/wp-json\/wp\/v2\/resource"}],"about":[{"href":"https:\/\/wpengine.com\/case-studies\/wp-json\/wp\/v2\/types\/resource"}],"author":[{"embeddable":true,"href":"https:\/\/wpengine.com\/case-studies\/wp-json\/wp\/v2\/users\/297"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wpengine.com\/case-studies\/wp-json\/wp\/v2\/affiliate\/42374"}],"wp:attachment":[{"href":"https:\/\/wpengine.com\/case-studies\/wp-json\/wp\/v2\/media?parent=139841"}],"wp:term":[{"taxonomy":"resource-topic","embeddable":true,"href":"https:\/\/wpengine.com\/case-studies\/wp-json\/wp\/v2\/resource-topic?post=139841"},{"taxonomy":"resource-role","embeddable":true,"href":"https:\/\/wpengine.com\/case-studies\/wp-json\/wp\/v2\/resource-role?post=139841"},{"taxonomy":"resource-type","embeddable":true,"href":"https:\/\/wpengine.com\/case-studies\/wp-json\/wp\/v2\/resource-type?post=139841"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}