Learn Python with Talk Python's 270 hours of courses

#263: SEO for developers Transcript

Recorded on Thursday, Apr 23, 2020.

00:00 As developers and technologists, it's easy to think that powerful and unique ideas will percolate to the top.

00:06 If we build something amazing, enthusiastic users will find and share our creations.

00:11 Sometimes this happens, but more often, success is an iceberg on so many levels.

00:16 We're going to look at one of those icebergs on this episode.

00:20 Join me and Christian Medina as we discuss SEO, search engine optimization, for developers.

00:26 Some of your search rankings are out of your control.

00:30 But as you'll see, there are many tools in the developer's toolbox that directly affect your search rank.

00:35 Let's dive in.

00:36 This is Talk Python to Me, episode 263, recorded April 23rd, 2020.

00:41 Welcome to Talk Python to Me, a weekly podcast on Python.

00:58 The language, the libraries, the ecosystem, and the personalities.

01:01 This is your host, Michael Kennedy.

01:03 Follow me on Twitter, where I'm @mkennedy.

01:05 Keep up with the show and listen to past episodes at talkpython.fm.

01:09 And follow the show on Twitter via at Talk Python.

01:11 This episode is sponsored by Kite and Linode.

01:15 Please check out what they're offering during their segments.

01:17 It really helps support the show.

01:18 Chris, welcome back to Talk Python to Me.

01:20 Hi, Mike.

01:21 How's it going?

01:22 Glad to be here.

01:23 Yeah, it's going really well.

01:24 You and I, we were supposed to be catching up at PyCon, and we're not, actually.

01:29 That's right.

01:30 That's right.

01:30 We had some interesting plans for PyCon this year, and we were unable to do that.

01:34 But oh well.

01:35 We roll with the punches and move on, I guess, right?

01:38 Yeah, what a bummer.

01:40 I'm a little bit bummed that PyCon's not happening this year, but at the same time, you know,

01:44 it's first world problems, right?

01:46 Like, everything could be way worse than we don't get to go to our geek hall here.

01:49 But at the same time, I really was looking forward to it, and yeah, we had some cool stuff

01:53 for the expo floor we were going to do together, but not to be.

01:56 Maybe 2021.

01:58 That's right.

01:58 I tweeted a little picture of all the badges and stuff.

02:01 I know.

02:01 I was going to bring online, but okay.

02:04 Yeah, I have a big box of stickers that we'll now have to wait until the next event.

02:09 So welcome back.

02:10 Welcome back.

02:11 You've been on the show a couple of times.

02:13 You first came on the show with episode 166 for continuous delivery with Python.

02:18 And that was really interesting to talk about continuous delivery, but it was also one of

02:22 the shows that just had so many little tips and tools and techniques that was like, so many

02:29 people wrote in and talked about it.

02:30 It was like, it was awesome.

02:31 And it was like, it was awesome, even if you don't care about CICD.

02:34 So that was, that was fun.

02:35 And then you came back and we talked about Python packaging and the options that you

02:39 explored there.

02:40 Yep.

02:40 Well, what I'm wondering though, is if somebody went to the internet and they did a search

02:45 for those things, would my site come up?

02:47 I could tell you mine won't.

02:49 Yeah.

02:51 I've been reading a lot about what makes all of that work.

02:54 So in running the stuff I do at TriExitPass, it's been interesting trying to understand how the

03:03 internet actually works.

03:04 You think you know how it works, but you don't.

03:05 You think you actually have control over what you see and how you get to it, but you also

03:11 don't.

03:11 So it turns out that a lot of that is filtered through a bunch of companies and those tend

03:18 to be mostly Google, but Bing plays a little role in it as well.

03:22 So that's why, you know, if you've ever had the situation where like you're talking to a

03:27 buddy and you Googled something and you're like, why didn't you find it?

03:30 I Googled it and it's right here.

03:31 Yeah.

03:32 Then your buddy Googles it and the search results are completely different.

03:34 There's a lot of stuff that happens in that algorithm that really has an effect on how

03:41 well your pages show up on search results.

03:43 Well, I think that that's a good indicator or data point for just how much the algorithms

03:51 are playing a role here, right?

03:54 Like if I go and search for something when I'm logged in, I get different results than if

03:58 I search when I'm not logged in.

03:59 And anytime I want to try to assess how is this thing actually ranking for the world?

04:05 Like how is it really being relevant to others?

04:07 I go and open an incognito or private window and do my search there because there's a lot

04:14 of different things at play, right?

04:16 There are a lot.

04:17 And so for example, like I have, like I don't log in, like in my work account isn't tied at

04:23 all to my home stuff.

04:25 The results are completely different when I'm at work and do Google searches.

04:29 And so it's interesting because, you know, one of the main reasons the internet is what

04:35 it is, is like this freedom where everybody can post information and make it available

04:38 to the whole world.

04:39 But actually it turns out there's all these gatekeepers that have come up in recent years

04:44 and it's all based on all the search algorithm and all the search engine rankings.

04:48 Yeah.

04:48 Everything is free and there's like this abundance of information.

04:51 But when there's too much of an abundance, then it's not providing the information or

04:56 the actual information itself that's valuable.

04:58 It's the filtering and the grouping and the directing you through and just mostly get rid

05:05 of all the stuff that's not there, right?

05:07 Like, what do I actually care about when I'm saying like, I need to learn this thing in Python

05:11 or I want to read something about this news event, right?

05:14 It's not that it's trying to show it all to me.

05:16 The actual role is to like, not show me the stuff.

05:19 Like, show me only what matters.

05:20 Which I think is a, it's a little bit contradictory to the way the internet started, right?

05:25 Like it started out with like, I don't know.

05:28 I think of Yahoo as like the most prototypical early, early, early days where it was literally

05:34 a directory.

05:35 A directory, yeah.

05:36 Like the yellow pages of the internet, right?

05:38 Yeah.

05:38 That's right.

05:39 So crazy.

05:40 It's all been kind of like incremental steps on how to make it easier for you to find stuff,

05:44 but also how does the search engine determine what is a valid result for you?

05:49 But you know, by them doing that, that means they have applied a filter on all of the websites

05:54 in the world, right?

05:55 In order to do this.

05:56 And if you're just a lonely old guy that wrote something that you just want to make it out,

06:01 polish it out there, people finding it is not as easy as it sounds.

06:05 Just publishing something on the internet these days is not enough.

06:09 Yeah.

06:09 It's not a field of dreams.

06:10 That's right.

06:10 Build it and they will come sort of thing, right?

06:12 So maybe let's take a real short step backwards and talk a little bit about TriExceptPass,

06:18 what you're doing there, what you're trying to grow there and whatnot, just to give people

06:23 a sense of like, why are you studying these things?

06:25 What are you trying to do?

06:25 Sure, sure.

06:26 So I started TriExceptPass almost five years ago now, which is kind of crazy.

06:31 That's insane, right?

06:32 As a medium blog, right?

06:34 And so then I had the domain name, the TriExceptPass.org.

06:37 And then I wanted to get off the platform and start building my own thing.

06:41 So I have a website.

06:42 There's a collection of articles about how to build real world software, problems you run

06:47 into with engineering and stuff like that.

06:50 And now we have a podcast on top of it, right?

06:52 Yeah.

06:52 Your podcast is pretty new, right?

06:53 You've got like six, seven episodes.

06:55 We're up to episode eight this week.

06:57 Yeah.

06:57 Yeah.

06:57 I'm going to be putting them out more regularly now.

07:00 But yeah.

07:00 So based on that, I really wanted to go hard on trying to get more visitors last year.

07:08 And I started to read about what I needed to do in order to make that happen.

07:11 And I have discovered all this stuff that I thought about SEO as SEO, meaning search engine

07:19 optimization, right?

07:20 Because we technically haven't defined the term.

07:22 So when people talk about how to make your website visible in a search engine, they're

07:26 talking about optimizing it so that it shows up appropriately, right?

07:29 So I had traditionally thought about this being more kind of like a keyword thing that maybe

07:34 marketing does or sales or somebody else does for a large company website.

07:38 But I hadn't realized-

07:40 Yeah.

07:40 The site works.

07:40 I wrote it for you.

07:41 Now it's up to you.

07:42 That's right.

07:42 Your turn.

07:43 Here you go.

07:43 You get it to rank, baby.

07:45 Yeah.

07:45 Fill in the fields and you're done, right?

07:47 But it doesn't work that way.

07:48 It turns out you need a bunch of hooks in there in order for it to actually be

07:52 picked up appropriately by the search engine algorithms.

07:57 And I'm not just talking about the traditional, like there's always been these like robots.txt

