3: Notre Dame’s Web Speed Strategy w/ Erik Runyon

ABOUT THIS EPISODE

Erik Runyon, Technical Director at the University of Notre Dame discusses tools and strategies to minimize web page weight and load times in order to maximize prospective student behavior.

Attracting today's new post traditional learners means adopting new enrollment strategies. Helix educations data driven, enterprise wide approach to enrollment growth is uniquely helping colleges and universities thrive in this new education landscape, and Helix has just published the second edition of their enrollment growth playbook with fifty percent brand new content on how institutions can solve today's most pressing enrollment growth challenges. Downloaded today for free at Helix Educationcom. Slash playbook. You're listening to enrollment growth university from Helix Education, the best professional development podcast for higher education leaders looking to grow enrollment at their college or university. Whether you're looking for fresh enrollment growth techniques and strategies or tools and resources, you've come to the right place. Let's get into the show. Welcome back to enrollment growth university. I'm Eric Oleson, AVP of marketing at Helix Education, and we're here today with Eric Running, technical director at the University of Notre Dame. Eric, how you doing today? Doing Great. Thanks for having me. Thanks so much for being here. Eric and I first met at, I believe, a high ad web conference five years ago at the time he was about one of the only ones in higher read doing responsive web design really well. I remember he and Peter Angel Form Leaf from Bob Jones University were comparing home page load times and brainstorming how a limit the amount of serve request to shave off fractions of seconds and maximized site speed, and I thought, wow, this is a performance based view of Web Development that I want to be a part of. Fast forward five years. Peter Angels now our head developer a helix, and Eric's one of the first people I call when I have a web development question. He's absolutely one of the leading technical minds and higher education and I'm ecstatic to chat with him today about how Notre Dame thinks of website performance as an enrollment growth strategy. But before we get deep into that air, can you get the listeners a little bit better understanding of both the University of Notre Dame and your role? They're right. So the University Notre Dame is a small private Catholic University in North Northwestern...

Indiana. Had as being for a moment there and it we're primarily known for our football. I suppose we're only trying to make much more of a name for ourselves for research. We want to become the pre eminent research Catholic University in the world. So I work for the marketing communications departments. We have the web team there. We worked on the main university home page as and we're also responsible for a number of top level pages, including I want to see. We have five hundred some websites in our cms that we built and maintain internally as well. Love it. Let's jump right into there. For the pages that you manage. Let's talk high level about webs cite performance, it's effect on perspective, student Web Behavior and what your team does to maximize performance in general. So we've been pretty focused on web performance for quite a while. I think I started giving presentations on performance probably starting around two thousand and eight or two thousand and nine, because you know, the iphone had recently come out. Mobile was obviously going to keep growing and it seemed like at the time that websites were just growing and growing in size and you know, with cellular connections, that that needed to back down. Now that obviously hasn't happened. Websites have continued to grow and growing, grow exponentially, even in higher ed it's just been climbing like crazy. For instance, I track higher it responsive website and I have a list of them out of my website. Will have a link in the show notes. But when I first started doing this I had like maybe sixteen hired websites that were responsive and at the time the average paid size, I want to say, was around one point two megs. And now, with my most recent numbers, it's I have about three hundred and nineteen hired websites and the average size is two point six...

...megabytes. And that's for the mobile version. Yeah, not that, not the desktop version. And now the problem that I see here is a core responding number, that is, the render start time for these sites is around eight seconds, so that from when the person you know hit your you are out in their phone, it starts rendering after eight seconds, which is a long time and is not visually complete. The average right now is twenty one seconds. And the problem with that is there was a report by Sony Erks and last year where they did a study on stress and mobile delays with streaming and websites, and some interesting stats they came out with was a found at heart rate increases thirty percent with thirty eight percent with mobile content delays, and one of the things that they core they like have this graph where they show certain things that can raise people's stress, and experiencing mobile delays is slightly higher than watching a horror movie. Now, I don't know about you, but I can remember the first horror movie that I saw. I was in the fourth grade. I know whose house I was at. I remember the layout of the living room. Yeah, who's babysitting, the name of the movie, I remember everything about that because it was so stressful that it was sort of seared into me. And personally, the last thing I want to do is cause users, who are, you know, these these potential students who are coming to our websites, to be stressed because our websites are so slow and then associate that with our brand. You know that's not something you really want. So the faster that you can make your sites it's going to create a much more positive experience and a much more positive view of your university or college from the user standpoint. Love it, yeah, and stresses one thing, but them giving up is incredibly likely when you're making them weight eight seconds to you famously publicize Notre Dame's webstats each month, with which I just love.

