HU

 

Technikai SEO és keresőoptimalizálási beállítások a weboldalainkon

A SEO-nak három területét szokás megkülönböztetni:

  1. a tartalom optimalizálását, azaz írását, szerkesztését, gondozását (on-page SEO),
  2. a weboldal népszerűsítését linkszerzéssel vagy más csatornákon keresztül (off-page SEO) és
  3. a technikai SEO-t.

A keresőkben való rangsorolás szempontjából a jó tartalom a legfontosabb, de döntő lehet az is, hogy technikailag minőségi-e az oldalunk. A technikailag keresőoptimalizált oldalaknak a hirdetési költsége is alacsonyabb.

Ügyfeleinknek a technikai keresőoptimalizálás miatt nem kell aggódniuk: weboldalainkat az alapoktól úgy építjük meg, hogy technikai szempontból ne legyen akadálya a jó helyezéseknek. Minden esetben telepítjük az alapvető technikai SEO-beállításokat lehetővé tevő modulokat is, hogy a honlap tulajdonosainak és kezelőinek minél könnyebb dolguk legyen a részletek igények szerinti beállításával és a tartalmi optimalizálással.

 

Keresőoptimalizált webhelyet szeretnék!

Mi a technikai seo?

A technikai SEO, vagyis technikai keresőoptimalizálás olyan tevékenységeket jelent, amelyekkel a weboldalainkat és website-unkat technikai szempontból jobbá tesszük és karbantartjuk. 

A cél:

  • egyrészt az, hogy lehetővé tegyük a robotok számára a tartalmunk feltérképezését és értelmezését, illetve hogy egyáltalán megjelenhessenek az oldalaink a keresőkben, 
  • másrészt az, hogy a felhasználók számára a megkönnyítsük és élvezetessé tegyük az oldalaink felfedezését és használatát.

Az informatív, hasznos, egyedi tartalom a legfontosabb ahhoz, hogy egy-egy keresőkifejezésre előkelő helyen szerepeljen egy-egy oldalunk a találati listákon.

Azonban két, hasonlóan informatív és jól megírt tartalmú weboldal helyezési sorrendjében az lehet a döntő, hogy a másik két aspektusban hogyan teljesítenek.

A technikailag is minőségi módon megépített webhelyeknek nemcsak nagyobb esélyük van az előkelő helyezésre a találati listákon, hanem a hirdetési költségeik is alacsonyabbak.

Egy lassan betöltődő, esetleg nem mobilbarát, zavarosan felépített oldalt hirdetni jóval költségesebb, mint egy professzionálisan kivitelezett webhely oldalait.

Technikai SEO és keresőoptimalizálási beállítások a Drupal weboldalainkon

Oldalbetöltődési sebesség

Nyilvánvaló, hogy az oldalak betöltődési sebességének óriási hatása van a felhasználói élményre és egyáltalán arra, hogy használják-e a webhelyünket az emberek. A javaslat régóta az, hogy tartsuk a betöltődési időt 3 másodperc alatt.

A Google 2017-es kutatása szerint ha 1 másodpercről 3 másodpercre nő a betöltődési idő, az 32%-kal növeli a visszafordulási arányt!  

2020-ban a Google rangsorolási tényezői közé bekerült alapvető webes vitals-mutatók (Core Web Vitals) kézzelfoghatóbbá teszi, hogy melyik oldalélménnyel kapcsolatos sebességértékekre kell figyelnünk. 

A Google PageSpeed Insights eszközével egy adott URL-t megadva ellenőrizhetjük a webes vitals-mutatókat desktopon és mobilon, és itt a konkrét javítanivalók listáját is megkapjuk. Ha már van elegendő forgalmunk, akkor a Google Search Console-ban (a Felhasználói élmény > Alapvető webes vitals-mutatók fülön) is ellenőrizhetjük, hogyan teljesítenek az oldalaink.

A fejlesztés során ügyelünk az optimalizált kódra, amiben nem lesz semmi, ami felesleges vagy nem oda való, ha pedig az adott oldalt a saját tárhelyünkön is hostoljuk, még több ráhatásunk van, hogy az adott funkcionalitású honlap a lehető legjobb teljesítményt nyújtsa.

Szemantikus HTML

Míg a weboldalak felépítése, elemeinek hierarchiája és jelentése a humán látogatók számára egyértelmű és intuitív lehet anélkül is, hogy látnánk magát a kódot, a HTML címkék a gépek számára könnyítik meg ugyanezeknek a megértését. A szemantikus HTML az akadálymentes weboldalak egyik fő ismertetőjegye is!

