Your SlideShare is downloading. ×
como pensar front para wordpress
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

como pensar front para wordpress

1,563

Published on

Vamos analisar um pouco sobre como devemos pensar em front-end, identificando pontos de planejamento e de atenção e o que podemos melhorar no front do wordpress para atingirmos a modularização.

Vamos analisar um pouco sobre como devemos pensar em front-end, identificando pontos de planejamento e de atenção e o que podemos melhorar no front do wordpress para atingirmos a modularização.

1 Comment
16 Likes
Statistics
Notes
No Downloads
Views
Total Views
1,563
On Slideshare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
39
Comments
1
Likes
16
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. como pensar front para wordpress
  • 2. bernard de luna @bernarddeluna
  • 3. - team leader de produto na Petrobras - creative director da Melt DSP - criador do framework Formee - colunista do iMasters e Tableless - +50 eventos pelo Brasil - HTML5DevConf em San Francisco
  • 4. @bernarddeluna
  • 5. @bernarddeluna qual o ponto fraco do seu código?
  • 6. @suco_de_uva meu ponto fraco é o cansaço. chega um momento que não consigo mais pensar e vou metendo classe :/ @netofontenelle organização não sei como separar bem o meu CSS. :/ @zenorocha refatoração. uma vez pronto, quase nunca volto para otimizar o CSS @srmarcosalberto ainda rola uma certa dificuldade de nomear bem os elementos
  • 7. @rafasato organização de css e falta de criatividade para nomear elementos @fabriciofmsilva dúvidas para nomear elementos, falta de organização e refatoração @wl_lf refatoração e nomear elementos. @cironunesdev meu ponto fraco é nomear as classes. Sem um plano, é dificil manter a disciplina de ter "carinho" ao escolher os nomes.
  • 8. @juliobitencourt a minha é o tal do DRY :( @fernahh dar nome aos bois, digo, as variáveis D: @matos_eduardo organização. @glaucoweb eu acho que eh falta de compromisso até o final. Ahh depois eu refatoro td. Começa mt bem mas nao termina :(
  • 9. bonito novos estilos são adicionados bagunçado estilos existentes não são reutilizados estilos não utilizados não são removidos não consertar o que não estiver quebrando o layout css tempo https://speakerdeck.com/winston/wah-lau-css-can-be-tested-too
  • 10. bernard de luna @bernarddeluna
  • 11. bernard de luna @bernarddeluna
  • 12. defina os componentes do seu framework
  • 13. dribbble.com
  • 14. dedique-se às convenções de nome
  • 15. imagine uma empresa
  • 16. imagine uma empresa função-nome
  • 17. imagine uma empresa nav nav-item nav-link
  • 18. imagine uma empresa btn btn-primary btn-large, btn-small
  • 19. imagine uma empresa gallery gallery-item gallery-link gallery-thumb
  • 20. imagine uma empresa gallery gallery-item gallery-link gallery-thumb camelCase não é recomendado para CSS http://csswizardry.com/2010/12/css-camel-case-seriously-sucks/
  • 21. agrupe e teste todos os seus componentes
  • 22. dribbble.com
  • 23. dribbble.com
  • 24. incluindo wordpress no processo de front-end
  • 25. falta de um wrapper
  • 26. <header id="branding" role="banner"></div>
  • 27. <span class="sep">Posted on </span> <span class="sep"> by </span>
  • 28. <span class="sep">Posted on </span> <span class="sep"> by </span> <footer class="entry-meta"> This entry was posted in <a href="http://localhost:8888/wordpress/?cat=1" title="View all posts in Uncategorized" rel="category">Uncategorized</a> and tagged <a href="#" rel="tag">cursus</a> by <a href="#">admin</a>. Bookmark the <a href="#" title="Permalink to Mais um tipo de post" rel="bookmark">permalink</a>. </footer>
  • 29. <div id="secondary" class="widget-area" role="complementary"> <aside id="search-2" class="widget widget_search"></aside> </div>
  • 30. contribuímos uma gota para melhorar isso
  • 31. fui!obrigado! @bernarddeluna

×