Como escrever uma página em html

4 partes:

Configurar o documentoFormatar o textoAdicionar links e imagensSaiba mais e colocar a sua página on-line

A linguagem HTML (por sua sigla em Inglês, HyperText Markup Language) é uma linguagem básica para desenvolver páginas web. Ele foi criado com a intenção de fazer um fácil e flexível para a linguagem de codificação. Quase todas as páginas da Internet foram criados com alguma variação desse código (ColdFusion, XML, XSLT). HTML é fácil de entender, mas pode levar um longo tempo se você estiver interessado em aprender suas funções completas. Para adicionar mais cor e emoção para suas páginas web, você pode aprender o básico de CSS uma vez que você se sentir confortável com a página HTML básica.

parte 1Configurar o documento

1

Abra um editor de texto simples. Bloco de notas é uma boa opção que você pode baixar gratuitamente. Você pode escrever HTML com quase qualquer programa de edição de texto, mas os programas mais complexos, com formato automático de torná-lo mais difícil de organizar sua página HTML.

  • Não é recomendado usar TextEdit, como muitas vezes salva o arquivo em um formato que seu navegador não pode reconhecer como HTML.
  • Você também pode usar um editor de HTML online. programas de edição de HTML não são recomendadas para iniciantes.

2

Salvar um arquivo como uma página da Web. selecionar arquivoSalvar como. Alterar o formato de arquivo "Pagina web", ".html" ou "htm". Guardá-lo em um local onde você pode encontrá-lo facilmente.

  • Não há nenhuma diferença entre estes três opções.

3

Abra o arquivo em um navegador da web. Dê um duplo clique no arquivo e será aberto automaticamente como uma página da web em branco no seu browser. Alternativamente, você pode abrir um browser, por exemplo, o Firefox ou o Internet Explorer eo uso "arquivo" → "arquivo aberto" para selecionar o documento.

  • Esta página web não será online. Ela só pode ser visto em seu computador.

4

Atualiza o site para ver o perigo. Faça isso no seu documento em branco: Olá Salve o documento. Atualizar a página em branco e você deve ver aparecer "Olá" na parte superior da página, em negrito. Cada vez que você quiser testar o seu novo HTML durante este tutorial, salve o documento .html e, em seguida, atualizar a janela do navegador para ver como o HTML é interpretado.

  • Se as palavras "" e "" aparecem em seu navegador, o arquivo não está sendo interpretado corretamente como HTML. Tente um texto programa de edição diferente ou outro navegador.

5

Entenda o que tags. instruções HTML são escritos através "etiquetas" (Tag, em Inglês), que dizer ao navegador como interpretar e exibir a página web. Sempre que eles são escritos em colchetes e não são mostrados no site. Você e você usou no exemplo anterior:

  • é uma "tag de abertura" ou "começar a tag". Tudo o que você digitar após esse rótulo deve ser definida como "texto em negrito" (Normalmente no site será mostrado em negrito).
  • é uma "tag de fechamento" ou "tag end". Ele mostra o ponto onde termina o texto em negrito. A maioria dos rótulos (não todos) precisa de uma marca de fechamento de função, para que você não se esqueça de incluí-lo.

6

Configurar seu documento. Exclui todo o conteúdo do seu documento HTML. Começa novamente com o seguinte texto exatamente como está escrito (ignorando pontos com marcadores). Este código HTML informa ao navegador qual o tipo de HTML que você vai usar e todo o seu HTML será contido entre as tags e .

7

Adicionar tags de cabeçalho e corpo. documentos HTML estão divididos em duas secções. A secção do "cabeça" (cabeça, em Inglês) é a informação especial, como o título da página. seção "corpo" (corpo, ) Inclui o conteúdo principal da página. Adicionar tanto ao seu documento, recordando também incluem marcas de fechamento. O novo texto a ser adicionado é aquele em negrito:

8

Dê-lhe uma página de título. Sendo um novato, não é importante para aprender a maioria das marcas que vão no cabeçalho da seção. No entanto, o título tag é fácil de usar e determinar o que aparece como o nome do guia de janela ou navegador. Colocar etiquetas abrindo e fechando título dentro das tags de cabeçalho e digite o título que deseja, incluindo:

  • Minha primeira página HTML

parte 2Formatar o texto



1

Agrégale algum texto para a seção corpo. Nesta seção você vai trabalhar somente dentro dos tags do corpo. O resto do texto permanece no documento, mas este guia irá evitar repeti-los para economizar espaço. Escrever o que quiser entre as tags e e aparecerá como o primeiro conteúdo do seu site. Por exemplo:

  • Eu estou seguindo o wikiHow guia para escrever uma página HTML

2

cabeçalhos de texto Agrégale. Organize suas tags de cabeçalho da página, que informam ao navegador para exibir o texto que aparece entre eles em um tamanho maior. Estes também usou o bots motores de busca e outras ferramentas para determinar o que sua página é sobre e como ele está organizado. É o maior cabeçalho e você pode criar cabeçalhos menor para baixo para

