Posts relacionados a ‘

21Jan08 A Web e o HTML: Passado, presente e futuro (Parte 4)

Juro que este será o último post da série :)

Minha intenção é começar a apresentar um pouquinho das mudanças de sintaxe no HTML 5. Tratarei aqui principalmente do que diz respeito ao cabeçalho, identificação do arquivo e coisas do tipo, principalmente porque isso já está definido pelo WHATWG e não deve ser mudado. As tags que ficarão dentro do <body> poderão sofrer mudanças de caráter semântico (terão outro sentido), outras serão mantidas como antes e algumas serão adicionadas, como a já famosa tag <canvas>, criada pela Apple no dashboard do OS X. Vários atributos e tags também serão removidos.

O DTD

O HTML nasceu com a sintaxe SGML, relativamente simples e prática pras necessidades de uso e semântica. A customização da sintaxe de uma linguagem de marcação em SGML é especificada por um DTD (Document Type Definition) como este:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

para o HTML 4 strict, ou este:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

para o XHTML 1.0 Strict.

O DTD carrega toda a especificação da linguagem - suas tags, atributos e valores aceitos.

No HTML 5, bastará a declaração <!DOCTYPE html>, que é suficiente para o navegador renderizar o html em ’standards mode’ - não em ‘quirks mode‘.

MIME Type e Encoding

É o MIME Type que define o tipo do documento que você está usando. O padrão para HTML clássico é e vai continuar sendo servido como text/html. Se você utiliza text/html para enviar um XHTML, ele será considerado um HTML, talvez com erros de sintaxe.

Hoje, quando não é possível o envio do MIME e do encoding da página pelo cabeçalho HTTP, usa-se:

<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />

No HTML5, o tipo deverá ser identificado somente no cabeçalho HTTP, de modo que se for possível identificar o encoding, a tag abaixo deve ser colocada logo após do DOCTYPE/html/head, antes mesmo do título, nos primeiros 512 bytes do código:

<meta charset="UTF-8">

Um arquivo XHTML deve ser servido no cabeçalho HTTP com um MIME Type de XML, como application/xml ou application/xhtml+xml. A codificação é passada no atributo encoding, na declaração do XML (que DEVE estar na primeira linha):

<?xml version="1.0" encoding="UTF-8"?>

Por fim, um arquivo HTML 5 teria essa estrutura básica:

<!doctype html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>Example document</title>
  </head>
  <body>
    <p>Example paragraph</p>
  </body>
</html>

e um arquivo XHTML 5 seria basicamente apresentado assim:

<?xml version="1.0" encoding="UTF-8"?>
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <title>Example document</title>
  </head>
  <body>
    <p>Example paragraph</p>
  </body>
</html>

Provavelmente o elemento canvas ainda me renderá alguns post. Pra ir adiantando o assunto, deixo o ‘Doom’ feito pela Mozilla, os efeitos do CVI (canvas/JS), o clone do MS Paint e o tutorial feito pela Mozilla.

Para terminar, você pode conferir aqui a lista completa das diferenças entre o HTML 4 e o 5 e aqui um super artigo do A List Apart sobre o HTML 5, sua estrutura e a entrada de video/audio.

tags {, , , , , , }

15Jan08 A Web e o HTML: Passado, presente e futuro (Parte 3)

Bom, depois de ficar muito tempo sem postar (perdão!) e de assistir 2001: Uma Odisséia no Espaço, o que me deixará afetado por algumas semanas, retomo este post.

O HTML foi criado como um meio de troca de documentos (científicos) entre máquinas e sistemas diferentes, usando o protocolo HTTP. Quem um dia já teve a oportunidade de escrever um documento científico sabe que ele é constituído de diversos elementos (titulo, resumo, autores, bibliografia, referências, etc.) que geralmente se repetem ou são obrigatórios/necessários. Com essa estrutura ‘previsível’, levantar e implementar as tags HTML necessárias para formatar tais documentos provavelmente não foi uma tarefa das mais difíceis. Além disso, diversas tags o HTML já herdava do SGML.

… mas a Web cresceu. Foi aberta para o mundo, para todos. E aí? Nem só de documentos científicos vivia essa Web.

Pois bem. Os browsers cresceram e apareceram com a Web. Mosaic, Netscape, Internet Explorer.

- Como colocar ‘tal’ texto em ‘tal’ lugar? Como criar colunas, barras, etc?
- Tipo um jornal?
- É! Tipo um jornal!
- Ora! Com tabelas!

Com tabelas, por favor!

As tabelas foram incluídas na especificação do HTML 3, em 1995. Daí pra frente, além de carregarem consigo dados tabulares, as tabelas serviam de grid para as páginas. E assim foi até uns dias atrás.

