Use o Dreamweaver 8 para alcançar “padrões da web”

Prefácio do tradutor: Esta série de artigos originais contém um total de 8 artigos. Ela começa com a popularização dos padrões da Web e descreve como usar o Dreamweaver 8 para construir uma Web compatível com os padrões. Site compatível com padrões próprios usando Dreamweaver 8 "(este artigo é um trecho pago), portanto, excluí o conteúdo apropriadamente. A ordem é consistente com o artigo original, mas o comprimento será ajustado. Venho por este meio informá-lo. O nível de tradução é limitado, por favor, entenda.

Se você está lendo este artigo, provavelmente já está interessado em padrões Web e está muito curioso sobre a aplicação de padrões em sites construídos com DW (abreviação de Dreamweaver).

Talvez você já tenha um certo conhecimento de WS (abreviação de Web Standards), mas não sabe como usar DW para escrever código compatível. Ou você é um usuário DW e gostaria de cumprir o WS, usar CSS de forma mais ampla e criar documentos mais fáceis de usar. Não importa que tipo você seja, este artigo lhe dará a resposta que você deseja: explicará como usar DW para lidar com WS.

Definição de Padrões Web

No que diz respeito aos WS que nos preocupam ao longo deste artigo, vamos primeiro tirar um momento para esclarecer do que estamos falando:

WS são especificações que orientam as linguagens de desenvolvimento Web e são formuladas pelo W3C. Essas especificações incluem múltiplas linguagens, como HTML, XHTML e CSS, bem como algumas outras linguagens relacionadas, como MathML, que são usadas para representar equações em matemática. Quando você tiver essas necessidades especiais, poderá usá-las. . O W3C também publica as Diretrizes de Acessibilidade de Conteúdo da Web (WCAG) - que promovem a acessibilidade das páginas da web (via WAI).

Dica:

você pode ler essas diretrizes diretamente no site do W3C, embora às vezes

seja

pouco

ler

:

HTML

4.01

Quem precisa de WS?

Você pode ter apenas uma vaga ideia de que WS é uma coisa boa, mas muitos sites - incluindo muitos sites bem conhecidos - não cumprem os WS e parecem ser bem gerenciados. Então, por que deveríamos nos esforçar para cumprir os WS. Há algum benefício real em fazer isso? Quem precisa prestar atenção às especificações e recomendações do W3C

?

desenvolvedores e designers

A marcação Clean torna a correção de bugs mais rápida

Se você validar suas páginas com o W3C, pelo menos saberá que a marcação irregular não é a causa dos erros que você encontrou. Às vezes, o processo de validação de uma página e correção de erros encontrados pode resolver problemas de exibição causados ​​por elementos intermináveis ​​ou tags com erros ortográficos.

Mesmo que a verificação do seu documento não resolva os problemas, pelo menos você saberá que os problemas existem no documento canônico. Agora que você sabe que esse problema não é um bug, você pode começar a se concentrar em outros problemas, como diferenças no tratamento de CSS em diferentes navegadores.

Cumprir os requisitos de acessibilidade é fácil.

Se você escrever uma marcação XHTML canônica, poderá garantir que o documento esteja semanticamente correto e separar o conteúdo do documento da apresentação, o que pode dar muito trabalho. problemas de acessibilidade listados nas WCAG1.0. Também é importante reconhecer que a acessibilidade não é apenas para pessoas com deficiência. Um site amigável pode ser acessado por diversos dispositivos, como celulares e PDAs, que não possuem poder de processamento para lidar com marcações dispersas e fora do padrão.

Compatibilidade futura

Se você considerar apenas o desempenho de sua página recém-desenvolvida nos navegadores atuais, como poderá garantir seu desempenho em novos navegadores no futuro? O novo navegador pode alterar sua página. A exibição é terrível e você fica com dificuldades? para encontrar e corrigir problemas irritantes.