08:02 files or sitemaps, XMLs that help search engines a little bit.

08:05 But it's way, way deeper than that with a bunch of meta tags and formatting and a bunch

08:12 of stuff that we'll get into in a minute.

08:14 Right.

08:14 And performance is playing a much more significant role in SEO than it has traditionally.

08:20 That's right.

08:21 And one of the main things is that because mobile is such a big thing, then performance has become

08:26 a lot more important.

08:28 It's always been important because the better performance you have, the more global access

08:34 your website gets because internet is not the best everywhere in the world.

08:38 But with mobile, that has become more of an issue because not everybody has like the fancy

08:44 high speed phones, right?

08:46 Right.

08:47 So it turns out that a lot of how your website is ranked is tied to that.

08:53 Yeah.

08:53 So I'm looking forward to talking about all of these things.

08:56 I just kind of want to put it out there at the beginning though.

08:58 I feel like that it's so easy to fall into the trap of, well, a little bit of like, if you

09:04 build it, they will come.

09:05 Right.

09:06 Like if I build something cool, people will eventually find it and it will rise to the

09:11 top.

09:11 If I build some amazing site, some service, some product, whatever, I want people to come

09:15 check it out.

09:16 If it has merit, people will come and love it.

09:20 And you know, stuff like this, as you know, the SEO, as well as like the other sides of marketing

09:26 and just getting the word out, right?

09:28 It's so tricky and vague, but it is actually what you have to do to make that succeed, especially

09:35 in a world of abundance like we are now.

09:37 Yeah.

09:37 So building great content is just like step one.

09:40 However, there is still an aspect of if you build it, they will come because if you built

09:46 something that's fantastic that everybody wants to read, then more web pages will link to it.

09:51 And that also has an implication in your rankings as well.

09:54 Yeah.

09:54 But yeah.

09:55 I'm sure you probably don't have any insight to this answer and I'm just speculating, but

09:58 you know, Google is built on page rank, which is sort of how many pages refer back to

10:04 a given page in super early days.

10:06 That was like the primary link.

10:08 And then people would go do stupid stuff.

10:09 Like they would buy links on other domains, like just pages of links or other really shady,

10:14 stupid stuff.

10:15 I wonder at some point though, when is like machine learning going to be the thing that

10:21 decides, right?

10:22 When is it going to be just like, well, there's a deep neural net.

10:25 It already is.

10:25 Yeah.

10:25 You think so?

10:26 Oh, it's big time.

10:28 So that's why Google is pretty much an AI company.

10:31 That's what they have, right?

10:33 Yeah.

10:33 Vast amounts of machine learning to try to parse.

10:36 I mean, these things are reading the content of your web pages to decide how to rank it.

10:42 It's not just about links.

10:43 It's about the structure, the grammar, how many images you have, how well the images are

10:49 formatted, how it flows, all that.

10:51 All that's all machine learning.

10:52 Wow.

10:53 Okay.

10:53 It's crazy.

10:53 That's pretty awesome.

10:54 Yeah.

10:55 I didn't realize this was so advanced.

10:56 I mean, I always kind of knew, but I didn't expect it to be this advanced.

11:01 Yeah.

11:02 Well, there's so much money behind it, right?

11:03 Yeah.

11:04 Yeah.

11:04 That's right.

11:04 In terms of advertising, right?

11:06 It's one of the most valuable companies in the world.

11:08 And that's basically makes them an advertising company.

11:11 But the ads are around like this kind of stuff.

11:14 So I can see, I guess so, why there's so much effort.

11:17 And the other interesting part is, right, that ranking algorithm, the SEO algorithm that Google

11:22 uses generates entire industry.

11:25 There's people that exist around how that algorithm works.

11:29 And Google doesn't tell you how it works.

11:31 It kind of gives you clues here and there.

11:33 But what happens sometimes is they update it.

11:36 And so then there's people that have been sitting at the top of the first page of your 10 results

11:41 off of Google and all of a sudden become number 100.

11:43 And there's like real economic consequences out of that.

11:48 Especially for like blogging community, people that live off of content that they produce

11:53 in smaller websites kind of thing.

11:55 They're always on top of that.

11:57 Right.

11:57 So let's start with defining a couple of terms that you have here.

12:00 One is domain rank and one is page rank.

12:03 Yeah.

12:03 So we've been talking about ranking a little bit.

12:05 So what happens is each page in your website gets ranked.

12:10 And there's a lot of things that come into that.

12:13 And it's like you get a grade, right?

12:15 And the higher the grade, the better.

12:17 From the tidbits of information I've been able to gather here and there, we just kind of talked

12:22 a little bit about it.

12:22 It's the content matters.

12:24 How many words in the page matter?

12:27 Grammar.

12:28 How performance.

12:29 We'll get into that later.

12:31 The links from external websites that are linking to your page and the links from your

12:36 page that are going to external websites.

12:38 Not just how many, but like what specifically, how that hierarchy is set up matters, right?

12:46 And so that gives you a grade, right?

12:48 And so then to your page.

12:50 But there's also a grade to your domain.

12:52 So like I have track set pass ORG and that has a rank and that rank might, I just checked

12:58 just a little bit ago that rank was in the 30s, 33 or something like that, which is, I'm

13:02 actually happy about that, which is not a great rank, but it's good because I started in the

13:07 20s, but it took me a year to get to 33, right?

13:10 Yeah.

13:10 Where do you check this rank?

13:12 Yeah.

13:12 So there's a bunch of tools that do this.

13:14 So aside from Google having their own little internal search engine ranking stuff, there's

13:20 entire companies that do this.

13:22 And so I use Moz.com, but there's also Alexa.

13:25 I've seen some of those.

13:26 They have some free accounts you can get with them that gives you some extra information and

13:31 allows you to do some searching and limits how many searches you can do.

13:34 But you can also, you know, if you get like a full blown account, you can like get into

13:39 like many great details.

13:40 But those guys keep their own thing too, right?

13:44 They give you a ranking, but it's not the ranking that Google's giving.

13:47 It's just an approximation of what we think Google will be giving.

13:52 And really, really the key player is Google.

13:55 It's crazy.

13:56 Yeah.

13:57 I mean, there are other search engines, but they're pretty safe to just ignore them.

14:00 Right.

14:00 I mean, there's Bing.

14:01 Yeah.

14:02 Bing still gets a little bit.

14:03 Yeah.

14:04 And there's DuckDuckGo.

14:05 Right.

14:06 Yeah.

14:06 Actually, I've been using DuckDuckGo for six plus months now as my primary search engine.

14:12 Yeah.

14:12 Okay.

14:13 How's that experience been?

14:14 Yeah.

14:14 It's been working nicely.

14:15 I like it.

14:16 And they got very similar tools to what you get out of Google search.

14:19 But, you know, they're still building up their stuff.

14:22 So every once in a while, you still got to do the Google search.

14:25 I don't know.

14:26 I've wanted to use DuckDuckGo.

14:27 And I very much support the privacy side of things.

14:29 Like, I would prefer to give less to Google.

14:33 Although, I don't hate them.

14:34 I think they offer a lot of great services.

14:35 But I'm a big fan of using Firefox over Chrome, for example.

14:38 And DuckDuckGo seems like a really easy choice.

14:40 Like, searching for stuff is so essential that, like, even if it was down 5%, I feel like I really want to do that to myself.

14:49 You know?

14:49 Yeah, yeah, yeah.

14:50 I get it.

14:51 I'm trying to find that one, like, thread race condition for SQLAlchemy.

14:56 Uh-huh.

14:57 Like, I just don't want to, like, it's already, I'm already frustrated a lot of times if I'm in that kind of scenario.

15:01 And I'm like, I really need the best answer.

15:03 Like, the best answer.

15:04 Yeah, yeah.

15:05 And so I've had a few of those lately.

15:08 And, yeah, it helps, you know, the Google algorithm is better for some of that stuff.

15:11 This portion of Talk Python to Me is brought to you by Kite, the smart AI-powered autocomplete for your editor.

15:19 As developers, our choice of editor is central to our work.

15:23 The more powerful and effective that that editor is, the more effective that you are.

15:28 That's why I'm excited about Kite.

15:30 Kite is a free plug-in for your code editor that gives you ML-powered autocompletions and documentation.

15:36 Chances are, it works with your editor of choice, even if that editor has existing autocomplete features.

15:42 The list includes PyCharm, VS Code, Atom, Sublime, Vim, and more.

15:46 And Kite runs locally.

15:48 So your code is private with no cloud or internet connection necessary.

15:52 And the Kite is 100% free.

15:54 So try it today at talkpython.fm/kite, K-I-T-E.

