Primeiro post -> O Bom Uso do Html

Sem espancar literalmente àqueles que são dignos de cursinhos de esquina e se auto-entitulam programadores/desenvolvedores, o bom uso do html, é fácil, bonito, eficaz e correto.

O html entrou em minha vida no ano de 2001. Eu aprendi na raça, brincando no Bloco de notas; hoje, no textmate/coda for mac. Eu vejo um bom site, espelho de um bom html, que retratará numa boa semântica, sintaxe, até mesmo princípios básicos de SEO.

Não viramos bons desenvolvedores em cursinhos, faculdades, ou brincando em casa durante 1 semana, ou poucos meses. Aprendemos nas dificuldades diárias, naqueles layouts feitos por Diretores de artes que pensam que a Web é uma folha de papel para pintar e exigem a perfeição no html para com os seus garranchos. Neste momento, percebemos a diferença entre os desenvolvedores. Claro, cada um com o seu método.

Cheguei ao ponto principal deste post -> Os métodos! Métodos, e seus princípios.

Princípios básicos:

  • Doctype: temos que definir um tipo de documento para o nosso html. É extremamente chato acharmos um projeto fechado com um Tipo Transitional;
  • Codificação de caracteres: utf-8, iso*, enfim… cada um para a sua finalidade. Prefiro utf-8 por ser facilmente aceito por outros motores, entretanto, não é imoral utilizarmos o iso 8859-1;
  • Metatags: caso queira o seu projeto bem visto, o uso de metatags é obrigatório;
  • Title, para HREF; Alt, para IMG; H1, para Logo; H2, para Título; enfim, o uso de tags ou parâmetros para elas, validará ou não o seu projeto;
  • Class e ID: Class para o que iremos utilizar inúmeras vezes, como <span class=”red”></span>, e ID, um identificador único, <div id=”header”></div>;
  • Nomenclatura: Eu uso caseCamel, mas tem quem use outros métodos; devemos apenas tomar cuidado com o uso exagerado ao escolher os nomes. Caso venhamos a utilizar um bash da vida para acessar via ssh o diretório e enxergar alguns arquivos, dependendo de como estão renomeados, dificultará a leitura. Eu, particularmente, prefiro “headerMenu” :)
  • Tags: cada tag em seu lugar. <html><head><body><span><div><address><link><script> e etc. Como aqui não vou ensinar como é html, apenas entenda: cada tag em seu lugar;
  • W3C: é um projeto que regra o bom uso de conteúdo para a web, inclusive HTML. Por fim, após finalizar um projeto, valide-o na W3C. (está aguardando o link? procure no google! ;p);

  • Não posso deixar de falar: usem sitemaps, robots; usem corretamente as tags, definam bons nomes, estudem o projeto, o wireframe. Coloquem tudo no papel.

Um modelo meu de html => http://pastie.org/private/tvv4pj1ejnrmbxhviwv8w

Até a próxima!

9 months ago  7 notes

Primeiro post -> O Bom Uso do Html

Sem espancar literalmente àqueles que são dignos de cursinhos de esquina e se auto-entitulam programadores/desenvolvedores, o bom uso do html, é fácil, bonito, eficaz e correto.

O html entrou em minha vida no ano de 2001. Eu aprendi na raça, brincando no Bloco de notas; hoje, no textmate/coda for mac. Eu vejo um bom site, espelho de um bom html, que retratará numa boa semântica, sintaxe, até mesmo princípios básicos de SEO.

Não viramos bons desenvolvedores em cursinhos, faculdades, ou brincando em casa durante 1 semana, ou poucos meses. Aprendemos nas dificuldades diárias, naqueles layouts feitos por Diretores de artes que pensam que a Web é uma folha de papel para pintar e exigem a perfeição no html para com os seus garranchos. Neste momento, percebemos a diferença entre os desenvolvedores. Claro, cada um com o seu método.

Cheguei ao ponto principal deste post -> Os métodos! Métodos, e seus princípios.

Princípios básicos:

  • Doctype: temos que definir um tipo de documento para o nosso html. É extremamente chato acharmos um projeto fechado com um Tipo Transitional;
  • Codificação de caracteres: utf-8, iso*, enfim… cada um para a sua finalidade. Prefiro utf-8 por ser facilmente aceito por outros motores, entretanto, não é imoral utilizarmos o iso 8859-1;
  • Metatags: caso queira o seu projeto bem visto, o uso de metatags é obrigatório;
  • Title, para HREF; Alt, para IMG; H1, para Logo; H2, para Título; enfim, o uso de tags ou parâmetros para elas, validará ou não o seu projeto;
  • Class e ID: Class para o que iremos utilizar inúmeras vezes, como <span class=”red”></span>, e ID, um identificador único, <div id=”header”></div>;
  • Nomenclatura: Eu uso caseCamel, mas tem quem use outros métodos; devemos apenas tomar cuidado com o uso exagerado ao escolher os nomes. Caso venhamos a utilizar um bash da vida para acessar via ssh o diretório e enxergar alguns arquivos, dependendo de como estão renomeados, dificultará a leitura. Eu, particularmente, prefiro “headerMenu” :)
  • Tags: cada tag em seu lugar. <html><head><body><span><div><address><link><script> e etc. Como aqui não vou ensinar como é html, apenas entenda: cada tag em seu lugar;
  • W3C: é um projeto que regra o bom uso de conteúdo para a web, inclusive HTML. Por fim, após finalizar um projeto, valide-o na W3C. (está aguardando o link? procure no google! ;p);

  • Não posso deixar de falar: usem sitemaps, robots; usem corretamente as tags, definam bons nomes, estudem o projeto, o wireframe. Coloquem tudo no papel.

Um modelo meu de html => http://pastie.org/private/tvv4pj1ejnrmbxhviwv8w

Até a próxima!

Primeiro post -> O Bom Uso do Html

About:

Following: