Tweakblogs.net

SEO vriendelijke klikbare div's

Anoniem: 173717 — Tue, 12 Oct 2010 09:27:09 GMT

Crisp heeft gelijk. Block in inline is ok in HTML5. Erg handig!

SEO vriendelijke klikbare div's

Booster — Tue, 12 Oct 2010 09:19:02 GMT

Op het gebied van SEO kan ik je afraden om dit soort anchor teksten te gebruiken: code:1 Lees meer >Anchor text helps users and search engines understand what page you’re linking to is about, and should be short, descriptive and on-topic. Bad = “click here” or “read more” Good = “The previous article in this series gave an introduction to SEO.”

SEO vriendelijke klikbare div's

ReneDx — Tue, 12 Oct 2010 08:02:37 GMT

-RetroX- schreef op dinsdag 12 oktober 2010 @ 09:50: ... ReneDx heeft post aangepast. Reactie hierop niet meer relevant ...Die was al niet relevant hè Vroeg enkel wat er mis is met deze (veel gebruikte) methode. Maar crisp punt is inderdaad ook een goeie.

SEO vriendelijke klikbare div's

-RetroX- — Tue, 12 Oct 2010 07:50:51 GMT

... ReneDx heeft post aangepast. Reactie hierop niet meer relevant ... (@ReneDx: je vroeg om wat is er mis is met een bepaald voorbeeld. Je kan daarover best discusieren. Later heb je de uitleg bijgevoegd waardoor de hele strekking van de post veranderd.) Gebruik van HTML5 kan ook. Wel is aan te raden dan de juiste elementen te gebruiken. Er zijn heel wat mooiere elementjes die je kan gebruiken ipv strong en em. Als je toch bezig bent met SEO dan zou je dit meteen mee moeten nemen.

SEO vriendelijke klikbare div's

crisp — Tue, 12 Oct 2010 07:50:35 GMT

Pas je doctype aan; blocklevel elementen in een zijn in HTML5 gewoon toegestaan

SEO vriendelijke klikbare div's

ReneDx — Tue, 12 Oct 2010 07:36:22 GMT

Wat is er mis met de volgende methode?; code:1 2 3 4 Title Description Breed gebruikt. Ik ben een groot fan van JavaScript, maak er dan ook van alles in, maar ben altijd van mening geweest dat je CSS en (X)HTML de content as-is moet leveren. JavaScript laat je vervolgens de "extra's" regelen zoals effecten zover deze niet met CSS3 kunnen. Vooral in deze situatie kan ik het niet eens worden met het JavaScript gebruik. Het is gewoon niet netjes naar mijn mening..

SEO vriendelijke klikbare div's

-RetroX- — Tue, 12 Oct 2010 06:43:40 GMT

Er zijn genoeg textreaders en SEO checkers in omloop om te zien wat wel en niet meegenomen wordt vanuit je code. Google neemt ook je JS en CSS files mee die je aanroept vanuit je html. Hoe de berekening dan gaat is aan google. De beste optie om te scoren in zoekmachines is degelijke content. Als je echt afhankelijk bent van optimalisatietrucs dan weet je dus ook dat je content beter kan. De gekozen oplossing is wel mooi. HTML voor de elementen, CSS voor opmaak, en JS voor de effecten. Of het volledig volgens standaard is... who cares? Ontwikkelaars die echt volgens standaarden ontwikkelen kiezen wel hun eigen methodes. Voor wie niet absoluut strict hoeft is dit echt een goede oplossing. (en wie nog trucs gaat toepassen om IE6 en IE7 browsers te ondersteunen zou opgeknoopt moeten worden.)

SEO vriendelijke klikbare div's

i-chat — Tue, 12 Oct 2010 06:13:55 GMT

joint_me schreef op maandag 11 oktober 2010 @ 22:11: [...] Voorzover ik het begrepen heb, leest een screenreader geen Javascript, daarom staat de link dan ook in de div als een standaard href. De Javascript haalt hem er alleen uit en plakt hem aan de div. Dus ik denk niet dat een screenreader hier problemen mee heeft.niet helemaal, het probleem is dat je je screnreader dus niet kunt vertrouwen, er zijn al een tijde screenreaders die zelfs met javascript proberen om te gaan, en dan zijn dit soort dingen JUIST niet handig. wat dan wel? - de titiel van je bron zegt het al 'no template' met andere woorden maak een bijna ouderwetse html versie van je pagina. gebruik webbased scripts voor dingen die je normaal in ajax zou doen. - en bovenalles schrijf html voor de gebruiker

SEO vriendelijke klikbare div's

RobIII — Mon, 11 Oct 2010 22:01:06 GMT