15:58 And see how Kite can help you be more effective with your Python code.

16:05 We talked about domain rank and those kinds of things.

16:08 So I went to Moz.com and I clicked on free SEO tools.

16:12 And that comes up and says, enter your domain and we'll tell you a couple of things.

16:15 And then I also went to a private incognito window and did a search.

16:20 So one of the things that I am a little bit proud of, impressed with myself that I was able to do,

16:25 is that if you do a, it's super important that you're not logged in, right?

16:29 Because it totally could vary on your history.

16:31 That's right.

16:32 At least where I am now, at the time it is now, it's been here for a while.

16:37 If I go to Google and I search for free MongoDB Python course, the number one result is freemongodbcourse.com, which is my course for my,

16:48 like it's a landing domain.

16:51 Good job.

16:51 That's not easy.

16:52 And like number three is MongoDB's actual free courses, right?

16:59 Nice.

16:59 Which are taught in Python.

17:00 Nice.

17:01 So I'm feeling really good about that.

17:03 I put that into that domain.

17:05 There's only one page there, right?

17:06 So I think that hurts it a little bit, but if the search lines up just right, it's okay.

17:11 So because it only has one page, it is like a page, basically the domain authorities, 22.

17:18 Yeah.

17:19 So that's kind of okay.

17:20 I'm not sure what to think about that, but it's low, but it's okay.

17:24 It's low, but it's like one niche thing, right?

17:26 Yeah.

17:27 It's ranking keywords are 36.

17:29 I don't know what that is, but the spam score is only 2%.

17:31 So that's pretty good.

17:32 And then I threw a talkpython.fm in there and that's domain ranking of 49.

17:37 Yes.

17:38 That's very good.

17:38 Yeah.

17:39 That's awesome.

17:39 And it's spam score is 1% and it has 1.6 thousand ranking keywords.

17:44 Sure.

17:45 Okay.

17:45 Yeah.

17:45 So the ranking keywords is the stuff that search engines would use to figure out whether to list your website as a result or not.

17:55 Theoretically, the more you have, the more you have, the better.

17:57 I see.

17:57 It also shows you cool things like here are the top ranking keywords.

18:01 Uh-huh.

18:02 And it's right.

18:03 I guess this is where it ranks.

18:04 If you were to search for this, like Python podcast, it's number one.

18:09 Async techniques and examples in Python, it's number one.

18:12 That's kind of cool.

18:13 And then it has like more by number of clicks.

18:16 So it has like 100 days of code where we're not that high, but it's like there's a ton of search clicks for it.

18:23 I feel like this actually gives me a lot of pretty interesting information.

18:28 If there's another tool in there about link research and you can pop your website in there and it tells you the things that link to you.

18:35 That's also important.

18:36 Yeah, absolutely.

18:38 So we were talking about your rank, what links to you matters because it helps your rank.

18:44 But the quality, like the domain authority of the sites that are linking to you is a modifier on how much that link matters to your website.

18:53 Right.

18:53 Because there are aggregators.

18:54 So like I found that like I have a bunch of aggregators that link to me, but their domain authority is so low that they don't really affect.

19:03 Those links don't really affect my stuff.

19:05 Yeah.

19:05 So it's like multiplying by zero, right?

19:06 These links are coming in, but they mean nothing because they're like so badly ranked.

19:10 That's right.

19:11 And interesting, we talked about like my domain rank for tracks that passes 33, but some of the pages in there have a different page authority.

19:19 Like the microservices article of mine has the highest page rank of page authority of 52.

19:26 Oh, that's pretty good.

19:27 Yeah.

19:27 It's interesting how all that plays a little bit.

19:30 And so if you go to that tool that does some link research for you, it'll show you the number of links you have as well based by the domain authority of the linkers.

19:40 And that brings me to something else we'll talk about later about how you do your A tags, your href tags in HTML and why that matters.

19:49 We'll talk about that later.

19:50 Yeah.

19:51 I think there's some really some of these great tools out there that I think people just don't think to use.

19:57 Like I used Moz a long time ago when I was setting up my training sites to try to understand how I might make it rank better.

20:05 But then I actually forgot about, I didn't forget about Moz, but I like it went off my radar and I stopped using it.

20:12 Like I literally haven't been to Moz.com or whatever the URL is for like a year.

20:16 Right.

20:16 But I should be going there frequently and like looking at how things are evolving.

20:20 What are new trends and how can I get involved with that?

20:22 Like what has some traction and what can I make it grow?

20:25 Right.

20:26 You got to be careful not to do it too often because all this stuff takes like weeks to propagate.

20:31 It's like changing DNS servers or something.

20:34 You know, it takes days.

20:35 Well, this takes weeks.

20:36 Does it work now?

20:37 Like, no, you need to stop asking.

20:39 It's just wait a while.

20:39 Yeah.

20:40 Right.

20:40 Yeah.

20:40 So in terms of tools while we're on it, like the Moz one is great for getting domain ranks and links and stuff like that.

20:46 But there is a Google search console as well.

20:49 Have you used that one?

20:50 I have used that one.

20:51 And that is pretty good.

20:52 You can say, show me some of the keywords.

20:54 How do I rank against them?

20:56 What are my popular keywords?

20:57 And you can trust that even a little bit better because it literally is from Google, right?

21:02 Google says here's how we would rank you for this thing.

21:04 Yeah.

21:04 And the interesting part is you get like how often people have been clicking in search results to your domain.

21:10 You get total number of times you've shown people your domain.

21:13 Like I was looking at my stuff.

21:15 I have like 2% average click-through ratio is what they call it.

21:19 So my domain's been shown 240,000 times in the last three months, I guess.

21:25 And out of that, it's been clicked 4,800 times.

21:29 And it gives me the average position that shows up on the Google search results.

21:33 And the goal is, like you said earlier, to bump that into at least the top 10, right?

21:39 And depending on what...

21:40 And you can play with that to find which search keywords give the highest position.

21:46 Like I have...

21:47 If you look for distributing Python applications, I'm number 4, according to the search console, right?

21:52 But the domain just in general is on average of 20.

21:56 Okay.

21:56 It's a lot of little things.

21:57 Yeah, there are.

21:59 So let's see.

22:01 If I go here, yeah, 4.

22:04 I got to have a range, I guess.

22:06 This is over the last couple months.

22:10 Search results, 18,688 total clicks.

22:13 That's pretty cool.

22:14 Yeah.

22:15 The other one that's really interesting that I guess we should maybe talk about, this is like definitely on the developer side, is error pages, sitemats.

22:24 Yes.

22:24 That kind of stuff.

22:25 Because the next graph that I see here is a graph that says, here's the coverage of our searching of your site.

22:31 You have 3,573 valid pages, which might blow people's minds, but there's like all the courses and every lecture of the course has its own transcript landing page for SEO somewhat and for usability.

22:43 Like there's a ton of pages.

22:45 And it has the number of errors.

22:47 Right now I have zero errors and 3,573 valid pages.

22:50 And it shows the growth of errors over time and pages over time.

22:53 And I put a lot of work into making sure that my sitemap is like complete.

22:57 How much do you think that matters?

22:59 It's important.

23:00 And they use the sitemap to figure out how to crawl.

23:03 So not only is that important for your main page.

23:08 So you have a staging page.

23:09 I don't know how you do your stuff, but like I have like a staging version of Trax Set Pass where I try stuff out.

23:14 You can configure stuff, not just with the sitemap, but with like robots.txt so they don't crawl those pages because you don't want those to show up

23:22 and affect your search results, especially because they're going to have errors and stuff like that.

23:26 So as a developer, that's one of the things you got to worry about.

23:29 I was working on a website for my company and application service a while back.

23:35 And that's like we had a staging version.

23:38 I didn't know about any of this.

23:39 And I'm like, oh, man.

23:39 So our domain, we had like staging.r stuff and just the regular production version.

23:44 I'm like, oh, maybe all this affected our page rank out on the real internet.

23:47 Right.

23:48 Yeah.

23:49 It's basically it might divide it by two, right?

23:51 Because it's the same content.

23:52 And so.

23:53 That's right.

23:53 So that brings me, might as well talk about it now.

23:55 So we've been talking about links.

23:57 So having copies of your content counts against your rank.

24:02 Right.

24:03 It basically dilutes the value and then other things are able to get above it.

24:07 Right.

24:07 Yeah.

24:07 So essentially, they try to figure out whether you're plagiarizing your own content, like

24:12 whether the domains are plagiarizing it, essentially.

24:14 Right.

24:15 Yeah.

24:15 So if you have like the exact same article show up somewhere else, that becomes like that