A proposta do CSS1 veio no mesmo ano, em novembro. A Microsoft adotou a idéia e prometeu implementar no recém-lançado Internet Explorer

Vale lembrar que desde 1993 havia na lista www-talk a idéia de uma folha de estilos pra HTML. Nada ainda em ‘cascata’. Veja a proposta do pessoal da O’Reilly:

@H1 fo(fa=he,si=32,we=bo) ve(be=1,af=2)

que equivale a:

h1 {

  font-family: sans-serif;

  font-size: 32pt;

  font-weight: 900;

  padding-top: 1em;

  padding-bottom: 2em;

}

Daí em diante, muita água passou por debaixo da ponte. A web crescia mais e mais. Novas possibilidades surgiam: e-commerce, leilões, chats, comunidades, enormes portais, web apps. Os browsers - claro, principalmente o eixo IE-Netscape - implementavam novas tags e outras tecnologias deliberadamente, levados pelo mercado e na tentativa de ganhar novos adeptos, tanto o usuário final quanto o desenvolvedor. Site compatível com IE nem sempre era com o Netscape e vice-versa.

A especificações do HTML4 e do CSS2 foram liberadas em 1998. Também em 1998, foi fundado o WaSP, o projeto Mozilla e foram iniciados os rascunhos do que viria a ser o XHTML.

E o vento começou a virar

Pequenos e grandes movimentos deram início ao trabalho de evangelização dos webstandards. A tecnologia disponível e a maioria dos browsers em uso já suportava o “pleno” uso de HTML/CSS para a construção de quaisquer tipos de site sem o uso, por exemplo, de tabelas como grid ou da tag <font>.

Como antes “HTML não era importante”, era “coisa pra browser entender” e era “uma bagunça de tag com trilhões de <td>”, nem todo ‘profissional’ web entendia HTML - o negócio era editor WYSIWYG. Macromedia Dreamweaver, Microsoft FrontPage, Netscape Composer, Adobe GoLive! e tantos outros eram ferramentas essenciais. Até concordo. Criar inúmeras estruturas de tabelas aninhadas na unha nunca foi tarefa das mais fáceis. Pior ainda era entender aquilo depois. No entanto, o movimento dos webstandards pregava uma coisa que essas ferramentas ainda não faziam no modo visual - e não fazem direito até hoje. Talvez por isso a migração para os padrões tenha sido tão lenta: a longa curva de aprendizado dos profissionais que até então dominavam o mercado e a demora para a evolução das ferramentas.

Do início dos anos 2000 pra cá, a adoção dos webstandards cresceu exponencialmente. Quem até então relutava em fazer da web um mundo melhor foi convencido pelo bolso (redução de custos e tempo de implementação e manutenção), pela equipe (programador nenhum gosta de trabalhar em um mar de <td>), ou pelo Google (conteúdo relevante como ele deve ser). Ah, sem falar que agências e profissionais anunciavam webstandards como diferencial competitivo - o que de fato era. Como a concorrência não quer nunca ficar pra trás, fizeram a lição de casa.

O XHTML foi liberado em 2000, como uma substituição/evolução do HTML 4. Hoje provavelmente seja a especificação mais usada para a escrita de novos documentos, mais por conta das melhorias de sintaxe em relação do HTML 4 do que pela abordagem do seu uso como documento XML. O futuro proposto pela W3C para o XHTML foi visto por Apple, Mozilla e Opera como um distanciamento da realidade e das necessidades dos autores dos documentos da web. Por conta disso, formaram o WHATWG, com foco principal na construção da especificação do Web Applications 1.0 (aka HTML 5).

No próximo post (provavelmente o último), as mudanças nas sintaxes de HTML4 e XHTML para HTML 5.

Ref: http://virtuelvis.com/archives/2005/01/css-history - História do CSS, principalmente quanto às sintaxes propostas

tags {, , , , , , , , , , }

25Dez07 A Web e o HTML: Passado, presente e futuro (Parte 2)

1993

  • a tag img é sugerida pelo time de desenvolvimento do Mosaic;
  • o Mosaic é lançado para o ambiente gráfico X e depois para Windows e Macintosh;