A gépeket a HTML címkék informálják, hogy egy adott szövegrész H1–H6 címsor, bekezdés vagy épp képaláírás, vagy hogy egy oldalelem funkciója a navigáció, a lábléc része-e, vagy a fő tartalmi rész szerves eleme, esetleg ahhoz lazán kapcsolódó, kiegészítő információ. 

Ha a megfelelő HTML5-elemeket használjuk az oldalaink egyes részeihez, az segít a keresőmotoroknak és a képernyőolvasóknak az oldalvázlat megértésében. 

A helyes HTML elemekben való elhelyezéssel segítjük a gépeket annak értelmezésében, hogy mi is az oldalunk valódi témája, melyek a legrelevánsabb és legfontosabb elemei, és az egyes elemek hogyan viszonyulnak egymáshoz.

Amit általában könnyű az admin felületen, kódolási tudás nélkül javítani, az a címsorszerkezet. Gondoskodjunk róla, hogy a tartalom címe <h1> elem legyen (Heading 1, címsor 1), az alcímek pedig sorrendben kövessék egymást, logikusan tagolva a szöveget, vagyis az 1. szintű címsort 2. szintű címsorok kövessék; ha pedig a 2. szintű címsorok alatti tartalmat további alcímekre kell tagolni, akkor azok 3. szintű címsorok legyenek stb.

Ez a honlapjainkon használt WYSIWYG tartalomszerkesztőben olyan egyszerű, mint egy szövegszerkesztőben:

A CKEditor eszköztára

Feltérképezhetőség és indexelési állapot

Úgy építjük meg a honlapjainkat, hogy a robotok biztosan be tudják járni rajta az összes linket, és XML oldaltérképet is állítunk be, hogy ezzel is elősegítsük az oldalak mielőbbi indexelését.

Ezenkívül egy alap, a domain.hu/robots.txt címen elérhető robots.txt fájlt is hozzáadunk minden site-hoz, és publikáláskor meggyőződünk róla, hogy ebben a fájlban is engedélyezve van a honlap feltérképezése. A robots.txt fájlt kérésre bármikor módosítjuk, bővítjük a honlap tulajdonosainak igényei szerint. 

A feltérképezési és indexelési állapotot egyébként a Google Search Console-ban az Index > Lefedettség fülön, vagy akár egy site:domain.hu Google-kereséssel (ahol a domain.hu rész helyére a saját domainnevünk kerül) lehet ellenőrizni. 

Annak az ellenőrzésére pedig, hogy tökéletesen bejárhatók a website-unk linkjei, használhatjuk a Screaming Frog SEO Spider nevű eszközét, amelynek az ingyenes verziójával 500 URL-ig feltérképezhetjük a webhelyünket. Többek között megnézhetjük, melyik oldalunkra hány link mutat és melyik oldalakról, milyen linkszöveggel; felderíthetjük a törött linkeket (amelyek nemlétező oldalakra mutatnak), illetve az átirányításokat; egyetlen jelentésben láthatjuk az oldalakhoz tartozó 1. és 2. szintű címsorokat, page title-öket, metaleírásokat, stb. A fizetős verzióban rengeteg haladó konfigurációs lehetőséget találunk, a bot típusának meghatározásától a javascriptes renderelés beállításáig.

A humán látogatók számára a navigációval lehet megkönnyíteni az oldal feltérképezését, ezért fontos, hogy a webhely kezelői szabadon tudják szerkeszteni, optimalizálni a menüt. A honlapjainkon a „Menüpontot hoz létre” jelölőnégyzet bepipálásával, a menüpont nevének megadásával és – ha egy már létező menüpont almenüpontjának szánjuk – a szülő elem kiválasztásával egyszerűen hozzáadhatjuk bármelyik oldalt a menühöz, főmenüpontként vagy almenüpontként.

Menübeállítások: menüpontot hoz létre csúszka, menüpont neve, szülő hivatkozás, súly

Jól olvasható URL-ek

A jól olvasható, jól formázott, értelmes URL-ek már az oldal meglátogatása előtt elárulják a felhasználóknak, hogy miről szól az adott oldal, hogy az az oldal hol helyezkedik el a website szerkezetében, és akkor is sokat segítenek, ha egy másik webhelyről úgy linkelnek a webhelyünkre, hogy pusztán az URL-t jelenítik meg.  

Honlapjainkon az oldalak URL-je (pontosabban az URL domainnév utáni része, a „slug”) alapértelmezetten automatikusan generálódik abból, ahogyan az adott oldalt elnevezzük.

Ha az automatikusan generált címet valamilyen szempontból nem tartja optimálisnak a webhely tulajdonosa vagy kezelője, akkor megváltoztathatja az oldal szerkesztésekor, a jobb oldali oldalsávban található a Webcímálnév lenyílóban.

