SEO chat - optimalizácia pre Slovensko

[dulius]

teda: klasicky nadpis najvyssej urovne je samozrejme h1 ...

takze <h1>nadpis</h1>

otazka, moze byt ako nadpis obrazok ? cize napr.:

Kód: Vybrať všetko

<h1><img src="obrazok.gif" alt="popis" /></h1>

je to vobec pripustne ?

pytam sa preto, ze robim jeden web a tam budu sekcie oznacene nadpismi, ale tie nadpisy su krasnym ozdobnym pismom, teda klasicky cez text ich nespravim, len cez obrazok ... a zasa viem, ze na stranke, podstrankach by mali byt nadpisi h1, kvoli optimalizacii ...

preto ich tam chcem mat ... ak by som nemusel, tak to dam len: <img src="obrazok.gif" alt="popis" />

ak to nie je pripustne z hladiska vyhladavacov, je pripustne take nieco ? :

Kód: Vybrať všetko

<h1 style="display: none">Nadpis</h1>

proste bude tam obrazok, na nom peknym fontom nadpis a prekryjem to nadpisom h1, ktory nedam viditelny ...

[fidelis]

ano je to pripustne ale v alt-e musi byt to iste co na obrazku (myslim text)
to prve je lepsie riesenie ako to druhe

[lukas]

CSS riesenie typu <h1>Nadpis<span></span></h1> kde span je v podstate ten obrazok, ktory prekryje text a ten text sa pomocou text-indent: -9999px posunie mimo je spravne ? ako sa stavia k tomu Google ? je lepsie pouzit toto riesenie, ktore som opisal alebo tam radsej vlozit <img src="" alt="" /> ?

[fidelis]

CSS riesenie typu <h1>Nadpis<span></span></h1> kde span je v podstate ten obrazok, ktory prekryje text a ten text sa pomocou text-indent: -9999px posunie mimo je spravne ? ako sa stavia k tomu Google ? je lepsie pouzit toto riesenie, ktore som opisal alebo tam radsej vlozit <img src="" alt="" /> ?

skryvat textovu alternativu mimo obrazovku pomocou minusoveho pozicovania moze byt penalizovane, alebo pochopene ako podsuvanie ineho obsahu vyhladavacom a ineho pouzivatelom
preto je lepsie bud text prekryt obrazkom pomocou absolutnej pozicie, alebo (podla mna najlepsie) pouzit klasicky image s alt atributom
oba postupy su pripustne
ale mne sa osvedcilo a myslim, ze je korektnejsie pouzivat postup s klasickym imageom ktory ma alternativny popisok teda tag "img" s atributom "alt" ktory obsahuje relevantnu textovu alternativu k obrazku
najdu sa tu na fore ludia, ktori ti odporucia prekryvanie textu obrazkom je to rozne oba su ok len mne sa viac paci ten prvy sposob

Vyhody obrazku s altom:
- obrazok sa zobrazi aj pri vypnutych styloch - CSS, teda aj v zastaralych prehliadacoch
- obrazok sa ohlasi pouzivatelom citacov obrazovky teda dostanu informaciu, ze dany objekt je grafika
- obrazok sa da aj vytlacit

Vyhody prekryvania textu obrazkom:
- mozes aplikovat viac dizajnovych variacii na identicky dokument
- ak niekoho grafika rozptyluje, moze vypnutim stylov vypnut zaroven aj zopbrazovanie obrazkov a dostane cisto textovy subor
- pouzivatelov citaciek obrazovky nezdrzujes hlaskou: "grafika"

takze je to na tebe co si vyberies ani jedno nie je horsie ani lepsie ako to druhe

[dulius]

Dakujem, takze pre upresnenie, je toto absolutne OK z hladiska SEO ?

Kód: Vybrať všetko

<h1><img src="kontakt.gif" alt="Kontakt" /></h1>

kde na obrazku kontakt.gif je okrasnym pismom napisane Kontakt

[fidelis]

Dakujem, takze pre upresnenie, je toto absolutne OK z hladiska SEO ?

