Upload
bernard-de-luna
View
1.595
Download
0
Embed Size (px)
DESCRIPTION
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.
Citation preview
- 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
@suco_de_uvameu ponto fraco é o cansaço. chega um momento que não consigo mais pensar e vou metendo classe :/
@netofontenelleorganização não sei como separar bem o meu CSS. :/
@zenorocharefatoração. uma vez pronto, quase nunca volto para otimizar o CSS
@srmarcosalbertoainda rola uma certa dificuldade de nomear bem os elementos
@rafasatoorganização de css e falta de criatividade para nomear elementos
@fabriciofmsilvadúvidas para nomear elementos, falta de organização e refatoração
@wl_lfrefatoração e nomear elementos.
@cironunesdevmeu ponto fraco é nomear as classes. Sem um plano, é dificil manter a disciplina de ter "carinho" ao escolher os nomes.
@juliobitencourta minha é o tal do DRY :(
@fernahhdar nome aos bois, digo, as variáveis D:
@matos_eduardoorganização.
@glaucowebeu acho que eh falta de compromisso até o final. Ahh depois eu refatoro td. Começa mt bem mas nao termina :(
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
imagine uma empresa
gallerygallery-item gallery-linkgallery-thumb
camelCase não é recomendado para CSShttp://csswizardry.com/2010/12/css-camel-case-seriously-sucks/
<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>
<div id="secondary" class="widget-area" role="complementary"> <aside id="search-2" class="widget widget_search"></aside>
</div>