Egyszerűen kikapcsolja az automatikus webcímálnév létrehozását, majd a Webcímálnév mezőbe beírja az URL domainnév utáni részét:

Automatikusan hoz létre webcímálneveket csúszka, webcímálnév mező

Átirányítások

A honlapokon időnként érdemes ellenőrizni (pl. a fentebb említett Screaming Frog-féle SEO Spider nevű eszközzel), hogy nincsenek-e törött linkek, vagyis olyan linkek, amelyek nemlétező oldalakra mutatnak. Mivel ezek érthetően rontják a felhasználói élményt, ezért, különösen nagy mennyiségben, hatással lehetnek a helyezésekre is.

Törött linkekhez vezethet, ha egy oldalt megszüntetünk, vagy valamilyen okból feltétlenül meg kell változtatnunk az URL-jét. Az első esetben nem feltétlenül, de általában indokolt egy másik oldalra való átirányítás, az utóbbi esetben pedig feltétlenül javasolt.

Az oldalainkon az URL megváltoztatásával automatikusan létrejön az új URL-re való átirányítás beállítása. Vagyis ha megváltoztatja a webhely kezelője egy oldal URL-jét, akkor azok a látogatók, akik a régi URL-t kísérlik meg felkeresni, automatikusan az új URL-en landolnak.

A megszűnő oldalak esetében is könnyen beállítható helyettesítő oldal, ha indokoltnak és értelemszerűnek látja a webhely szerkesztője. A Webcím-átirányítás hozzáadása gombra kattintva hozzáadhatja a megszűnt URL-t egy másik oldalhoz, amelyre terelni szeretné a régi URL felkeresését megkísérlő látogatókat. 

webcímátirányítások lenyíló, új hozzáadása gombbal

XML és HTML oldaltérkép

A weboldalainkat egy működő XML oldaltérképpel adjuk át, amelynek az alapbeállítását is elvégezzük. Az XML oldaltérkép a domain.hu/sitemap.xml címen lesz elérhető.

Az alapértelmezett beállítású oldaltérképen minden oldal szerepelni fog (a további optimalizálásában is tudunk segíteni), és automatikusan frissül, azaz minden, újonnan hozzáadott oldal fel fog kerülni rá. Az alapbeállítást szabadon felülbírálhatják és módosíthatják a honlap kezelői az egyes oldalak szerkesztőfelületén, az oldalsávban található XML sitemap lenyílóban.

Oldal megjeleAlapértelmezett oldaltérkép-beállítások módosítása: rajta legyen-e, fontosság, gyakoriság, képek beleértése

Minden oldal szerkesztésekor, az oldalsávban ellenőrizhető, hogy az adott oldal megjelenik-e az XML sitemapen. Ha az adott oldalt a webhely tulajdonosa nem találja jó minőségű céloldalnak, ezt jelezheti a keresőrobotoknak is úgy, hogy egy egyszerű lenyíló lista segítségével kizárja az oldaltérképről. A sitemap.xml fájl hozzájárulhat ahhoz is, hogy gyorsabban feltérképezzék és indexeljék az oldalainkat a robotok.

Az XML oldaltérkép különösen nagy (több ezer oldalt tartalmazó), és/vagy mély linkszerkezetű, és/vagy gyakran bővített, frissített tartalmú, és/vagy árvaoldalakat (semelyik oldalról sem linkelt oldalakat) tartalmazó website-ok esetén a legfontosabb, de egyéb esetekben sem árt. Az XML oldaltérképet érdemes a Google Search Console-ba is feltölteni.

A HTML oldaltérkép inkább a felhasználóknak szól: ez egy olyan oldal a honlapon, ahol az összes aloldal linkje megtalálható, általában vizuálisan, az elrendezéssel, pl. többszintű felsorolásos formával is segítve a szerkezet áttekintését.

Hreflang attribútum

Ha ugyanaz a tartalom több nyelven is megtalálható a site-on, akkor a hreflang HTML attribútummal jelezhetjük a Google számára, hogy milyen nyelveken létezik az adott tartalom, melyik tartalomnak melyik más oldalak milyen nyelvű fordításai.

A többnyelvű oldalaink kódjába automatikusan bekerül a hreflang attribútum, ezzel nincs külön teendő.

Az ellenőrzéséhez kattintsunk az oldalon jobb egérgombbal, válasszuk a „View page source” menüpontot, majd keressünk rá a „hreflang” szóra. Egy olyan tartalomnak a kódjában például, amelynek van magyar és spanyol verziója, kell találnunk egy ehhez hasonló részletet:

