For this guide to building a website we chose the Joomla content management system as our example tool. That is no coincidence: it is a powerful open source CMS that combines simplicity with professional capabilities. It lets you build a modern, fully featured website that can be extended and adapted further.
- Clean, readable URLs without unnecessary parameters,
- automatic support for structured data (schema.org): the system lets you insert markup that helps search engines understand the content of your pages better,
- a high level of accessibility, which is an increasingly important SEO factor,
- tools for canonical links, metadata and indexing directly in the administration.
There are other CMS systems, such as WordPress or Drupal, but Joomla remains an excellent choice for anyone who wants to keep their website under control, without limitations and with direct access to all the important settings. Services such as Wix, by contrast, aim for the simplest possible use, but often at the cost of limited control and lower flexibility.
If it matters to you that the website you build is truly your own work and easy to find in search engines, then read on.
Step 1: Planning the structure
Before you start building the website itself, the foundation is to think through its purpose and target audience. Who will the website serve? What does a visitor expect from it, and what result should the website bring you?
Instead of choosing a design or template, make your first step the design of the website's content structure. Write down the individual sections or pages the website will contain. Draw a simple sketch of the website, on paper if you like. Visualising it helps you understand how the pages relate to each other and how a user will move through them. Leave the home page until last, because it comes together best once you know all the inner parts of the website.
Beginners often start by choosing a design, because it is tempting and visually attractive. But remember, a website template only determines the appearance, not the logic and content of the website. That is why it is far more effective to start with the content, because a good structure works in any design. What is more, once you know what you want to display, it is easier to choose a template that really suits it.
Step 2: Installing Joomla
Once you have a basic plan for your website and know what its purpose will be, what you want to present on it and how its structure should look, it is time to move on to installing the content management system itself.
The good news is that installation is easy these days. Most good web hosting companies offer what is known as one-click installation. This means you can install the whole system in a few minutes directly from the hosting's administration interface, even without deeper technical knowledge.
How does it work?
After logging into your web hosting administration (e.g. cPanel, Plesk or the provider's customer area), you will find an option to install Joomla under "Web applications" or "Application installer". You just fill in a few basic details, such as the domain name.
After confirmation, the web hosting installs a clean version of the system within a few dozen seconds and you can log straight into your website's administration.
Sample data? Why not.
After the first installation, Joomla offers you the option of installing what is known as sample data. This is pre-prepared content that helps you understand how Joomla works and how the individual elements relate to each other. If you are new to building websites, definitely try this option. It will help you grasp the logic of the system faster.
Joomla installation guide for advanced users, in case your web hosting does not offer this service.
Step 3: Creating content
It does not matter whether you want to create a blog about travel, an online recipe collection or a professional company website. Every website shares the same goal: to convey information to visitors through text, images or videos. In other words, the main building block of every website is content.
Categories
Think of categories as folders on your computer. You keep holiday photos in one and invoices in another. In the same way, categories in Joomla serve to organise articles clearly. Once you have more articles, sorting them properly helps you keep everything in order.
Categories can also be arranged hierarchically, with subcategories. For example, if you write a blog covering various topics, you might have a main category "Blog" with subcategories such as "Travel", "Technology" or "Tips and tricks".
Articles
An article can be, for example, a news item, a blog post, information about your company or even a recipe, in short any content you want to manage and display on your website. Joomla offers plenty of ways to create and display articles, which is great. The easiest way to create an article is to click the "+" button in the left-hand menu or the "New" button in the article list.
What does editing an article look like?
After clicking the button, an editor opens where you can start writing your article.
- In the top bar you will find buttons for saving and other actions.
- We recommend saving your work as you go.
- On the right-hand side of the screen there is a help button that will assist you at any time.
- Choose the article title carefully; it should be clear and to the point.
- Joomla automatically creates an alias, which becomes part of the article's URL.
What can you set in an article?
An article has several tabs, but to begin with the first one, where you write the content, is enough. Also select the category the article belongs to.
You write the text in a large text field; the editor is similar to the one in Word, so you can format text, add links, images and more.
How to add an image to an article
To insert an image into an article, place the cursor where it should go and click the "Insert media" button. Select the image from your images folder, add an ALT description and set the alignment, for example so the image sits on the left.
If the image is too large, click on it and change the dimensions in the settings or add margins so the text and image look good together.
How to make an article suitable for a blog
If you want your article to appear in the blog overview with a short introduction and a "read more" button, split the text into an introductory part and the rest using the "Read more" button. The introductory part is called the intro text or teaser.
It is also recommended to add a small image as the intro preview, which is shown in the article overview. You will find this option on the tab named "Images and Links".
How to hide unnecessary information
You may not want to show some of the article details that are displayed by default. You can set this in the menu options or directly in the articles on the "Options" tab.
How to check the accessibility of your pages
Joomla pushes the boundaries of web accessibility with new features, including the useful "Joomla Accessibility Checker" plugin. This tool automatically detects accessibility errors as you create content and offers practical advice on how to fix them.
Working with media
In Joomla you can upload files simply by dragging them with the mouse into the right folder. If you want to edit an image, just click on it and use the simple tools: you can crop, resize or rotate it.
The media manager also lets you rename files, easily delete even whole folders, select several files at once, copy links and download anything to your computer with a single click.
On the right-hand side of the screen you will find clear information about each file, such as when it was uploaded, how big it is and what format or type it has. This makes it easy to see which images might need shrinking so that the website loads faster.
In addition, Joomla plans to allow other services to be connected in the future, such as Dropbox or Google Drive, and to add tools for automatic image optimisation. The new media manager is thus a great helper that will keep your files in order and let you handle everything easily, even without experience.
Basics of SEO optimisation for content
How to do SEO in Joomla? Here is a simple guide for beginners. It only takes a few basic steps to improve your position in search results. This guide is written in plain language, without complicated technical jargon. Anyone who has learnt to work with the basic functions of Joomla can manage it.
- Choose good hosting: Quality Joomla hosting means a fast website. And speed matters, both for users and for search engines. Avoid the cheapest options. Ask whether the provider supports Joomla.
- Turn on friendly URLs: In the administration go to System > Global Configuration > SEO and enable:
- Search Engine Friendly URLs
- Use URL Rewriting
"www.example.com/website-development" instead of "index.php?option=com_content&id=12" - Write articles thoughtfully and use keywords: Try to put yourself in the visitor's shoes: what would they type into Google? Then use those phrases in headings, descriptions, URLs and the text itself. For example: "How to create a website?" or "best motor for a fishing boat".
- Link articles to each other: In every article, include a link to another article on the website. It helps visitors and search engines alike.
- Create a sitemap: Using an extension such as Jsitemap, you create an overview of all the pages on the website. You then submit this file to Google Search Console so that Google can explore your website more thoroughly.
- Optimise images: Images should have a sensible size, format and a proper name. Do not use names like `IMG002.jpg`, but for example `honda-10hp-motor.jpg`. Do not forget to fill in the alternative text (ALT) describing what is in the image.
- Start a blog or a news section: Adding articles regularly shows that the website is alive. Write about what interests your customers: advice, tips, how-to guides. Every such article is a new chance for someone to find you on Google.
- Track your results: Set up an account in Google Search Console and Google Analytics. You will find out how you are doing, what people are searching for and where they come to your website from. Both are free.
Step 4: Navigation (menus)
A well-designed menu is like a map that helps visitors quickly find their way to the right content. It is important that a visitor can reach any page in at most two clicks. Forget complicated, deep menus: simplicity and logic win.
A menu is like a container for individual links (known as menu items). You can have several different menus. For example a main menu, a footer menu, a menu for logged-in users and so on.
Menu items then represent specific links, for example to an article, a list of contacts, a category blog, an external URL and the like.
Example: A blog divided into categories
Let us say you have a blog and write articles on three different topics: Travel, Recipes and Technology. You have each of these topics set up as a separate category. Then, in the administration:
- You create articles and assign them to the corresponding categories.
- You add new items to the main menu:
- Title: Travel. Item type: Category Blog, Choose a category: Travel
- Title: Recipes. Item type: Category Blog, Choose a category: Recipes
- Title: Technology. Item type: Category Blog, Choose a category: Technology
Result: Your visitor sees three items in the website's main menu. When they click on "Recipes", for example, they see all the articles in the "Recipes" category.
Step 5: Modules
Once you have the structure of the website ready, you start adding the individual functional parts, such as a list of news, a login form, a search box or the menu we created in the previous step. In Joomla, modules are used for these purposes.
They are small blocks that display specific content or a function in a particular place on the page. You can assign each module a position in the template, that is, the place where it should appear on the web page.
For your menu to appear on the website, you need to create a module of the menu type. You then assign it to a specific menu and define exactly where it should be displayed (e.g. in the top bar, the sidebar or the footer). In the administration, choose Content > Site Modules, click New, select the Menu type and set the required parameters.
Step 6: The look of the website
When you install Joomla, you automatically get a basic look for your website as well, a template called Cassiopeia. This template determines how your website looks to visitors. It is adapted for mobile devices and built on the modern Bootstrap framework, so it works well on all screen sizes.
Why Cassiopeia?
- It is free
- It is secure and regularly updated
- It can be adapted as needed
If the look of the website does not suit you, you can customise it in the template:
- Logo or website name
- Colours, fonts, layout
To begin with, you can use this basic template that Joomla provides, or download another one free from the internet. Bear in mind, though, that some templates look beautiful mainly thanks to their sample photos and texts. Imagine how the template will look once you put your own content into it. Take enough time choosing a template.
Website running costs
Creating a website in Joomla can be very cheap if you do it yourself, or more expensive if you use professional services. The total price depends on the scope of the project, the extensions and templates used and the technical support.
Joomla is free, but hosting, a domain and any paid templates or extensions make up the basic costs. You also need to allow time for maintenance, updates and possibly SEO or content management.
Indicative cost overview
| Cost item | Estimated price |
|---|---|
| Domain and hosting | €40 to €80 per year |
| Template and extensions | €0 to €200 one-off |
| Website development by an agency (custom) | €1,000–4,000 and more |
| Management and maintenance | €0–600 per year and more |
| Content and SEO | individual |
Help right where you need it
One of the useful tools is what are known as guided tours. This interactive element helps you understand the administration interface more easily and find your way around the individual functions of the system faster. Everything is available in Czech as well.
What exactly is a tour?
A tour is an interactive guide that walks you step by step through a specific part of the administration environment. It guides you directly on the page using highlights and explanations, for example next to buttons, form fields or links. Each step tells you what you are looking at and what it means. So you do not need to search the documentation for anything; you see it all right where you need it.
Where do you find the tours?
In the top right-hand corner of the administration you will find the Start Tour button. Clicking it shows the tours available for the current page. If you want to explore them all, just expand the full list. You can then browse tours focused on articles, menus, modules or other parts of the system.
One of the first options offered is the tour "How to create an article". In a few steps it teaches you how to write and save your first content properly.
Extending the website's capabilities
If you have experience with WordPress or static HTML pages, you may be surprised that Joomla behaves differently in many respects. Some functions that you previously had to solve by installing plugins are already part of the system here by default. So there is no need to go looking for an extension for every little thing straight away; the basic installation is often enough.
If you do need to extend your website's capabilities after all, it is good to know that Joomla uses three main types of extension:
- Components. Larger extensions that add complex functionality (e.g. an online shop or a booking system),
- Modules. Display blocks (e.g. menu, news, search),
- Plugins. Small extensions that add supplementary functions.
You will find all the add-ons on the official portal extensions.joomla.org.