1994

  • Maio - Primeira World Wide Web Conference, organizada pelo CERN. Foi chamada de “a Woodstock da Web”, com 400 usuários e desenvolvedores;
    A Spyglass Inc. compra os direitos comerciais do Mosaic;
  • Julho - Sai a especificação do HTML 2;
  • Novembro - Nasce o Netscape, browser de uso extremamente simples - vale lembrar que praticamente todos os browsers de hoje seguem a estrutura visual do Netscape. Por conta da ‘necessidade’, criaram diversas tags arbitrariamente. Dificilmente apareciam nas grandes conferências da WWW e pareciam dirigir o padrão HTML. O Mozilla (contração de Mosaic Killer), um lagarto verde, era o mascote da empresa e era encontrado nas páginas do website. Aqui, o e-mail de lançamento do Netscape;
  • Final do Ano - É formada a W3C - World Wide Web Consortium, chefiada por Tim Berners-Lee;
  • Em algum ponto de 1994 - Início do projeto Opera, como pesquisa na Telenor, maior empresa norueguesa de telecomunicações;

1995

  • Início do ano - Novas tags surgem, rascunho do HTML 3 é liberado e a linguagem ganha especificação para tabelas;
  • Agosto - O Internet Explorer é anunciado, baseado em um licenciamento do Spyglass Mosaic. ActiveX seria o diferencial;
  • Setembro - Netscape propõe os frames;
  • Novembro - Internet Explorer é lançado para Win NT e 95;
    CSS é proposto e Microsoft promete implementação no IE;
    Rascunho da internacionalização do HTML, com suporte a diferentes alfabetos e sets de caracteres;
  • Em algum ponto de 1995 - Projeto Opera se torna uma empresa separada, a Opera Software ASA;

1996

  • Abril - W3C inicia rascunhos de padronização de scripting;
  • Julho - IE 3.1 é lançado para Mac e Windows 3.1;
  • Dezembro - Início dos trabalhos no projeto codinome Cougar, que viria a ser o HTML4;

1997

  • Janeiro - Especificação do HTML 3.2 (wilbur) é liberada, como um grande acordo entre os players do mercado. A especificação já inclui applets, tables, float de textos em torno de imagens, sobrescritos e subescritos;

1998

  • Fevereiro - Netscape libera o código do Netscape Communicator 5, em fase de projeto. Cria o mozilla.org, pra organizar o desenvolvimento;
  • 2° trimestre - HTML 4 (Cougar) é liberado como recomendação da W3C;
  • Outubro - Código do Netscape 5 é considerado sem futuro e é descartado. O “Mozilla” começa a ser reescrito do zero, tendo como meta o suporte aos padrões HTML4, XML, DOM e CSS1;
  • Novembro - AOL compra Netscape. Daí em diante, todos os releases do Netscape seriam baseados no Mozilla;
  • Dezembro - W3C libera rascunho de ‘reformulação do HTML em XML’ - codinome Voyager - que viria a ser o XHTML;
  • Em algum ponto de 1998 - Fundado o WaSP: Web Standards Project. Aqui, a missão inicial do projeto.

2000

  • Janeiro - XHTML 1.0 passa a ser Recomendação da W3C;
  • Março - estouro da bolha da internet;
  • Em algum ponto de 2000 - Lançado o Opera Mobile;

2001

  • Maio - XHTML 1.1 passa a ser Recomendação da W3C;
  • Agosto - Lançado o Microsoft Internet Explorer 6;

2002

  • Setembro - Release do Phoenix 0.1, versão independente do Mozilla Navigator (futuro Firefox);

2003

2004

  • Fevereiro - Mozilla Firebird é rebatizado como Mozilla Firefox;
  • Novembro - Lançado o Mozilla Firefox 1.0;
  • Em algum ponto de 2004 - Após um workshop da W3C, Apple, Mozilla e Opera, insatisfeitos com os rumos que a W3C estava dando ao XHTML/HTML (se distanciando das reais necessidades dos autores), fundaram o WHATWG. O HTML 5 (Web Applications 1.0) é o principal foco do WHATWG e também do novo W3C HTML Working Group;

2005

  • Outubro - Firefox bate a marca de 100 milhões de downloads;
  • Em algum ponto de 2005 - A Mozilla Corporation é criada (mozilla.com);
    Criação dos Microformatos, projeto que visa adicionar mais semântica ao código HTML (machine understandable).

2006

  • Outubro - Lançado o Microsoft Internet Explorer 7;
  • Em algum ponto de 2006 - Lançado o Opera Mini, em Java, para celulares;
    Opera lançado para Nintendo DS e Wii.

2007

  • Junho - Opera Mini 4 é lançado;
    Versão beta do Safari para Windows é lançada;
  • Dezembro - Internet Explorer 8, ainda em desenvolvimento, passa no teste Acid2, do WaSP. Até então, somente o Opera 9.2 havia passado.

2008

  • Início do ano (esperado) - Lançamento do Mozilla Firefox 3, Opera 9.5 e beta do IE8;

No próximo post, o uso do HTML ao longo dos anos pelos desenvolvedores.

Fonte:

http://www.w3.org/People/Raggett/book4/ch02.html
http://br.mozdev.org/sobre/crono/
http://www.eskimo.com/~bloo/indexdot/history/html.htm

tags {, , , , , , , , , , }

21Dez07 A Web e o HTML: Passado, presente e futuro (Parte 1)

Escrevo este artigo motivado pelas minhas últimas leituras sobre o desenvolvimendo da especificação do HTML5.

Estou procurando redigir um texto enxuto, carregado de referências e links, para quem não é lá muito entendido do assunto também poder se inteirar.

Por ser uma compilação de muitas fontes, posso ter cometido alguns erros ao reunir as informações ou traduzindo alguma coisa. Por favor, comentem o texto para que eu possa dar um update.

O foco? Programadores, analistas, designers ou alguém que por acaso caia aqui de paraquedas vindo do Google.

O Passado

A primeira proposta da WWW foi de Tim Berners-Lee, em 1989, e refinada em 1990 por Robert Caillau. Eles trabalhavam no CERN, em Genebra. Eram ideias para um sistema de informação que pudesse ser usado pelos diferentes sistemas de computadores em uso na organização. Muitas pessoas usavam TeX e PostScript. Alguns poucos usavam SGML. Tim propôs o HTML, como uma solução simples, usando o (também simples) protocolo HTTP - de maneira que tanto terminais burros quanto os computadores com interface gráfica podessem ter acesso às informações.

Trabalhos de pesquisa às vezes envolvem colaboração de institutos de todo o mundo. Muitos papeis, inúmeras referências entre eles. Com o hipertexto e o uso de links para as referências, a informação se organizava em uma grande teia: a Web.

Outra característica importante que nascia era a URL. O padrão www.nome.nome era extremamente simples, de facil memorização (quantos IP’s você sabe de cor?) e endereçava tanto os documentos locais quanto os remotos.

O HTML se utilizou intencionalmente de um padrão de anos para marcação de texto: o SGML. Tags como title, p, h1-h6, ol, li, ul e varias outras foram herdadas. Isto provavelmente contribuiu para a aceitação que o HTML viria a ter. O SGML, obviamente, não continha links. O uso do atributo href em uma tag de âncora foi uma das invenções de Tim.

O CERN lançou a Web em 91, na lista de discussão www-talk. Outras pessoas com linhas de pensamento semelhantes logo se uniram na criação de websites e browsers. A web a partir daí cresceu exponencialmente, ofuscando outros sistemas de informação baseados na internet, como o Gopher e a Usenet.

Aqui, o primeiro website, escrito por Tim. No final de 1993, a Web já correspondia a 1% de todo o tráfego na internet (o restante basicamente se dividia em acesso remoto, e-mails e tranferência de arquivos).

Além da Web, o CERN foi pioneiro na introdução da Internet na Europa, no início dos anos 80.

Aqui e aqui, screenshots do WorldWideWeb, browser escrito em 1990 por Tim Berners-Lee em Objective-C em um computador NeXT - empresa aberta por Steve Jobs após ser demitido da Apple. Seus computadores eram amplamente usados no meio científico. Em 1997, a Apple adquiriu a NeXT e junto vieram Jobs e muito do que hoje é o MacOS X.

No próximo post, uma linha do tempo deste ponto até a atualidade.

tags {, , , , }

17Dez07 Webkit e Epiphany

Num outro post o Lucas falou sobre diversos browsers - na verdade, sobre seus renderizadores. Bom, faltou um: Epiphany Web Browser. Mas por que ele não foi citado? Na verdade, a título de “renderizadores”, o Epiphany não teria relevância por utilizar o Gecko (Firefox). Mas o quadro está mudando.

Pela forma polida e bem feita que o Epiphany foi feito, este permite que um backend seja facilmente incorporado, e é o que já vem sendo feito com o WebKit. Ele já é suportado desde a versão 2.19.6 do Epiphany. A importância de se ter um browser utilizando WebKit no mundo dos SOs Linux é a mesma do projeto ies4linux: nós desenvolvedores web podermos desenvolver ferramentas que sejam amplamente compatíveis com o mercado. O WebKit é o renderizador do Safari. Ou seja, testar no Epiphany-WebKit (que é como o Epiphany usando o backend WebKit é chamado) garante com ao menos 90% de ceteza que funcionará no Safari.

O Epiphany-WebKit já está incluso em distribuições de peso como Debian (se souberem de outra, por favor, comentem :D) e há planos para que esta vertente se torne o padrão no Epiphany - e consequentemente em todas as distros que o utilizam como browser padrão.

P.s.: dica de como instalar Epiphany com WebKit no Ubuntu

tags {, , }