Jack Lenox Interview – Web Sustainability, The Last Frontier

Jack Lenox is an environmentalist and tech aficionado. He knew from an early age that he wanted to make the web a better place (or was it the world?), but it was his ancient historical studies that put his career in focus.

You’ll also discover that Jack had decided to dive to the depths of the web long before he joined Automattic.

Now that you are more familiar with the topic, I’m sure you’re ready to find out more about this. If you’d rather choose the video over the text transcription, make sure you open the Twitter thread. Each question has a separate video.

We were lucky enough to interview @JackLenox at #WCEU last week. He talked to us about sustainable web design and how easy it can be to get started.

Unfortunately, Twitter's video restrictions meant we needed to edit for brevity but the full interview will go on YouTube soon. pic.twitter.com/sjfpkT5hz7

— Codeinwp (@codeinwp) July 1, 2019

Jack Lenox:

Well, it depends on how you configure it, but 6 KB is what I got the home page to. So, obviously the theme is small, but you could put a huge image which would blow that right out. Yeah, 6 KB-ish.

Jack Lenox:

About a day (laughs). It took a bit longer. It’s funny because I sort of talked to people about it being the thing that took the least effort to get the most amount of applause.

I was mostly just removing things, so I wanted to get everything out of the theme, except the things we absolutely need. So I started with Underscores. Underscores is a starter theme for people who aren’t familiar with it, produced by the team Automattic. And it’s already a bare-bones theme, but there are lots of things in there.

There are also assumptions made in Underscores that fit in with a traditional way that we do with theming in WordPress, like having a sidebar and widgets areas. I took all of those things out and I also cut down some of the markup, because I was getting into some fine-tuning; some of the divs and stuff that don’t really need to be there, and other elements.

It’s very lean Underscores, but I was cutting even the CSS they had back and had the bare minimum I think I could do. So yes, it took a little bit of time. It probably took more than a day, but it didn’t take very long.

Jack Lenox:

When I got to University and having this hobby of doing websites, I got involved with setting up a student newspaper and then we needed a website. I thought there has to be a better way than using these crazy content management systems I had been making.

At that point, Ruby was becoming a thing, so there were different approaches, but I knew PHP and SQL and that’s kinda all I wanted to do, even though some people criticized that. WordPress came on to my radar and then I started playing around with it and from the beginning it cut out so much of the work, just having a CMS that’s working.

I’ve always been a bit of an outsider, because I’ve always liked this sort of unorthodox use of WordPress. So, for me, WordPress has always been the CMS. I was like “I need to build a newspaper website, so let’s build a newspaper website and use WordPress”.

When I first started using it, I didn’t have custom post types. It was 3.0, pretty old. So I remember doing a lot of weird hacks for creating galleries, that old stuff that people used to do back then.

Then it kinda evolved and I ended up coming out of University in the middle of a recession. I was trying to become a journalist and it wasn’t an easy road. But I had built up all these web skills, so I worked at a consumer finance website where I was a journalist. I quickly got on to working on their website and I said: “your website is terrible”. Then, they wanted to shift it on to WordPress and I was like “I’ve just been learning WordPress”. And that led to more and more of that.

Jack Lenox:

I work for Automattic. In 2013 I joined Automattic, having done a few different agency jobs. Then, in 2016, I moved from the VIP team which is kinda within Automattic, but it’s quite separate. And now I work on big newspaper websites. Things like 538 and we’ve also got The Sun in the UK, which is a big newspaper.

And then, we’ve got all sorts of other clients; we’ve got Metro, which is one of the free papers in the UK. In the US, all of CBS is on there – all of their local sites. Facebook and almost every site that isn’t Facebook.com is on WordPress VIP. We host a lot of blogs like Spotify, Airbnb blogs and so on.

Jack Lenox:

If you’re a small business, there are a lot of little things that you can be doing. Obviously one of those things is trying to choose a performant theme. It’s a little bit hard to work out which ones are sustainable. I’d love to include some sort of grading in the theme repository.