What are you and your team looking for in these analytics to determine side effectiveness, site speed issues, and then what kind of next steps do you take after analysis to make sure you are continually improving each month? So those stats post, I think, are primarily with those I'm looking for trends with browsers and mobile traffic and whatnot. I'm not really using those is as a performance for most performance standpoint. For that I usually rely on webpage test at ORG, which is a fantastic tool. You can put in your website. You can even put in your url and like some other website that you consider something you want to benchmark against, and you can have sidebyside video of how quickly your site loads compared to this other site. And another great thing about it is it will help you catch regressions. For instance, this is actually a very timely thing to note. We just recently updated the architecture for our main dubsite. We have been on Amazon for I want to say seven or eight years now. It's been a while at least, and so it was finally time to upgrade the architecture for our primary website. And so last night I ran a test against the site again just as see how things were going, and I noticed that our score drop to dramatically and upon digging in it really we realized that in the move from the old architecture to the new architecture, Geez it wasn't turned on, which is the server technology that will compress your files before sending it down to the user, which is a major performance hit. Like I can't believe we actually alive with with that happening, but we were able to fix it within I probably say thirty minutes, but if you don't monitor things like that, then it could have gone for, you know, weeks and weeks with users getting a subpart experience from a performance standpoint from our website. So yeah, so the stats are more to watch for trends and see which a browsers we need to support and how mobile is improving,...

...and then use other tools for actual page performance. I love it. Let's talk a little bit more about site speed, because it seems like that is just a primary focus of both you and your team. I know Google historically has been famous for talking about the benefits of site speed and how you will rank higher. Google would trust your site more from an authority standpoint, if you have a fast loading page. You were mentioning to me offline that that facebook is kind of a teasing a similar algorithm here and in your future. Can you speak more about that? Yeah, so they just released an article on it would have been to two days ago now, on their news room to Facebookcom and they are saying that an update that they are doing to the way that they load show stories is that they are going to start taking page speed into account. there. We can put a link in the show notes for this as well. It's an interesting read. But what they will do is, though, look at estimated load time of Web page when someone clicks on it and start factoring that into the person's network and you know which stories are actually going to be promoted more than others. So, yeah, you mentioned Google has been doing that for quite a while. Another thing to take into account is https. Google is also going to start prioritizing secure connections or not secure, and I ran a stat against my list of websites a while back and it was well under half of higher a universities that are forcing their sites t to be https. Wow, which is another important thing that you should start doing, because there was a researcher from Stanford a couple years ago who's at the at an airport and load up stand for its home page and there were banner ads being injected by ATT's Wi fi because their website wasn't secure. Well, so not just from a you know, general security standpoint, but Google is going to be prioritizing https. Plus, going back to brand, it's it's an important thing to have so that way nefarious networks aren't...

...going to mess with your with your sits content. Speak a little bit more about that because I think for most of us when we think https, we think, Oh yeah, our burst stars office has that. When on the pages where students are paying for the tuition or paying fees, and maybe we're nervous about pages that have inquiry forms? Well, who would be important on pages where folks aren't transmitting personal information? Well, for one would be the you know Google prioritizing sites that are secure, but also just making sure that the networks in between your site and your user aren't injecting things that you wouldn't want as part of your site. So like the that that example with Stanford would be an important one and the thing is that in the past a lot of people said, well, https is going to be slower. Is really not anymore. In some instances it's actually a little bit faster. And plus, https is free. Now there's websites where you can get free certificates. If you're on aws, you can get a free certificate for any of your websites that you're hosting there, which is saved us a bunch of money. And so, in light of all of that, we have actually start did any new site that we build at at Notre Dame is https by default for the past I want to say year and a half, almost two years. We won't launch a site that's not https anymore. You know, is should just be the way that we're doing business now, kind of like responsive web design. You know, talk about well, do you want responsive? Of course it's going to be part of the build build. https should also be just absolutely it's just how we build sites now. Love it, love it. Let's talk about launching new sites. I feel like college and universities, every three years they talked about a site redesign and I think often what is the priority in their mind is looks outdated, maybe some navigation issues. We want to improve or we have a new brand that we want to leverage. How much should colleges and universities focus on visual esthetic when they are entering a...

