Assinar
Quel tal não criar mais HTML?
Quantas vezes você não escreveu algo como <div class="header"> ou <div class="footer">?
O HTML nos fornece uma linguagem para definir aspectos bem raíz da formatação, mas ainda falta padronização na forma com a qual descrevemos elementos comuns do dia-a-dia.
Se cada um “inventasse” seu próprio HTML, talvez eu usasse <forte> ao invés de <strong> e <destaque> ao invés de <em>. É basicamente isso que estamos fazendo ao criar um <div class="conteudo"> ou <div class="post">.
Coisas como logotipo, nome do site, navegação, busca interna e conteúdo são elementos comuns entre muitas páginas da internet, embora cada autor diferente use uma maneira diferente de declarar esses elementos.
Quando digo que não devemos criar mais HTML, na verdade estou dizendo que já passou da hora de definirmos um padrão pra essas coisas tão comuns. Pra variar, teremos que radicalizar.
É muito comum ver sites com um <div id="sidebar"> pra agrupar um determinado conteúdo. Isso é errado, aquele conteúdo nem sempre poderá ser uma barra ao lado. Assim como headers nem sempre ficarão como cabeçalho e o mesmo para footers. Eu poderia definir um logotipo dentro do header e no dia seguinte querer colocar o mesmo no fim da página. E aí como fica?
Eu particularmente gosto da estrutura proposta pelo Andy Clarke e acho que devíamos criar módulos para o HTML. Isso além de nos fazer escrever menos iria padronizar a forma com a qual usamos o CSS, tornando os estilos modulares também. CSS modular não é uma novidade e já exige estruturação padronizada.
Devemos continuar escrevendo HTML, mas parar de inventar HTML novo. É uma idéia bem parecida com a dos microformatos, só que pra resolver um problemão genérico e não pequenos problemas específicos, quase um Megaformato.
Uma sugestão (baseada na proposta de Andy Clarke):
- #container
- Container da página
- #branding
- Usado para um cabeçalho ou banner com a “marca” da página.
-
- #branding-logo
- Logotipo
-
- #branding-tagline
- Uma pequena frase que define o site.
- #nav or #navigation
- Navegação
-
- #nav-main
- Navegação principal
-
- #nav-section
- Navegação dentro da seção atual
-
- #nav-external
- Páginas externas ao site.
-
- #nav-supplementary or #nav-supp
- Uma lista complementar de links que pode substituir o comum porém presentacional footer.
-
- #nav-(qualquer coisa)
- Uma lista de links qualquer, com nome qualquer.
- #search
- Relacionado à busca e resultados de busca
-
- #search-input
- Um formulário de busca
-
- #search-output
- Resultados de busca
- #content
- Usada para o conteúdo da página
-
- #content-main
- Área principal do conteúdo
-
- #content-news
- Notícias Relacionadas
-
- #content-(qualquer coisa)
- Outro tipo de conteúdo, pode ser #content-related para relacionado ou #content-quote para citações.
- #siteinfo
- Usado para informações relacionadas
-
- #siteinfo-legal
- Informação sobre copyright, etc.
-
- #siteinfo-credits
- Créditos
11/4/2007 às 1:12 pm
Com o uso de microformats, esse tipo de regras impostas são desnecessárias e caem no vazio.
11/4/2007 às 2:23 pm
Microformatos são pra resolver problemas específicos de semântica, como datas e informação pessoal. Uma página pode conter vários microformatos, no entanto terá sempre uma estrutura que engloba tudo.
Acima de tudo, padronizar a forma com a qual estruturamos o HTML evita erros grosseiros como o exemplo do
<div id="sidebar">, que mistura apresentação com conteúdo.Sugiro que, se souber inglês, leia essa excelente discussão iniciada por Eric Meyer sobre o assunto.
11/4/2007 às 2:43 pm
Hey! Porque fechou comentários naquele outro post? Sacanagem!
E quanto ao assunto do post. Acredito que a padronização deve existir, mas quem deve produzí-la são as máquinas. Caso contrário, erros pequenos como de digitação poderiam ferrar com sites inteiros neste caso.
A web semântica tem que dar às máquinas a capacidade de organização e recuperação de informação por elas próprias. Caso contrário caímos numa entropia, como no caso dos metadados.
11/4/2007 às 4:39 pm
Não concordo com a idéia.
Acho que padronizar até o nome das divs é desnecessário.
Até porque o povo não faz busca pelo código.
Se eu coloco uma div chamada “sidebar”, esse nome tem algum significado pra mim, vou saber quando olhar de novo pro código.
Se outro desenvolvedor for mexer no site ele vai saber olhar o HTML e entender onde fica cada coisa, mesmo com os nomes ‘pessoalmente’ escolhidos.
11/4/2007 às 4:50 pm
Eu acho que padronizando fica ainda mais fácil pra um desenvolvedor conhecer o código do outro. Aliás, esse é um dos objetivos de qualquer tipo de padronização.
Pensando de uma maneira ampla, se você colocar
<div id="content-aux">qualquer desenvolvedor que estiver acostumado com o padrão, vai reconhecer quando olhar para o código.Do ponto de vista do CSS somente, é meio inútil, mas a carga semântica para o HTML por exemplo é ótima.
Se você olhar para o Web Applications 1.0 vai ver que já existem elementos sendo planejados com esse objetivo. O elemento nav, elemento aside e article.
Como todo padrão, vai gerar dificuldades para alguns e facilidade para a maioria das pessoas.
12/4/2007 às 7:14 am
em vez de
<div id="sidebar">eu costumo usar<div id="opcoes">ou<div id="menu">simples… é soh preservar a ideia do conteudo separado da apresentação…para quem ainda naum assistiu:
http://www.youtube.com/watch?v=6gmP4nk0EOE
12/4/2007 às 7:28 am
Creio eu que XML é uma bela saida pra isso
12/4/2007 às 3:23 pm
Concordo com tudo que você disse, mas imagine se cada um criasse o seu HTML, como os browsers iriam entender isso, você usa forte, outro usa fonte-bem-grossa, outro, fonte-bem-fininha, aí já viu né!!!