24:21 whole page, that whole article, both yours and the other person's will have a lower ranking

24:27 compared to yours.

24:28 And so that's why, like if you go to sites like dev.2 and you publish something there,

24:34 you can link to your article, to your original source, and you add an extra piece of information

24:42 in the tag, in the HTML tag that says this is a canonical link.

24:46 So that means that the original source, you're pointing to the original source, and then the

24:52 search engines won't count dev.2 against your original article.

24:58 And they'll actually complement each other.

25:00 Right.

25:00 Okay.

25:01 So I ran into something like that recently.

25:04 I had the strangest problem, which I came up with an even stranger solution to.

25:10 I spent days, days trying to solve this problem.

25:14 If you went to talkpython.fm/forward slash, or training. talkpython.fm/forward

25:21 slash, I don't remember which of those two sites it was that had the problem.

25:24 They're both on, they're both on Ubuntu 18.

25:27 They're both running Nginx.

25:29 They're both running the same type of certificate.

25:31 They're basically identical servers.

25:34 One of them in Safari, whether it was mobile, like this is actually where it matters a lot.

25:39 It's like all of iOS.

25:41 You would go to one of them.

25:42 It would say it was an error where like the site said it disconnected.

25:46 Like the connection was reset was the error.

25:49 You look at the logs and it was fine.

25:50 You look at the logs and it was fine, right?

25:51 I see.

25:52 Yeah.

25:52 But any other page on the site was fine.

25:54 Like slash episodes was fine.

25:56 Slash about was fine.

25:58 Slash anything other than slash home was fine on one server.

26:03 The other server was fine everywhere.

26:04 I spent days trying to figure this out and figure out what the different, like everything I could tell with the two servers were set up the same.

26:11 And I just finally said, you know what?

26:12 If iOS is happy with slash anything, but the slash like by itself, I'm just going to redirect it to slash home and have slash home be like a copy of the homepage.

26:23 That is for anytime I detect Safari.

26:26 I'm like, dude, we're just going to redirect you to like another URL that's deeper in the site, but it shows the same content because that one renders fine and just the forward slash it over.

26:36 Right.

26:37 So I was like, forget this.

26:38 But what I didn't think about was the SEO impact of that.

26:42 Right.

26:43 Because if Google comes as today, I want to be Safari.

26:46 Let's see what's up.

26:47 Like, oh, I'm over on this other page, which looks like the same content as Chrome saw yesterday on forward slash.

26:54 One of the listeners said, you know, you have the same content.

26:56 You really should use this rel equals canonical on there.

27:00 And so what I did to like stop undermining myself while still making iPhones work was to just put like do a test.

27:08 Like if it's slash home in the template, just put a meta tag that says or whatever kind of tag says rel canonical is the forward slash URL, not the forward slash home URL.

27:17 That's right.

27:17 But this can be used in other places.

27:20 Like if you want to write on Medium, but also on your blog, but have your blog get the SEO juice.

27:26 I don't know if it works on Medium.

27:28 It works in some place like Dev2 and other places, right?

27:30 Dev.2 has it like in there stuff to set it up.

27:34 You have the capability of doing that.

27:35 In Medium, I know you can add some HTML stuff in there.

27:39 So it might.

27:39 That's one of the reasons I got off of Medium a while back.

27:42 Honestly, I'm not a fan of Medium.

27:44 I think it's a beautiful site.

27:45 It's a nice experience, but I, it just, there's just.

27:49 The paywall killed it for me.

27:50 Dude, there's just too many things that go against the grain.

27:52 Like I'm not even against a paywall.

27:54 Somebody says like, I want to do like deep writing and have people pay for that.

27:58 That's great.

27:59 Like that's, that's their work and their choice.

28:01 But I feel like Medium was built up on the back of this is a free place that people can do awesome writing.

28:06 Let's all get together and then like yank on the rug and now it's paid.

28:10 Right.

28:10 You know what I mean?

28:10 It's like, I feel like they didn't build on that ethos.

28:13 And so it's like a bait and switch.

28:15 Yeah.

28:15 That's what I don't like it.

28:16 Yeah.

28:17 Yeah.

28:18 Yeah.

28:19 That's what killed it for me.

28:19 And so like for me that switched off of Medium, it was really hard.

28:23 I mean, I used to get people following me on the Medium article.

28:26 Right.

28:27 And I'm like, how do I bring that traffic to my website?

28:30 Right.

28:31 Yeah.

28:31 Yeah.

28:31 For sure.

28:32 So while we're on it, this is not exactly SEO, but it does talk about rank and keyword and relative

28:38 stuff.

28:38 And it's really good for exploring other sites.

28:43 So have you played with SimilarWeb, SimilarWeb.com?

28:46 No.

28:47 I saw you added the link.

28:48 I pulled it up, but just barely looked at it.

28:51 Yeah.

28:51 So if you go in there and you just type in any domain, like you could type in like talkpython.fm

28:55 or you could talk real Python or try accept paths.org, whatever you want.

28:58 It'll come up with a ranking.

28:59 It only has like tons of information for sites that are ranked well enough, but it will show

29:04 you like traffic over time month by month.

29:07 Right.

29:08 So right now it says I'm getting 56,000 unique visitors a month who spend an average of four

29:14 minutes and visit 3.45, 3.42 pages and so on during their visits.

29:20 And this is not because there's plugs.

29:22 I don't even show up.

29:23 It's not.

29:23 Yeah.

29:24 Well, it's got to get to like a certain level.

29:25 Right.

29:26 But you could take any, like if you have a competitor or something you're trying to

29:30 like, Hey, we're building a site.

29:31 We want it to rank.

29:32 Here's some of our competition and they're ranking well.

29:35 So you can put that in there and you can see like traffic by countries, traffic sources,

29:40 the referrals, the places that are linked, like you talked to linking into it.

29:43 So apparently GitHub, python.org, forums.fast.ai, all these are like strong linking, referring

29:50 sites to mine.

29:51 Not because I know that, but because this external thing is like tracked it just.

29:55 Yeah.

29:55 Okay.

29:56 Whether the traffic is paid.

29:57 So this is a good one for like how, then you could put another domain next to it and

30:02 it'll put those charts next to each other and say, here's how you compare to that other

30:06 place in general ranking traffic, types of traffic and whatnot.

30:10 I could have sworn that some of this was also available in Moz.

30:14 If I find it, I'll give you a link.

30:19 This portion of Talk Python to Me is brought to you by Linode.

30:22 Whether you're working on a personal project or managing your enterprise's infrastructure,

30:26 Linode has the pricing, support, and scale that you need to take your project to the next

30:31 level.

30:31 With 11 data centers worldwide, including their newest data center in Sydney, Australia, enterprise

30:37 grade hardware, S3 compatible storage, and the next generation network, Linode delivers

30:43 the performance that you expect at a price that you don't.

30:46 Get started on Linode today with a $20 credit and you get access to native SSD storage, a

30:52 40 gigabit network, industry leading processors, their revamped cloud manager at cloud.linode.com,

30:57 root access to your server, along with their newest API and a Python CLI.

31:02 Just visit talkpython.fm/Linode when creating a new Linode account and you'll automatically

31:08 get $20 credit for your next project.

31:10 Oh, and one last thing.

31:11 They're hiring.

31:12 Go to linode.com slash careers to find out more.

31:15 Let them know that we sent you.

31:16 That type of analysis is really, really interesting and useful.

31:22 Yeah.

31:23 Because, yeah, that helps determine how well your stuff is going to show up.

31:27 So, speaking of moths, they wrote a pretty interesting article called The Beginner's Guide to SEO,

31:33 which you're linking to.

31:35 We'll put it in the show notes.

31:35 Yeah.

31:36 And we've heard of Maslow, Maslow's hierarchy of needs, right?

31:40 You need shelter and then you need like human contact.

31:43 You know, then you need food or maybe you need food, then shelter, right?

31:46 But whatever, like eventually way, way up there is like entertainment and fulfillment.

31:51 You know what I mean, right?

31:52 That's right.

31:53 Yeah.

31:53 So, there's something like they put together like this for SEO and says like, you must have

31:58 this to be ranked.

31:59 And then like you can be more competitive as you layer on more advanced stuff.

32:03 Do you want to talk us through that?

32:04 Yeah, yeah.

32:04 So, we can go through the pyramid and some of these we'll dive into a little more detail

32:09 in a little bit.

32:10 So, like right at the bottom, right, is crawl accessibility.

32:15 So, that means that your website must be the search engine crawlers, the robots that go out

32:21 and just scrape the internet and formulate the model or whatever to find search results.

