Se você é iniciante no desenvolvimento de web design e front-end (HTML, CSS, Javascript), então você pode escolher começar com um editor WYSIWYG. Esse acrônimo significa "o que você vê é o que você obtém" e basicamente se refere ao software que permite criar uma página da Web usando ferramentas visuais enquanto o software grava algum código nos bastidores com base no que você está criando. A ferramenta WYSIWYG mais popular disponível é provavelmente o Adobe Dreamweaver.
O Dreamweaver é uma boa opção para quem está começando
Embora muitos profissionais experientes da Web com habilidades mais refinadas olhem para baixo no Dreamweaver e sua tendência a produzir marcações de HTML e estilos CSS inchados, a simples verdade é que a plataforma continua sendo uma boa opção para quem está começando a criar websites. À medida que você começa a usar a opção "visualização de design" do Dreamweaver para criar uma página da Web, uma das perguntas que provavelmente terá é como criar uma quebra de linha única para o conteúdo nessa visualização.
Quando você adiciona texto HTML a uma página da Web, o navegador da Web exibe esse texto como uma linha longa até alcançar a borda da janela do navegador ou seu elemento de contêiner. Nesse ponto, o texto será encerrado na próxima linha. Isso é semelhante ao que acontece em qualquer software de processamento de texto, como o Microsoft Word ou o Google Docs. Quando uma linha de texto não tiver mais espaço em uma linha horizontal, ela será quebrada para começar outra linha. Então, o que acontece se você quiser ditar onde uma linha quebra?
Quando você pressiona a tecla ENTER na visualização de design do Dreamweaver, o parágrafo atual é fechado e um novo parágrafo é iniciado. Visualmente, isso significa que essas duas linhas são separadas por um pouco de espaçamento vertical. Isso ocorre porque, por padrão, os parágrafos HTML têm preenchimento ou margens (que dependem do próprio navegador) aplicados à parte inferior do parágrafo que adiciona esse espaçamento.
Isso pode ser ajustado com CSS, mas a verdade é que você deseja que haja espaçamento entre parágrafos para permitir a legibilidade do site. Se você quiser uma única linha e nenhum espaçamento vertical entre as linhas, não deseja usar a tecla ENTER porque não deseja que essas linhas sejam parágrafos individuais.
Para estes momentos em que você não quer que um novo parágrafo comece, você adicionaria o
tag em HTML. Isto também é por vezes escrito como
. especificamente para versões de XHTML que requeriam que todos os elementos fossem fechados. O trailing / nessa sintaxe auto-fecha o elemento desde o
tag não tem sua própria tag de fechamento. Está tudo bem, mas você está trabalhando no Design View no Dreamweaver. Você pode não querer entrar no código e adicionar essas quebras. Isso é bom, porque você pode, de fato, adicionar uma quebra de linha no Dreamweaver sem recorrer à visualização de código.
Adicione uma quebra de linha na visualização de design do Dreamweaver:
- Coloque o cursor onde você deseja que a nova linha comece.
- Mantenha o botão tecla Shift e pressione Entrar.
É isso aí! A simples adição da tecla "shift" junto com a tecla ENTER adicionará
em vez de um novo parágrafo. Então, agora que você sabe como isso é, você deve considerar onde usá-lo e onde evitá-lo. Lembre-se, o HTML destina-se a criar a estrutura de um site, não a aparência visual. Você não deve usar múltiplos
tags para criar espaçamento vertical abaixo dos elementos em seu design.
É para isso que servem as propriedades CSS para preenchimento e margens. Onde você usaria um
tag é quando você precisa apenas da quebra de linha única. Por exemplo, se você estiver codificando um endereço de correspondência e tiver decidido usar um parágrafo, adicione
tags como esta:
Nome da empresa Este código para o endereço é um único parágrafo, mas visualmente exibiria as três linhas em linhas individuais com um pequeno espaço entre elas.
Linha de endereço
Cidade, estado, ZIP
