Índice:
Vídeo: Como criar um site? | Vale a pena usar ferramentas prontas? 2025
Antes de começar a codificar o HTML, considere as opções em termos de um ambiente de codificação. Existe um amplo leque de ferramentas, que vão desde o editor de texto gratuito que acompanha o seu sistema operacional (como o Bloco de notas do Windows ou o TextEdit em um Mac) para aplicativos profissionais (especialmente o Dreamweaver) que fornecem ferramentas substanciais para ajudá-lo a escrever e testar, código.
Editores de código
Existem três níveis de editores de código:
-
Editor de texto do seu sistema operacional: Sim, seu sistema operacional possui um editor de texto incorporado. Bom. Aqui estão duas ótimas vantagens de usar o editor incorporado no seu sistema operacional como um editor de código para HTML (e CSS):
-
Sem custo.
-
O aplicativo já está instalado no seu computador. Feito e feito.
Esta rota é definitivamente a opção sem frescura, sem recursos de verificação de códigos e verificação disponíveis em editores de código gratuitos para download. A menos que você esteja planejando fazer apenas uma quantidade mínima de codificação HTML, baixe um editor de código gratuito como o Text PSPad ou Text Wrangler.
Criando HTML com TextEdit em um Mac.
Criando HTML com o bloco de notas no Windows.
-
-
Editores de código gratuitos e descarregáveis: Atrás da porta # 2 são editores de código gratuitos, como TextWrangler para Macs ou PSPad para Windows.
Novamente, é bom. Esses (e outros) editores de código gratuitos incluem recursos no topo do que vem com o aplicativo do seu sistema operacional:
-
File que permitem que você trabalhe com vários arquivos ao mesmo tempo. Essa capacidade é essencial para trabalhar com um HTML e um arquivo CSS vinculado ao mesmo tempo.
-
Codificação de cores que identifica elementos de sintaxe de codificação. Você encontrará este recurso muito útil quando você digitou algum código, porque esse conteúdo incorreto não adotará o código de cores esperado.
-
A verificação ortográfica está disponível em editores de códigos gratuitos como o TextWrangler e o PSPad para ajudar a identificar palavras com erros ortográficos.
-
Autocompletar está incluído no PSPad.
Editores de código gratuitos como TextWrangler (para Macs) e PSPad (para Windows) não vêm com janelas gráficas WYSIWG que mostram como as páginas HTML serão exibidas em um navegador. E eles não têm o tipo de opções de insinuações de código disponíveis nos editores de código que custam dinheiro.
-
-
Editores de código de baixo custo: BBEdit, por exemplo (vendendo por US $ 50 a partir desta gravação), é uma versão aprimorada do TextWrangler. Uma das características mais poderosas do BBEdit é que ele pode preencher automaticamente o código - antecipando e preenchendo o final do código à medida que você digita. A figura a seguir, por exemplo, mostra uma variedade de tags HTML que começam com a letra "h", indicando "h"."
Dreamweaver
A ferramenta mais poderosa para trabalhar com HTML é o Adobe Dreamweaver. Além dos recursos encontrados em editores avançados de código profissional (como verificação ortográfica e insinuação de código), a atração principal do Dreamweaver é que você não precisa codificar HTML. Em vez disso, você pode usar opções de menu (como "Inserir → Imagem") e painéis (como o inspetor de propriedades) para gerar HTML.
Muitas pessoas estão conscientes de que o Dreamweaver pode criar HTML sem codificação manual. Mas o que muitas pessoas não percebem é que o Dreamweaver opera em dois modos:
-
Vista de design: Nesta imagem, o código é gerado com o menu e as ações do mouse ocultas.
-
Vista de código: Esta visão fornece um ambiente de codificação completo com indicação de código e teste para não apenas HTML, mas outros idiomas de design web como CSS (folhas de estilo), JavaScript (para animação e interatividade) e PHP (para scripts do lado do servidor que gerenciam dados online).
Como observado, o maior sorteio do Dreamweaver é que ele permite que os designers gerem HTML (bem como CSS e alguma outra codificação) em uma janela de design que pareça e pareça algo como outras aplicações do Adobe Creative Suite, como Photoshop, Illustrator ou InDesign.