. Julgá-los em sua página:
  • Bem-vindo ao meu site

  • Eu estou seguindo o wikiHow guia para escrever uma página HTML
  • Meus objetivos hoje:

  • Objectivos completado:
  • Saiba como usar cabeçalhos
  • objetivos não cumpridos:
  • Saiba mais tags de formatação de texto

3

Saiba mais marcas para formatar o texto. Você sabe o rótulo "forte"Mas há muitas outras maneiras de formatar texto. Jogar com eles ou usar várias tags em torno da mesma cadeia. Lembre-se sempre adicionar a marca de fechamento depois!

  • texto importante. Ele é mostrado em negrito em navegadores.
  • Texto enfatizado. Ele será mostrado em itálico em navegadores.
  • Texto um pouco menor do que o habitual. Ele será dimensionado automaticamente se usado em um cabeçalho.
  • Texto já não se aplica. Ela vai mostrar cruzou com uma linha.

4

Ordenar o texto na página. Talvez você tenha notado que, ao premir a tecla entrar Não é o suficiente para suas telas de texto em uma linha diferente. Estas etiquetas podem ajudá-lo a formar parágrafos e inserir quebras de linha ou classificar seu texto de forma diferente:

meios "parágrafo" e vai ajudar você a manter todo o texto entre estas tags é um único parágrafo, separando o texto que está acima ou abaixo dela.


  • Isto irá criar uma quebra de linha. Não incluir uma tag de fechamento, neste caso, uma vez que não irá alterar qualquer outro conteúdo. Use-o para poemas ou linhas de endereço, não para separar os parágrafos.
  • Se você precisa para exibir o texto com muita precisão, esta etiqueta irá definir o texto dentro dessas tags como uma fonte de largura fixa (cada letra tem a mesma largura) e permite criar espaços e quebras de linha, como faria normalmente em vez de escrever através de etiquetas.
  • Isso define o texto como texto citado por uma fonte. Em seguida, você pode descrever a fonte usando o namoro etiqueta ..
  • 5

    Adicionar comentários texto invisível. Tags de comentário não são visíveis no site. Eles permitem que você escrever notas para si mesmo no documento HTML, sem interferir com o conteúdo. Não adicione uma tag de fechamento.

    • Rótulos que são suficientes em si mesmos e não usam tags de fechamento são conhecidos como "tags vazias".

    6

    Coloque tudo isso junto. A melhor maneira de lembrar esses rótulos é usá-las em seu próprio site. Aqui está um exemplo de como usar rótulos para cada um dos passos que você aprendeu até agora. Tenta prever como vai ficar em um navegador, em vez de copiar e colar tudo no seu documento para descobrir.

    • Minha primeira página HTML
    • Bem-vindo ao meu site

    • Espero que você goste do site!

    Eu o criei especialmente para você.

  • Parte 1: HTML descoberto

  • Fui aprendendo HTML para um horas, assim que eu sou um especialista.
  • parte 3Adicionar links e imagens

    1

    Saiba quais são os atributos. As etiquetas podem ter informações adicionais por escrito dentro deles. Esta informação é conhecido como "atributos". Atributos aparecem palavras como adicionais dentro do mesmo rótulo, da forma: atributo-name ="valor específico". Por exemplo, praticamente qualquer tag HTML pode ter o atributo "título" (Título):

    Aqui está o parágrafo introdutório

    Este atributo adicionado ao parágrafo um título, "introdução", Que aparece quando você passa o mouse sobre parágrafo no site.

    2

    Criar um link para outra página da web. Use etiquetas para criar um link para qualquer outro site. Insira o URL da página web de destino usando o atributo href. Aqui está um exemplo que liga o documento com a página que você está lendo agora.

    • Os visitantes do seu site pode clicar neste texto a seguir o link.

    3

    O lance em um atributo id para suas tags. Outro atributo que pode incluir praticamente qualquer tag HTML é o elemento "identidade". Dentro de cada rótulo, tipo ID ="exemplo" ou usar qualquer nome que não inclua espaços. Isso não vai ter um efeito visível, mas você vai usar na próxima etapa.

    • Por exemplo, adicione isso ao seu documento:

    Este parágrafo é usado como um exemplo para mostrar como o atributo id funciona.

    4

    Criar um link para um id específico. Agora você pode usar etiquetas hyperlink para criar um link para outro ponto na mesma página. Em vez de uma URL, você deve usar o símbolo # seguido pelo valor do ID para o qual você está indo para fazer a ligação. Por exemplo, Este texto irá criar um link para o parágrafo que contém o id "exemplo".

    • Nenhum valor HTML é sensível a maiúsculas e minúsculas. "#Exemplo" e "I #Exemplo" irá levá-lo para o mesmo lugar.
    • Se a sua página é pequeno o suficiente para exibir todo o conteúdo na mesma tela, você pode não notar qualquer alteração quando você clica no link usando o browser. Redimensiona a janela até que uma barra de rolagem aparece, e depois tente novamente.

    5

    Adicione uma imagem. A etiqueta É uma tag vazia, o que significa que não é necessário incluir uma tag de fechamento. Todas as informações necessárias pelo navegador para exibir a imagem será adicionada através de atributos. Aqui está um exemplo que mostra o logotipo do wikiHow seguido por uma descrição de cada atributo:

    • o atributo src =" " (Fonte) informa ao navegador onde encontrar a imagem (note que é geralmente ofensiva publicar a imagem de alguém do site e essa imagem vai desaparecer se o site a partir do qual é desconectado).
    • o atributo style ="" (Style) Você pode fazer muitas coisas, mas a coisa mais importante que ele faz é definir a largura e altura das imagens em pixels (você também pode usar a largura atributos ="" (Largura) e height ="" (Altura) separadamente, mas você pode entrar em apuros em tamanho um pouco estranho se você estiver usando CSS).)
    • o atributo alt =" " É uma breve descrição da imagem que o usuário irá ver se a imagem não carrega. Esta é considerada uma exigência, porque os leitores de tela utilização para os visitantes cegos.

    parte 4Saiba mais e colocar a sua página on-line

    1

    Valide seu HTML. verificações de validação de HTML para erros no código. Se seu site não é exibido corretamente, a validação pode ajudar a encontrar o erro que pode estar causando o problema. Você também pode lhe ensinar mais sobre a identificação de código HTML que parece bem na tela, mas não é recomendado devido aos padrões HTML atualizado. Usando HTML inválido não significa que seu site não poderá ser usado, mas pode causar problemas ou apresentar uma visão inconsistente em diferentes navegadores.

    • Tente serviço de validação online livre W3C ou encontrar outro Validador HTML online 5.

    2

    Saiba mais tags e atributos. Há muitas outras tags HTML e atributos e muitos lugares onde você pode aprender:

    • tentar w3schools e Dog HTML se você precisar de mais tutoriais e listas de etiquetas mais completos.
    • Procurando por um site onde você gosta de seus usos aparência e função "Ver fonte da página" ver-se o seu HTML. Copiar e colá-lo em seu próprio documento e brincar com ele para ver como ele funciona.
    • Leia mais artigos para aprender como criar tabelas HTML usando meta tags para aumentar a sua visibilidade nos motores de busca ou usar div e span para ajudar com CSS.

    3

    Coloque seu site online. escolher serviço de hospedagem web ou hospedagem na web e você pode enviar quantas páginas HTML como você deseja para sua equipe de domínio web. Para fazer isso, você precisa usar um programa de transferência de FTP, mas muitos serviços de hospedagem também oferecem este serviço.

    • Quando você vai para estabelecer links para outras páginas ou imagens de seu próprio site, não é necessário o uso de endereços completos. Por exemplo, se o seu nome de domínio é elmejorcodificadordehtml.com, então o endereço Estas etiquetas dentro do texto estabelecer uma ligação com o endereço "superskilledhtmlcoder.com/journal/monday.html".

    4

    Adicione estilo com CSS. Se a sua página HTML é muito elementar, tentar aprender algumas características básicas CSS para adicionar mais cor, fontes diferentes e maior controle sobre a colocação de elementos. Ligando uma folha de estilo CSS (folha de estilo CSS) Com suas páginas HTML lhe permitirá fazer mudanças significativas rapidamente, ajustando o estilo de todo o texto encontrado dentro de uma determinada etiqueta. Aqui você pode ver como jogar folhas de estilo básicas ou você pode mergulhar em tutoriais mais detalhados usando o HTML CSS cão-guia.

    5

    Código Agrégale javascript para sua página. javascript é uma linguagem de programação usada-los para substituir funções para páginas HTML. são inseridos comandos javascript entre as tags e fechamento de abertura e pode ser usado para adicionar botões interativos, calcular problemas de matemática e muito mais. Saiba mais usando Exemplos de W3C.

    dicas

    • O tipo de documento (em Inglês doctype), Foi usado neste tutorial é "4.0.1 HTML transição solta", Um fácil de usar para iniciantes. usos () Para que o navegador interpreta o código com estrita formato HTML 5, que é o padrão recomendado (apesar de ser um dos menos utilizados).

    avisos

    • HTML destina-se a manter o conteúdo da página em um formato universal. Não se destina a controlar a apresentação do seu site, tais como a cor de fundo e localização exacta dos elementos. Embora existam rótulos que lhe permitem controlar estas coisas, é altamente recomendado o uso de CSS para criar um site mais controlável e consistente.

    Coisas que você precisa

    • Um editor de texto simples, como o Bloco de Notas ou TextEdit
    • Um navegador da Web, como o Internet Explorer ou o Mozilla Firefox
    • Um editor HTML como o Adobe Dreamweaver, Aptana Studio ou o Microsoft Expression Web (opcional)

    Artigos Relacionados