Informações gerais sobre a codificação no Dreamweaver

Saiba mais sobre como o Dreamweaver oferece suporte aos diferentes idiomas de codificação usados para construir sites.

As linguagens de programação mais populares para criar e desenvolver sites totalmente funcionais são HTML, HTML5 e CSS para front-end e PHP, JavaScript, Java e jQuery para back-end.

Você pode projetar a aparência de um site (por exemplo, fontes e cores) usando CSS. E, depois, você pode usar HTML para inserir imagens, texto, vídeos, formulários e outros tipos de conteúdo para criar uma página Web coesa.

Usando CSS e HTML juntos, você pode construir um site estático. No entanto, a maioria dos sites requer algum tipo de interação (como solicitar que o cliente preencha um formulário ou faça um pagamento) e um banco de dados para armazenar os dados do site.

Para criar esses canais back-end de comunicação, você precisa de uma linguagem de programação no lado do servidor (como PHP) que se comunica com o banco de dados.

Linguagens de programação compatíveis com o Dreamweaver

Além dos recursos de edição de texto, o Adobe Dreamweaver oferece vários recursos, como dicas de código, para ajudar você a codificar nas seguintes linguagens:

HTML
PHP
CSS
JavaScript

Não há suporte para outras linguagens, como Perl, nos recursos de codificação específicos de linguagem no Dreamweaver; por exemplo, você pode criar e editar arquivos Perl, mas as dicas de código não se aplicam a essa linguagem.

Modificação automática de código

Você pode definir opções que instruam o Dreamweaver limpar automaticamente o código manuscrito de acordo com os critérios especificados. No entanto, o código nunca é regravado, a menos que as opções de regravação de código sejam ativadas ou que você execute uma ação que altere o código. Por exemplo, o Dreamweaver não altera o espaço em branco nem altera as maiúsculas e minúsculas dos atributos, a menos que você use o comando Aplicar formatação de origem.

Algumas dessas opções de regravação de código são ativadas por padrão.

Os recursos de Roundtrip HTML do Dreamweaver permitem que você mova os documentos para frente e para trás entre um editor HTML baseado em texto e o Dreamweaver com pouco ou nenhum efeito no conteúdo e na estrutura do código-fonte HTML original do documento. Esses recursos incluem:

Você pode usar um editor de texto de terceiros para editar o documento atual.
Por padrão, o Dreamweaver não altera o código criado ou editado em outros editores HTML, mesmo se o código for inválido, a menos que você ative as opções de regravação de código.
O Dreamweaver não altera tags que não reconheça, incluindo as tags XML, porque ele não tem critérios que possa usar para julgá-las. Se uma tag não reconhecida sobrepuser outra tag (por exemplo, <MyNewTag><em>text</MyNewTag></em>), o Dreamweaver a marcará como um erro, mas não regravará o código.
Se desejar, defina o Dreamweaver para realçar o código inválido na Visualização de código (em amarelo). Quando você selecionar uma seção realçada, o Inspetor de propriedades exibirá as informações sobre como corrigir o erro.

Código XHTML

O Dreamweaver gera o novo código XHTML e limpa o código XHTML existente de uma forma que atenda à maioria dos requisitos XHTML. As ferramentas de que você precisa para atender a alguns requisitos XHTML restantes também são fornecidos.

Observação:

alguns requisitos também são necessários em várias versões HTML.

A tabela a seguir descreve os requisitos XHTML aos quais o Dreamweaver atende automaticamente:

