Happy New Year 2021, everyone! This is the last part of my series on optimising Joomla sites. In the previous instalment we did some site building calisthenics. Today we'll talk about content. This is not necessarily a Joomla topic — it applies equally to WordPress, Drupal, Medium, Blogger and everything that publishes written words to the web.
Have you ever thought that the very fact that I can make it so that disembodied data is transferred across the globe using electron movement and light so that a thinking rock powered by lightning can render some scribblings on a piece of glass which will make you hallucinate a copy of my thoughts into your brain is nothing sort of magic?
This is what the web is all about. Practical magic, designed to communicate our thoughts to people we have possibly never met and never would have the chance of talking to. In this light, web sites are tools for communicating and search engine optimisation (SEO) is a means to an end, not a goal in its own right. SEO is about helping more people find our thoughts.
Let's talk about how we can do that in a way that makes sense for our readers, for ourselves and for the magic thinking rocks that weigh our words and decide which brains to infect with them.
Break down long articles
I know that I am guilty of writing very long form content. My articles typically run in the few thousand words. Beyond a certain point they become too taxing to both humans and machines consuming them.
If your articles are longer than a couple of paragraphs it helps putting headings in them. Headings act as anchors for the reader, both the first time and the returning one. Speaking of anchors, if you want to be able to link to specific headings remember to give them
id attributes. I admit I don't frequently do that in articles. I do, however, practice that when writing documentation.
Headings will only take you this far. Once you get to a couple printed pages long your content becomes too long for a human to take in. It is best to break it down into logical groups of those headings and put each one of them in a new page.
You do not need to and should not create a new article for each page! Joomla has a built-in article pagination feature. Use the Page break editor button to separate your logical pages. Joomla will show a table of contents at the top of each page and links to the previous and next page in your article.
Keep the DOM size in check
Your entire site and your content are delivered as HTML to the browser. HTML is structured text. Each tag creates a node in the Document Object Model (DOM) tree, the internal representation of the parsed HTML in your browser's memory. OK, technically it's more complicated than that but this is a good approximation to begin with.
A very large or excessive nested DOM will cause problems when rendering your site. The browser will need to expend more effort to lay out your page. Interactions with the page will require the browser to recompute a very large number of DOM nodes. Your pages will be slow to load, display, scroll and interact with while using up a whole lot more power. If your content is likely to be consumed by 9 out of 10 people out there on a mobile, underpowered device you should take that into account.
You can keep the DOM size down in at least two ways. First, break down long articles in pages as explained above. Second, mind your HTML! Don't use inline styles, use classes. Chances are your inline styles are something you will be reusing and will fare better as a CSS class anyway. Don't paste directly from Word or another site. It's better to paste as plain text and spend a bit more time reformatting your content than end up with a rat's nest of tags and nonsensical CSS classes.
Regarding DOM nesting it's something that starts with your template. Try to organise your template sensibly, without too many nested tags. This may push your CSS skills a bit. I should know. I am not exactly a leading authority in creating a page structure in CSS out of thin air. Whenever I had to do something that would normally require me to use half a dozen nested CSS tags I asked my wife and she came up with a solution that at first looked like dark magic but once I dissected it to its components it made a great deal of sense. Flexbox and CSS Grid are your friends in creating layouts that are powerful as they are easy on the browser and yourself to understand. These things are magic. If you're not into writing CSS from scratch you can use Bootstrap 4 which, unlike its previous versions, is a slightly friendlier wrapper around Flexbox.
Hey, purists: I know that Bootstrap 4 is heavy, blah blah blah. Please remember that most people reading this article are trying to make sites with a tiny team, on impossible deadlines and shoestring budgets. Losing 10 points in Lighthouse is not the end of the world. Not delivering a site in time may as well be.
Write primarily for humans, not bots
A lot of the advice you will find on writing good content for the web focuses on short term goals. Typically it is telling you how to make search engines rank your content highly, at least in the short term, with complete disregard on how humans perceive the end result. For some sites, such as limited time marketing campaigns, this makes sense and if you have such a site continue doing that. For most sites, however, this may be a shortsighted approach.
Search engines may highly rank your content and place it in front of more eyeballs but this means nothing if it doesn't lead to more traffic on your site. A human who has visited your site before and found it full of utter drivel will ignore your precious highly ranked search results when they're looking for something else. Humans remember bad experiences more than they remember good ones. This is a key feature of the human nature, one that kept our primitive ancestors alive — learning to avoid the cave with the hungry bear was a key survival skill.
The best approach for your content is to write it as it is most appealing to your intended audience. My content, for example, falls into two rough categories: technical how-to articles and opinion pieces like this one here. They have distinct audiences with different needs and expectations. My technical articles focus on what you have to do with a short description of why and a longer explanation of exactly how which is clearly marked as such. They are laid out in the order you need to do things. Caveats are pointed out. Plenty of headings help you find your place if you found yourself lost. The writing is dry, technical and to the point.
My opinion pieces are a different story. My intro text starts with a short hook that will make for a good summary under the link card when shared on social media. I use eye-catching images for the same reason. In the full text I lead with a paragraph that sets the expectations and the tone. I try to employ cohesive storytelling, each section building up on what I have already covered. I finish with an outro paragraph which gently takes the reader back to the here and now and prods them to think more about my content. The content itself is written in the same informal tone I'd use when making a presentation.
Find out what are your audience's expectations and modulate your tone of voice and content structure to appeal to them. Avoid what would best be described as "wooden language" i.e. excessive formality — unless you're a lawyer or writing a press release for the Prime Minister in which case it can't be avoided. On the other end of the spectrum and unless your audience explicitly expects that kind of content please avoid excessive jargon, slang and colloquialisms. Avoid verbalism; your erudition is not called in question when writing content for the web. I understand the irony of telling you not to use big words by using big words; it was intentional and demonstrates how out of tone content can give your readers a pause. Finally, avoid "fluff" i.e. saying something simple with too many words. If your content reads like it was written by a bored student trying to hit a word limit you lose credibility.
Spell and grammar check
Always check your content for spelling and grammar mistakes. Nobody expects you to be at the level of a linguist, unless you are one, but do make an effort to avoid blatant mistakes.
Most modern browsers and Operating Systems include built-in dictionaries and spell checkers. I am using Safari to write this content. All I need to do to check my content for spelling and grammar is right click on it, click on Spelling and Grammar and have it spot my mistakes and make recommendations.
Beyond that, you can use third party resources such as Grammarly and Thesaurus to improve your writing. You could also try marrying an American who's a stickler for proper grammar like I did but third party resource are very likely far more practical. (Hey, Crystal, if you're reading this content, please don't give me an F.)
Beyond your content tone and structure you should avoid unnecessary disruptions in the visitor's reading flow. Don't interject advertisements in your content. If you must, keep them to a minimum and clearly mark them as such with subtle visual cues (such as a more opaque background or a slight border). Avoid big, moving, flashing, in-your-face or popup, popover and pop-under advertisements. They are extremely unfriendly to people with cognitive disabilities, epilepsy or ADHD like yours truly. I use an aggressive ad blocker because this kind of ads make it impossible for me to focus on the content. Do not use advertisements which look like part of your content or your site, they are throwing off your visitors and they're likely to close the tab because your content suddenly makes no sense. Do not use advertisements that magically appear when people scroll the page. They disrupt the reading flow and they trigger a flight response. For the love of whatever you hold dear, do not under circumstances link random words to advertisements. When people see a link they expect something useful, not utter drivel.
Do not use auto-playing video unless your content is only video, clearly marked as such and your users expect it to start playing. Many of us have toddlers trying to sleep and we are on our phones while they settle to sleep, a process that can take over an hour on a regular basis. Autoplaying videos can make our phones start blurting out sound and wake the toddler up. Most parents feel very strongly about that, to the point that it'd be actively harmful for your physical safety to be in the same room as them once you identify yourself as the source of that autoplaying video. Similar reactions occur when our partner is sleeping, we're at the office (when we are allowed back to our offices after the pandemic is under control...), the train station (ditto) and so on and so forth. Even when in our lonesome those bloody auto-playing videos are unexpected, annoying and make us never want to visit your site again.
In the same note, please, do not overdo it with popups and popovers. I don't want your cookies, a point I already talked about. I don't want to sign up to your newsletter, we just met. I don't care about your discount you shoved in my face; I have not read about your product description yet, I sure as heck won't jump into buying it just because you waved a 5% discount in front of my face. No, you are not allowed to block me because I am accessing your site from the European Union, you are doing GDPR wrong. Oh, for crying out loud, I won't disable my ad blocker to read your content; your flashing ads making it impossible for me to access your content is why I am using it in the first place. STOP. WITH. THE. POPUPS. *closes tab* That's my typical experience visiting a site these days. If you created a site like that, I hate you. Most people hate you. You are doing a disservice to your audience and, effectively, yourself.
In short, keep unnecessary distractions to an absolute minimum. Your audience will appreciate a mostly distraction free experience. Do subtle advertisements if that's what is paying your bills. Offer your newsletters as a sidebar action or an in-line advertisement towards the end of your content — if I liked it then, yes, I might even subscribe to your newsletter to get more of it. Show me the first time client discount when I go to the product purchase page, not the product description page. I will appreciate it, even more so if it's a button that applies it for me instead of trying to copy it on my smartphone which invariable causes it to disappear from my sight. Respect my privacy and my decision to use an ad blocker. If you need to restrict my access to the amount of content I can consume, do it; New York Times does it and I still visit their site.
Make your content bot-friendly all the same
Good quality content that is enjoyable by humans on a fast-loading site does rank very well in search engines. Your visitors are also far more likely to share it which will create even more inbound links for you which will further improve the rankings. It's as though search engines try to show users the most relevant, human reader friendly content that's relevant to their search...
Sarcasm aside, there are a few things you can do to further help search engines and social media platform to digest your content and make sense of it: microdata. These are additional attributes in your HTML content which hint machines to the type of your content and provide further context. For example, you can tell the machines that ingest your content who's its author, when it was created and last modified, what kind of product you're talking about and where to find more information about it and so on and so forth.
Joomla has built-in support for microdata using the Schema.org language. It made its first appearance as a core library in 2013 for use by third party plugins and got fully integrated into the core components' HTML output around 2017. If you have a third party you should check if their template overrides include microdata. Everything you see in the Publishing tab when editing an article becomes part of the microdata.
Speaking of the Publishing tab, remember to fill in the information there for your content. The meta keywords are no longer the only hints for a search engine but it helps them with disambiguation if they are not entirely sure about your content's context. The meta description is rarely, if ever, used in search results anymore but many third party sites use it to present a summary of your content when there's a link to it. Content rights are an often forgotten but important piece of information that gives a hint to machines and people about the licensing of your content and whether it can be reused.
Your links to external resources should have a
rel attribute set to
nofollow for any links pointing to something you do not endorse or is commercial in nature. If you are linking to internal pages which should not be indexed such as a cart or checkout page, a user panel etc you should set the
rel attribute to
That's all, folks!
This article series has been a wild ride for me. I started working on improving my blog's performance back in April. I was working on and off on it until July. I ended up writing a bunch of plugins and making a lot of big and small changes throughout the site. The need to share it with the world was born.
I started writing this series back in late July 2020, thinking it would be a single, rather long article. As I kept on writing, adding new things and revising what I had already written I realised that nobody would have the patience for reading a 13,000 word article — most people would call it a small book. I started rearranging it in November as an article series, intending to publish it as my advent calendar in December. Dear reader, I should have known better.
Between mid-November and Christmas I was snowed in with work. Everyone found themselves in a mad rush to do just about everything they hadn't managed to do just yet. Being the author of many popular extensions I found myself at the intersection of my clients pushing hard to get those final few sites done and PHP 8.0 coming out. My advent calendar idea had to be scrapped. The best laid schemes o' mice an' men, as they say in Scotland.
Right after Christmas I did a sprint of my own, finishing the content for this series and compressing it into five long articles I could publish as my five day countdown to New Year's. I managed to touch the surface of just about everything that really matters, from why bother optimising your site, to tips on building your site, optimising its static content, doing some veritable calisthenics and, finally, making your content worth reading.
I hope you enjoyed this series as much as I enjoyed writing it. I hope that at the very least I gave you a small itch to start optimising your sites and possibly helped you learn something new or rediscover something forgotten. Have a Happy New Year and may this year be devoid of pandemics and disasters!