Os links não são um detalhe
As ligações determinam como pessoas e sistemas encontram, classificam e relacionam conteúdos.
Uma viagem pelo mundo do desenvolvimento web
Embarque em uma jornada desde a ideia do que mais tarde ficou conhecido como hipertexto,
passando pelos primeiros sistemas de hipertexto até a web atual.
Entenda as origens do hipertexto e, portanto, da própria web.
Evolução dos sistemas de hipertexto
Dos primórdios à era moderna
1945
Memex
Apresentado no artigo ‘As We May Think’ de Vannevar Bush (The Atlantic)
Um conceito visionário de Vannevar Bush que lançou as bases do hipertexto e do desenvolvimento web moderno: organizar e ligar informações como nas bases de dados e links atuais.
1960
Xanadu
Projeto iniciado nos anos 1960; primeiro sistema publicado em 1988
Projeto revolucionário de Ted Nelson para um sistema de hipertexto transclusivo. Influenciou tecnologias posteriores e a forma de pensar informação interligada.
1968
oN-Line System (NLS)
Nome oficial do sistema mostrado na ‘Mother of All Demos’
Sistema pioneiro de Douglas Engelbart com rato e edição de texto interativa – pilares da interação moderna.
1968
Augment
Apresentado na lendária ‘Mother of All Demos’
Um dos primeiros sistemas de hipertexto para ampliar a capacidade humana – um marco na interação com sistemas digitais.
1980
Enquire
Desenvolvido por Tim Berners-Lee no CERN – precursor da Web
Primeiro sistema de hipertexto de Berners-Lee que concretizou a informação interligada e inspirou a Web.
1980
Tangle
Sistema experimental de Tim Berners-Lee
Desenvolveu as ideias do Enquire com foco em redes de informação complexas.
1987
HyperCard
Apresentado pela Apple – facilitou a criação de conteúdo ligado
Ferramenta para criar conteúdo interativo e ligado – precursora de muitas apps web modernas.
1989
World Wide Web
Conceito de 1989; primeiro website online em 1991
Sistema de hipertexto de Tim Berners-Lee que popularizou a informação ligada e revolucionou o acesso ao conhecimento.
Por que o hipertexto é importante
A base do desenvolvimento web moderno
Antes da web existir, surgiu a ideia de hipertexto: conectar informações entre si.
Este conceito é a origem do que hoje conhecemos como Internet e desenvolvimento web moderno.
Compreender a história do hipertexto revela também as bases sobre as quais se constroem HTML, CSS, JavaScript e outras tecnologias web.
O que o hipertexto significa hoje
De links e SEO até uma arquitetura de informação limpa
SEO começa na estrutura
Se compreendes o hipertexto, também percebes melhor porque a ligação interna, a semântica e o contexto importam para os motores de busca.
Os problemas começam muitas vezes na estrutura
Navegação pouco clara, relações caóticas entre páginas e ausência de hierarquia raramente são problemas de design. São problemas de estrutura.
Desenvolvimento da rede de informação
De sites estáticos à inteligência artificial
1990er
Web 1.0
Páginas estáticas, HTML e CSS básico
A Web 1.0 era principalmente centrada em documentos. Os usuários podiam ler informações, mas raramente criar conteúdo próprio.
2000er
Web 2.0
Redes sociais, JavaScript, AJAX
Com a Web 2.0, a internet tornou-se mais interativa. Os usuários podiam criar, comentar e compartilhar conteúdos.
2010er
Web 3.0
Web semântica, APIs, Linked Data
Na Web 3.0, os dados estão no centro. A informação é melhor conectada e legível por máquinas, permitindo aplicações inteligentes.
2020er
Web 4.0
Sistemas inteligentes, IA, experiências personalizadas
A Web 4.0 combina inteligência artificial com a internet. O objetivo é uma web autoaprendente, ciente do contexto e altamente personalizada.
Cada fase da web resolve um problema e cria outro
O progresso na web é sempre uma troca
Web 1.0
As páginas estáticas tornaram o conhecimento acessível, mas os utilizadores quase não podiam reagir, participar ou influenciar.
Web 2.0
A interação tornou-se mais fácil, mas as plataformas ganharam enorme controlo sobre conteúdo, alcance e dados.
Web 3.0
Os dados tornaram-se mais estruturados e ligados, mas também mais complexos, mais difíceis de modelar e muitas vezes mais difíceis de usar bem.
Web 4.0
Contexto e IA prometem sistemas melhores, mas trazem novas questões sobre dependência, rastreabilidade e qualidade.
Fundamentos da Web
Os blocos de construção sobre os quais tudo se apoia
A web moderna é construída sobre um conjunto de tecnologias fundamentais que definem sua estrutura e funcionamento.
O HTML fornece a espinha dorsal ao estruturar o conteúdo, o CSS cuida do design e do layout, enquanto o JavaScript permite interatividade e comportamento dinâmico.
Juntos, essas ferramentas formam a base sobre a qual cada site e aplicação web é desenvolvido.
Marcos do desenvolvimento web
Visões sobre o desenvolvimento web moderno
2010
Single Page Applications (SPA)
Experiência fluida sem recarregar a página
Aplicações dinâmicas e interativas com carregamento assíncrono – popularizadas por frameworks como React e Vue.
2011
Web Components
Blocos de UI reutilizáveis e multiplataforma
Elementos HTML personalizados reutilizáveis em qualquer app; habilitados por padrões como Shadow DOM e Custom Elements.
2011
WebRTC
Comunicação em tempo real no navegador
Áudio, vídeo e dados sem plugins – base de muitas ferramentas modernas de comunicação.
2015
Progressive Web Apps (PWA)
Rápidas, fiáveis e multiplataforma
Combinam o melhor de sites e apps nativas: offline, notificações push e experiência semelhante a app no navegador.
2015
Service Worker e Web Push
Funcionalidades offline e notificações
Permitem acesso offline e notificações em tempo real – tornam as PWA potentes e flexíveis.
2015
Jamstack
Arquitetura para sites rápidos e seguros
Desacopla frontend e backend, combinando entrega estática com APIs dinâmicas para desempenho e segurança.
2015
Compressão Brotli
Maior compressão do que Gzip
Carregamentos mais rápidos graças à compressão mais eficiente e menor uso de dados.
2017
WebAssembly (WASM)
Alto desempenho na web
Permite desempenho quase nativo ao executar código compilado (p. ex., C++/Rust) no navegador.
2018
HTTP/3 e QUIC
Ligações mais eficientes via UDP
Ligações mais rápidas e estáveis com menor latência – especialmente em redes móveis.
2021
Privacy Sandbox
Iniciativa de privacidade para uma web sem cookies
Visa melhorar a privacidade sem cookies de terceiros, permitindo ainda anúncios relevantes.
2022
WebTransport
Dados em tempo real via UDP
Permite comunicação em tempo real de alto desempenho para jogos, streaming e mais.
2022
Container Query CSS
Mais flexibilidade para design responsivo
Regras baseadas no tamanho do contêiner em vez do viewport – muito melhor controlo de layout.
2023
WebGPU
Substituto moderno do WebGL
Acesso direto à GPU para 3D e ML no navegador – desempenho muito superior.
Porque existem tecnologias modernas
Novas ferramentas surgem porque os limites antigos doem
O desenvolvimento web moderno é interessante, mas acima de tudo é uma resposta a gargalos reais. A questão principal não é apenas o que é novo, mas que problema isso pretende resolver.
SPA
As Single Page Applications nasceram para tornar a interação mais fluida. Em troca, navegação, carregamento inicial e SEO tornaram-se muito mais difíceis.
HTTP/3
HTTP/3 existe porque o TCP e as ligações clássicas atingem limites com latência e perda de pacotes. O QUIC responde exatamente a esse problema.
WebGPU
WebGPU não é apenas mais um nome de API. É uma resposta à necessidade de mais potência gráfica e de cálculo diretamente no navegador.
TTT: Dicas – Truques – Ferramentas
Blog de desenvolvimento web
Descubra neste blog onde o desenvolvimento web teve sua origem e obtenha dicas úteis, coleções de links, artigos, bem como documentos digitais e cursos em vídeo para se aprofundar no assunto.
Da Web 1.0 estática e centrada em documentos, passando pela Web 2.0 social e pela Web 3.0 semântica, até chegar à Web 4.0 inteligente.
Descubra como o desenvolvimento web moderno é moldado hoje: conheça as tecnologias e tendências mais recentes, obtenha orientações práticas e acesso a recursos valiosos como ferramentas, frameworks e comunidades online que ajudam a levar seus projetos para o próximo nível.