{"id":9386,"date":"2016-01-29T17:13:04","date_gmt":"2016-01-29T19:13:04","guid":{"rendered":"https:\/\/king.host\/blog\/?p=9386"},"modified":"2024-06-04T07:43:57","modified_gmt":"2024-06-04T10:43:57","slug":"dia-da-saudade-e-a-web-anos-90","status":"publish","type":"post","link":"https:\/\/king.host\/blog\/tecnologia\/dia-da-saudade-e-a-web-anos-90\/","title":{"rendered":"Dia da Saudade e a Web Anos 90"},"content":{"rendered":"

Contamos com muitas mudan\u00e7as no desenvolvimento web desde 1991, quando o primeiro site<\/a> foi criado. Neste Dia da Saudade, que comemoramos em 30\/01, vamos relembrar elementos que fizeram parte da hist\u00f3ria da web e da nossa hist\u00f3ria profissional. Sofremos e nos divertimos com esses m\u00e9todos e tecnologias, hoje considerados completamente obsoletos. Quando sa\u00edram de cena, deram lugar a t\u00e9cnicas e padr\u00f5es mais elegantes e eficientes. No entanto, ainda hoje, ficamos impressionados e sentimos uma pontinha de nostalgia ao ver as \u201cprodu\u00e7\u00f5es\u201d daquele tempo, n\u00e3o \u00e9!?<\/p>\n

Para os exemplos que citamos, vamos mostrar p\u00e1ginas hist\u00f3ricas dos gloriosos anos 90. Elas est\u00e3o intactas e ainda no ar, com detalhes em HTML 2.0, com frames e gifs animados perfeitamente preservados.<\/p>\n

O Navegador Netscape<\/h3>\n

Inicialmente o Netscape foi o navegador dominante em termos de popularidade e uso. Anos depois, com a chegada do rival – Internet Explorer -, o Netscape perdeu praticamente toda a sua participa\u00e7\u00e3o no mercado.<\/p>\n

\"Netscape_1\"<\/p>\n

A tag <body> e seus acompanhantes<\/h3>\n

Todos os sites tinham uma estrutura b\u00e1sica, com 4 propriedades que n\u00e3o podiam faltar: a tag <body>  acompanhada dos 4 parametros de margem\u2014 LEFT, TOP, WIDTH, HEIGTH. Para ilustrar o uso do <body> centralizado, o site de buscas de 1995 I Find It<\/a> (melhor visualizado em resolu\u00e7\u00e3o 800\u00d7600 \u00e9 claro!):<\/p>\n

\"cinza\"<\/p>\n

O truque do pixel transparente dentro da tabela<\/h3>\n

A tag <table> e suas acompanhantes eram uma das ferramentas mais utilizadas. Os layouts eram projetados e desenvolvidos usando os elementos <td> contendo um pixel transparente 1 \u00d7 1, redimensionado para o tamanho que a margem precisava ter. Na \u00e9poca, era mais comum usar tabelas em HTML para gerar um layout de grades do que para dispor dados tabulares. Um exemplo de site constru\u00eddo com tabelas, que ainda segue no ar, \u00e9 o site que a CNN fez para o julgamento de O.J. Simpson<\/a> l\u00e1 em 1996:<\/p>\n

\"oJSim\"<\/p>\n

 <\/p>\n

A tag super vers\u00e1til chamada <font><\/h3>\n

Dos t\u00edtulos \u00e0s legendas das imagens, format\u00e1vamos tudo via tag <font>. Gra\u00e7as a essa tag, que repet\u00edamos a cada c\u00e9lula da tabela que continha texto, era poss\u00edvel ter o \u201ccontrole\u201d de como o texto seria mostrado a partir dos navegadores. Um dos problemas do m\u00e9todo \u00e9 que, apesar das apar\u00eancias vis\u00edveis aos olhos humanos, o c\u00f3digo n\u00e3o expressava nenhuma hierarquia de informa\u00e7\u00f5es para os buscadores. Exemplo de site<\/a> que ainda segue online, o Ali Web foi o primeiro buscador da web, iniciando suas atividades em 1993:<\/p>\n

\"aliweb\"<\/p>\n

O uso das imagens<\/h3>\n

Enquanto a tag <font> era um tanto limitada em termos de op\u00e7\u00f5es de formata\u00e7\u00e3o, as combina\u00e7\u00f5es projetadas a partir dos softwares de imagens eram livres, e assim elas eram utilizadas nos sites. A imagina\u00e7\u00e3o era o limite. O melhor \u00e9 que diversos textos importantes do site eram dispostos atrav\u00e9s de imagens, sem o fornecimento da tag alt \u00e9 claro. Sendo assim, mais uma vez o texto era lido por humanos, mas n\u00e3o por rob\u00f4s de busca.<\/p>\n

Muitos sites caprichavam no background, inclusive com a inclus\u00e3o de gifs animados na apresenta\u00e7\u00e3o. O site DPGraph<\/a> ainda est\u00e1 online, ostentando desde 1997 seu visual psicod\u00e9lico atrav\u00e9s de gifs que representam elementos da matem\u00e1tica e da f\u00edsica.  \ud83d\ude1b<\/p>\n

\"giflouco\"<\/p>\n

O projeto Way Back Machine<\/a> pode ser usado para consultar vers\u00f5es antigas ou mesmo p\u00e1ginas web que j\u00e1 sa\u00edram do ar.<\/p>\n

Muitas vezes a hist\u00f3ria nos ensina como n\u00e3o fazer algo, este \u00e9 o caso com a web anos 90. Felizmente, agora a separa\u00e7\u00e3o do conte\u00fado e do estilo para o desenvolvimento web est\u00e1 bastante difundida. De modo geral, n\u00f3s conseguimos evoluir muito em metodologias e padr\u00f5es web. Para ficar por dentro e ter seus projetos \u00e0 prova de marca\u00e7\u00f5es obsoletas, confira as ferramentas de valida\u00e7\u00e3o do W3C<\/a>.<\/p>\n","protected":false},"excerpt":{"rendered":"

Contamos com muitas mudan\u00e7as no desenvolvimento web desde 1991, quando o primeiro site foi criado. Neste Dia da Saudade, que comemoramos em 30\/01, vamos relembrar elementos que fizeram parte da hist\u00f3ria da web e da nossa hist\u00f3ria profissional. Sofremos e nos divertimos com esses m\u00e9todos e tecnologias, hoje considerados completamente obsoletos. Quando sa\u00edram de cena, deram lugar […]<\/p>\n","protected":false},"author":253,"featured_media":9392,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1179,8],"tags":[1363],"class_list":["post-9386","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-desenvolvimento","category-tecnologia","tag-tecnologia"],"_links":{"self":[{"href":"https:\/\/king.host\/blog\/wp-json\/wp\/v2\/posts\/9386","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/king.host\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/king.host\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/king.host\/blog\/wp-json\/wp\/v2\/users\/253"}],"replies":[{"embeddable":true,"href":"https:\/\/king.host\/blog\/wp-json\/wp\/v2\/comments?post=9386"}],"version-history":[{"count":1,"href":"https:\/\/king.host\/blog\/wp-json\/wp\/v2\/posts\/9386\/revisions"}],"predecessor-version":[{"id":31379,"href":"https:\/\/king.host\/blog\/wp-json\/wp\/v2\/posts\/9386\/revisions\/31379"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/king.host\/blog\/wp-json\/wp\/v2\/media\/9392"}],"wp:attachment":[{"href":"https:\/\/king.host\/blog\/wp-json\/wp\/v2\/media?parent=9386"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/king.host\/blog\/wp-json\/wp\/v2\/categories?post=9386"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/king.host\/blog\/wp-json\/wp\/v2\/tags?post=9386"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}