Scribd Logo
Unggah

Selamat datang di Scribd!

  • Aula Const Pag

    Diunggah oleh

    Claudio Corso Da Silva Corso
    6 tayangan36 halaman

    Hak Cipta

    © Attribution Non-Commercial (BY-NC)

    Format Tersedia

    PPT, PDF, TXT atau baca online dari Scribd

    Apakah menurut Anda dokumen ini bermanfaat?

    Apakah konten ini tidak pantas?

    Laporkan Dokumen Ini

    Hak Cipta:

    Attribution Non-Commercial (BY-NC)
    Unduh sebagai PPT, PDF, TXT atau baca online dari Scribd
    Tandai sebagai konten tidak pantas
    6 tayangan36 halaman

    Aula Const Pag

    Diunggah oleh

    Claudio Corso Da Silva Corso

    Hak Cipta:

    Attribution Non-Commercial (BY-NC)
    Unduh sebagai PPT, PDF, TXT atau baca online dari Scribd
    Tandai sebagai konten tidak pantas
    dari 36

    Construo de homepages

    Profa rsula Lisba Fernandes Ribeiro

    WWW
    A Organizao Europeia para a Investigao Nuclear (CERN) foi a responsvel pela inveno da World Wide Web como conhecemos hoje. No incio, permitia apenas aos cientistas trocar informaes. O principal responsvel pela inveno foi Tim Berners-Lee. A World Wide Web tambm conhecida como WWW, W3 ou Web, que, traduzido para o portugus, significa rede de alcance mundial, um dos servios oferecidos oferecidos pela Internet.

    Servidor web
    Um servidor web um computador responsvel por fornecer ao computador do cliente (usurios de sites e pginas eletrnicas) os dados solicitados. Geralmente, so computadores de maior porte. Servidor Apache o mais bem sucedido servidor web free

    Desenvolvimento web

    O desenvolvimento web o termo utilizado para descrever o desenvolvimento de sites na Internet. Est associado a programao, mas tambm pode ser usado para se referir ao projeto visual das pginas. O desenvolvimento web tem sido uma das indstrias de mais rpido crescimento no mundo, pois a Internet trouxe novos hbitos de consumo e criou formas e formas de realizao de negcios. O mercado para os programadores web est bem aquecido.

    Desenvolvimento web
    Para desenvolver um site, voc no precisa adquirir ferramentas de edio sofisticadas e caras. No podemos deixar de mencionar a existncia de ferramentas do tipo WYSIWYG (What you see is what you get) que so extremamente bem aceitas, mas so no recomendadas para o incio do aprendizado! Exemplo de ferramenta: Dreamweaver

    Navegadores

    Em 1993 surgiu o primeiro navegador web. Um navegador web, ou browser, consiste em um software que permite exibir e navegar nas pginas web. O navegador um programa simples que solicita pginas web, o que ocorre ao se digitar um endereo de um site (www.google.com.br) ou clicar um link em uma pgina web.

    Pgina web
    um arquivo onde podemos inserir textos, imagens, tabelas, etc. Uma coleo de pginas web que tenham relao entre si armazenadas em uma nica pasta ou subpasta em um servidor web conhecida como site. Pgina principal, pgina de entrada (homepage em ingls) a pgina inicial de um site da internet. Geralmente faz uma apresentao geral do site e de todo seu contedo.

    HTML
    Uma linguagem de marcao um conjunto de cdigos aplicados a um texto ou a dados, a fim de adicionar informaes particulares sobre esse texto ou dado. A linguagem de marcao da internet a HTML. A sigla uma abreviatura de HyperText Mark-up Language ou Linguagem de Marcao de Hipertexto. O que hipertexto? So aqueles itens destacados em uma pgina web que, quando clicados, levam a imagens ou informaes mais detalhadas sobre um determinado assunto. HTML foi inventado em 1990 por Tim Berners-Lee O que vemos quando visualizamos uma pgina na Internet a interpretao do browser do cdigo HTML.

    Editor de texto legal

    Editores de texto
    jEdit (Windows, Mac, Linux): Disponvel em http://jedit.org. Notepad++: Disponvel em http://notepadplus.sourceforge.net/. Conta com recursos que o tornam ideal para escrever HTML e CSS, como o realce de sintaxe. HTML-Kit

    Primeiro exemplo Salve com a extenso .html


    <html>

    <head>
    <title> </title> Primeira pgina

    </head>
    <body> Ol! Esta a minha primeira Aprender HTML muito bom! </body> </html> pgina web.

    Tags HTML
    As marcas utilizadas para produzir o hipertexto so chamadas de tags. Uma tag consiste dos sinais < (menor que) e > (maior que) e um texto dentro delas. Um documento HTML composto de tags que faro com que o browser monte a pgina de acordo com a formatao definida pelos comandos HTML. De um modo geral, as tags aparecem em pares, por exemplo: <HTML> texto </HTML>.

    Maisculas e minsculas

    Primeiras taqs

    Atributos
    J sabemos que uma tag um comando para o navegador... Em algumas tags podemos acrescentar informaes adicionais por meio de atributos. O que so atributos? Os atributos definem propriedades para o elemento HTML.

    Vamos a um exemplo ento? <body bgcolor="green"> Que poderia ser escrito da forma:
    <body bgcolor="#00ff00">

    Cores

    Inserindo imagens no fundo


    Um outro atributo bem interessante o que permite colocar uma imagem como plano de fundo. Escolher uma imagem qualquer da Internet, e salv-la na mesma pasta em que est o arquivo html.

    <html> <head>

    <title> Minha primeira pgina </title>


    </head> <body background="fondo1.jpg">

    Ol! Esta a minha primeira Aprender HTML muito bom!


    </body> </html>

    pgina

    web.

    Imagem de fundo
    A imagem de fundo fondo1.jpg est na pgina:

    http://www.criarweb.com/artigos/exemplos/tallerhtml/fundo_ prova.html
    Para fazer o download: Clicar com o boto do lado direito e selecionar a opo Salvar plano de fundo como.

    Outros atributos
    Outros atributos: bgcolor background text link alink vlink

    Mais um exemplo...
    <html> <head> <title> Minha primeira pgina </title> </head> <body bgcolor="#00FF00" text=YELLOW >

    Ol! Esta a minha primeira pgina web. Aprender HTML muito bom!
    </body>

    </html>

    Exemplo

    Digitar o arquivo primeiro.html

    Criao de links

    A palavra link utilizada para designar uma ligao Atravs dos links possvel navegar entre as pginas, a partir de palavras ou imagens. possvel fazermos ligaes de uma parte de texto (ou imagem) para outro documento. O browser destaca essas regies e imagens do texto, indicando que so ligaes de hipertexto tambm chamadas links ou hiperlinks.

    Tipos de links
    Links internos: so aqueles que se dirigem a outras partes dentro da mesma pgina Links no remotos: so aqueles que se dirigem a outras pginas do mesmo site Links remotos: so aqueles que se dirigem a pginas de outros sites Links para arquivos: So aqueles links que permitem que os usurios possam fazer download de arquivos

    Link remoto
    A tag a ser utilizada : <a> </a> Vamos incluir no nosso cdigo o seguinte trecho abaixo:

    <h2> Links interessantes: </h2>


    <a href= "http://www.canalkids.com.br/viagem/mundo/paine.htm"> Torres del Paine </a> <br> <a href= "http://www.google.com.br"> Site do Google </a> <br>

    Imagens
    Existem vrios formatos de imagens: .gifs, .jpg, .bmp, .png, entre outros. Os formatos mais usados so .gif, .jpg e .png, pois, geralmente, ocupam menos espao de armazenamento.

    Formato GIF
    Os arquivos do tipo gif (Graphics Interchange Format) so adequados para logotipos, faixas, desenhos etc. No so apropriados para imagens fotogrficas, pois permitem imagens com no mximo 256 cores. Oferecem a opo de transparncia de 1 nica cor, o que significa que voc pode fazer com que uma determinada cor da imagem desaparea, permitindo que o fundo de uma pgina web seja visto atravs de parte da imagem. Podemos ter imagens gifs animadas.

    Formato JPG
    o formato o ideal para fotografias. um formato bem popular na internet por aliar duas caractersticas importantes: oferece um bom nvel de qualidade de imagem e gera arquivos de tamanho pequeno quando comparado a outros formatos, facilitando o seu armazenamento e a sua distribuio.

    um formato que utiliza compresso de imagens. Compresso consiste na eliminao de dados redundantes nos arquivos.

    Formato PNG
    um formato que surgiu em 1996 como substituto para o formato GIF. A criao do formato foi motivada, em grande parte, pela restrio de patente existente no algoritmo do formato GIF. O PNG permite animao, fundo transparente e compresso sem perda de qualidade. Suporta milhes de cores, no apenas 256 como o formato gif, sendo assim, uma tima opo para imagens fotogrficas

    Colocando imagens na pgina


    Para inserir uma imagem em uma pgina, devemos utilizar a tag:

    <img src=imagem>

    Dimensionando imagens
    H dois atributos do elemento <img> que devemos conhecer: widht e height.

    Eles podem ser usados para informar ao browser o tamanho de uma imagem na pgina.
    widht ==> especifica a largura da imagem. Seu valor medido em pixels. height ==> especifica a altura da imagem. Seu valor medido em pixels.

    Verificando a dimenso de uma imagem

    Verificando a dimenso de uma imagem

    Redimensionando
    Para ampliar no navegador a imagem, podemos escrever...

    A imagem ser ampliada

    Colocando links em imagens


    Para colocar um link em uma imagem devemos colocar a tag <img> dentro da tag <a>.

    <a href=http://www.google.com.br"> <img src="tnoronha4.jpg"> </a>

    Depois que voc inclui o elemento <img> dentro de um elemento <a>, o browser tratar a imagem como um link clicvel.

    Anda mungkin juga menyukai