como pensar front para wordpress

  • 1,460 views
Uploaded 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.

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
No Downloads

Views

Total Views
1,460
On Slideshare
0
From Embeds
0
Number of Embeds
2

Actions

Shares
Downloads
38
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