Kód: Vybrať všetko

<h1><img src="kontakt.gif" alt="Kontakt" /></h1>

kde na obrazku kontakt.gif je okrasnym pismom napisane Kontakt

Ano je to uplne super aj z hladiska SEO aj z hladiska pristupnosti len tak dalej drzim palce a prajem vysoke pozoicie a navstevnost a tiez zisky

[vlado]

Pravidelne pouzivam spomenutu metodu s img a alt a zatial vysoka spokojnost, ziadne penalizacie ani abnormality...

[indiana]

Nie je to dobre.
Definuj nadpis cez obrazok v CSS.

[vlado]

Nie je to dobre.
Definuj nadpis cez obrazok v CSS.

Dokaz, dovody....

[Lier]

No kludne môžeš tam dat obrazok, ale ja som zastanca textu, ale to je jedno. Obrazok a alt. CSS nie . Prečítaj si: http://tutorialdog.com/create-seo-frien ... s-headers/

[tybi]

:) No kludne môžeš tam dat obrazok, ale ja som zastanca textu, ale to je jedno. Obrazok a alt. CSS nie . Prečítaj si: http://tutorialdog.com/create-seo-frien ... s-headers/

Takže prečo nie CSS? Článok, na ktorý odkazuješ, hovorí presne o skrývaní textu pomocou CSS.

[lukas]

Podla mna moze byt aj CSS, ale predstav si situaciu, ze mas obrazok, ktory je priehladne PNG a pod nim budes mat text, ktory bude cez ten obrazok vidno tak pouzijes text-indent: -9999px a vyhladavac ti na to pride, ze je to neviditelny text a bude to pokladat za spam(aspon myslim), ale dalsia vec sa tyka pristupnosti ak niekto bude mat vypnute zobrazovanie obrazkov tak neuvidi nic. Inak to je ked obrazok nie je priehladny vtedy nemusis pouzit text-indent: -9999px a vsetko by malo byt okay.

[Dmagician]

lukas.. naco davat nejake negativne indenty v <h1> a neviem co este..

staci to napriklad napisat takto

<h1 id="toto-je-header-kery-bude-mat-v-backgrounde-obrazok-a-text-v-spane-bude-display-none><span>tvoj text</span></h1>

roman

[shaggy]

Dmagician, to nie je najšťastnejšie riešenie - ak vypneš obrázky, tak text nebude vidieť. A problém s tým môžu mať aj zrakovo postihnutí (kvôli ktorým sa tam ten text pridáva), ich čítačky nemusia ten text prečítať.

Dá sa to riešiť ale podobným spôsobom, tak som to urobil napr. tu:
http://www.johnnycash.sk/

pozrite si zdrojový kód k "logu" a k menu (nechce sa mi to vypisovať, je toho dosť). Myslím, že to každý pochopí.

[tybi]

Len aby bolo Duliusovi jasno, pretože už sa to znovu začína preberať: www-motoresthamor-sk-prosim-ohodnotit-t558/#p3587

Z pohľadu vyhľadávačov je momentálne rozdiel medzi <h1>Text</h1> vs. <h1><img src="" alt="Text"></h1> naozaj minimálny.

Alternatívny text sa berie ako skoro (alebo možno už aj ako) plnohodnotný text. Vyhľadávače to jednoducho tak brať musia, ak sa to používa. Bohvie, čo bude v budúcnosti...

Dmagician to však nazval, "že to hraničí so zdravým rozumom" a niekde má pravdu. Je to niečo, ako keby si chcel z ryby urobiť jeleňa. Nadpis je nadpis, obrázok je obrázok, nadpis nemôže byť obrázkom, ale obrázok môže byť nadpisom? Nadpis sa píše, nie maľuje, je to priamo v tom slove.

Vždy by som volil klasický textový nadpis, potom CSS image replacement a nikdy by som nedal: <h1><img src="" alt="Text"></h1>