There are a lot of things like YouTube embeds – if you actually embed a YouTube video, that would take about 1 Mb download just to show the embed before you even click “play”.  And both from a performance standpoint and a sustainability standpoint, you can say, if everyone is going to click this, if it is embedded on the page, if it’s a virtual tour of our hotels, then you’ll probably want to embed it. But a lot of time, people do that. It’s that kinda stuff that gets in the way. If most people aren’t clicking it, then, you know, it doesn’t need to be embedded.

You could just have the link to the video, or you can have a static screenshot image. The point is making your site as accessible as possible, so people aren’t wasting time roaming around it. It’s not just performance, it’s not just usability, it’s also energy usage.

And then, there are some plugins. For example, you should be using a plugin like WP Super Cache, because you don’t need to configure it. You’re not configuring NGINX or Apache, for it would just generate HTML and static pages and serve those instead of the dynamic ones. If you’re kind of a web administrator, add WP Super Cache and activate it. It’s a really great plugin.

Jack Lenox:

It’s pretty wide-ranging. First is getting as up-to-date as you can, with the latest performance techniques. For example, if you’re in a position where you configure servers, there’s a new compression mechanism called Brotli, which Google has produced and Open Sourced. It’s even better than GZip.

Then, it is about how you build your product. The quote I have from Peter Pickering that I really like is: “The most performant, maintainable component you build for your website is the one that you don’t build.” So it’s kind of a minimalistic approach. I am not saying “take all of your graphics away”, but make it really nice.

So yeah, think about all the way down to your divs and what CSS preprocessors you’re using. Also, think about what kind of CSS that’s producing, monitoring all those kind of different bits of code that you’re producing, setting performance budget and setting yourself a target on how big your webpage is going to be.

I’d suggest something like half a megabyte. I mentioned Thought Company, the article I showed was 200 KB and that’s fully designed. That’s a proper publishing house and they are doing that kind of thing.

The other thing, if you were in a position to do this, is to be powering your stuff with renewable energy, because that really helps. So, we’ve got quite a few hosts in the UK. You can use Google Cloud platforms.

You can actually like the AWS Frankfort data center, for it is the sustainable service petition. They have a whitepaper that links from that petition and it is only about 5 or 6 pages. It is really interesting to read through and see what the technologists in this sphere have been doing.

Jack Lenox:

I think the leader is Wholegrain Digital. I know Tom quite well and we’ve chatted quite a bit, so it’s cool because not many people are doing stuff about this. So, to have a company as influential as Wholegrain Digital in the sphere in WordPress space, I mean it’s pretty awesome.

They’ve obviously built this website, which is the tool that tells you what the carbon footprint of your website is. They’re doing a lot of work as a company, so they’re disclosing all of their carbon footprint data based on everything down to employees commuting into work. And if they were coming to a conference like this, they would be measuring everything. They would be encouraging people to go by train. They’re definitely the out and out leader.

There are kind of some peripheral companies as well that probably not everyone will know.  For example Mightybytes, which is a company run by Tim Frick. Tim wrote the book “Designing for Sustainability”.

MightyBytes actually does a lot of WordPress work, but they’re one of those agencies that you won’t see as much at WordCamps. They are not as much in the community, because they also do Drupal. They’re a multi, not just a WordPress agency.

In terms of individuals, someone like Justin Tadlock, who I shouted out to in the talk, I don’t think he’s making things for sustainability, but he happens to be doing it by accident. So high five.

Jack Lenox:

I would say Google should do whatever they can to make their platform as sustainable as possible for free. If the premium apps, like if it’s hanging around, we’d stop playback of video. I don’t know anyone on the YouTube team or anything.  I’d love to know a bit more about how they came to that decision.

Chris:

Yeah, it’s weird because there are options where you can get streaming music for free, like Spotify free. It’s really good so I understand it’s a requested feature, but I don’t think it’s make or break.

Jack Lenox:

No, you wouldn’t think that’s the only reason people are going for premium, so I’d like to see them take it out. For the study as well, guys at Bristol were looking at one. They were like: “what’s one design change that YouTube could make?” And that’s was the one they hit upon.

I think there are hundreds of changes they could be making and they do. These companies are really performant. But it’s thinking about the actual design of the site and how people are going to use it, and if it is as efficient as possible. That comes back to the designers and it comes to user experience.

Jack Lenox:

You have to take your hat off in all different ways. They’re running the Lighthouse project which is a performance auditing tool. It is built into Chrome, you can run it standalone and it’s open source. It’s being led by Paul Irish, one of their celebrity web developers. They severely audit all of their own stuff. You know, the performance of Google – their homepage over the years. It’s obviously a very simple page in and of itself, but they made that faster and faster.

They also rank a part of the weighting of your search engine ranking, so the more heavy your site is, the lower your ranking. All of these things are encouraging a more performant site, which in turn is more sustainable.

The cloud platform is, through offsets and other things, effectively 100% renewable, which is pretty huge. They are way ahead of Amazon in that regard. Alphabet is the biggest corporate buyer of renewable energy in the world.

Obviously, as someone who is environmentally minded, you think they could be doing more. A lot of their energy setup is through offsetting. They’re buying renewable energy in Canada and feeding it back into their grid. But if you’re ramping up your energy at the speed the Internet is, we’re going to run out of options. They need to be building solar farms and they need to be building wind turbines themselves. Or at least funding them to power their data centers, so they need to be truly green and it’s a big challenge.

Chris:

When you talk to the clients and they are like: Woah, I want that carousel in there. Where are the share buttons? How are you talking them out of that?

Jack Lenox:

I think if you have it, the best thing you use is data. It’s proven across the board that the bigger and heavier your website is, the more you lose people. The more you lose customers, the more you lose readers. The more you lose, you’ve dropped down the Google rankings, because that’s part of their measure. There are so many reasons not to do it.

Certainly, I think there has been a shift. We’ve never really done frontend code reviews. We do code review for the security and everything else, but clients are increasingly saying “we want our site to be better”. Because we sell speed, but we can’t stop you adding two hundred images to a page and it being slow.

We serve them as quickly as possible, but that doesn’t matter. Or, if you have some massive blocking JavaScript that’s going to happen and you’re going to come up bad on WebPageTest. Clients are increasingly actively wanting it as well.

I think the third thing you could do there is doing user research and the more you can do that with the client. User research sounds really expensive. You think we’ve got to book a room, pay people to come in, test the website and ask a load of questions. Or, you can literally go sit in a cafe and go up to someone and say: “Excuse me, do you mind if I…would you test my website and I’ll buy you a coffee?”

You can spend an hour in the grand scheme of things for even a freelancer, agency. But if you can’t sit and demonstrate to a client that the user doesn’t like a carousel, so you compare the two and you say “that’s definitely because users don’t like carousels”.

They don’t interact with them. 98% of people don’t click them. That’s where you end up with your hardest evidence. You’re like: “Look, all these people, they don’t like carousels.”

Jack Lenox:

Well, it is really interesting, because sustainability does encompass all of those practices. So I don’t know if people capture the imagination in quite the same way as other paradigms shifts have. We are definitely seeing a lot more companies competing, in terms of how sustainable they are, even banks. It’s what everyone wants to be saying they’re doing. And obviously, making a website more sustainable is one thing, but I also want to try and drive it to companies to be more like Wholegrain Digital and to disclose their carbon footprint.

To be thinking about WordCamp Europe, I’d love to see a carbon footprint analysis of this whole conference. The point is, once you start measuring stuff, you can start changing stuff. So if WCEU does a carbon footprint analysis, it’s probably too late now. They can think about what can we do to make that better next.

The impact of measuring creates an actual number that you can then start to shift. I’d love to see that happening within web design and within the web industry. That’s the thing. It gets in the collective psyche to have people writing about it and talking about it. And one of the big things is talking to other people about it.