32:26 Your website needs to be crawlable, essentially.

32:29 And that means you have to have good HTML and good things for those robots to actually be able

32:34 to parse the information.

32:35 Right.

32:35 And that's a little bit like what I was talking about with the sitemap and the number of pages

32:40 versus the number of discovered pages.

32:42 Right.

32:43 But it also means like if you go to a part of your site is behind a login or a paywall or

32:48 some other interaction, that is blind to the world.

32:51 Right.

32:51 That is no longer part of the search index of the world.

32:55 And so, you just got to like, it might be fine.

32:57 That might be your personal account info or whatever.

33:00 You don't want it to be.

33:00 But sometimes I see people building sites in a way that I think, oh, you don't want to do

33:05 that because Google's not going to get there.

33:07 And that's a problem.

33:10 Yeah.

33:10 So, that's why single page web apps are an interesting, have an interesting situation

33:16 when trying to be searchable.

33:18 So, you'll find that a lot of like say, just to pick something like say Linode or whatever.

33:24 And I'm not saying that they are a single page web app.

33:26 But you'll find that a lot of these companies that have consoles or something that some application

33:31 type of thing that's available through the website, they actually have a landing page.

33:35 And then from the landing page, you can load up the web app.

33:39 You can't have the whole thing be the web app or the stuff just won't start, won't show

33:44 up on the search engine.

33:44 It's behind JavaScript.

33:46 Exactly.

33:46 If you look at Vue Source of like a VJS app, it's entirely underwhelming.

33:52 And it always looks the same because the data is not loaded yet, right?

33:56 That's right.

33:56 And in fact, it might even count against you, which is like the next ring in the pyramid

34:02 is having compelling content.

34:04 The only thing that the search engine will find there is just JavaScript.

34:08 So, it's not going to know what any of that means or what the paragraphs are, what the

34:14 information is, nothing.

34:15 So, that's it.

34:16 Yeah, I'm wondering if these days, if like when Google sees that, they're like, you know

34:20 what, we have to fire up Selenium and hit this page to like get the answer, right?

34:25 They may look for Vue.js, Angular, the couple popular ones and say, we got to-

34:29 Yeah, I'm sure they do.

34:30 We got to do a little more.

34:30 They probably do.

34:31 But it can't be helping, right?

34:34 Like even if eventually it does figure it out, I just feel like these spa apps cannot be helping

34:39 their SEO case.

34:39 No.

34:40 There is some stuff that's been built to help all of that.

34:43 I haven't looked too much into it, but there are things to help that side of the world.

34:48 Yeah.

34:48 Yeah.

34:48 Okay.

34:49 So, compelling content, that's important.

34:51 It's sometimes tricky to do.

34:53 I suspect like images.

34:55 Like if you try to tell the story with a picture instead of with words, that might actually hurt

34:59 you a little bit in terms of SEO.

35:00 But when you make that image tag, you can have enough information in the image tag, which also

35:06 helps the rankings.

35:07 Like in the title or the alt or something like that?

35:09 The alt, yeah.

35:10 Okay.

35:11 So, there's that.

35:12 And then just like the size of the content, just general grammar stuff, how the paragraphs

35:17 are broken up, how many.

35:18 In fact, having content for multiple languages also counts for you.

35:22 There's all kinds of stuff like that.

35:24 And if you're doing like international stuff like that, where you have like multiple versions

35:27 of your site, that's like a whole new, like I wanted to do that recently because I wanted

35:31 to, you know, Spanish is actually my first language.

35:34 So, I wanted to write the site in Spanish and provide a Spanish version of it.

35:37 And I started to look into, wait, what about like the canonical stuff?

35:41 And like, what's going to show up here?

35:42 And it's like, there's all these rules.

35:43 I was like, I don't have time to look at all of this.

35:44 It was already going to be a lot of work to rewrite it in a second language.

35:48 And now you've got to like re-SEO it.

35:51 And like, not just redo the SEO, but you got to make sure you don't hurt yourself, right?

35:57 Because if it shows up in two languages, it could be worse than just having one if

36:01 it thinks that's like copied, right?

36:03 Yeah.

36:03 When we're talking about this, you know, we're not just talking about like, do I have the right

36:07 keywords, which is actually the next ring in the pyramid, you know, having,

36:10 having the words that are searchable that represent what the article is about, right?

36:17 But we're talking about like, just like HTML formatting, right?

36:21 If you don't have the right tags in the right places with the right properties, stuff doesn't

36:27 get picked up correctly.

36:28 And I mean, as a developer, I mean, it makes perfect sense.

36:30 Somebody wrote some code to go and crawl this website, right?

36:34 And, you know, they're at Google.

36:35 They're like, well, I'm going to look for this.

36:37 If you don't put that in there, oh, well, right?

36:39 You want me to rank you?

36:40 Well, then put that in there.

36:41 And Google's got like, they're all documented.

36:44 All that stuff as you search around.

36:46 Yeah.

36:47 Yeah.

36:47 For sure.

36:48 Next up, I guess, keyword optimize.

36:50 Is that, have we talked about that yet?

36:52 Yeah.

36:52 That's what we were just talking about.

36:53 Yeah.

36:54 Okay.

36:54 Then above that is the great user experience.

36:58 Now we start getting a bit deeper into actual developer action.

37:01 Yeah.

37:01 And this is where the developer story starts to like really be your story around SEO.

37:08 I mean, obviously you've got to have crawl accessibility, right?

37:11 If your site crashes, if it's unreliable, if it doesn't generate the site map quickly or

37:16 correctly, then all those things are right.

37:18 Like you're not even like alive on the hierarchy.

37:21 You're at the bottom and you're not there.

37:23 But here you have things like fast load speed and ease of use.

37:26 And the wording here is compelling UI on any device, but like the developer word is like

37:33 a program.

37:34 Not a program.

37:35 Yeah.

37:35 Like viewports and like responsive is the word I was looking for.

37:39 Responsive UI that, that like actually will look right on the device.

37:44 That's right.

37:44 Now you're well into the web developer, Python developer side of the story.

37:48 And there is so much here and we can talk, skip ahead a little bit around making your load

37:54 times better.

37:55 There's a bunch of tools.

37:56 There's some, there's a website from Google called PageSpeed, which you can go and plug

38:01 in a URL and it'll go do these rankings for you, these checks for you.

38:06 Yeah.

38:06 And then there's a tool called Lighthouse, which runs on Chrome.

38:09 So if you have Chrome developer tools, you can get it to actually launch and run it locally.

38:13 And so what it does is it analyzes a website and you can ask it to do it, do an analysis,

38:20 assuming you're running from a desktop or assuming you're running from a mobile phone with a fast

38:25 speed or assuming you're running from a mobile phone with a slow connection, right?

38:28 And it'll do all this analysis and you'll get into a bunch of things like what format are

38:35 your images?

38:35 You know, are you PNG?

38:36 Are you JPEG and all that, right?

38:38 And then it turns out that do they have the right compression ratios?

38:41 How big are they relative to the page?

38:44 Are you loading a 2000 pixel white image on a 400 pixel white page?

38:48 You're just wasting people's time when you do that, right?

38:51 Right, right.

38:52 And when I logged into the Google search engine console that you talked about before, I got

38:56 a big pop-up that said, there's one of these domains I hadn't visited for a while.

39:00 And it said, your site has now been switched to mobile first indexing.

39:06 That's right.

39:06 That's right.

39:07 And one of the considerations is, does this page render good on a mobile phone?

39:13 And they also think, when they think about performance, I think a lot of developers, they

39:17 think, okay, and I totally count myself among this group in the early days.

39:21 And I'd like to hear your thoughts as well as I go and I hit the server.

39:25 How fast is the database?

39:26 How fast is Pyramid, Flash, Django, whatever, getting out the door?

39:30 Like, how quick am I getting like first byte to user, basically?

39:34 And then that's kind of like, I'm done.

39:36 Like, I've solved it.

39:37 Like, now it's down to the browser to deal, right?

39:39 Yeah.

39:40 But that's just the beginning, right?

39:42 That's what you learn, apparently, when you try to like start doing this analysis.

39:46 Oh, my goodness.

39:47 Yeah.

39:48 I did my stuff.

39:49 My stuff is a static page.

39:50 So like, I was like, oh, yeah, this is awesome.

39:52 It just loads the page.

39:54 It's going to blaze.

39:55 There's nothing else to worry about.

39:56 One millisecond.

39:57 We're good.

39:57 I'm good.

39:59 So what did you get when you first put it into the PageSpeed Insights, which is like

40:02 the hosted version of Lighthouse?

40:04 Do you remember?