Takže tí, čo ti radili, aby si to tak použil, majú pravdu v tom, že tým z pohľadu vyhľadávačov nič-moč nepokazíš . Tí, čo hovoria, že to hraničí so zdravým rozumom majú pravdu tiež.

[vlado]

http://www.w3.org

pozrite si kod a dajte si hladat id="logo"

Sli by proti sebe keby to nie je spravne, nie?
Jasne neda sa na tom zakladat, predtym som pouzival CSS replacement teraz pouzivam h1 a img s altom, obe funguju cca rovnako.

[Dmagician]

Dmagician, to nie je najšťastnejšie riešenie - ak vypneš obrázky, tak text nebude vidieť. A problém s tým môžu mať aj zrakovo postihnutí (kvôli ktorým sa tam ten text pridáva), ich čítačky nemusia ten text prečítať.pozrite si zdrojový kód k "logu" a k menu (nechce sa mi to vypisovať, je toho dosť). Myslím, že to každý pochopí.

To si testoval s tou citackou alebo len tipujes? Text odsunuty negativnym indentom je pri vypnutych obrazkoch vidiet?

Ked uz sme pri tom, tak je samozrejme najidealnejsie riesit to pixyho stylom, to jest <h1>toto je text<span id="prekryjeme-text-backgroundom-tohto-spanu</span></h1> (teda ak niekto nezacne zasa splietat nieco o transparentnych png

Dá sa to riešiť ale podobným spôsobom, tak som to urobil napr. tu:
http://www.johnnycash.sk/

jj, vyzera to ako pixy styl.. (teda aspon unho som to prvykrat videl (a odkukal)) pouzival som to volakey ale ma to velku reziu, keby som nutne zasa potreboval vlastny font uz radsej pouzijem sifr, cufon a podobne moderne riesenia.

roman

[Dmagician]

Len aby bolo Duliusovi jasno, pretože už sa to znovu začína preberať: www-motoresthamor-sk-prosim-ohodnotit-t558/#p3587

Z pohľadu vyhľadávačov je momentálne rozdiel medzi <h1>Text</h1> vs. <h1><img src="" alt="Text"></h1> naozaj minimálny.

Alternatívny text sa berie ako skoro (alebo možno už aj ako) plnohodnotný text. Vyhľadávače to jednoducho tak brať musia, ak sa to používa. Bohvie, čo bude v budúcnosti...

Dmagician to však nazval, "že to hraničí so zdravým rozumom" a niekde má pravdu. Je to niečo, ako keby si chcel z ryby urobiť jeleňa. Nadpis je nadpis, obrázok je obrázok, nadpis nemôže byť obrázkom, ale obrázok môže byť nadpisom? Nadpis sa píše, nie maľuje, je to priamo v tom slove.

Vždy by som volil klasický textový nadpis, potom CSS image replacement a nikdy by som nedal: <h1><img src="" alt="Text"></h1>

Takže tí, čo ti radili, aby si to tak použil, majú pravdu v tom, že tým z pohľadu vyhľadávačov nič-moč nepokazíš . Tí, čo hovoria, že to hraničí so zdravým rozumom majú pravdu tiež.

