Adding a Reading Time Estimate to Your Blog
You've seen it on lots of websites (including this one!): a little bit of text below a headline telling you the article will take X amount of time to read. How is this done, and how can you add this to your site?
The Formula
It can be as simple as grabbing the word count of your page and then dividing it by a reading rate in words per minute.
I've seen rates all over the place, but they tend to range from 100–250, and I've seen 200 even more often emerging as a common reading rate. Here's the formula I'll work with:
Creating the formula in python to test it out looks like this:
>>> t = "this is a sentence of some words and stuff. Also another one."
>>> len(t.split(" "))
12
>>> len(t.split(" ")) / 200
0.06
The second line isn't necessary, but that's an easy way to get the word count (splitting the text in t
by all the spaces and counting the groups).
You could also try this out in Javascript:
> const fullText = "this is a sentence of some words and stuff. Also another one."
> fullText.split(" ").length / 200
0.06
Create a Function
We'll finish this up in python, though you can easily extract this into JS if that's your coding flavor. I'll go with python to demonstrate how this could be done server-side if you were using Django, for example.
In my models.py for my blog post, say I have a TextField called, "body," in which I've put all of the text for the post. Just adding a little read_time function like below will do the trick:
class Blog(models.Model):
body = models.TextField()
def read_time(self):
return round(len(self.body.split(" ")) / 200)
Then in my template, blog-list.html, I can output this read time for my top three featured blogs, for example:
...
{% for blog in featured_blogs %}
{{ blog.title }}, {{ blog.read_time }} Min
{% endfor %}
Note that I used the shortened form of "minute" as "Min" because then I don't have to account for pluralization 😏
I also added the round()
to our original read time formula, because it looks much cleaner output as a whole number.