Waarom is dit geen optie? Er staat javascript direct in je code, dit gaat ten koste van tekst-code ratio beoordeling door een crawler.Tekst-code ratio? En sinds wanneer is dat interessant? Heb je een (gezaghebbende) bron?En een tekstreader zal in het beste geval de link lezen voordat de context behandeld is.En dus Lijkt me nou niet je grootste probleem (zie ACM's opmerking).en levert je waarschijnlijk minpunten op van de crawlerMinpunten? Het levert je hooguit niet méér "punten" op.Wat is dan wel een goede oplossing? Het antwoord is javascriptWat meteen je ding onklikbaar maakt voor mensen die geen JS gebruiken. Ik zie deze hele oplossing als eenzelfde oplossing als de target="_blank" niet gebruiken omdat 't niet W3C valid is en dus maar een JS omheen bakken zodat de code valideert... Daarmee hou je hooguit jezelf voor de gek.Het resultaat is * duidelijk en leesbare HTML. Een text-reader zal geen problemen hebben de tekst goed lezen, net zoals een crawler.Dat heb je in de andere twee gevallen ook (goed leesbaar en een crawler zal er geen moeite mee hebben). Hooguit het verschil van de onclick en de anchor in voorbeeld 1 en je oplossing zal wat verschil hebben; maar je vergeet een optie: je kan die anchor ook gewoon in de div mikken en met CSS hiden * Er staat geen onnodige Javascript in de Content, de verhouding text-code wordt hierdoor beter.Heel die verhouding is, IMHO, uit de lucht gegrepen onzin.Ook krijgt tekst in een link punten mee van google, we herinneren ons vast nog wel 'raar kapsel' op google.Wat in 1996 ofzo interessant was. Je weet dat Google om de paar maanden z'n algoritmes herziet? En dat er nog 1001 andere dingen meewegen? En dat je van Google HTML 'moet' schrijven voor gebruikers en niet voor zoekmachines? Je vergeet voor 't gemak ook even dat je (minimaal) 24Kb overhead op jQuery inlevert (want die zal toch geladen moeten worden (los van caching)) en dus ook nog een extra HTTP request (mits je jQuery zelf host). Gebruik je toch al jQuery en gebruik je (bijv.) de Google CDN dan is het nog andere koek, maar ik vind 't dus wat kort door de bocht.ACM schreef op maandag 11 oktober 2010 @ 22:22: [...] Vziw hebben daar gebruikers expliciet van gevraagd om het niet klikbaar te hebben... Wellicht ivm het niet ongebruikelijke gedrag om tekst aan te klikken die men leest.Juist!

SEO vriendelijke klikbare div's

Sebazzz — Mon, 11 Oct 2010 21:50:02 GMT

joint_me schreef op maandag 11 oktober 2010 @ 21:51: [...] Blijkbaar heb ik semantiek niet goed gebruikt volgens jou, jammer dan, volgende keer beter. Maar leg dan maar eens uit, zodat ik het de volgende keer wel goed gebruikt?Semantiek is niet iets van HTML, het is gewone taal. Zoek maar eens op in het Van Dale en je ziet dat 'semantiek' 'betekenis' betekent Dus de betekenis van elementen en attributen in deze context. Niet validatie.

SEO vriendelijke klikbare div's

veldmuis — Mon, 11 Oct 2010 20:40:32 GMT

joint_me schreef op maandag 11 oktober 2010 @ 22:16: [...] Die zal ik voor jouw aanpassen!Dat hoeft niet voor mijn.

SEO vriendelijke klikbare div's

ACM — Mon, 11 Oct 2010 20:22:19 GMT

joint_me schreef op maandag 11 oktober 2010 @ 22:11: Ik klik bijvoorbeeld vaak op de tekst bij "Reviews & Features" op de homepage en vind het dan jammer dat hij niet verder gaat. Of je moet op de titel klikken, of op de kleine pijltjes naast de tekst of de afbeelding, waarom dan niet op de tekst?Vziw hebben daar gebruikers expliciet van gevraagd om het niet klikbaar te hebben... Wellicht ivm het niet ongebruikelijke gedrag om tekst aan te klikken die men leest.

SEO vriendelijke klikbare div's

joint_me — Mon, 11 Oct 2010 20:16:09 GMT

veldmuis schreef op maandag 11 oktober 2010 @ 21:47: Over semantiek, SEO e.d. gesproken: een H1 voor een titel van een blok lijkt me niet handig.Die zal ik voor jou aanpassen!

SEO vriendelijke klikbare div's

joint_me — Mon, 11 Oct 2010 20:11:52 GMT

i-chat schreef op maandag 11 oktober 2010 @ 21:51: maar nu natuurlijk de grote vraag? waarom een klikbare div, wat is er zo bijzonder aan een klickable_div... als je een beetje pech hebt denkt je screenreader dat het hele ding een link is en maakt ie de boel blauw, heb je ooit wel eens met screenreaders gewerkt? zo neej doe dat dan eens ... dan is dit gelijk de laatste keer dat je ooit nog over klikbare divs hebt nagedacht...Als je een div klikbaar maakt, hoef je niet meer zo te mikken op 1 stukje tekst. Je kunt het gebruiken voor actieblokken, prijsblokken, opsommingen, etc. Ik klik bijvoorbeeld vaak op de tekst bij "Reviews & Features" op de homepage en vind het dan jammer dat hij niet verder gaat. Of je moet op de titel klikken, of op de kleine pijltjes naast de tekst of de afbeelding, waarom dan niet op de tekst? Voorzover ik het begrepen heb, leest een screenreader geen Javascript, daarom staat de link dan ook in de div als een standaard href. De Javascript haalt hem er alleen uit en plakt hem aan de div. Dus ik denk niet dat een screenreader hier problemen mee heeft.

SEO vriendelijke klikbare div's

i-chat — Mon, 11 Oct 2010 19:51:52 GMT

maar nu natuurlijk de grote vraag? waarom een klikbare div, wat is er zo bijzonder aan een klickable_div... als je een beetje pech hebt denkt je screenreader dat het hele ding een link is en maakt ie de boel blauw, heb je ooit wel eens met screenreaders gewerkt? zo neej doe dat dan eens ... dan is dit gelijk de laatste keer dat je ooit nog over klikbare divs hebt nagedacht...

SEO vriendelijke klikbare div's

joint_me — Mon, 11 Oct 2010 19:51:38 GMT

Sebazzz schreef op maandag 11 oktober 2010 @ 21:42: [...] Weet je wel wat semantiek betekent? Los hiervan, het is gewoon volgens de HTML specificatie niet toegestaan. Overigens zou ik qua usability zoiets niet doen, en als ik het zou doen dan zou ik hem ten minste een pointer cursor geven.Blijkbaar heb ik semantiek niet goed gebruikt volgens jou, jammer dan, volgende keer beter. Maar leg dan maar eens uit, zodat ik het de volgende keer wel goed gebruikt? Maar usability technisch gezien zou ik het juist wel gebruiken! IE browsers zijn nog steeds veel gebruikt en ondersteund tot en met IE7 geen :hover op div's. Met jQuery kan je makkelijk een class toevoegen. Wat je daaraan dan toewijst is aan jouw. JavaScript:1 2 3 4 5 6 7 8 9 $(this).hover(function () { $(this).addClass('hover'); }, function () { $(this).removeClass('hover'); }); $(this).click(function () { div_link = $(this).find('div.klikbare_div a').attr('href'); window.location = div_link; }); Maar dat beschrijf ik al in mijn stukje.

SEO vriendelijke klikbare div's

veldmuis — Mon, 11 Oct 2010 19:47:08 GMT

Volgens mij maak je een oplossing voor een probleem wat niet bestaat. Voor groep 1, de bezoekers met een 'gewone' browser, maak je iets wat anders reageert dan je mag verwachten. Over semantiek, SEO e.d. gesproken: een H1 voor een titel van een blok lijkt me niet handig.

SEO vriendelijke klikbare div's

plofkip — Mon, 11 Oct 2010 19:47:05 GMT

Sebazzz schreef op maandag 11 oktober 2010 @ 21:42: Overigens zou ik qua usability zoiets niet doen, en als ik het zou doen dan zou ik hem ten minste een pointer cursor geven.Dat doet ie natuurlijk via CSS en z'n 'klikbare_div'-class

SEO vriendelijke klikbare div's

AW_Bos — Mon, 11 Oct 2010 19:45:09 GMT

Geweldige tutorial.

SEO vriendelijke klikbare div's

Sebazzz — Mon, 11 Oct 2010 19:42:09 GMT

SEO vriendelijke klikbare div'sSearch Engine Optimalization vriendelijke klikbare div's? Je bedoeld search- en accessibility friendly clickable div's.Deze is niet veel beter, ten eerste staan er block elementen in een inline element. Dit is semantisch niet toegestaan en levert je waarschijnlijk minpunten op van de crawler.Weet je wel wat semantiek betekent? Los hiervan, het is gewoon volgens de HTML specificatie niet toegestaan. Overigens zou ik qua usability zoiets niet doen, en als ik het zou doen dan zou ik hem ten minste een pointer cursor geven.

SEO vriendelijke klikbare div's

MittaM — Mon, 11 Oct 2010 19:38:54 GMT

Interessant stukje code.