 Okay. Hi. I'm Erica Soroco. Like Christine was saying, I'm the Creative Director at City Ranked, a full-service digital marketing agency in Vancouver, where we focus on providing our clients data-driven solutions. We measure our successes in traffic and conversions. Personally, my passion lies in striking the balance between design and function with a daily pursuit for maximum efficiency. Okay. So, you've designed a beautiful website. Every detail is perfect, and every angle is considered. But does Google like it? If you can't get your website to rank, your gorgeous design is never going to be seen or used. In this talk, I'm going to quickly cover three common design practices that could be tanking your SEO. In an effort to focus these case studies, I'm focusing on just one metric, site speed. Site speed is a huge factor in the way that users and, therefore, Google ranks your website. And if you have design baggage that's increasing load time, you may not be getting the results you expect. Let's be honest. We all hate slow websites. But, you know, who really hates slow websites is Google. We've been hearing it for years, but now it's official. As of July 2018, page speed is officially a mobile ranking factor. Unfortunately, for us, it's completely algorithmic, so no tool, not even search console will tell us if our sites are specifically affected. Keep in mind we do have Google's mobile-friendly tool, which can score our sites on whether they're mobile-friendly or not. But Google is currently telling us that only a portion of website rankings are affected at this point by this update. Therefore, we have to assume that all of our websites are affected. And as a result, we need to focus on shaving down site speed, which could mean ditching some of our favorite design trends. Sliders are a great way to showcase your most important content with big, beautiful images loaded with JavaScript and jQuery in a revolving carousel. They can save space above the fold and are intended to captivate users with immersive design, and they can be gorgeous. But here's why you should consider ditching them. I'm sure we can all agree that sliders are often effective, but let's see what happens when we strip a slider out of a site. Here I've used a local transmission shop as a case study. On the left you can see that the website originally had three slides showcasing each of their main services with big, sexy images of cars behind text. On the right, I removed that slider, replacing it with four static blocks with four smaller but equally sexy images to compare. Is the slider an asset when we compare engagement versus speed? There's a lot of data here, but essentially with the slider, we're looking at a mobile score of 76% and a load time of 4.2 seconds. I got these results by testing the page with the listed tools, Google's PageSpeed Insights, webpagetest.org, and the audit feature in Google Chrome. I tested each one three times and then took the average. When we strip out the slider, we can see that the mobile score increased 4%. The load time is half a second faster, and organic traffic is up 52% in a seasonally comparable period. You'll notice that in the Chrome audit, we actually saw that the time to interactive was actually almost a second longer than with the slider, but the overall trend shows improvement with the variation. OK, so Google probably likes the site better, but let's see what real users think. Comparing these two a little closer, side by side, in addition to the faster load time and the improved mobile score, analytics shows us that the average time on the page is almost a full minute longer, and conversions, which in this case, for this client, we're measuring as phone calls and form fills, are up 31%. Clearly, losing the slider on this website is the way to go. This one's a little controversial, and at least one guy on my team is up there rolling his eyes at me right now, but the data doesn't lie. The second thing to consider ditching are custom fonts. What are custom fonts? Basically anything that doesn't load automatically on all devices, and the most popular of those being Google Fonts and Adobe Typekit. Custom fonts are primarily used to reinforce branding and to create an overall visually appealing look. They're a simple way to make your site stand out. Looking at a side by side comparison here, you can definitely tell that there's a difference between these three sets of fonts, especially if you look at the styling of the 20% off block there. One's using Google Fonts, one System Fonts, and one Adobe Typekit. But can you really tell which one's which? In this test, I've used Starks.com. You guys are probably familiar with them because they're pretty local here. But they're a vacuum retailer, and they have a really large e-commerce website, which loads lots of resources, and I took it to compare the load time of these three different types of fonts. Choosing just two font families to load from each, I found that while Google Fonts are about a second faster than Typekit, System Fonts are the way to go, shaving a full 2.4 seconds off of load time, and even increasing the page speed in sites mobile score from 82 to 83%. Again, you can clearly tell that there's a difference between the three screenshots here, and we could argue which one looks best or which one matches the company's branding best. In fact, with some sites, including Starks in this case, we actually chose to load the extra resources and go with the Google Fonts to specifically match their branding because it's so important to their company specifically. Also, I have to note that by suggesting that you use System Fonts, I'm definitely not suggesting that you leave your text treatment plain and blah and boring. Please use CSS and dress it up and make it look exciting and interesting. The last thing to consider ditching are third-party calls. What do I mean by third-party calls? Specifically, any information that you're telling your website to load offsite each time that it loads. Super common examples of this include maps, social media feeds, inventory management systems like digital poor, or IDX feeds for real estate. Sometimes we use these for social proof. Other times, there's information that's hosted elsewhere, like if we're pulling the keg levels into a website through a brewery's digital poor account. Often, we can't get around using third-party calls, but it's really worth looking into which ones are truly necessary on each page. For this case study, let's look at Samson Sports, a large e-commerce website for wakeboard towers and accessories with a huge social presence and instructional videos for all of their products. On the homepage alone, we have three YouTube videos, one Facebook video, an Instagram feed, and an iframed Google map. Are they all necessary? Maybe, but let's see how they stack up. The results for this were astounding, so I'm going to go over how I did it. Again, each test, I ran three times and then took the average. I removed each call individually, tested it again three times, and then removed the next until the only thing loading was the site itself. Then, I added each of those calls back to the site individually, testing again each time. The base load time on the site was 3.9 seconds, which is arguably too long to begin with, but by adding in Google Maps, Facebook, YouTube, and Instagram, I was able to increase the load time to nearly 18 seconds. There's no way a user is going to stick around for this thing to load no matter how awesome it looks when it's finished. Obviously, we can't get rid of every third-party call on a website, but it's definitely worth weighing which ones are critical and which ones can be cut for the sake of speed. We all know that longer load times result in higher page abandonment and ultimately fewer conversions. Just looking at the image on the left there probably gives most of us anxiety. But now, with Google officially ranking sites based on mobile speed, if your site's beautifully clunky, users may not even make it there in the first place. So what's the big takeaway here? Sometimes it's cool to sacrifice a fraction of a second of site speed for just the right design element. It's all a balancing act, and we have to choose what's really needed on a site-by-site basis. But they all add up, and at the end of the day, you probably can't have everything. If your site's too slow, users bounce, your rankings are negatively affected, especially with Google's new speed update, causing no traffic to the site. So who cares if it's the most awesome site in town? These slides contain a lot of data. I have a link there to my slide deck that has all of the information that we went over, also some screenshots of some of the specific tests that I did. And if you have any questions, feel free to reach out to me, and I can go over all of the testing stuff a little more in-depth. Yeah, I think that also left me with time for questions if anybody has any. Oh, sorry. The question was, have we done any work using AMP pages? Yes, we've looked into it. The clients that my company specifically works with are much more in the service-based industry. And so we don't have a lot of bloggers and AMP, while it is a really super awesome tool for a really big content-heavy websites. It just isn't quite the right fit for any of our clients, so I don't personally have a whole lot of experience with it. But I do know it's a fabulous way around a lot of this if you're working with something that has a ton of content. I'll have to pull it up. I don't remember off the top of my head. Oh, I've passed it. Sorry. So this is, and I'm sorry, which one are you looking at? The page between and so. Oh, desktop. Yes. Yes, it went down to 75. And that was another example of the time to interactive also, also, also, was increased. So because everything that we're loading just loads ever so slightly differently. I think the scores are just going to kind of vary from one test to the next, which is why I took the three average scores in order to find my results. In terms of why that might be, I'm not really sure. I don't know. Yeah. For the sake of this, though, I think it's really important for us to focus on mobile just because that's where the world's going and that's clearly where Google's going with the new speed update. But it is really interesting how you shift and change different elements and the scores adjust so wildly. Just to clarify on that, is Google ranking site speed only for mobile devices or is it for desktop as well? So site speed is definitely a ranking factor and has always been a ranking factor. Both directly, Google, I forget which algorithm update it was, but site speed was a huge thing a couple years ago. And then Google kept saying, like, we're focusing on mobile soon, but they never quite said when that was going to happen. But if we even take the actual site speed metric out of consideration, and we're just talking about Google's intent as a whole, Google's a business, and Google's primary focus is to serve the end user, the person who's searching, the results that they're looking for. And so they're taking into account every little teeny, tiny detail on your site and the way that users interact with it. And so even if we're not considering site, speed, mobile, or desktop as like a direct factor, if a user is getting to your site and it's taking 18 seconds to load and they're like, yeah, right, I'm out of here, Google's going to pay attention to that. And they're going to see that, OK, so the bounce rate is really high on this site because it takes so long to load. Therefore, people are clicking off of that and they're going to that next listing in the SERPs and they're going to end up on that site, and that's the one they're going to convert from. Google knows all that because they're really creepy and they follow everybody. Any other questions? Thank you, Erica.