40:04 I was probably like in the 60s.

40:07 Yeah.

40:07 Or something like that.

40:08 And so that has a ranking zero to 100, right?

40:11 Yeah, exactly.

40:12 So zero to 100.

40:12 I put training.talkpython.fm in there and then talkpython and then Python bytes and whatnot.

40:17 And those sites are crazy fast in the way I described.

40:21 Like the database, the first byte out of the server is really fast.

40:25 It's like totally reasonable to have a page that's 10 milliseconds.

40:28 And I'm like, well, how could it possibly be slow?

40:30 So let's see what amazing numbers I get if I throw it in here.

40:33 And I got like 50.

40:34 And it says, which is on the bottom end of moderately slow.

40:38 And I'm like, what is that?

40:40 What is this?

40:41 What is going on?

40:43 And so I spent three days going through the recommendations, like three eight-hour days

40:47 working on one of the sites.

40:48 And now I've got it up to, if I go to training.talkpython.fm, on mobile, I get 94.

40:53 And on desktop, I get 100.

40:54 Cool.

40:55 Yeah.

40:55 Nice.

40:55 I'm in the 90s as well now, finally.

40:57 Yeah.

40:57 And there's flexibility, right?

40:59 Like if the server hasn't requested a page, it might be a slightly, there's like, there's

41:03 some variability here.

41:04 And it's even if you just rerun it.

41:05 But what's interesting is the 94 is the mobile version, like how fast can't, if you've got

41:12 an image that has to be resized, it's one thing to do it on a high-end desktop.

41:14 But if the phone has to resize it, that's going to hurt your ranking because it's like computationally

41:20 slow for the phone to render the page.

41:22 And there's all these different layers of stuff that you've got to look at.

41:26 I mean, if you just loaded the image itself the wrong size, it's bigger.

41:30 So you just sent the phone extra data that it's not really needed, right?

41:35 Yeah.

41:35 So to stick with it, so there's a few pieces here to stick with the images.

41:38 So the first thing that the Google stuff recommends is to use WebP as the format, not PNG, not JPEG,

41:46 as a compression format for your images.

41:48 And that's great.

41:49 It works great.

41:49 It's, you know, it's usually lower image sizes, which is why they recommend it.

41:54 It's Google's proprietary image format, right?

41:58 That's right.

41:58 Of course they're going to recommend it.

42:00 So I was like, I did all this.

42:01 I'm like, I got my stuff into the 90s.

42:03 We'll get to the rest of it in a minute.

42:04 I'm like talking to a buddy at work that also runs some websites and stuff.

42:09 And he pulls out his iPhone and goes to my website.

42:12 It's like, oh, that's cool.

42:13 Yeah, yeah.

42:14 Hey, what's up with your images?

42:15 I'm like, what do you mean?

42:17 Safari doesn't render WebP because Apple, right?

42:21 Yeah.

42:22 So that leads to you, in order to do this correctly, you can no longer use the image

42:28 tag.

42:29 You have to use the picture tag.

42:30 There's a picture tag?

42:31 This is like totally changing my, like blowing my mind.

42:33 Yes.

42:34 And the picture tag has fallbacks.

42:36 Okay.

42:37 So I'm trying to find the good one I have on my site.

42:40 But essentially, you can specify a list of images and you say, if the screen size is of

42:47 this many pixels, load this image.

42:49 If it's of this many pixels, load this image.

42:51 If the, you know, whatever.

42:52 And then in the end, if you can't load any of those, load this image.

42:55 So I had like, so for every image in my website, and that's important for me.

43:00 So in Dragset Pass, we do illustrations and they come on.

43:04 Like, I'm like, I want to load, you know, the 4,000 pixel illustration because it's really

43:08 nice, right?

43:09 Yeah.

43:09 But obviously I can't.

43:10 So I have four different files for every image.

43:13 Each one optimized, you know, there's like a one at like, I think it's 1280 pixels.

43:19 I do one in the 800s and one in the 400s.

43:22 And then I automatically pick which one to use with the picture tag.

43:26 And then I also have a PNG format for the people that are using Safari to render it.

43:31 Yeah.

43:31 That sounds really tricky, right?

43:33 Because now you've got to have all these different types.

43:36 And then how do you know about like the 404 missing image?

43:39 Because you viewed it on a device that supports that.

43:41 It selected a different format and whatnot.

43:45 Yeah.

43:45 Yeah.

43:45 So I haven't gone down that path on the...

43:48 I was going to export it to JPEG with a slightly lower quality and make sure the sizes...

43:52 Like I might have multiple sizes that are all JPEG or like one's PNG and a bunch are smaller.

43:56 Sure.

43:57 But I don't know.

43:58 Like the varied support, it just threw me off.

44:02 I'm just like, I just don't know that I want to go down this path of having like unsupported

44:06 image types that I've got to swap out, take care of.

44:08 Yeah.

44:09 That was an interesting adventure for me.

44:11 Continuing down that, you get the screen optimizations and the fallbacks with the picture tag.

44:15 Yeah.

44:16 But outside of images, right?

44:18 These days, people use CDNs a lot to load things that run on their website.

44:23 So I have delivered a static webpage and I need jQuery to do something.

44:27 I go link to some CDN that has jQuery.

44:30 Well, that's yet another connection that client's browser needs to open.

44:34 And that connection is going to open to a different server, which means you guys know how this works,

44:39 right?

44:39 If I went to tracksetpaths.org, I did a DNS query to figure out what IP address it was, open

44:45 a TCP connection, download some data.

44:48 If I'm talking about JavaScript, I'm then parsing that and loading it up, right?

44:54 Right.

44:54 Well, now if I have an extra script tag in there, now I have to do that same thing for

45:01 whatever DNS is providing, whatever domain is providing that.

45:04 So if that's coming from, you know, Google Fonts, right?

45:07 So that's got to do the DNS query, open up Google Fonts, download the font, do whatever

45:12 parsing and show it in the website.

45:13 So for every CSS or script or external thing that loads into your page, you're doing all of

45:19 these things and that has an impact and that actually shows up.

45:23 And it counts against you regardless of whether it's a CDN link, a second link on your site

45:29 or like, it's just number of connections we got to do.

45:31 The more, the worse.

45:32 Yeah.

45:33 It's more work for the client, for the browser, right?

45:36 Yeah.

45:36 So in order to help that around, there's a number of things that you can do in your header,

45:42 in your HTML that will serve as preloads.

45:47 So there's a couple of different commands.

45:49 There's the link tag, like you would add a style sheet or whatnot, but there's also, there's

45:56 a rel property that you can set to preload or pre-connect.

46:00 And pre-connect means do the domain name resolution.

46:04 So that means you do that once because ahead of time, like for example, the Google Analytics

46:09 that get added to my website, I do a pre-connect to Google Analytics so that that, all of that

46:16 is resolved.

46:16 The TCP connection is already open at the start of the page.

46:19 And by the time it makes it all the way to the bottom and actually needs to load something,

46:23 it just needs to go and get data versus having to.

46:26 Right.

46:26 It's probably done the DNS resolve and actually already done the SSL exchange.

46:30 That's right.

46:31 The port opening to the server even maybe.

46:34 That's right.

46:35 And for that one, I needed to pre-connect because the get changes slightly.

46:42 I'm looking at dumping the whole Google Analytics stuff.

46:44 So at some point that, that's a different conversation we should also have.

46:47 I've since dumped them.

46:49 So yeah, I hear you.

46:49 There's also a preload command you can give out, which actually essentially just loads the

46:55 file that you say.

46:56 It just loads it and keeps it in memory.

46:58 It doesn't use it immediately.

47:00 It's just there.

47:01 And then when you run into it in the rest of the document, then it uses it.

47:04 So I use that for like the fonts.

47:06 The fonts get preloaded and some JavaScript gets preloaded and stuff like that.

47:09 Yeah.

47:10 I just recently saw my first page that was like full of these preloads and pre-connects.

47:14 And I'm like, oh, this is the thing that I didn't know about.

47:16 How interesting.

47:17 And it's clearly like, we're going to set this up and fire these off.

47:20 And like, as soon as you can get them, as soon as you got a break and loading stuff,

47:23 go get these.

47:24 And yeah, that seems pretty cool.

47:26 Another one that will probably basically not help you on PageSpeed, on the Google PageSpeed

47:33 site, but will really make your users happy is just browser caching.

47:37 Yes.

47:37 And there's different aspects of that and different problems that it generates.

47:41 You can give the browser instructions on what to cache and how long to cache it for.

47:48 Yeah.

47:49 And the PageSpeed stuff actually takes that into consideration for how long you're caching

