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 programar nas seguintes linguagens:
- HTML
- PHP
- CSS
- JavaScript
Outras linguagens, como Perl, não são compatíveis com os recursos de codificação específicos da 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 instruem o Dreamweaver a limpar automaticamente o código escrito manualmente de acordo com os critérios especificados.No entanto, o código nunca é reescrito, a menos que as opções de reescrita de código estejam ativadas ou você execute uma ação que altere o código.Por exemplo, o Dreamweaver não altera o espaço em branco ou muda a capitalização 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 HTML Roundtrip no Dreamweaver permitem mover documentos de um lado para o outro 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 faz alterações no 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 reescrita de código.
O Dreamweaver não altera tags que não reconhece—incluindo tags XML—porque não tem critérios pelos quais julgá-las.Se uma tag não reconhecida se sobrepõe a outra tag (por exemplo, <MyNewTag><em>text</MyNewTag></em>), o Dreamweaver a marca como erro, mas não reescreve o código.
Opcionalmente, você pode configurar o Dreamweaver para realçar código inválido na visualização Código (em amarelo).Ao selecionar uma seção realçada, o Inspetor de propriedades exibe informações sobre como corrigir o erro.
Código XHTML
O Dreamweaver gera novo código XHTML e limpa código XHTML existente de forma que atenda à maioria dos requisitos XHTML.As ferramentas necessárias para atender aos poucos requisitos XHTML restantes também são fornecidas.
Alguns dos requisitos também são obrigatórios em várias versões do 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 antes do elemento-raiz, e a declaração deve fazer referência a 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"> Ou, se o documento XHTML tiver um frameset: <!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 namespace XHTML. |
Adiciona o atributo namespace ao elemento html, da seguinte forma: <html xmlns="http://www.w3.org/1999/xhtml"> |
Um documento padrão deve ter os elementos estruturais head, title e body.Um documento frameset deve ter os elementos estruturais head, title e frameset. |
Em um documento padrão, inclui os elementos head, title e body.Em um documento frameset, inclui os elementos head, title e frameset. |
Todos os elementos do documento devem ser adequadamente aninhados: <p>Este é um <i>mau exemplo.</p></i> <p>Este é um <i>bom exemplo.</i></p> |
Gera código aninhado corretamente e, ao limpar XHTML, corrige aninhamento em código que não foi gerado pelo Dreamweaver. |
Todos os nomes de elemento e atributo devem estar em minúsculas. |
Força os nomes de elementos e atributos HTML a ficarem em minúsculas no código XHTML que gera e ao limpar XHTML, independentemente das suas preferências de maiúsculas e minúsculas para tags e atributos. |
Todo elemento deve ter uma tag de fechamento, a menos que seja declarado no DTD como EMPTY. |
Insere tags de fechamento no código que gera e ao limpar XHTML. |
Elementos vazios devem ter uma tag de fechamento, ou a tag de abertura deve terminar com />. Por exemplo, <br> não é válido; a forma correta é <br></br> ou <br/>. A seguir estão os elementos vazios: area, base, basefont, br, col, frame, hr, img, input, isindex, link, meta, e param. E para compatibilidade com versões anteriores com navegadores que não oferecem suporte a XML, deve haver um espaço antes de /> (por exemplo, <br />, não <br/>). |
Insere elementos vazios com um espaço antes da barra de fechamento em tags vazias no código que gera e ao limpar XHTML. |
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 que gera e ao limpar XHTML. Observação: Se um navegador HTML não oferecer suporte ao HTML 4, poderá falhar ao interpretar esses atributos booleanos quando aparecem na forma completa. |
Todos os valores de atributo devem estar cercados por aspas. |
Coloca aspas ao redor dos valores de atributo no código que gera e ao limpar 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 com o mesmo valor, sempre que o atributo name for definido por um inspetor de propriedades, no código que o Dreamweaver gera e ao limpar XHTML. |
Para atributos com valores de um tipo enumerado, os valores devem estar em minúsculas. Um valor de tipo enumerado é um valor de uma lista específica de valores permitidos; por exemplo, o atributo align tem os seguintes valores permitidos: center, justify, left, e right. |
Força valores de tipo enumerado a serem minúsculos no código que gera e ao limpar XHTML. |
Todos os elementos script e style devem ter um atributo type. (O atributo type do elemento script é obrigatório desde o HTML 4, quando o atributo language foi descontinuado.) |
Define os atributos type e language nos elementos script e o atributo type nos elementos style no código que gera e ao limpar XHTML. |
Todos os elementos img e area devem ter um atributo alt. |
Define estes atributos no código que gera e, ao limpar XHTML, reporta atributos alt ausentes. |
Expressões regulares
Expressões regulares são padrões que descrevem combinações de caracteres no texto.Use-as nas pesquisas de código para ajudar a descrever conceitos como linhas que começam com "var" e valores de atributos que contêm um número.
A tabela a seguir lista os caracteres especiais em expressões regulares, seus significados e exemplos de uso.Para pesquisar texto que contenha um dos caracteres especiais da tabela, use uma barra invertida antes do caractere especial.Por exemplo, para pesquisar o asterisco real na frase some conditions apply*, seu padrão de pesquisa pode ser assim: apply\*.Se você não usar escape no asterisco, encontrará todas as ocorrências de "apply" (assim como "appl", "applyy" e "applyyy"), não apenas as seguidas por um 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$ combina com "h" em "teach" mas não em "teacher" |
* |
O caractere precedente 0 ou mais vezes. |
um* combina com "um" em "rum", "umm" em "yummy" e "u" em "huge" |
+ |
O caractere precedente uma ou mais vezes. |
um+ combina com "um" em "rum" e "umm" em "yummy" mas nada em "huge" |
? |
O caractere precedente no máximo uma vez (ou seja, indica que o caractere precedente é opcional). |
st?on combina com "son" em "Johnson" e "ston" em "Johnston" mas nada em "Appleton" ou "tension" |
. |
Qualquer caractere único, exceto o caractere de nova linha. |
.an combina com "ran" e "can" na frase "bran muffins can be tasty" |
x|y |
x ou y |
FF0000|0000FF combina com "FF0000" em bgcolor="#FF0000" e "0000FF" em font color="#0000FF" |
{n} |
Exatamente n ocorrências do caractere precedente. |
o{2} combina com "oo" em "loom" e os dois primeiros o's em "mooooo", mas nada em "money" |
{n,m} |
Pelo menos n, e no máximo m, ocorrências do caractere precedente. |
F{2,4} combina com "FF" em "#FF0000" e os primeiros quatro Fs em "#FFFFFF" |
[abc] |
Qualquer um dos caracteres entre colchetes.Especifique um intervalo de caracteres com um hífen (por exemplo, [a-f] é equivalente 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 um intervalo de caracteres com um hífen (por exemplo, [^a-f] é equivalente a [^abcdef]). |
[^aeiou] inicialmente combina "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 a nada em "goober" ou "snob" |
\B |
Algo que não seja um limite de palavra. |
\Bb combina "b" em "goober" mas nada 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 de espaço em branco único, incluindo espaço, tab, quebra de página ou quebra de linha. |
\sbook combina "book" em "blue book" mas nada em "notebook" |
\S |
Qualquer caractere único de espaço que não seja em branco. |
\Sbook combina "book" em "notebook" mas nada em "blue book" |
\t |
Uma tabulação. |
|
\w |
Qualquer caractere alfanumérico, incluindo sublinhado. Equivalente a [A-Za-z0-9_]. |
b\w* combina "barking" em "the barking dog" e tanto "big" quanto "black" em "the big black dog" |
\W |
Qualquer caractere que não seja alfanumérico. Equivalente a [^A-Za-z0-9_]. |
\W combina "&" 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. Certifique-se de desmarcar a opção Ignorar diferenças de espaço em branco ao pesquisar isso, se não estiver usando expressões regulares.Observe que isso combina com um caractere específico, não com a noção geral de quebra de linha; por exemplo, não combina com uma tag <br> ou uma tag <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 delimitar agrupamentos dentro da expressão regular para serem referenciados posteriormente.Em seguida, use $1, $2, $3 e assim por diante no campo Substituir por para se referir ao primeiro, segundo, terceiro e posteriores agrupamentos parentéticos.
Na caixa Pesquisar por, para se referir a um agrupamento parentético anterior na expressão regular, use \1, \2, \3 e assim por diante em vez de $1, $2, $3.
Por exemplo, pesquisar por (\d+)\/(\d+)\/(\d+) e substituir por $2/$1/$3 troca o dia e o mês em uma data separada por barras, convertendo assim entre datas do estilo americano e datas do estilo europeu.
Código de comportamento de servidor
Quando você desenvolve uma página dinâmica e seleciona um comportamento de servidor no painel Comportamentos do servidor, o Dreamweaver insere um ou mais blocos de código na página para fazer o comportamento de servidor funcionar.
Se você alterar manualmente o código dentro de um bloco de código, não poderá mais usar painéis como Vínculos e Comportamentos do servidor para editar o comportamento 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 do servidor.Se você alterar o código de um bloco de código de qualquer forma, o Dreamweaver não conseguirá mais detectar o comportamento de servidor e exibi-lo no painel Comportamentos do servidor.No entanto, o comportamento de servidor ainda existe na página, e você pode editá-lo no ambiente de codificação no Dreamweaver.
Criar belos sites no Dreamweaver
Crie, codifique e gerencie sites dinâmicos com uma ferramenta completa e eficiente.