A conformidade com o WS não erradicará completamente esse problema; no entanto, a compatibilidade dos padrões reduz bastante o risco de falha do seu projeto, e as empresas atuais de software de navegador também estão começando a oferecer suporte aos padrões. Eles podem acidentalmente interpretar mal alguma parte da especificação, mas não podem desaprová-la completamente. Se o pior acontecer e um novo navegador produzir efeitos estranhos em seu site padronizado, será muito mais fácil consertar isso do que um site incompatível. Se você encontrar um problema, ele também afetará outros sites compatíveis com os padrões. A sabedoria coletiva da comunidade da web apontará isso e escreverá artigos para abordar o assunto. Portanto, todos discutiram coletivamente que é mais fácil consertar esse BUG em um documento compatível do que em um documento incompatível.

Refatoração mais fácil

Você já teve que retirar o texto de um site e refatorá-lo e começar tudo de novo? Você já viu aqueles rótulos cheios de rótulos de fontes e minúsculas células de tabela (que nos fazem ter que começar do zero)? a refatoração deste site.

Separar o conteúdo e a apresentação de um documento proporciona a beleza da conformidade com os padrões: significa que da próxima vez que alguém quiser refatorar o site, não será necessário copiar o documento da Web. Todo o texto do site será marcado com (X)HTML semântico, e todas as informações da apresentação - que é o que o webmaster deseja alterar - serão armazenadas em um arquivo CSS facilmente substituível.

Alguns clientes não esperarão que ele seja refatorado antes de começarem a pedir que você faça algumas alterações. Eles esperarão até visitarem o Mammoth Fossil Pit e então pedirão que você diga: "Basta mover a coluna da esquerda para a direita. ." Para sites compatíveis padronizados, todas as páginas são controladas por CSS. Você pode mover facilmente as tags na página sem ter que pensar em truques em muitas páginas com tabelas complexas como estruturas. Isso facilita a alteração do layout da página.

Separar a estrutura da apresentação também pode facilitar a adição de novos elementos, como uma versão de um site com alto contraste e imagens pequenas, que pode ser mais atraente para alguns espectadores. Por que criar versões separadas somente de texto de páginas quando você pode alterar facilmente as folhas de estilo?

Empresas de software de navegador

As empresas de software de navegador estão começando a prestar atenção ao WS. No passado, as empresas de software de navegador adicionavam suas próprias tags e atributos proprietários à linguagem básica. Mas agora, como nunca antes, todos eles estão começando a cumprir os padrões, e alguns dos navegadores mais recentes já estão fazendo um esforço para exibi-los de acordo com (X)HTML e CSS conforme definido na especificação.

Num futuro próximo, os navegadores serão capazes de exibir a maioria das marcações e códigos fora do padrão, porque se não o fizerem, milhares de sites fora do padrão não serão exibidos corretamente - e então o público provavelmente começará a culpar o navegador, não os web designers. No entanto, outros dispositivos (aqueles sem o poder de processamento dos desktops) dependerão mais da compatibilidade padronizada do código que encontrarem.

Fornecedores de software de ferramentas de autoria

Os fornecedores de software de ferramentas de autoria — como a Macromedia, que fabrica o Dreamweaver — também estão começando a aderir ao WS, assim como os web designers, por exemplo, à medida que cada vez mais clientes exigem que essas ferramentas de autoria produzam marcação canônica. Originalmente, esses ambientes de desenvolvimento visual não tinham uma boa reputação porque produziam marcações confusas e não padronizadas. No entanto, os principais ambientes de desenvolvimento visual mais recentes invocaram elementos padronizados de compatibilidade e acessibilidade, o que também se tornou um principal ponto de venda; Os fornecedores de software devem ouvir e responder às necessidades do mercado.

Usuários da Web

Os usuários dos sites que criamos também se beneficiam com a adoção do WS, mesmo que não percebam. Talvez estejam inconscientemente usando sites desenvolvidos especificamente para os navegadores populares de hoje. Se esses usuários mudarem para outro navegador, poderão descobrir que a experiência on-line não será mais agradável porque essas tags proprietárias não serão aceitas pelo novo navegador. Um site padronizado e compatível funciona bem em diferentes navegadores, sejam navegadores existentes ou futuros.

Além disso, um site que segue as recomendações de acessibilidade será mais acessível aos usuários que consideram a navegação na web insatisfatória. A Web deve proporcionar condições mais convenientes de compra, leitura e pesquisa para pessoas com deficiência visual ou outras deficiências. Eles não devem ser impedidos de navegar em um site porque ele utiliza tags proprietárias ou outra tecnologia exclusiva (referente ao navegador).