Requisito XHTML	Ações do Dreamweaver
Deve haver uma declaração DOCTYPE no documento anterior ao elemento raiz e a declaração deve referenciar um dos três arquivos de definição de tipo de documento (DTD) para XHTML (strict, transitional ou frameset).	Adiciona um XHTML DOCTYPE a um documento XHTML: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> Se o documento XHTML tiver um conjunto de quadros: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
O elemento raiz do documento deve ser html e o elemento html deve designar o espaço para nome XHTML.	Adiciona o atributo namespace ao elemento html, da seguinte maneira: <html xmlns="http://www.w3.org/1999/xhtml">
Um documento padrão deve ter os elementos estruturais head, title e body. Um documento de conjunto de quadros deve ter os elementos estruturais head, title e frameset.	Um documento padrão inclui os elementos head, title e body. Um documento de conjunto de quadros inclui os elementos head, title e frameset.
Todos os elementos do documento devem ser adequadamente aninhados: <p>Este é um <i>péssimo exemplo.</p></i> <p>Este é um <i>bom exemplo.</i></p>	Gera um código corretamente aninhado e, ao limpar o XHTML, corrige o aninhamento do código que não foi gerado pelo Dreamweaver.
Todos os nomes de elemento e atributo devem ser minúsculos.	Força os nomes de elemento e atributo HTML a estarem em minúsculas no código XHTML gerado e ao limpar o XHTML, independentemente das preferências de minúsculas ou maiúsculas da tag e do atributo.
Cada elemento deve ter uma tag de finalização, a não ser que isso seja declarado na DTD como EMPTY.	Insere tags de finalização no código gerado e ao limpar o XHTML.
Os elementos vazios devem ter uma tag de finalização ou a tag de abertura deve ser finalizada com />. Por exemplo, <br> não é válido. A forma correta é <br></br> ou <br/>. Estes são os elementos vazios: area, base, basefont, br, col, frame, hr, img, input, isindex, link, meta e param. Para compatibilidade com versões anteriores em navegadores que não são ativados para XML, deve haver um espaço antes de /> (por exemplo, <br />, e não <br/>).	Insere elementos vazios com um espaço antes da barra de fechamento nas tags vazias do código gerado e ao limpar o XHTML.
Os atributos não podem ser minimizados; por exemplo, <td nowrap> não é válido. A forma correta é <td nowrap="nowrap">. Isso afeta os seguintes atributos: checked, compact, declare, defer, disabled, ismap, multiple, noresize, noshade, nowrap, readonly e selected.	Insere pares completos de atributo/valor no código gerado e ao limpar o XHTML. Nota: se um navegador HTML não oferecer suporte a HTML 4, pode ser que ele não consiga interpretar esses atributos boolianos quando eles aparecerem na forma completa.
Todos os valores de atributo devem ser envolvidos por aspas.	Delimita os valores de atributo com aspas no código gerado e ao limpar o XHTML.
Os seguintes elementos devem ter um atributo id, bem como um atributo name: a, applet, form, frame, iframe, img e map. Por exemplo, <a name="intro">Introduction</a> não é válido; a forma correta é <a id="intro">Introduction</a> ou <a id="section1" name="intro"> Introduction</a>.	Define os atributos name e id para o mesmo valor, sempre que o atributo name é definido por um Inspetor de propriedades no código gerado pelo Dreamweaver e ao limpar o XHTML.
No caso dos atributos com valores de um tipo enumerado, os valores devem estar em minúsculas. Um valor de tipo enumerado é um valor que consta em uma lista especificada de valores permitidos; por exemplo, o atributo align tem os seguintes valores permitidos: center, justify, left e right.	Força os valores de tipo enumerado a serem minúsculos no código gerado e ao limpar o XHTML.
Todos os elementos de script e estilo devem ter um atributo type. (O atributo type do elemento script tem sido obrigatório desde o HTML 4, quando o atributo language se tornou obsoleto.)	Define os atributos type e language nos elementos script e o atributo type nos elementos style, no código gerado e ao limpar o XHTML.
Todos os elementos img e area devem ter um atributo alt.	Define esses atributos no código gerado e, ao limpar o XHTML, relata atributos alt ausentes.

Expressões regulares

As expressões regulares são padrões que descrevem combinações de caracteres em texto. Use-as nas pesquisas de código para descrever conceitos como linhas que começam com ‘var’” e valores de atributo que contêm um número.

A tabela a seguir lista os caracteres especiais nas expressões regulares, seus significados e exemplos de uso. Para procurar um texto que contenha um dos caracteres especiais da tabela, aplique o escape ao caractere especial precedendo-o com uma barra invertida. Por exemplo, para procurar o asterisco real na frase some conditions apply*, o padrão de pesquisa pode ter a seguinte aparência: apply\*. Se você não aplicar o escape ao asterisco, encontrará todas as ocorrências de “apply” (bem como qualquer ocorrência de “appl”, “applyy” e “applyyy”), e não apenas as seguidas por asterisco.