47:53 things.

47:53 Yeah.

47:53 I actually took advantage.

47:55 So I have like a set default kind of thing, but I also took advantage of using, I use Cloud

48:01 Flare in front of the website.

48:02 So I can dynamically change that in Cloud Flare depending on what it is.

48:06 So I can add like rules that say, well, tell our clients to cache the images for a year,

48:12 right?

48:13 Because I'm not going to change the image for an article.

48:15 Right.

48:16 But only cache the HTML for a week or something like that.

48:19 Yeah.

48:19 Interesting.

48:21 Yeah.

48:21 On mine, I have it.

48:22 Every CSS, JavaScript, image, everything is cached, I think for a year.

48:26 Yeah.

48:27 And they recommend the really high number.

48:29 Yeah.

48:29 And it's really good in terms like speed.

48:31 Like I was at a hotel in Israel and trying to get back to some sites.

48:36 So they were all just dragging.

48:38 And mine is like zip, zip, zip, because it just exchanges just the HTML and nothing else.

48:43 Right.

48:44 One connection, everything else is out of the browser.

48:46 Like this is really super cool.

48:48 Is it working well?

48:48 The problem is if you change anything, like you update your style, then it's all busted,

48:54 right?

48:54 That's where a question mark and some hash comes into play.

48:59 I have a whole infrastructure that says, here's the URL and on the server side, generate a hash,

49:05 like cache ID equals whatever the hash is.

49:08 And if that file changes, it's going to rehash it.

49:10 So it's an entirely different thing that's cached, again, for a year.

49:13 Like it might use up another 200K of somebody's browser cache, but who cares, right?

49:17 It's memories cheap.

49:18 Yeah, sure.

49:19 So on that, right, there's, aside from the caching, right, don't forget that any JavaScript

49:26 or CSS that you give out to your customers, you want that to be minimized, right?

49:35 And that means, what does minimization mean?

49:38 That means removes all of the spaces, for example.

49:42 Yeah.

49:42 You also want fuelification, which is a bundle.

49:45 That's right.

49:46 You want less of them and you want them to be smaller, taken as an aggregate.

49:50 That's right.

49:51 And so then like there are minimizers.

49:53 Google has a tool that you can use for minimizing CSS and JavaScript.

49:58 And it's not just removing spaces, but it also, like in the case of JavaScript, it'll rename

50:03 all your variables.

50:04 Oh, interesting.

50:04 Okay.

50:05 So it does a little bit of obfuscation, right?

50:07 So if you have a, like as a developer, you want to have descriptive variables, but the

50:11 tools will actually take that variable name down to one letter as much as you can.

50:16 Okay.

50:17 So you'll find your users.username, users.email, whatever can turn into A.B.A.C.

50:24 Right.

50:25 Right, right.

50:25 Yeah.

50:26 Which can be significant.

50:27 Yeah.

50:28 For the right app.

50:29 Just the whole point of that is to reduce the size of the file that you're transferring

50:33 to the clients.

50:35 Right.

50:35 Right.

50:35 You want to reduce the size.

50:37 And if you can, you want to bundle them.

50:38 That doesn't always work because sometimes like the JavaScript might refer to a relative

50:43 path back to like an image or a CSS file or something.

50:48 And then like if you bundle them up, up the directory, then they get all broken.

50:51 I had something like that with font awesome.

50:53 I had to stop.

50:54 I'd like unbundle font awesome or something because it was, it couldn't find pieces of itself.

50:58 There's some tricky stuff as it refers between files.

51:01 Yes.

51:01 But theoretically, which is contrary to usual programming practices, the more that you can

51:08 put all of this stuff in the one file, right?

51:11 So if you can combine, so there's a, the tools will do that for you too.

51:15 If you load jQuery and font awesome and, you know, bootstrap and a bunch of JavaScript and

51:21 then the JavaScript for your website, you can run it for these tools and it'll put everything

51:25 into one file and then minimize it.

51:27 Yeah.

51:27 And so then you're transferring one thing, which means one TCP connection, one request,

51:31 and you're just moving data back.

51:32 Well, let's say one thing that I came across and started using exactly in this space when

51:37 I was going down the lighthouse thing, as I said, you're making 26 requests for JavaScript

51:41 and CSS.

51:42 Oh my gosh, I'm done.

51:44 Like there's nothing I can do to like, how can I fix this?

51:47 Right.

51:47 And I knew about bundling, but I'm like, this is going to be a lot of trouble because I,

51:50 I like to have small CSS files.

51:52 Like this part of the site has its own CSS file.

51:54 So it's not huge and I can reasonably deal with it.

51:56 Right.

51:57 But, but Google was hating on it because it's like, here's another request.

52:00 I'm like, yeah, but it's cash for a year, but it doesn't matter.

52:03 My page rank is what they say.

52:06 And it's the first request, not the cash request.

52:08 So whatever.

52:08 Yep.

52:09 Along those lines, there's a progressive web apps.

52:12 Yeah.

52:12 If folks have heard about that.

52:14 So a track set pass is a PWA, progressive web app.

52:18 I think that's, I might disable that, but what that does is it makes your, you can write a

52:24 little bit of JavaScript that will make your website run even when your site is not online

52:29 as much as possible.

52:30 And it can be executed.

52:33 Like if you're, you can actually make a shortcut to the site.

52:39 So you'll have like a, an icon just for your site.

52:41 You can just click it and it'll come online.

52:43 And all that JavaScript does is it registers what they call a worker.

52:47 And the, every request that the webpage makes for content goes through this worker essentially.

52:55 And the worker, you can do whatever you want with it.

52:57 But the main point is the worker keeps a local cache.

53:00 And the worker knows what to pre-cache.

53:03 So when your website comes online, it says load all these images for you.

53:06 And then for every request, go get them and load it into a cache.

53:11 It gets stored in local storage in your web pages.

53:14 You can see it all in developer tools.

53:16 And so then, you know, that makes your website run fast and you can even have an off, you'd

53:20 have to have an offline page.

53:23 So if you need to like fetch the content and you can't get to it, you can provide the users

53:26 and like, oh, I can't get to the internet right now.

53:28 This is what it looks like.

53:29 Okay.

53:29 Yeah.

53:29 That's really cool.

53:30 What I came across was this thing called web assets.

53:34 All one word.

53:35 Yeah.

53:36 Yeah.

53:36 Which is a Python library that does that bundling and minification you're talking about.

53:40 It uses JS min and CSS min, which are Python packages that do that for JS and JavaScript

53:46 and CSS.

53:47 And so now when my site starts, it just does like a quick check.

53:52 Hey, do I need to rebuild the one giant CSS and JavaScript files?

53:56 So I don't have to remember to take it and like, oh, I forgot to run that.

54:00 So that's out of date.

54:01 Like, it's just like at the start, it goes, here's the hash of the files.

54:04 Is there anything new?

54:05 Let's regenerate them.

54:06 And it's kind of just all automatic.

54:08 Right.

54:08 So that's a pretty good set of Python tools.

54:10 Nice.

54:11 Yeah.

54:11 I knew about this at work.

54:12 I actually hadn't thought about looking at that for the stuff I have at home for some

54:15 reason.

54:15 Yeah.

54:16 I'll have to go.

54:16 I'll have to go see.

54:17 It might help me out with a few things.

54:19 I have a really quick one that will totally help people.

54:21 This one only works on macOS, but I think they link to other options on their site.

54:27 An image optim.

54:29 I am AJ, like image O-P-T-I-M.

54:32 And what it is, is like a, just a collection of algorithms that do lossless recompression

54:40 and re-encoding of images.

54:42 Okay.

54:42 Right.

54:43 So like you visually, literally there's no visual change to what's happening, but it might

54:47 re-encode it.

54:48 Like it might change the color spectrum for a PNG because it realizes only 256 colors.

54:53 Oh, that's pretty cool.

54:53 Right.

54:54 And so what you can do is you can take just the root of your website and throw it at this.

54:58 It will traverse the directories, find all the things and in place, replace them with their

55:03 optimized but unchanged version.

55:05 Nice.

55:05 That's pretty cool.

55:06 Yeah.

55:07 I did this on my sites and I got like 40% less.

55:10 It went from like 20 megs of images to, I don't know, whatever that was like nine.

55:15 And you just, it takes forever, but you just literally drag, drop, wait, done.

55:20 Cool.

55:21 I'll check it out.

55:22 Yeah.

55:22 So I was going to say on the image side, I use, I was talking about WebP earlier.

55:25 I forgot to mention it.

55:26 I use C WebP, which is, you can just go install it and it'll produce WebP images and you can

55:32 have it resize the images for you.

