Fundamentos e Tecnologia em Web Fundamentos e Tecnologia em Web Padrões WEB • Objetivos: –Apresentar os fundamentos básicos de criação de websites baseados nos atuais padões Web; –Apresentar uma visão geral do assunto; –Conhecer as principais formas utilizadas; Fundamentos e Tecnologia em Web O conhecimento dos Webstandards ou Padrões Web permite a implementação de layouts em HTML muito mais fácil e rapidamente. A separação dos códigos que definem a apresentação (CSS), o conteúdo (HTML) e o comportamento (DOM) oferece as seguintes vantagens: – manutenção mais fácil – tamanho do arquivo menor (economia de banda e velocidade no carregamento) – maior acessibilidade para o usuário – compatibilidade com diferentes navegadores Fundamentos e Tecnologia em Web Padrões WEB - Histórico • Os primeiros pensamentos sobre o que viria a ser a Web surgiram em 1945 quando Vanevar Bush escreveu um artigo descrevendo um aparelho foto-eletro-mecânico chamado Memex (abreviação de memory extension) que poderia criar e seguir links entre documentos armazenados em microfichas. • Doug Engelbart prototipou uma aplicação chamada oNLine System capaz de criar e editar documentos interligados. (Para o propósito de tornar a aplicação mais acessível, ele também inventou o mouse.) Fundamentos e Tecnologia em Web Padrões WEB - Histórico • Em 1965, Ted Nelson, em um dos seus trabalhos seminais, A File Structure for the Complex, the Changing and the Indeterminate, cunhou a palavra hipertexto para expressar essa categoria de documentos interligados. Dois anos depois, o primeiro sistema baseado em algumas de suas idéias foi criado. • Em 1980, os primeiros esforços na criação de uma estrutura real de informação baseada em documentos hipertextos começam quando Tim Berners-Lee, trabalhando para o CERN, desenvolveu uma aplicação capaz de criar e manipular nós entre documentos arbitrários. Fundamentos e Tecnologia em Web Padrões WEB - Histórico • Em 1989, Tim Berners-Lee circulou uma proposta para o gerenciamento facilitado de informação baseado em documentos hipertextos. A proposta foi recirculada em 1990 e, somente então, Berners-Lee recebeu permissão para criar o sistema. Em outubro desse ano, Berners-Lee começou a escrever a aplicação e a chamou de WorldWideWeb. • A aplicação era uma interface visual para a criação e exibição de documentos hipertexto suportando o modo WYSIWYG . Fundamentos e Tecnologia em Web Padrões WEB - Histórico • Como base na linguagem SGML, Berners-Lee criou o HTML como forma de expressar os documentos estruturados. Ele também resolveu o problema da identificação dos documentos criando o esquema de endereçamento universal conhecido com URL. Em novembro, durante os testes da aplicação, entrou em funcionamento o primeiro servidor Web da história. • Aqui nascia a WEB. Fundamentos e Tecnologia em Web Padrões WEB - Histórico • Em 1991, os primeiros servidores Web externos ao CERN foram criados. A grande revolução, entretanto, veio em 1993, quando o primeiro navegador Web, o NCSA Mosaic, foi liberado. • Em 1994, a Mosaic Communications Corp. é fundada e o Netscape, o primeiro navegador comercial da história é disponibilizado. A Web agora é uma realidade. Fundamentos e Tecnologia em Web Padrões WEB - Histórico • O crescimento da Web também trouxe seus problemas: – Os elementos contidos na linguagem HTML apenas definiam a estrutura básica de um documento, tais como cabeçalhos, listas, parágrafos, ênfase e similares. Não havia nada na linguagem em si que explicava com tais elementos deviam ser exibidos. – Nesse caso, o conteúdo era distintamente separado da apresentação e poderia ser visto em qualquer navegador sem inconvenientes Fundamentos e Tecnologia em Web Padrões WEB - Histórico • O crescimento da Web também trouxe seus problemas: – O desenvolvimento comercial dos navegadores e a necessidade destes de manter uma vantagem competitiva sobre os concorrentes levou à inclusão de elementos proprietários e/ou de apresentação nas implementações específicas. Assim, ao invés de usar o elemento h1, por exemplo, para a identificação do cabeçalho primário de documentos, as pessoas estavam usando o elemento font para forçar a exibição da maneira visual requerida. – Com isso veio a conhecida “Guerra dos Browsers”. Fundamentos e Tecnologia em Web Padrões WEB - Histórico • Em 1994, para lidar com essas questões, o Word Wide Web Consortium (W3C) foi criado e liderou um esforço de padronização do HTML, desta forma, uma especificação inicial para a versão 2.0, incluindo muitos dos elementos proprietários e outros necessários, foi criada. Essa especificação foi a primeira a apresentar elementos para formulários e suporte a imagens mapeadas. A especificação foi desenvolvida e finalmente aprovada no final de 1995. Fundamentos e Tecnologia em Web Padrões WEB - Histórico • A especificação 3.0 introduzia elementos como tabelas, fluxo do texto ao redor de imagens e a exibição de equações matemáticas. Embora fosse compatível com o HTML 2.0, ela era tão complexa e abrangente que a sua adoção provou-se uma esforço impossível na época e ela eventualmente expirou. • Em 1996, a especificação 3.2 foi anunciada, sendo constituída de várias extensões propostas para a especificação 2.0, algumas características da versão 3.0 já implementadas na época, e um série de atributos proprietários existentes em vários dos navegadores existentes no momento. Fundamentos e Tecnologia em Web Padrões WEB - Histórico • O avanço do HTML e a incorporação de muitos elementos de apresentação aumentaram a complexidade e a dificuldade na criação de documentos estruturados, negando o próprio objetivo do padrão. Para resolver essas questões, duas especificações surgiram em épocas distintas atacando problemas diferentes das implementações já existentes. Essas novas especificações foram o CSS e o XHTML. • Em meados de 1996 a primeira especificação CSS tornouse uma recomendação do W3C Fundamentos e Tecnologia em Web Padrões WEB - Histórico • Em 1998, foi decidido pelas organizações por trás do HTML que a especificação precisava ser repensada. A decisão foi recriá-la como uma aplicação do XML (eXtensible Markup Language) , outra metalinguagem criada a partir do SGML (Standard Generalized Markup Language ), mas com regras mais estritas. • A especificação XHTML 1.0 é basicamente uma estruturação da especificação HTML 4.0 em XML. A criação de uma nova especificação, XHTML 2.0, está em andamento focalizando os problemas existentes na especificacão 1.0 atual. Fundamentos e Tecnologia em Web Padrões WEB - Necessidade • O crescimento exponencial da Web criou muitos desafios que somente esses padrões eram capazes de responder. Algumas pessoas acreditam que os padrões Web são limitadores. A verdade é que eles removem grande parte da dificuldade do desenvolvimento dando maior flexibidade ao desenvolvedor e produtor Web, permitindo que as pessoas possam realmente exercer a sua criatividade ao mesmo tempo em que forjam elos de comunicação. Fundamentos e Tecnologia em Web Padrões WEB - Vantagens • Uniformidade – Uma estrutura comum permite que modificações tais como inserções e remoções de conteúdo ou movimentações estruturais podem ser realizadas de maneira simples, sem a necessidade de aplicações complexas. – uniformidade permite que documentos possam ser manipulados através de um conjunto reduzido de aplicações, transformações e mecanismos de apresentação. – Exemplo: www.csszengarden.com Fundamentos e Tecnologia em Web Padrões WEB - Vantagens • Simplicidade – retorno à utilização do HTML para a simples estruturação dos documentos, ignorando inicialmente a apresentação dos mesmos, que pode ser aplicada depois de diversas formas; – Documentos criados com os padrões tendem a apresentar uma economia de marcação que permite maior flexibidade na utilização dos mesmos, seja diretamente em navegadores ou na transformação para outros usos; – melhores tempos de acesso; – Exemplo: Mecanismo de busca. Fundamentos e Tecnologia em Web Padrões WEB - Vantagens • Liberdade – a liberdade de estruturação e inovação por não serem controlados por uma empresa específica, permitindo que sejam utilizados por qualquer pessoa em qualquer lugar, sem a necessidade de pagar ou fazer algo pelo privilégio ; – maior facilidade na movimentação de informações e evita que as mesmas se tornem obsoletas; – estará sempre aberto à movimentação na direção de outros padrões e sistemas ; Fundamentos e Tecnologia em Web Padrões WEB - Vantagens • Separação de estrutura e apresentação – o documento fica restrito ao seu conteúdo, sem especificar qualquer forma de apresentação, permitindo que esta seja modificada de acordo com as necessidades. Assim, o documento permanece o mesmo, embora possa ser usado em diferentes ambientes como navegadores, sintetizadores de fala, e geradores de documentos Braille; Fundamentos e Tecnologia em Web Padrões WEB - Vantagens • Facilidade de criação – qualquer tipo de layout pode ser criado a partir de CSS e isso permite que essa etapa da construção de sites seja realizada independentemente do desenvolvimento de conteúdo; – O conteúdo pode ser editado em qualquer processador de textos e posteriormente estruturado. Fundamentos e Tecnologia em Web Padrões WEB - Vantagens • Assessibilidade – permitir que pessoas com deficiências físicas tenham acesso à Web, e também capacitar a utilização das páginas por e em outros tipos de ambientes que não um navegador ; – evita a duplicação de conteúdo e facilita a utilização geral dos documentos; – auxilia também pessoas que não possuem deficiências físicas melhorando a manipulação das páginas por teclas de atalho e outros métodos Fundamentos e Tecnologia em Web Padrões WEB - Vantagens • Extensibilidade – permite que documentos criados com os padrões agreguem informações adicionais que podem ser separadas quando não são necessárias; – preparar documentos para usos imprevistos no futuro. Fundamentos e Tecnologia em Web Padrões WEB - Vantagens • Estabilidade – os documentos feitos sob os mesmos permanecerão compatíveis tanto para frente como para trás ; – na manutenção de documentos. Muitas vezes um determinado site pode passar por várias equipes durante sua vida útil. A estabilidade dos documentos através dos padrões Web permite que um site possa ser compreendido e editado por qualquer grupo necessário sem necessidade de esforços excessivos. Fundamentos e Tecnologia em Web Padrões WEB - Desvantagens • Implementações discordantes – Um determinado atributo CSS normalmente é renderizado de maneira muito diferente em cada um dos navegadores visuais em existência hoje; – diferença entre os modelos de unidade de medição dos elementos entre os navegadores Web que gera um série de complicações na exibição das páginas; – O suporte XHTML também é muito incompleto nos navegadores e seu uso ainda é muito restrito por parte dos desenvolvedores. Fundamentos e Tecnologia em Web Padrões WEB - Desvantagens • Aumento da complecidade inicial – Isso pode parecer contraditório em relação à vantagem da simplicidade citada anteriormente, mas na realidade não é. Esse desvantagem só existe inicialmente, quando os criadores de documentos estão fazendo uma transição para o uso de padrões. Assim, mesmo que essa desvantagem desapareça com o tempo ela implica em necessidades de treinamento e esforço inicial. Fundamentos e Tecnologia em Web Padrões WEB - Estruturando um Documento • Construir um site com os padrões Web significa tomar as providências necessárias para que cada documento no site conformese às especificações do formato em que é servido e a especificações adicionais de auxílio ao uso do mesmo. Isso implica em não somente ter um documento que atenda à letra das especificações mas que também seja estruturado apropriadamente. Fundamentos e Tecnologia em Web Padrões WEB - Estruturando um Documento • Um site deve ser: – Perceptível • Isso significa que o conteúdo presente no site deve ser apresentado de uma forma que é perceptível para qualquer pessoa, ou seja, o site deve ser capaz de degradar graciosamente sob as mais rigorosas condições. – Operável • Isso significa que os elementos de interface presentes em um site devem ser operáveis por qualquer pessoa, ou seja, o site deve facilitar a navegação e a orientação através do conteúdo do mesmo. Fundamentos e Tecnologia em Web Padrões WEB - Estruturando um Documento – Inteligível • Isso significa que o site deve tornar fácil a identificação de seu conteúdo e dos seus controles acessórios, ou seja, o site deve ser auto-evidente e não colocar nenhum ônus sobre usuários menos experimentados ou com dificuldades de acesso. – Robusto • Isso significa que o site deve usar tecnologias que maximizam a compatibilidade de sua estrutura com navegadores atuais e futuros, tecnologias de acessibilidade e outros programas, ou seja, o site deve ser capaz de preservar a sua integridade tecnológica. Fundamentos e Tecnologia em Web Padrões WEB - Estruturando um Documento – Inteligível • Isso significa que o site deve tornar fácil a identificação de seu conteúdo e dos seus controles acessórios, ou seja, o site deve ser auto-evidente e não colocar nenhum ônus sobre usuários menos experimentados ou com dificuldades de acesso. – Robusto • Isso significa que o site deve usar tecnologias que maximizam a compatibilidade de sua estrutura com navegadores atuais e futuros, tecnologias de acessibilidade e outros programas, ou seja, o site deve ser capaz de preservar a sua integridade tecnológica. Fundamentos e Tecnologia em Web Padrões WEB - Arquitetura É a organização de grande volume de informação, de forma que os visitantes possam ter acesso a informação de forma fácil e eficiente. Fundamentos e Tecnologia em Web Padrões WEB - Arquitetura É a organização de grande volume de informação, de forma que os visitantes possam ter acesso a informação de forma fácil e eficiente. Fundamentos e Tecnologia em Web Padrões WEB – Etapas de um projeto Fundamentos e Tecnologia em Web Protocolos Web Protocolo é a comunicação entre computadores, seguindo algumas regras. No caso da Internet existem três camadas: na mais baixa está o IP (Internet Protocol), que define datagramas ou pacotes que carregam blocos de dados de um nó da rede para outro. A maior parte da Internet atual utiliza a IPv4, quarta versão do protocolo, apesar de o IPv6 já estar padronizado, sendo usado em algumas redes específicas somente. Fundamentos e Tecnologia em Web Protocolos Web Na camada média está o TCP, UDP e ICMP, que possibilitam a transmissão de dados. Na camada mais alta estão os protocolos de aplicação, que definem mensagens específicas e formatos digitais comunicados por aplicações. Alguns dos protocolos de aplicação mais usados incluem DNS (informações sobre domínio), POP3 (recebimento de email), IMAP (acesso de e-mail), SMTP (envio de email), HTTP (documentos da WWW) e FTP (transferência de dados). Fundamentos e Tecnologia em Web Protocolos Web – SSL Fundamentos e Tecnologia em Web Protocolos Web – http e https Hypertext Transfer Protocol - Protocolo de Transferência de Hipertexto é um protocolo de comunicação (na camada de aplicação segundo o Modelo OSI) utilizado para sistemas de informação de hipermedia distribuídos e colaborativos. Seu uso para a obtenção de recursos interligados levou ao estabelecimento da World Wide Web. Fundamentos e Tecnologia em Web Protocolos Web – http e https Hypertext Transfer Protocol Secure - Protocolo de Transferência de Hipertexto Seguro) é uma implementação do protocolo HTTP sobre uma camada SSL ou do TLS que permite que os dados sejamatravés de uma conexão criptografada e que se verifique a autenticidade do servidor e do cliente através de certificados digitais. O protocolo HTTPS é utilizado, em regra, quando se deseja evitar que a informação possa ser visualizada por terceiros. A existência na barra de tarefas (normalmente do lado direito) de um cadeado demonstra a certificação de página segura (SSL). Fundamentos e Tecnologia em Web Protocolos Web – SSL SSL é o protocolo mais usado para implementar criptografia na Internet (pois é o mais usado na web). Ele funciona como uma camada intermediária entre as camadas de transporte e de aplicação