• Like
  • Save
Seo e HTML5
Upcoming SlideShare
Loading in...5
×
 

Seo e HTML5

on

  • 2,379 views

Palestra 'SEO e HTML5' ministrada na conferencia Web.br 2012, organizada pelo W3C Brasil no dia 19 de outubro de 2012.

Palestra 'SEO e HTML5' ministrada na conferencia Web.br 2012, organizada pelo W3C Brasil no dia 19 de outubro de 2012.

Statistics

Views

Total Views
2,379
Views on SlideShare
2,364
Embed Views
15

Actions

Likes
10
Downloads
52
Comments
0

2 Embeds 15

https://twitter.com 14
https://si0.twimg.com 1

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    Seo e HTML5 Seo e HTML5 Presentation Transcript

    • @GugaAlves• Analista de Sistemas• Pós Graduado em Gestão Estratégica de Marketing Digital• Professor de SEO do Instituto Infnet• Coordenador de Comunicação – ABRADI-RJ• Criador do TudoParaWordPress• Vencedor do 1 #DesafioSEO da MestreSeo
    • The Web has not seen this level of transformation, this level ofacceleration, in the past ten years. Were betting big on HTML5 Vic Gundotra VP of Engineering, Google
    • The world is moving to HTML5. Steve Jobs Apple
    • If you want to do something universal, there is no question, the world is going HTML5. That isclear...The world is just pushing down this HTML5 path and so are we. Steve Ballmer CEO Microsoft
    • In general, we work hard to understand as much of the web as possible, but I have a feeling that HTML5 markup is not yet as widely in use (and in use correctly) that it would make sense for us to use it as a means of understandingcontent better. As HTML5 gains in popularity and as we recognize specific markup elements that provide value to our indexing system, this is likely to change, but at the moment I would not assume that you would have an advantage by using HTML5 instead of older variants. John Mueller Webmasters Trends Analyst, Google
    • Atualmente, usamoselementos <div> paraorganizar e segmentode uma página web.Não temos umaorganizaçãosemântica quemostre com exatidãoqual bloco deconteúdo é referentea exatamente qualseção do site.
    • Uma vez o HTML5sendo maisamplamente adotado,mecanismos de buscapodem usar essesnovos elementos paraos ajudar a encontrarelementos da páginade seu interesse.
    • Microdata e HTML5
    • Microdados são um subconjunto deinformacões em um documento que tem um significado para as maquinas, robôs, assim como tem um significado para uma pessoa lendo o documento. Isto é, fornecermetadados de uma forma que pode ser usada por uma maquina e permitir que os dadossejam processados e exibidos de uma forma que atenda melhor o usuário.
    • Exemplo prático:http://www.tudoparawordpress.com.br/seo-wordpress/impacto-html-5-seo/
    • Breadcrumbs<p id="crumbs" itemscope itemtype="http://data-vocabulary.org/Breadcrumb"> <span itemprop="title"> <a itemprop="url" href="http://www.tudoparawordpress.com.br" rel="nofollow"> <span itemprop="title">Inicial</span></a> </span> » <span itemprop="child" itemscope itemtype="http://data-vocabulary.org/Breadcrumb"> <a itemprop="url" href="http://www.tudoparawordpress.com.br/seo-wordpress/"> <span itemprop="title">SEO</span> </a> </span> » <span itemprop="child" itemscope itemtype="http://data-vocabulary.org/Breadcrumb"> <strong class="current" itemprop="title">Qual impacto o HTML 5 pode ter em SEO?</strong> </span></p>
    • Marcação de Autor<aside itemscope itemtype="http://schema.org/Person"> <img alt="Guga Alves" src="guga-alves.jpg" class="avatar avatar-75 photo" height="75" width="75"> <div> <span class="vcard author"> <span class="fn"> <a itemprop="name" href="#">Guga Alves</a> </span> </span> <ul> <li><a href="#" class="tw">Twitter</a></li> <li><a href="#" class="fb">Facebook</a></li> <li><a href="#" class="in">Linkedin</a></li> <li><a href="#" rel="author" class="rss">Google+</a></li> <li><a href="mailto:#" class="mail" itemprop="email">Email</a></li> </ul> <p>Descrição do autor</p> </div></aside>
    • Ferramenta de teste de dados estruturados Breadcrumbs Perfil do Autor no Google+ http://www.google.com/webmasters/tools/richsnippets?hl=pt-BR
    • Como é interpretado pelo Googlebot?
    • Exemplo 2: Rating<div class="vote"> <p class="rating num-votes">Taxa de aprovação <span><span class="average">3.9</span>/5</span> Avaliações <span class="votes">31</span> </p> <p id="star"> <span>Avalie:</span> <a class="full" href="#"></a> <a class="full" href="#"></a> <a class="full" href="#"></a> <a href="#"></a> <a href="#"></a> </p></div>
    • Como é interpretado pelo Googlebot? Como é exibido para o usuário?
    • Mais informações no GWThttps://www.google.com/webmasters/tools/structured-data
    • https://developers.google.com/speed/
    • http://www.youtube.com/watch?v=6EJ801el-I8http://www.slideshare.net/souders/high-performance-html5-sf-html5-ug
    • E lembre-se dos dispositivos portáteis!
    • Resumindo:• Diversas melhorias na usabilidade e experiência do usuário.• Novas tags que ajudam a classificar o conteúdo de forma semântica.• Ótimas melhorias para manipulação de mídias (áudio e vídeo).• Precisa comparar com Flash e Silverlight? EPIC WIN!• SEO-friendly se pensarmos rastreamento e indexação de site.• Uso crescente em aplicativos móveis e jogos.
    • HTML5 + CSS3 + Javascript = Semântica + Interatividade + Encontrabilidade
    • Referências• html5rocks.com• html5doctor.com• google.com/webmasters/tools/richsnippets?hl=pt-BR• tableless.com.br/introducao-a-microdata-no-html5/• marcofolio.net/webdesign/html5_microdata_what_is_it_and_why_shoul d_you_care_.html• net.tutsplus.com/tutorials/html-css-techniques/html5-microdata- welcome-to-the-machine/• http://support.google.com/webmasters/bin/answer.py?hl=pt- BR&answer=99170&topic=21997&ctx=topic• http://searchengineland.com/seo-best-practices-for-html5-truths-half- truths-outright-lies-99406
    • twiter.com/GugaAlvestwitter.com/TudoParaWPhttp://br.linkedin.com/in/gugaalves/pthttp://www.slideshare.net/gugaalves TudoParaWordPress.com.br