Ez igy igaz, de ez is egy modszer! 🙂
Accessibility és SEO: alternatív szövegek
Írta: Hutchington | 2008. december 01. | kategóriák: (X)HTML, CSS, SEO, WebA probléma
Egy weboldal grafikai tervezésénél, ha a SEO és Accessibility szempotokat is figyelembe veszünk, nem használunk olyan szöveges elemeket, melyeket majd képként kell megjelentíteni. Nem használunk például élsimítást a szöveghez, hogy az a valóságban is szövegként (pl: <h1>Lorem Ipsum</h1>) jelenhessen meg.
Ez azért fontos, ha a keresők ráfutnak az oldalra, akkor a hasonló elemeket valóban szövegnek ismerje fel, mert ugye ha az egy kép (főleg alternatív szöveg hiányában), akkor nem “látja”. Mitöbb a látássérülteknek készült olvasóprogramok sem tudják megfelelően kezelni, magyarán nem tudja felolvasni a látássérült ember számára.
Ám nem mindíg tudjuk elkerülni ezek használatát, például egy a fejlécben levő logó esetében.
A megoldás
Elfogadott megoldás a text-indent CSS tulajdonság használata ennek megoldására.
A következő példáben egy képzeletbeli cég logóját fogjuk ezzel a módszerrel felhelyezni a weboldalára.
A text-indent CSS tulajdonság
Ezzel a tulajdonsággal a tömbszerű elemekben levő tartalom első sorának behúzását lehet megadni. Leggyakrabban tabulátorhatás keltésére használják.
Megadható hosszérték, százalékérték, és öröklés. Alapértéke: 0
(forrás: O’REILLY – CSS zsebkönyv)
A trükk lényege hogy beleírjuk egy h1 tag-be a cég nevét, és CSS-ben megadjuk a hátterét – ami a cég logója lesz – majd a text-indent tulajdonsággal a beleírt szöveget mínusz értékkel kitoljuk a megjeleníthető területről.
Régebben hallottam, hogy az ilyesfajat, látható területről való szövegkitolást a keresők nem szeretik. Pontosabban büntetéseket adnak az alkalmazó weboldalnak… De lehet ez csak mítosz… 🙂
Jobban belegondolva, példaként azt hiszem azt hozták, hogy keresőszavak garmadáját helyezik el így kitolva a honlap már nem látható részére, vagy háttérrel azonos színű betűvel írják ki, esetleg z-index… Így a látogatót nem zavarja, kereső meg azt látja, hogy minden oldalon desokmindent írnak ezekkel a szavakkal… Csak hát az okosabb böngészők állítólag kiszúrják a turpisságot…
Erre vannak egyébként a text-indentnél elegánsabb megoldások is, de kétségtelenül ez a leggyorsabb, és a legegyszerűbb 🙂