Scribd Logo
Carica

Benvenuto in Scribd!

  • Lição 4 - Criando Seu Primeiro Website - HTML PDF

    Caricato da

    Fabinho Juntá Ká Afer Tuxá
    18 visualizzazioni4 pagine

    Titolo originale

    Lição 4_ Criando seu primeiro website - HTML.pdf

    Copyright

    © © All Rights Reserved

    Formati disponibili

    PDF, TXT o leggi online da Scribd

    Hai trovato utile questo documento?

    Questo contenuto è inappropriato?

    Segnala questo documento

    Copyright:

    © All Rights Reserved
    Scarica in formato PDF, TXT o leggi online su Scribd
    Segnala contenuti inappropriati
    18 visualizzazioni4 pagine

    Lição 4 - Criando Seu Primeiro Website - HTML PDF

    Caricato da

    Fabinho Juntá Ká Afer Tuxá

    Copyright:

    © All Rights Reserved
    Scarica in formato PDF, TXT o leggi online su Scribd
    Segnala contenuti inappropriati
    di 4

    Lio 4: Criando seu primeiro website - HTML.

    net

    1 de 4

    http://pt-br.html.net/tutorials/html/lesson4.php

    Lio 4: Criando seu primeiro website


    Com o que voc aprendeu nas lies anteriores est a alguns minutos de criar seu primeiro website.

    Como?
    Na lio 1 vimos o que necessrio para construir um website: um navegador e o Notepad (ou um editor de
    texto similar). Uma vez que voc esta lendo esta pgina, provavelmente est com seu navegador aberto.
    Agora abra outra janela do seu navegador de modo que voc tenha duas janelas na tela, uma para ler este
    tutorial e outra para visualizar o website que voc vai construir.
    Abra tambm o Notepad ( Iniciar Programas Acessrios):

    Agora, estamos prontos para comear!

    O que posso fazer?


    Vamos comear com algo simples. Que tal uma pgina que diga: "Hurrah! Esta a minha primeira pgina
    web." Continue e voc ver como isto simples de fazer.
    HTML simples e lgico. O navegador l HTML de modo idntico ao que voc l um texto qualquer, de
    cima para baixo e da esquerda para a direita. Assim um documento HTML inicia com aquilo que deve ser
    a primeira coisa aparecer na pgina e termina com a ltima coisa a aparecer.
    A primeira coisa a fazer dizer ao navegador que voc vai "falar" com ele na linguagem HTML. Isto feito
    com a tag <html> (nenhuma novidade nisto). Ento, antes de mais nada digite "<html>" na primeira linha do

    04/02/2014 16:35

    Lio 4: Criando seu primeiro website - HTML.net

    2 de 4

    http://pt-br.html.net/tutorials/html/lesson4.php

    documento, no Notepad.
    Como sabemos das lies anteriores, <html> uma tag de abertura e deve ser fechada com a tag de
    fechamento quando voc acabar de digitar seu documento HTML. Para termos certeza que no iremos
    esquecer de fechar a tag HTML, faa isso agora mesmo, digitando "</html>" localizada a algumas linhas
    abaixo, assim voc ir escrever seu documento entre as tags digitadas <html> e </html>.
    A prxima coisa que o documento precisa um "head" (cabea), que fornece informaes sobre o
    documento e um "body" (corpo), que abriga o contedo do documento. Como HTML no seria nada se no
    fosse lgico, a "cabea" (<head> e </head>) fica em cima do "corpo" (<body> e </body>).
    Seu documento agora est como mostrado abaixo:

    <html>
    <head>
    </head>
    <body>
    </body>
    </html>

    Notar como estruturamos o cdigo em linhas diferentes (usar a tecla Enter para pular para prxima linha)
    e tambm a indentao (recuos) do cdigo (usar a tecla Tab para indentar). A prncipio no faz qualquer
    diferena a maneira como voc estrutura (linhas e recuos na digitao) seu documento HTML. Mas um
    cdigo bem estruturado mais fcil de ler e entender, altamente recomendado que voc adote uma
    estrutura clara e ntida para seu HTML, usando linhas e indentao (recuos), como mostrado no
    exemplo acima.
    Se o seu documento est como o mostrado acima, voc construiu sua primeira pgina web - uma pgina
    particularmente chata e provalvelmente nada parecido com o que voc sonhou fazer quando comeou a ler
    este tutorial, mas de qualquer forma um tipo de website. Isto que voc fez ser um template base para seus
    futuros documentos HTML.

    At aqui tudo bem, mas como colocar contedo no meu


    website?
    Como voc j aprendeu, seu documento HTML composto de duas partes: um head e um body. Na seo
    head voc escreve informaes sobre a pgina e na seo body voc coloca as informaes que
    constituem a pgina.
    Por exemplo, para dar um ttulo ao documento, ttulo este que aparea no topo da barra do navegador voc
    dever usar a seo"head". A tag para acresentar um ttulo <title>:

    <title>Minha primeira pgina web</title>

    Notar que o ttulo no aparece na pgina propriamente dita. Tudo que voc quer que aparea na pgina
    contedo e dever ser colocado entre as tags "body".
    Conforme combinamos, queremos uma pgina dizendo, "Hurrah! Esta a minha primeira pgina web." Este
    o texto que queremos comunicar e ele dever ser colocado na seo body. Ento digite na seo body o
    seguinte:

    04/02/2014 16:35

    Lio 4: Criando seu primeiro website - HTML.net

    3 de 4

    http://pt-br.html.net/tutorials/html/lesson4.php

    <p>Hurrah! Esta a minha primeira pgina web.</p>

    A letra p na tag <p> a abreviatura para "paragraph" (pargrafo) que exatamente o que o texto - um
    texto pargrafo.
    Seu documento HTML agora est como mostrado a seguir:

    <html>
    <head>
    <title>Minha primeira pgina web</title>
    </head>
    <body>
    <p>Hurrah! Esta a minha primeira pgina web.</p>
    </body>
    </html>

    Pronto! Voc acaba de construir seu primeiro website!


    Agora basta que voc salve seu trabalho no HD e depois visualize no navegador:
    No Notepad v ao menu "Arquivo" no topo da janela e escolha a opo "Salvar como...".
    Escolha "Todos os arquivos" no box "Salvar como tipo". Isto muito importante - caso voc no faa
    isto, o arquivo ser salvo como texto e no como documento HTML.
    Salve seu documento com o nome "page1.htm" (a extenso ".htm" indica que se trata de um
    documento HTML. A extenso ".html" d o mesmo resultado. Eu sempre uso ".htm", mas voc pode
    escolher a que voc preferir .htm ou .html). Voc pode salvar o documento onde voc quiser no seu
    HD - esteja certo de salvar em um lugar que depois voc possa achar com facilidade.

    Agora v ao seu navegador:

    04/02/2014 16:35

    Lio 4: Criando seu primeiro website - HTML.net

    4 de 4

    http://pt-br.html.net/tutorials/html/lesson4.php

    No menu existente no topo do navegador v em "Arquivo" e escolha a opo "Abrir" (CTRL+O).


    Clique em "Procurar" no box que aparece.
    Localize o seu documento HTML e clique em "Abrir".

    Voc dever ver no seu navegador: "Hurrah! Esta a minha primeira pgina web." Parabns!
    Se voc quer que o mundo todo veja sua pgina, v direto para a Lio 14 e aprenda como fazer upload da
    sua pgina para a Internet. Se no, tenha pacincia e continue lendo. A brincadeira apenas comeou.

    << Lio 3: O que so tags HTML?

    Lio 5: O que voc j aprendeu >>

    04/02/2014 16:35

    Potrebbero piacerti anche