Caractere	Corresponde a	Exemplo
^	Início da entrada ou linha.	^T corresponde a “T” em “This good earth”, mas não em “Uncle Tom’s Cabin”
$	Fim da entrada ou linha.	h$ corresponde a “h” em “teach”, mas não em “teacher”
*	O caractere precedente 0 ou mais vezes.	um* corresponde a “um” em “rum”, “umm” em “yummy” e “u” em “huge”
+	O caractere precedente uma ou mais vezes.	um+ corresponde a “um” em “rum” e “umm” em “yummy”, mas não tem nenhuma correspondência em “huge”
?	O caractere precedente no máximo uma vez (ou seja, indica que o caractere precedente é opcional).	st?on corresponde a “son” em “Johnson” e “ston” em “Johnston”, mas não tem nenhuma correspondência em “Appleton” ou “tension”
.	Qualquer caractere único, exceto o caractere de nova linha.	.an corresponde a “ran” e “can” na frase “bran muffins can be tasty”
x\|y	x ou y	FF0000\|0000FF corresponde a “FF0000” em bgcolor=”#FF0000” e “0000FF’” em font color=”#0000FF”
{n}	Exatamente n ocorrências do caractere precedente.	o{2} corresponde a “oo” em “loom” e às duas primeiras letras o em “mooooo”, mas não tem nenhuma correspondência em “money”
{n,m}	No mínimo n e no máximo m ocorrências do caractere precedente.	F{2,4} corresponde a “FF” em “#FF0000” e às quatro primeiras letras F em #FFFFFF
[abc]	Qualquer um dos caracteres entre colchetes. Especifique uma faixa de caracteres com um hífen (por exemplo, [a-f] equivale a [abcdef]).	[e-g] corresponde a “e” em “bed”, “f” em “folly” e ”g” em “guard”
[^abc]	Qualquer caractere que não está entre colchetes. Especifique uma faixa de caracteres com um hífen (por exemplo, [^a-f] equivale a [^abcdef]).	[^aeiou] corresponde inicialmente a “r” em “orange”, “b” em “book” e “k” em “eek!”
\b	Um limite de palavra (como um espaço ou um retorno de carro).	\bb corresponde a “b” em “book”, mas não tem nenhuma correspondência em “goober” ou “snob”
\B	Algo que não seja um limite de palavra.	\Bb corresponde a “b” em “goober”, mas não tem nenhuma correspondência em “book”
\d	Qualquer caractere de dígito. Equivalente a [0-9].	\d corresponde a “3” em “C3PO” e “2” em “apartment 2G”
\D	Qualquer caractere que não seja dígito. Equivalente a [^0-9].	\D corresponde a “S” em “900S” e “Q” em “Q45”
\f	Feed de formulário.
\n	Feed de linha.
\r	Retorno de carro.
\s	Qualquer caractere único de espaço em branco, incluindo espaço, tabulação, feed de formulário ou feed de linha.	\sbook corresponde a ”book” em “blue book”, mas não tem nenhuma correspondência em “notebook”
\S	Qualquer caractere único de espaço que não seja em branco.	\Sbook corresponde a “book” em “notebook”, mas não tem nenhuma correspondência em “blue book”
\t	Uma tabulação.
\w	Qualquer caractere alfanumérico, incluindo sublinhado. Equivalente a [A-Za-z0-9_].	b\w* corresponde a “barking” em “the barking dog”, e “big” e “black” em “the big black dog”
\W	Qualquer caractere que não seja alfanumérico. Equivalente a [^A-Za-z0-9_].	\W corresponde a “&” em “Jake&Mattie” e “%” em “100%”
Control+Enter ou Shift+Enter (Windows), ou Control+ Return ou Shift+Return ou Command+ Return (Macintosh)	Caractere de retorno. Verifique se você desmarcou a opção Ignorar diferenças de espaço em branco ao realizar essa pesquisa, caso não esteja usando expressões regulares. Observe que isso corresponde a um caractere específico, e não à noção geral de uma quebra de linha. Por exemplo, isso não corresponde a uma tag <br> ou <p>. Os caracteres de retorno aparecem como espaços na Visualização de design, e não como quebras de linha.

Use parênteses para executar agrupamentos na expressão regular que será referenciada posteriormente. Em seguida, use $1, $2, $3 e assim sucessivamente, no campo Substituir por para se referir ao primeiro, segundo, terceiro e subsequentes agrupamentos entre parênteses.

Observação:

na caixa Procurar por, para se referir a um agrupamento entre parênteses anterior na expressão regular, use \1, \2, \3 e assim por diante, em vez de $1, $2, $3.

Por exemplo, a procura por (\d+)\/(\d+)\/(\d+) e sua substituição por $2/$1/$3 trocará o dia e o mês em uma data separada por barras, convertendo entre datas em estilo americana e em estilo europeu.

Código de comportamento de servidor

Quando você desenvolver uma página dinâmica e selecionar um comportamento de servidor no painel Comportamentos de servidor, o Dreamweaver inserirá um ou mais blocos de código na página para fazer com que o comportamento de servidor funcione.

Se você alterar manualmente o código em um bloco de códigos, não poderá usar mais painéis como Ligações e Comportamentos de servidor. O Dreamweaver procura padrões específicos no código de página para detectar comportamentos de servidor e exibi-los no painel Comportamentos de servidor. Se você alterar o código em um bloco de códigos de qualquer forma, o Dreamweaver não poderá mais detectar o comportamento do servidor e exibi-lo no painel Comportamentos de servidor. No entanto, o comportamento do servidor ainda existirá na página e você poderá editá-lo no ambiente de codificação do Dreamweaver.

Sobre codificação no Dreamweaver

Linguagens de programação compatíveis com o Dreamweaver

Modificação automática de código

Código XHTML

Expressões regulares

Código de comportamento de servidor

Artigos relacionados

Receba ajuda com mais rapidez e facilidade

Pergunte à comunidade

Fale conosco