Web, programação e outras historias

Assine o Feed RSS

3 de junho

Aula n.1 – Curso de Html, CSS e Javascript

Como todo curso que se respeite, me apresentei e fiz os alunos se apresentar; em seguida, apresentei a “roadmap” das aulas.

Neste curso não aprenderemos a criar Layouts de site com editores WYSIWYG ( = What You See Is What You Get, ou seja O Que Você vê é o que você obtêm), mas sim a desenvolver HTML (e XHTML) conforme os Web Standards. Aprenderemos a criar um código bonito e semanticamente correto. O código que desenvolvemos não tem somente o simples objetivo de agradar o cliente (ou nós) porque é bonito. Nos temos algumas responsabilidades, entre elas a de deixar nosso site accessível, para pessoas com deficiências visuais (ou até outras). Este vídeo exemplifica muito bem o conceito, e é  por isso que o mostrei:

Legal, não é? Deixa bem claro quanto nossa atenção a certos detalhes é importante.

Agora, vamos supor que a gente seja muuuuito ma. Que não se importe com as categorias citadas no vídeo, que pra nós só conta o dinheiro. Bem existe uma personagem muito importante no mundo da web, que pode nos permitir de ganhar muito, o de fazer o sucesso do nosso site. o detalhe que esta personagem é cega. Sabem que é? O robot do Google, ou seja aquele programa que vasculha todas as páginas da Web e que permite – ou não – que nosso site apareça nos resultados de busca. Então, o Google (ou o Yahoo, ou o Live Search, agora Bing) é cego. Não lê imagens, não gosta de código sujo, não gosta de muito Flash (= animações). Não é um caso que os serviços de  SEO (Search Engine Optimization) são muito requisitados nestes últimos anos.

Enfim, o primeiro passo para um site bem feito é conhecer muito bem as tags html, não para o que mostram visualmente mas para o que elas querem dizer, para o significado semântico delas.

Por isso, na sala, fiz um pequeno experimento: peguei um site qualquer, e pedi para os alunos que identificassem estruturas básicas da página: títulos, cabeçalhos, rodapês, paragrafos, etc. Futuramente este exercicio evolverá em criar o próprio html das páginas respeitando a semântica.

Logo depois passei para os alunos as ferramentas do que falo neste artigo , e começei a introduzir o HTML, não sem antes ter explicado um pouco da arquitetura cliente – servidor. No final da aula, os alunos tiveram que reproduzir uma porção de teto deste mesmo blog, identificando parágrafos, títulos, e tentando uma formatação básica das fontes e das cores (tudo via atributos HTML, mas cientes que mais adiante este trabalho será feito pelo CSS).

Semana que vem, mais tags!