em
W3C Redesign

W3C Redesign

O 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.

Comentários

  1. 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!

    :P

    por Thony Conde Responder
  2. 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…

    por Thiago Cavalcanti Responder
  3. 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;

    por Thony Conde Responder
  4. 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.

    :)

    por Thiago Cavalcanti Responder
  5. Vlw pelo post muito interresante

    por Alexandre broggio Responder
  6. Um design para Web moderno é composto de 3 camadas básicas:

    – Conteúdo/Significado (xhtml/html);
    – Formatação/Posicionamento (css);
    – Comportamento (js);

    por Mikael Carrara Responder
  7. 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

    por Thony Conde Responder
  8. 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.

    por Diego Eis Responder
  9. 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.

    por Édipo Responder
  10. Simplismente não consigo escrever css desta forma, acho grotesco rs !

    Tenho que atualizar meus padrões !

    por Wellington Responder
  11. 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.

    por Édipo Responder
  12. Gostei muito, e o melhor de tudo não é compatível com o IE6, ótima iniciativa.

    por Vitor Melo Responder
  13. 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!

    por Alex Batista — Responder
  14. @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.

    por Pedro Rogério Responder

Deixe uma resposta

O seu endereço de email não será publicado Campos obrigatórios são marcados *

Você pode usar estas tags e atributos de HTML: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>