55:33 You feed it like a JPEG and PNG and it'll put out that kind.

55:38 Yeah.

55:38 And you can define what quality you want and what size you want for the image.

55:42 So you even resize it automatically for you.

55:43 Cool.

55:44 Yeah.

55:44 Those are, I like those because they're so easy.

55:46 Like they take no work and they're like, as long as you got your stuff in GitHub, checked

55:49 in, source control, like you're not in real danger of messing up stuff.

55:52 Yeah.

55:52 Yeah.

55:53 That's right.

55:53 That's right.

55:54 Yeah.

55:54 Yeah.

55:54 All right, Chris, we're getting kind of closer to the end of the show, running short on time.

55:58 I feel like we've just scratched the surface though, you know?

56:00 Yeah.

56:00 What else, like quickly, what else should we like point out for folks that they should go

56:04 check out?

56:05 We can talk about a few pieces.

56:07 So in Google search, so okay.

56:10 Trying to figure out which one works best.

56:13 So you put a link in Twitter.

56:15 Yeah.

56:15 Twitter pulls up like a little card with an image and a little summary of the website or

56:20 whatever it is that you like.

56:21 Right.

56:21 For the cool sites it does, right?

56:23 Yeah.

56:24 Right.

56:24 Like ours, right?

56:25 Exactly.

56:25 So all that is configured through meta tags and there's actually a standard, there's

56:29 a Twitter.

56:30 It seems like Twitter came first or maybe just Twitter was different.

56:33 Everyone else seemed to grab it or whatever, right?

56:35 Yeah.

56:35 There's a thing it's called Open Graph that describes a set of meta tags you can put into

56:42 your website to provide a title, a description, a summary, what image you want to use for that

56:49 little summary, a bunch of stuff like that and keywords as well, which is also important.

56:54 So all those meta tags you have to put in there because not just it works for Twitter, but it

56:58 works for your search engine and as part of the rankings.

57:02 Yeah, that's awesome.

57:04 And it definitely helps your stuff look more professional and anybody happens to grab it

57:07 and share it on social, right?

57:09 It's got this cool visual, like you've structured how it looks rather than just depending on like

57:13 a weird truncated URL.

57:14 Yeah, exactly.

57:15 And along the same lines, there's actually a whole other standard called JSON-LD, which is

57:23 used to essentially provide a JSON version of the stuff in your website, in your page.

57:31 So for example, when you go to Tri-Set Pass, in the main index, I can say, I am a website

57:41 of articles and here are all the articles and the titles and links and all that stuff.

57:46 Oh, wow.

57:46 Okay.

57:47 So that's parsed by search engines.

57:49 But not just that.

57:50 That information is actually used to generate the little cards that show up in the Google

57:55 searches.

57:55 You know, if you search for a recipe, it'll sometimes have the little...

57:59 Right, right, right.

57:59 All of that stuff has higher priority than the rest of the content because it shows up

58:04 up top in your search results, right?

58:07 And that is actually used if you go to the Google Search Console.

58:10 There's a little discovery section on the left side, which is part of like if you're on an

58:15 Android device and it's one of the Google built-in things in there and it shows content that Google

58:21 thinks you'd be interested in, if you have these things available, then it shows up in

58:27 discovery a little bit more.

58:28 Oh, cool.

58:29 You can characterize your website with it.

58:31 You can say it's articles, it's recipes, it's video or whatever.

58:34 There's like all this stuff to help do that.

58:36 Okay.

58:37 Awesome.

58:38 Yeah.

58:38 So that's JSON-LD, huh?

58:40 That was a piece that's important.

58:41 JSON-LD.

58:42 Yeah.

58:43 I'll put that in the show notes as well so people can have that.

58:45 Oh, man.

58:46 So many things.

58:47 It's so awesome.

58:47 And the thing is, it's rewarding if you get this right, people just engage with you and

58:52 your content more or your products or whatever.

58:54 And it's awesome.

58:55 Yep.

58:55 Exactly.

58:56 All right, Chris.

58:57 Cool.

58:57 I should leave it here.

58:57 But maybe it'll have to be a second edition to dive deeper into this.

59:02 But before you get out of here, you got to answer the two questions again.

59:05 You're right.

59:06 Some Python code.

59:06 What editor do you use?

59:07 I'm on VS Code these days.

59:09 Loving the remote extension.

59:10 Oh, yeah.

59:11 That's super cool.

59:12 I wanted to start using that as well some more.

59:14 I probably will.

59:15 I was talking about redoing my servers.

59:16 Maybe it's the time to get like a little hook for that in there as well.

59:19 Yeah.

59:19 And then notable PyPI package.

59:22 I'm using unsync these days a little bit.

59:24 I know you like that one.

59:25 I'm all about unsync.

59:27 I love that.

59:27 It's like awesomeness per line of Python code.

59:30 Can't be beat.

59:31 Yep.

59:31 It's a really nice one.

59:32 Awesome.

59:32 Yeah.

59:33 So basically, it's a unifying API across threaded parallelism, multiprocessing parallelism,

59:40 and async ILO.

59:41 Yep.

59:42 And a slightly better API for all of them.

59:44 Right.

59:44 And one.

59:45 Yeah, exactly.

59:45 It's so, so clean.

59:47 It's really nice.

59:47 I love it.

59:48 Really simple.

59:48 Great recommendation.

59:49 Yeah.

59:49 All right.

59:50 Final call to action.

59:50 People want to, like, they've got their site.

59:53 Maybe they just threw it into PageSpeed and they're like, how could it be 54?

59:56 This is, I can't believe it's 54.

59:59 Or, you know, they saw something crazy in the search console.

01:00:02 They want to take some action, make this better, get their stuff to rank better.

01:00:05 What do they do?

01:00:05 If you're using PageSpeed, just take advantage of the actual output.

01:00:09 It's really descriptive.

01:00:10 There's links to all the documentation, why all of the things matter.

01:00:13 Just, like, take your time and go through it and start optimizing.

01:00:17 You'll probably be able to get a bunch out of just optimizing images first.

01:00:21 So you can prioritize stuff like that.

01:00:23 Then you can head over to the JavaScript stuff.

01:00:25 And then you can start looking at the connections and whatnot.

01:00:28 I think reading through the Moz guide, which is a long guide, we'll link in the show notes,

01:00:34 is very useful.

01:00:36 Remember, producing a good website not only makes more people come to it,

01:00:40 though, you know, people will be happier with it.

01:00:42 It'll seem responsive and more professional, right?

01:00:45 I agree.

01:00:46 Yeah, all these things help SEO, but most of them also help the users directly.

01:00:50 Yeah, that's right.

01:00:51 Awesome.

01:00:51 Happy users is a good thing.

01:00:52 That's for sure.

01:00:53 All right.

01:00:54 Well, Chris, it's been great to have you back on the show.

01:00:56 Until next time.

01:00:57 Thanks for having me.

01:00:58 Yeah, you bet.

01:00:58 Bye-bye.

01:00:58 Catch you later.

01:00:59 Bye.

01:01:00 This has been another episode of Talk Python to Me.

01:01:04 Our guest on this episode was Chris Medina, and it's been brought to you by Kite and Linode.

01:01:08 Kite is the smart, AI-powered autocomplete for your editor.

01:01:12 And the more powerful your editor is, the more effective that you are.

01:01:16 Get Kite for free at talkpython.fm/kite.

01:01:19 Start your next Python project on Linode's state-of-the-art cloud service.

01:01:24 Just visit talkpython.fm/Linode, L-I-N-O-D-E.

01:01:28 You'll automatically get a $20 credit when you create a new account.

01:01:33 Want to level up your Python?

01:01:34 If you're just getting started, try my Python Jumpstart by Building 10 Apps course.

01:01:39 Or if you're looking for something more advanced, check out our new async course that digs into

01:01:44 all the different types of async programming you can do in Python.

01:01:47 And of course, if you're interested in more than one of these, be sure to check out our

01:01:51 Everything Bundle.

01:01:52 It's like a subscription that never expires.

01:01:54 Be sure to subscribe to the show.

01:01:56 Open your favorite podcatcher and search for Python.

01:01:58 We should be right at the top.

01:01:59 You can also find the iTunes feed at /itunes, the Google Play feed at /play,

01:02:04 and the direct RSS feed at /rss on talkpython.fm.

01:02:08 This is your host, Michael Kennedy.

01:02:10 Thanks so much for listening.

01:02:12 I really appreciate it.

01:02:13 Now get out there and write some Python code.

01:02:15 I really appreciate it.

Back to show page
Talk Python's Mastodon Michael Kennedy's Mastodon