Als je je Joomla website opbouwt moet je zorgen dat je HTML code netjes gestructureerd is. Op die manier zorg je ervoor dat zowel zoekmachines als gebruikers je website goed kunnen lezen. Natuurlijk is er een verschil tussen wat je lezers zien en wat Google ziet, je lezers lezen geen kale code, maar ook je code moet goed leesbaar zijn. Als maar een klein deel van je code leesbare HTML is en de rest alleen maar grote blokken Javascript en in-line CSS is de tekst / code verhouding laag, en moet Google veel moeite doen om de boel te ontwarren. Daarnaast moet de code ook gestructureerd zijn. Let daarbij op de volgende zaken:

  • Stop je CSS en Javascript in externe bestanden. In uitzonderingsgevallen kan het uit performance-overwegingen beter zijn om kleine stukjes code in-line te plaatsen, maar dit zijn uitzonderingen.
  • Structureer je content met correcte HTML tags. Gebruik bijvoorbeeld geen <span>-tags om code-blokken te ordenen, maar gebruik geavanceerde HTML5 tags. Een voorbeeld: Als je een quote wilt weergeven, gebruik dan geen span met font-style italic, maar gebruik de "q" tag. Gebruik vooral de HTML5 tags, veel daarvan zijn precies voor dit structureren bedoeld. Gebruik in plaats van div's met een ID tags als <header>, <footer>, <aside> en dergelijke. Bij correct gebruik kunnen zoekmachines goed achterhalen wat de belangrijke delen van je site zijn en welke minder.
  • Gebruik micro-data (zie het betreffende artikel).
  • Vermijd content die zoekmachines niet kunnen lezen (Flash bijvoorbeeld).

H1 koppen

De bovenstaande structurering voer je uit in je template, of zou je template-provider voor je moeten doen. Daarnaast moet je ook de content in je Joomla artikelen structureren. Met structuur en hiërarchie kan Google ook deze beter beoordelen.

Net als in Microsoft Word kun je met koppen een mooie structuur aanbrengen. Liefst begin je daarbij met een H1 kop ( <h1> tag ) op elke pagina. Gebruik daarbij liefst maar 1 hiervan, en gebruik vervolgens H2 en H3 koppen om verdere zaken te scheiden. De H1 kop is echt de top-kop. Nu zul je in veel gevallen het liefst willen dat de titel van je artikelen door Joomla wordt gebruikt als de H1 kop. Helaas is dat niet zoals Joomla staat ingesteld, kijk maar eens naar deze Joomla site met demo-inhoud:

Gelukkig zijn er allerlei manieren om hier iets aan te doen:

Je kunt gewoon met de mogelijkheden in de Joomla core al bereiken dat je artikel titels worden weergegeven als een H1, zeker bij wat kleinere sites:

  • Ga naar Artikelbeheer, en klik op Opties. Zet dan de parameter Toon titel op Nee.
  • Vul nu in de editor van het artikel de gewenste H1 kop in. Je moet nu wel de titel 2 keer invullen, maar zeker voor wat kleinere sites is dit een prima oplossing.

Ook met de opties in het Menubeheer kun je dit bereiken (in menu-item: Paginaweergave tabje: toon Paginakop).

Optie 2: Extensies

Er zijn extensies die het beheer van de koppen voor je kunnen regelen, zodat bijvoorbeeld een <h2> veranderd wordt in een <h1> op basis van je instellingen. Een populaire extensie hiervoor is de Header Tags extensie. Ook binnen extensies als SH404SEF kun je dit soms instellen.

Optie 3: Gebruik een template override

Normaal gesproken zijn template overrides meer wat voor gevorderde Joomla beheerders, maar dit is waarschijnlijk de gemakkelijkste template override die er is. Daarnaast is het aanmaken van een override in Joomla 3 zeer gemakkelijk geworden:

Ga naar Extensies > Templatebeheer > Templates and selecteer de actieve template. Ga dan naar het Maak overrides tabje, klik op com_content (je ziet dan extra opties) en klik op article. Ga dan naar het Tekstverwerker tabje, en browse naar html >> com_content >>article.  Een code-editor window verschijnt. Zoek dan de volgende code, ongeveer van regel 28:

<div class="page-header">
<h2>
<?php echo $this->escape($this->params->get('page_heading')); ?>
</h2>
</div>

Je ziet gelijk de <h2> tag. Vervang nu de open- en sluit-tag door <h1> en je titels worden correct weergegeven.

Je kunt (oo in Joomla 2.5) trouwens hetzelfde bereiken door het bestand default.php located incomponents\com_content\views\article\tmpl te kopiëren naar templates\YOUR_TEMPLATE\html\com_content\article (maak de folders html en com_content aan in je template folder als ze nog niet bestaan) en voer dezelfde vervanging daar uit..

Nadat je gezorgd hebt dat een <h1> op elke pagina wordt weergegeven moet je natuurlijk zelf zorgen voor verdere structurering met <p> tags voor de body tekst, en <h2> koppen voor verdere onderverdeling (niet meer dan 3-4 per pagina) en eventueel <h3>.

Gebruik verder indien nodig tags als <q>, <b>, <i> voor verdere structurering.