Do marketplace ao WordPress - WordCamp BH 2015

1. Do Marketplace ao
WordPress
Fellyph Cintra
Elo7

2. Fellyph Cintra
Software Engineer Elo7
Instrutor WordPress DRC
Trabalha com WordPress
since 2008
@fellyph

3. O elo7
3http://craftedbits.elo7.com.br/2014/11/17/metodologia-agil-no-elo7/

4. Elo7 Marketplace e blog

5. Blog + Marketplace
• Gerar tráfego + vendas
• Manter o Elo7 presente na vida das pessoas
• Valorizar o trabalho craft
5

6. Blog em números
• Mais de 400k visualizações mês
• Mais de 1.600 posts
• 27k comentários
• Mobile is coming
• 47% do acesso é mobile + tablet
• Finais de semana o acesso mobile > 60%

7. Passado x Presente
• Sem suporte mobile
• Páginas pesadas
• Nenhuma otimização para SEO
• Excesso de plugins instalados
7
• Suporte mobile
• Integração com time de conteúdo
• Otimização para SEO
• Atualização e melhorias do tema

8. Ferramentas
• SEO META 1 click
8
• Webmaster tools

9. SEO META 1 click
https://chrome.google.com/webstore/detail/seo-meta-in-1-click/bjogjfinolnhfhkbipphpdlldadpnmhc 9

10. Resumo
• Título
• Descrição
• Keywords
10

11. Resumo
• Título
• Descrição
• Keywords
11

12. Headers
Lista todos os headers e
suas hierarquias
12

13. Headers
Fique atento as hierarquias
13

14. Headers
Situação ideal 14

15. Headers
what?
15

16. Headers
Temas pagos são bonitos, já
por dentro…
16

17. Headers
17
Possível solução

18. Imagens
As imagens atualmente são
uma grande fonte de tráfego,
elas merecem uma atenção
especial
A extensão aponta as
imagens sem titles e ALT’s
18

19. ALT’s e titles ajudam, mas…
Existem outros pontos que devemos levar em consideração:
• A imagem está relacionada ao conteúdo?
• É um conteúdo original?
• Nada de arquivos com DSC98932.jpg
• Escale as imagens no tamanho correto
• Utilize ferramentas de otimização(ImageOptim,
JPEGMini e PunyPNG)
19

20. schema.org
• A grosso modo ela auxilia na classificação de nosso
conteúdo para os mecanismos de busca
• Ela possui uma série grupos de conteúdo onde
vamos identificando item-a-item.
20
https://schema.org/docs/full.html

21. schema.org + WordPress
• Dentro do schema.org temos
umas série de grupos de
classificação.
• Um grupo que podemos encaixar
o blog é CreativeWorks > Article >
BlogPosting
• Podemos encontrar dentro do blog
conteúdo que se encaixe em
outros grupos
21

22. Exemplo
22

23. Validando seu schema.org
Structured Data Testing Tool
23
https://developers.google.com/structured-data/testing-tool/

24. Social
• Pinterest e Facebook utilizam
o OpenGraph, então cuidado
com ele.

25. Facebook debugger
https://developers.facebook.com/tools/debug/ 25

26. Revisando
título, descrição,
keywords
26
Headers
Imagens
schema.org
Leia o código
Monitoramento

27. Validando Conteúdo
• Check list para conteúdo
• Alerta para o nível de
otimização do conteúdo
• Mas não adianta atender
todos os checklist e ter um
conteúdo pobre
27

28. Webmaster tools
• Análise de dados estruturados
• Search Analytics
• Análise de facilidade de uso em
dispositivos móveis
• Rastreamento de erros
28

29. Acompanhando as melhorias
29
Taxa de cliques (+50%)

30. Integração
30
Marketing Design Engenharia
+ +

31. Extra
31

32. doc.js
• doc.js é uma micro biblioteca para manipular o DOM
e browsers mobile e desktop.
• 2.4kb minificado + gzip
• Biblioteca utiliza uma estrutura em AMD
32
https://github.com/elo7/doc-amd

33. Alguns recursos do doc.js
els
size
each
data
val
html
append
text
attr
hasClass
addClass
removeClass
toggleClass
removeItem
find
filter
first
last
previous
next
parent
isEmpty
on
off
throttle
selectedText
…
closest
33

34. Instalando com Bower via terminal
bower install doc-amd
34
https://github.com/elo7/doc-amd

35. Craftedbits
35http://craftedbits.elo7.com.br/

36. 36

37. 37
Obrigado !