Peter Martin was annoyed by bad websites, got inspired by some packaging, and built a multilingual Joomla website in 5 languages under 5 Top Level Domains about the best practices for websites.

1. The Idea

I see bad websites

Since 2005 I have been building Joomla websites and extensions professionally. Ever since I have been active on the internet, I have come across a lot of beautiful websites. Unfortunately, even more often I stumble on bad websites: loading slowly, unclear navigation, difficult to read due to lack of contrast, badly constructed texts, or layout issues. Such websites are often easy to improve with just a few minor changes.

Liquorice

The Netherlands is the country of “Stroopwafels” and liquorice. Stroopwafels, thin biscuits with caramel in between, are already known in the Joomla community. Sweet or salty liquorice is often eaten as candy in my country. Last September I queued for the cash register at a local farm shop that sells local vegetables and delicacies. A pack of liquorice: “De Beste Drop Ooit” caught my eye. In English: "Klepper & Klepper present: The Best Liquorice Ever - according to Klepper & Klepper". I had to laugh about the funny packaging with its pretentious claim.

A website about websites

I had been thinking about creating a great Joomla website that I could demonstrate to my customers. To show the power of Joomla CMS. Its core multilingual and comprehensive authorization features. And how to optimize everything. In the afternoon on the couch with a cup of English tea (PG Tips), I thought again about “The Best Liquorice Ever”.

The best website

So what about creating “the best website”? An optimized website about the best practices for websites. To motivate website owners to improve their websites. To inspire other website builders on how to build good websites and optimize them using a range of possible tests.

To my surprise, the domain names de-best-website.nl and the-best-website.com were still available for registration. I installed a new Joomla site and configured it as a multilingual website. A day later I decided to register the German die-beste-website.de, French le-meilleur-site-web.fr and Spanish domain name el-mejor-sitio-web.es.

2. Implementation

The website is one instance of Joomla 3.9.x with four additional language packs:

Dutch (nl-NL), German (de-DE), French (fr-FR) and Spanish (es-ES).

Content structure

For each language I created categories and articles like:

English (category)

• For Visitors (category)
  • A reliable website (article)
  • A dynamic website (article)
  • A user-friendly website (article)
  • A mobile website (article)
  • A privacy-friendly website (article)
  • A fast website (article)
  • An accessible website (article)
• For Admins
  • 7 articles
• This Website
  • 3 articles
• About
  • 6 articles

I created a similar Menu Item structure and “Language Associated” Menu Items with its equivalents in the other languages. I did the same for Categories and Articles, just to make it easier to maintain in the back-end.

Layout

For the Layout of the website, I used Yootheme Pro (commercial extension). It’s a responsive template that optimizes images. It has a dynamic page builder called “Templates”. You can construct the Category Blog and Single Article View, and assign them to specific Categories or Articles.

TLD per Language

Finally, to bind the five languages on the website to their Top Level Domain (TLD) counterparts, I used a System Plugin called “Language Domains”. It was developed by Jisse Reitsma, the author of the well-known book “Programming Joomla Plugins”. As it is an unmaintained project, I adapted the code for Name Spacing and PHP 7.4.

3. Extensions

I like to stick to the Joomla core. Use as few non-core extensions as possible. That way the website will be easier to maintain and use less resources (thus loads faster). The following extensions make it easier to work with Joomla. Removing them won’t interfere much with the front-end of the website.

• d2 Content Pro - To create your own Article Edit view: select only the tabs and fields that you need. Instead of Joomla’s default 7 tabs with 76 fields, in this website, only 1 tab with 14 fields is displayed. It works alongside Joomla’s default Article Edit view.


• JCE editor Pro - A very nice customizable editor. Makes it easy to upload and manage images. Creating links to other articles is easy.


• PWT SEO - Helps you to SEO optimize your articles. Analyzes the article on your defined keyword. Gives you tips and a clear visual indicator of the level of optimization.


• JCH Optimize - To optimize and minify the HTML/CSS/JS output.


• OSMap Free - Generates dynamic Sitemaps. The Best Website uses one Sitemap per language: an HTML for the visitors and XML for Search Engines to easily index the website.


• Akeeba Backup Pro - Backups are important. Akeeba Backup Pro can create encrypted backups of the files and the database. It can move the backup to another location.


• RSForms Pro - An excellent form component to generate custom forms. The forms can be stored in the database, and it can send notifications to the visitor and/or the admins. It supports multilingual labels and conditional fields. You can extend the functionality of the forms with your own PHP code.


• HTTP Header - A server communicates via HTTP headers the status, cache, etc of a page. Via HTTP Security Headers the server can communicate to the browser what actions are allowed: does the website allow iframes, external scripts, ask for location/camera/microphone use, etc. With this plugin, you can easily set what Security Headers your Joomla website should add to the communication. This functionality will be in the Joomla 4 core!

4. Challenges

When building the website, I ran into a couple of difficulties:

• Google Analytics - In Yootheme Pro, you can easily add a Google Analytics Key. However, “The Best Website” has a Google Analytics Key for each language/TLD. Therefore I created a Template Override (in Yootheme called “Child Theme”) and added a small routine that checks the language and sets the Google Analytics Key for that language.


• 404 Error pagina - When a visitor tries to retrieve a non-existing page, like a wrong URL because a page has been moved, Joomla will generate a 404 error. The default 404 error by Yootheme is not so nice: just a white screen with the text “404 Error” + a link to the homepage. To have a nice 404 error for each language, I created a Joomla article per language, and for each language a hidden menu item to that article. Using another template override, the 404 article will be retrieved, while an HTTP 404 header will be communicated to the browser. This results in a better-looking page in the layout of the website and with the website’s menu structure on top.

5. Result

The Best Website discusses the best practices for a good website from the visitor’s point of view. And from the point of view of the administrators that have to maintain the website.

Furthermore, it discusses why “The Best Website” is a good website for visitors and administrators, based on various tests. And it gives an overview of all the tests so that website owners and builders can test their own websites.

Finally, the website has some background information about the purpose of the website, imprint, privacy statement, contact form and an HTML sitemap.

This structure is used consistently over the whole multilingual Joomla website. The website has five languages and each of them is available under its own Top Level Domain. When you visit one of the domains, it automatically selects its corresponding language. When you use the language switch to select another language, you’ll get redirected to the corresponding Top Level Domain.

You can see it in action:

• English: The best website: https://the-best-website.com/


• German: Die beste Website: https://die-beste-website.de/


• French: Le meilleur site web: https://le-meilleur-site-web.fr/


• Spanish: El mejor sitio web: https://el-mejor-sitio-web.es/


• Dutch: De beste website: https://de-beste-website.nl/