<link rel="alternate" hreflang="hu"
       href="https://domain.hu/oldal" />
<link rel="alternate" hreflang="es"
       href="https://domain.hu/es/pagina" />

A képek alt attribútuma

Ha valamilyen okból egy képet nem lehet megjeleníteni, akkor az alternatív szöveg jelenik meg helyette, illetve a képernyőolvasó programok is az alternatív szövegeket olvassák fel ott, ahol kép van a tartalomban. Nem mindig kell kitölteni (például díszítő funkciójú képekhez nem kell írni alternatív szöveget), de minden képnek kell hogy legyen alt attribútuma.

A honlapjainkon biztosan egyetlen kép sem marad alt attribútum nélkül: a képek feltöltésekor kötelező kitölteni az alternatív leírás mezőt, legalább egy üres idézőjelpárral ("").

Az alternatív szövegek ellenőrzése lehetséges akár egy böngészőbővítménnyel is (pl. a SEO Meta in 1 Clickkel), de úgy is lehet, hogy jobb egérgombbal kattintunk az oldalon, a felugró menüből kiválasztjuk a „View page source” menüpontot, majd Ctrl + F-fel rákeresünk: alt=. Legalább ennyinek: alt="" minden képnél szerepelnie kell – és bizonyos képeknél jó, ha ez ki is van töltve, nem pusztán az üres idézőjelek állnak itt.

Mobilbarát megjelenítés (reszponzív oldalak)

Ma már felhasználói alapelvárás (és rangsorolási tényező is), hogy minden oldalnak minden kijelzőméreten tökéletesen használhatónak kell lennie.

A Prompt.hu egyik oldalának desktopos és mobilos megjelenítése

Természetesen mi is gondoskodunk a reszponzivitásról: akár sablon, akár egyedi dizájn alapján dolgozunk, a kompatibilitás érdekében a weboldalainkat alaposan teszteljük a népszerű mobileszközökön: iPhone-on, iPaden, Android okostelefonokon és táblagépeken is.

A reszponzivitás tesztelésére a Google is kínál egy eszközt, a Mobilbarát teszt oldalt, de a Search Console-ban is van szekciója a mobilos használhatóságnak (Felhasználói élmény > Mobilos használhatóság).

Szerkeszthető metajelölők (oldalcím, metaleírás, noindex...)

Az oldalcím, azaz a <title> HTML elem értéke lesz a Google találati listán a nagy, kék, kattintható szöveg, illetve ez jelenik meg a böngészőben a fülön is:

oldalcím a Google találati listán

 

oldalcím a böngészőben a fülön

A metaleírás (meta description) az az „ízelítőszöveg”, amely a Google találati listán a nagy, kék, kattintható szöveg alatt megjelenik.

metaleírás a Google találati listán

Közvetlen rangsorolási szerepe nincs, ám nagyban befolyásolhatja, hogy az oldalunkra kattintanak-e a felhasználók, ezért fontos, hogy az oldal kezelői tudják szerkeszteni.

A honlapjainkon minden létrehozott oldalnak lesz alapértelmezett oldalcíme, így biztosan egyetlen oldal sem marad <title> nélkül. Az alapértelmezett oldalcím az adott oldal első szintű címsorából (címsor 1, Heading 1, a HTML-ben a <h1> elem) és a honlap nevéből generálódik automatikusan, és ilyen felépítésű lesz:

Oldalcím | Honlapnév

 – ezt az automatikusan létrehozott oldalcímet felül lehet írni az adott oldal szerkesztésekor, az oldalsávban, a Metacímkék lenyílóban. Ugyanitt lehet beírni a metaleírásba szánt szöveget is. Ezekhez a mezőkhöz karakterszámlálót is adunk:

Oldalcím és metaleírás mezők

Egyszerű jelölőnégyzetekkel szintén a Metacímkék lenyílóban állíthatjuk be a noindex és a nofollow meta robots címkéket:

Noindex, nofollow jelölőnégyzetek

Ugyancsak a Metacímkék részben adhatjuk meg az Open Graph metacímkéket, vagyis azt, hogy hogyan szeretnénk megjeleníteni az oldalt a Facebookon és a Twitteren posztként megosztva: meghatározhatunk például egy alternatív honlapnevet, oldalcímet, leírást, és azt is megadhatjuk, melyik képet szeretnénk a poszthoz megjeleníteni.

+ 1: A teljesítmény mérése

A honlapokat minden esetben a látogatottság mérését lehetővé tevő Google CímkekezelőGoogle Analytics és Google Search Console telepítésével, illetve alapkonfigurálásával adjuk át.

 

Keresőoptimalizált webhelyet szeretnék!