Tybi diky ze si to takto zrozumitelne vysvetlil. Ja to slovo semantika ktore sa volakedy v ere fanatickeho presadzovania validneho xhtml ci html omielalo stale dokola nemam velmi rad (podbne ako nemam rad vyrazy ako "w3c valid xhtml transitional" a podobne , ale v tomto pripade to sedi.

Jednoducho kazda znacka ma svoj vyznam. IMG sluzi na zobrazenie grafiky (obrazku, ilustracie, fotky, a pod) a jeho atribut "alt" sluzi na popisanie obsahu tej grafiky, h1 sluzi na nadpisy a jeho obsahom by prirodzene mal byt text. Ak uz vyhladavac obrazok v h1 zoberie vdaka altu ako text a neodignoruje ho, je to skor "vynimka" ktoru si vyziadala prax, a nie nejaky odporucany sposob prace s nadpisom. Ak uz je silou mocou treba do h1 davat nejake vlastne fonty a podobne, je idealnejsie pouzit nejaku javascript vrstvu.

V pripade pouzitia obrazku v h1 je sa tiez treba zamysliet ci ta grafika obsahuje naozaj taky dolezity text aby bol v h1. Typickym prikladom je pouzivanie h1 v logach a sloganoch .. tiez som to tak predtym robil, ale je to hlupost, logo ci slogan predsa nie je nadpis stranky, je to nadpis celeho webu ktory sa dokola opakuje, a nie je potrebne ani nutne mu pridavat na vahe tym ze ho dame do relativne najsilnejsej znacky.

[tybi]

http://www.w3.org

pozrite si kod a dajte si hladat id="logo"

Sli by proti sebe keby to nie je spravne, nie?
Jasne neda sa na tom zakladat, predtym som pouzival CSS replacement teraz pouzivam h1 a img s altom, obe funguju cca rovnako.

Stránky w3.org, ktoré oznamovali pravidlá prístupnosti, boli dlhú dobu nepoužiteľné a vytýkalo sa im to, veľmi. To, že W3.org mali slabú použiteľnosť web stránok znamená, že by sme ich slabú použiteľnosť mali opakovať? Nie je to tento prípad, len chcem povedať, že toto nemôže byť argument.

Myslím, že som to zhrnul celkom dobre... Nič svetoborného sa nedeje, či sa použije jedno alebo druhé, ale to H1-img-alt-/H1 ide naozaj proti logike.

[shaggy]

Dmagician - http://www.pravidla-pristupnosti.cz/17.php

Pro skrývání však není vhodné používat předpis display:none ani visibility:hidden, protože takto skrytý text nejsou schopna některá pomocná výstupní zařízení interpretovat.

Ale v tomto prípade by to mohlo fungovať, napr. JAWS by mal čítať text, ktorý sa nachádza v spane a ten sa nachádza v odkaze a súčasne má display: none (osobne som toto neskúšal, čítal som to niekde... narýchlo som to našiel iba v tomto článku - http://juicystudio.com/article/screen-r ... y-none.php).

A áno, to čo mám na johnnycash.sk je myslím od pixyho (ak si dobre pamätám, jemu som to "ukradol").

[fidelis]

Dmagician - http://www.pravidla-pristupnosti.cz/17.php

Pro skrývání však není vhodné používat předpis display:none ani visibility:hidden, protože takto skrytý text nejsou schopna některá pomocná výstupní zařízení interpretovat.

Ale v tomto prípade by to mohlo fungovať, napr. JAWS by mal čítať text, ktorý sa nachádza v spane a ten sa nachádza v odkaze a súčasne má display: none (osobne som toto neskúšal, čítal som to niekde... narýchlo som to našiel iba v tomto článku - http://juicystudio.com/article/screen-r ... y-none.php).

A áno, to čo mám na johnnycash.sk je myslím od pixyho (ak si dobre pamätám, jemu som to "ukradol").

Dakujem ti Shaggy v mene vsetkych zrakovo postihnutych, ze aj nas sa zastavas. Myslim to vazne nerobim si srandu. Naozaj si ma potesil. Ano dispaly: none nie je naj riesenie lepsie je pixyho ale ako som uz spomenul vyssie ja ho nepouzivam kvoli tlaciarnam napriklad a tie pokial viem pouzivaju najma vidiaci

[Dmagician]

logo napriklad nie je dekoracia je to pokial viem sucast firemnej identity a malo by sa dat aj na papier z webu vytlacit

bez debaty, ja netvrdím, že logo nemá byť obrázok. Hovorím ale, že je zbytočné dávať do H1 logo a slogan (opakuj[ce sa na každej stránke), že do H1 má ísť nadpis ktorý je pre každú stránku špecifický. Ak hot tam nedáš, tak H1 prakticky stráca zmysel.. tentokrat sa ti zatmelo pred očami skôr ako si môj text dočítal. Klíííd.

[Dmagician]

Dmagician - http://www.pravidla-pristupnosti.cz/17.php

Pro skrývání však není vhodné používat předpis display:none ani visibility:hidden, protože takto skrytý text nejsou schopna některá pomocná výstupní zařízení interpretovat.

Ale v tomto prípade by to mohlo fungovať, napr. JAWS by mal čítať text, ktorý sa nachádza v spane a ten sa nachádza v odkaze a súčasne má display: none (osobne som toto neskúšal, čítal som to niekde... narýchlo som to našiel iba v tomto článku - http://juicystudio.com/article/screen-r ... y-none.php).

A áno, to čo mám na johnnycash.sk je myslím od pixyho (ak si dobre pamätám, jemu som to "ukradol").

Osobne si myslím, že čítačka ktorá zohľadňuje pri čítaní textu na stránke CSS je pokazená. Nezaoberám sa touto problematikou takže to nemôžem otestovať, ale osobne som presvedčený, že každá čítačka dokáže prečítať text ktorý je obsahom tagu (akokoľvek je CSSkom upravený, či skrytý).Čo sa týka pomocných zariadení, osobne si myslím,že tam skôr ide o zariadenia zorbazovacie ktoré nezobrazia ani obrázok ani text správne. Teda ako si už predtým spomínal.. pri vypnutých obrázkocha zapnutých štýloch človek nič neuvidí, což je zle.

[indiana]

Na smashingmagazine je myslím najjednoduchšie riešenie problému, ktoré sám používam.
http://www.smashingmagazine.com/2009/03 ... on-images/ časť CSS Font Replacement. Komu by to nestačilo, nájde tam hneď link na článok s 9 techikami ako vyriešiť tento problém, ktoré bohužiaľ zdajú sa byť všetky nedokonalé ...

[fidelis]

Dmagician - http://www.pravidla-pristupnosti.cz/17.php

Pro skrývání však není vhodné používat předpis display:none ani visibility:hidden, protože takto skrytý text nejsou schopna některá pomocná výstupní zařízení interpretovat.

Ale v tomto prípade by to mohlo fungovať, napr. JAWS by mal čítať text, ktorý sa nachádza v spane a ten sa nachádza v odkaze a súčasne má display: none (osobne som toto neskúšal, čítal som to niekde... narýchlo som to našiel iba v tomto článku - http://juicystudio.com/article/screen-r ... y-none.php).

A áno, to čo mám na johnnycash.sk je myslím od pixyho (ak si dobre pamätám, jemu som to "ukradol").

Osobne si myslím, že čítačka ktorá zohľadňuje pri čítaní textu na stránke CSS je pokazená. Nezaoberám sa touto problematikou takže to nemôžem otestovať, ale osobne som presvedčený, že každá čítačka dokáže prečítať text ktorý je obsahom tagu (akokoľvek je CSSkom upravený, či skrytý).Čo sa týka pomocných zariadení, osobne si myslím,že tam skôr ide o zariadenia zorbazovacie ktoré nezobrazia ani obrázok ani text správne. Teda ako si už predtým spomínal.. pri vypnutých obrázkocha zapnutých štýloch človek nič neuvidí, což je zle.

nie nie je pokazena ))
prave naopak aj tvorcovia citaciek obrazovky sa snazia svojim pouzivatelom aspon z casti dopriat variabilitu interpretacie daneho obsahu nie samozrejme vizualne
aj citacky napriklad JAWS zohladnuje CSS a preto ak das display: none dany objekt bude ignorovat akoby tam ani nebol
aj v citacke sa daju nastavit rozne hlasy vyska sila atd proste styly
ved existuju v typoch medii uz CSS 2.0 pozna media "aural, speech" a o co ide no predsa o zvukove syntezy teda text-to-speech software
ano nevidiaci si styly moze vypnut ale tak ako to nevie ani kazdy vidiaci vo svojom prehliadaci urobit tak ani kazdy nevidiaci surfer to nevie a okrem toho citacka obrazovky pracuje so strankou zobrazovanou v stnadardnom grafickom prehliadaci a preto sa snazi co najvernejsie odinterpretovat to a len to, co je zobrazene aj vizualne