...redesign, and how much should they balance that with any performance issues that some of these modern designs may cause? I think performance should be one of the top priorities of any redesign. For instance, our main website, Dodd A, need ID to you. It's it's over five years old now. We launch that in April of two thousand and twelve. But one of the things that we had discussed is if you go and look at it now, you'll see a large image in the background. But what one of the first things that we discussed about doing in that area was, rather than than a large image, it would be a very subtle background video that takes up the entire space. The thing was is nobody was really doing this at that time. So in one respect I regret us not doing it, because we would have been one of the first sites out there doing this, you know, the subtle background video. But ultimately a lost out to performance. We were trying to find that balance between, you know, something big and beautiful versus something that loads extremely quickly so, I mean we do a lot of lazyloading on the site, you know, any images that aren't displayed when when the site first pops up, we don't even load until these are scrolls, because is pretty as you want it to be. If it's slow for the user to connect and actually see it, then then you're you're kind of like breaking out some of that positive experience by by making things so for your users. So you really got to find that balancing act between the visuals and the performance, and performance should absolutely be part of the conversation from day one. I know you keep track of, like you mentioned, more than three hundred higherd websites, specifically those that are responsive. Can you provide us with some benchmarks? Maybe not the average of the higher ad aggregate, but just in general things that are our web teams should keep in mind in terms of basic pageload bench marks that we should keep in mind in terms of let's try to keep our...

...home page under this and our sub pages under this. Any just just quick high level tips you can provide? So that's often referred to as a performance budget, where you try to decide move on it, to load this fast on this browser. In this connection, and you really shoot for that goal. And now, oftentimes the home page budget will be difference from some pages because you know the home page will often have like the more, the larger, prettier pictures, right, so that will often drive up the page size because you know, images are the primary bloat for most hied websites, right, and websites in general. So I'd say for the average subpage, I don't like to see them over three or four hundred K and you know, try to load have the load time of less than two seconds, easy, like preferably one. For the home pages, you can go a little bit larger, but I still don't like to see a home page of a site over, let's say, five or six hundred K. and you know, it really makes you focus on not just the design but when you are creating the imagery, to make sure that you are compressing it correctly and you know you have the corrective image formats, because a lot of times people will take like an image and just dump it from their phone onto the website. So it's important to train people in how to proper compress images and, as well as your cms, make sure that you have some way of building building in so it will compress images even further while not degrading the visuals, obviously. But one nice thing that's coming along is have you're heard of service workers? Sure, yeah, yeah, so service workers. For the listeners that don't know, it's a newer technology. It's replacing an older technology called APP cache, and it allows for the developers to be very fine grained with how assets are stored on the device. So you can take essentially take an entire website stored on the device, so that way if the user doesn't have a connection...

...or has a slow connection, it can load from the device and still be fast. And the Nice thing that just happened is the Webkit team just it came out yesterday that they are starting their initial plans to build service workers into Fari. So right now it's supported by chrome and Firefox and hopefully within the next six months or so it'll be available in Safari, which is going to cover a vast majority of most people's user base at that point, which means that you would be able to use these service workers to vastly increase the page speed, and maybe not on initial load. You would still have to make sure that you focus on initial load performance, but for repeat visits service workers are going to be great for improving performance and offline viewing. And I know you earlier mentioned that the average higher reed home pages is over to meg two points consideration. That's for the mobile. It sets for the mobile. If, if folks are able to utilize these tools to compress their sites effectively and then get to those benchmarks you talked about, you know, K or under page, maybe six hundred k Max for a home page, would that arguably put them in the top one to five percent of highed pages out there? Oh, absolutely. Yeah, I just looked at desktop. That's three pointing us and like and like we talked about, if you focus on the right tools you can make some staggering performance leaps quickly without sacrificing esthetic experience. and Google will favor you. facebook will now favor you. Yeah, much more than your peers. So it's it's super exciting world to start digging into. Yeah, but it's a very important to make it part of the overall culture of the team and anybody who's involved. So I mean your designers and the product owners. Everybody has to be all in on understanding and believing that performance is important. Otherwise it's going to start slipping and esthetics are going to,...

...you know, win out over performance. Terrific tip, Eric. Anything else knew that you're excited about, either from a responsive web development standpoint or just a DEV standpoint in general? You want to make sure is on our listeners. Radar Service workers is I've been excited about that since, you know, it first came out. It's a very cool technology. It's a little complicated initially, but a lot of tooling is coming out to really help improve the building and maintaining of service workers, and now that safari is getting on board that means that we're really really going to be able to start using it in a much more across the board because, you know, IOS is a big chunk of our mobile traffic, and Notre Dame some. Once service workers is available, there will really be able to start utilizing it to its full of potential. Awesome, Eric. Thank you so much for joining us today and sharing all the good stuff you in your team and Notre Dame we're doing. What's the best place for listeners to connect with you if they have any follow up questions? Probably twitter. It's Iranian er UNYO in and I linked to my website from there, so you can get to every everywhere else. If you want to contact you can do so either from twitter from my site. Awesome, Eric, thanks so much for joining us today. Thank you so much for having me. You've been listening to enrollment growth university from Helix Education. To ensure that you never miss an episode, subscribe to the show in Itunes or your favorite podcast player. Thank you so much for listening. Until next time,.

In-Stream Audio Search

NEW

Search across all episodes within this podcast

Episodes (246)