W3C Redesign
Postado por: Pedro Rogério emO W3C tem a missão de levar a World Wide Web para o seu pleno potencial através do desenvolvimento de protocolos e orientações que assegurem o crescimento a longo prazo da web, e hoje foi lançado uma versão beta do redesign do seu site.
Analisar o código HTML e o CSS é uma boa aula de boas práticas e semântica, e por falar em boas práticas, aproveitem para dar uma olhada no CSS, vejam que ele é todo inline as propriedades são declaradas em linha, muita gente fala que escrever CSS dessa forma é perda de tempo, mas eu particularmente só escrevo CSS dessa forma e aconselho vocês a segui-la também.
Abaixo você pode ver um vídeo com as partes chave do redesign do site do W3C:
Mais informações: W3C Q&A Weblog.
Sobre Pedro Rogério
Pedro Rogério é desenvolvedor web por paixão, não saberia fazer melhor outra coisa. Além de escrever para o Pinceladas da Web também escreve para o CSS no Lanche, blog voltado ao desenvolvimento front-end.
Bacana, vou dar uma acessada e ver o que posso tirar de útil para mim. Logo de cara, gostei das opções na parte superior a direita: Mobile Style, Print Style e Desktop Style… Muito legal esta forma de oferecer ao usuário as 3 visualizações, com icones bem visiveis.
Sempre usei CSS Inline, menos Kb’s na pagina css!
Que salada!
CSS inline é CSS embutido num atributo style dentro de uma tag qualquer, como span!
Isto é errado pois não separa o conteúdo da apresentação dificultando assim a atualização do design do site.
O que o Diego Eis criticou, e nisto ele estava coberto de razão e desinformado ao mesmo tempo, foram pessoas que escrevem CSS numa linha só. Isto NÃO se chama CSS inline! Isto é código otimizado para largura de banda (ou, mais precisamente, a falta dela) e fazê-lo a mão é sim uma péssima prática pois dificulta a leitura além de atrapalhar o ritmo de produção.
No entanto, não tão somente é possível, como é simples fazer isso automaticamente no servidor (vide o minify em http://code.google.com/p/minify/ ) ou até mesmo no editor de código (pois alguns deles oferecem esta funcionalidade).
Para terminar, o redesign do W3C não está utilizando CSS numa linha só, conferi isso agora mesmo.
Por favor, retifica o artigo para evitar confundir os iniciantes…
Thiago;
Quando fiz a leitura do artigo me confundi durante a leitura, quando me referi que que fazia CSS Inline era referindo a escreve-lo todo em única linha, para consumir menos kb’s, e não escreve-lo no xhtml internamente a alguma tag se usando de style.
Não conhecia http://code.google.com/p/minify/
Vou me informar e aprimorar esta prática.
Att;
Tudo bem, o importante era corrigir aquilo mesmo para não confundir os novatos!
Quanto ao minify e ferramentas semelhantes, são mesmo uma mão na roda! O UA recebe a versão “minificada” enquanto você trabalha na versão com quebras de linha e indentação normalmente.
Vlw pelo post muito interresante
Um design para Web moderno é composto de 3 camadas básicas:
- Conteúdo/Significado (xhtml/html);
- Formatação/Posicionamento (css);
- Comportamento (js);
Thiago;
Enquanto desenvolvo, uso quebras de linha e indentação normalmente no CSS. Após concluir o arquivo faço manualmente a compressão em linha única de tudo. O minify será uma mão na roda a partir de agora. rs
Tem twitter? Adicona lá @thonyconde
Com certeza eles não escreveram o CSS diretamente em uma linha só. Eles fazem o upload do CSS nessa forma porque diminui o tamanho do arquivo. Diminuindo o tamanho do arquivo, há uma economia de banda, os servidores não ficam sobrecarregados e o site fica mais rápido.
Escrever CSS diretamente em uma linha é insanidade.
Sobre o CSS, eu agrupo alguns elementos inline,
por exemplo
display, float
width; height, overflow
padding; border; outilne; margin;
backgound
sobre o texto
coisas a mais
nisso vou agrupando inline.
o site ficou legal, o que me deixa um pouco com medo do site é que tem elementos com três classes, chega uma hora que vira bagunça, o ie6 vai morrer, mas para quem desenvolve para ele eu não aconselho a usar isso pois bug bonito.
Abraços, ótimo meio de informação esse blog.
Simplismente não consigo escrever css desta forma, acho grotesco rs !
Tenho que atualizar meus padrões !
nada, rs, é dó um jeito de você agrupar os atributos de um jeito que faça mais sentido, talvez não precisaria ser inline dependendo da pessoa, um enter talvez basta para isso entre o que você acha que pode ser agrupado.
Gostei muito, e o melhor de tudo não é compatível com o IE6, ótima iniciativa.
Tudo é via de mão dupla. Todos nós sabemos que a melhor prática é escrever CSS in external files. Alguns soluções são aprensetados com CSS inline, visto que na sua totalidade, não precisa de hack, uma vez que o “objeto” elemento está recebendo o atributo diretamente.
A obeservação que fez o Thiago Cavalcanti é muito válida.
Cuidado com esses tipos de posts Pedro!
@Alex Batista,
Quando disse que o CSS é inline quis dizer é que as declarações são feitas em uma única linha, se você olhar o novo site e dar uma olhada no CSS vai entender o que eu quis dizer.