Como podemos garantir o uso correto do WS ao

usar o WS

Primeiro, devemos cumprir a especificação? Isso significa que devemos usar apenas os elementos e atributos definidos na especificação e evitar o uso de certos atributos específicos do navegador, como a tag marquee do IE e a tag blink do Netscape. Também não utilize elementos que apareceram em especificações anteriores (como HTML 3.2) ou que foram removidos de especificações posteriores.

Crie um documento XHTML canônico

Neste artigo usaremos XHTML, portanto seguiremos as recomendações XHTML 1.0 do W3C [de acordo com o W3C, Recomendação significa especificação]. XHTML é basicamente a versão mais recente do HTML e foi projetado para substituir o HTML, a linguagem de marcação da web. Embora seja uma variante HTML do XML, o XHTML é quase idêntico ao HTML, com diferenças sutis que discutiremos mais adiante em XHTML e Semântica.

Você pode gerar um documento XHTML através da caixa de diálogo Novo documento no Dreamweaver (Arquivo>Novo...). Certifique-se de que Página base esteja selecionada na lista Categoria e selecione HTML na lista Página base, conforme mostrado na Figura 2.1, "Criando um novo documento XHTML no Dreamweaver". Você pode então selecionar qualquer tipo de documento na lista suspensa.

Figura 2.1: Criando um novo documento XHTML no Dreamweaver

Figura 2.2: Exibindo o novo documento XHTML na visualização de código

Clique em “Criar” para gerar um novo documento. Clique no botão de código na parte superior da janela do documento e vá para a "visualização de código". Você pode ver claramente qual código está incluído em um documento XHTML simples. Conforme mostrado na Figura 2.2, a primeira linha do

documento "Exibir novo documento XHTML na visualização de código" exibirá o seguinte conteúdo

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http: / /www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">Isso

é chamado de declaração de tipo de documento ou DOCTYPE. Como o nome sugere, DOCTYPE declara qual é o seu documento - qual especificação (X)HTML você está cumprindo. Neste exemplo, estamos seguindo o XHTML 1.0 Transitional, que é a configuração padrão para DW 8. A seção Transicional nos fornece algumas informações adicionais sobre a versão XHTML. XHTML1.0 tem três "sabores": Estrito, Transicional e Conjunto de quadros. DW usa o tipo Transicional por padrão, e se quiser inserir uma moldura no documento, é Frameset.

XHTML Strict é o formato XHTML mais estrito, como você provavelmente pode imaginar. Um tipo de documento Strict se parece com isto:

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">Se

você estiver usando um Strict DOCTYPE, não poderá usá-lo no documento Qualquer elemento (tag) ou atributo que declara obsoleta não pode ser usado em frames. Os elementos declarados obsoletos serão removidos em uma versão futura do XHTML. Muitos desses elementos são usados ​​para controlar a aparência da página, que pode ser totalmente substituída por CSS. A maior diferença entre Strict e Transitional é que ao usar Strict DOCTYPE, os atributos e elementos que você pensou que poderiam ser usados ​​para desempenho são bastante restritos.

Nota: Usar Strict DOCTYPE em DW

DW não é muito rigoroso no cumprimento do padrão. Se você utiliza Strict DOCTYPE, preste atenção especial na validação do seu documento e na correção de atributos irregulares. Basicamente, é fácil substituí-los por CSS.

Frameset DOCTYPE suporta o uso de molduras. Se você inserir uma moldura no documento, o DW usará automaticamente esse tipo. A página do quadro deve estar relacionada a pelo menos duas outras páginas e não há limite no tipo de documento das páginas relacionadas. O código do Frameset DOCTYPE é o seguinte:

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">

HTML 4.01 também fornece esses três "sabores" de tipos de documentos - Transicional, Estrito e Frameset - eles operam exatamente da mesma forma que os DOCTYPEs XHTML mencionados acima. Se você usar qualquer um dos tipos, deverá indicar isso no documento HTML (não XHTML). Discutiremos as diferenças entre HTML e XHTML em detalhes posteriormente na seção sobre como criar um site.

Original: Dreamweaver 8 faz padrões por Rachel Andrew

Compilado: x5!