sábado, 20 de fevereiro de 2010

html e dreamweaver Mx: aula - 1

Através deste curso você aprendera a criar sites bem como usar o html em vários outros contextos, ensinaremos a cada aula a formatar uma pagina em html trabalhando diretamente com o código e também utilizando o melhor software do mercado o dreamweaver na versão mx.

Lembramos que para ser um webdesign não basta saber apenas html, você ira precisar no mínimo saber trabalhar com software para edição de imagem e artes gráficas, recomendo o photoshop, fireworks e o coreldraw.
Nas nossas aulas iremos disponibilizar os ficheiros com todos os arquivos necessarios.

Apesar de hoje os editores html gerarem o código sozinho permitindo que trabalhemos diretamente no visual da pagina é de extrema importância que tenhamos conhecimento do código, este é o motivo de demonstrar exemplos de como criar um site a partir do bloco de notas nas primeiras aulas, das aulas futuras conciso de que já devera estar familiarizado com a linguagem trabalharemos direto com o dreamweaver dando ênfase ao código só quando trabalharmos com algo novo.

Mas o que é html?

Html ( hipertext mark-up language) em português significa linguagem de marcação de hipertexto, é uma linguagem de marcação, ele ira formatar o conteúdo que o navegador devera exibir na tela do monitor. Faça um teste, abra seu navegador de internet em entre em qualquer site de sua preferência, agora va ao menu exibir/código fonte.
Este é o que o navegador leu e interpretou como a pagina que você estava vendo.

Tags
Tags são marcadores que indicam a parte do código que sofrera alterações elas devem ficar entre “<” e ”>”

Existem marcadores simples e compostos, os marcadores simples não precisão de fechamentos, já as tags compostas precisão isto e´feito colocando uma barra depois do símbolo “<”, lembramos que as tags devem seguir uma hierarquia dentro da pagina.

Abra o bloco de notas iniciar/programas/acessórios/bloco de notas

Seria interessante criar um atalho na área de trabalho, para fazer isto de um click com o botão direito do rato e vá em enviar para/área de trabalho.

Crie também uma pasta e nomeie meu html.

No bloco de notas você ira digitar a estrutura básica de uma pagina:


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


Salve como 1.html, veja que o arquivo já aparecera como ícone do seu navegador, abra o arquivo dando dois clicks sobre ele, devera aparecer uma pagina e branco, aproveite para dar uma olhada no código fonte.

Tudo que estiver entre <html> e </html> será interpretado como pagina web. O que estiver entre <head> e </head> será o cabeçalho, <title> serve para que os mecanismos de busca saiba o nome de seu site, só ira aparecer na pagina o que estiver entre <body> e </body>

Abra novamente o arquivo com o bloco de notas, vamos acrescentar um titulo e aprenderemos a tag para parágrafo <p>. Embora os navegadores consigam ler um texto sem a formatação de parágrafo não vale a pena arriscar.

<html>
<head>
<title> teste 1 </title>
</head>
<body>
<p>Este é um parágrafo</p>
Este não é um parágrafo
</body>
<html>

Vá em arquivo/salvar, não feche o bloco de notas, abra o arquivo 1.html para ver o resultado.
Vamos colocar negrito, itálico e sublinhado. <b>, <i>,<u>

<html>
<head>
<title>teste 1</title>
</head>
<body>
<p>este é um paragrafo</p>
este não é um paragrafo
<br>
<br>
<br>
<b>este texto vai aparecer em negrito</b>
<br>
<br>
<i>este texto vai aparecer em italico</i>
<br>
<br>
<u>este texto vai aprecer em sublinhado</u>
</body>
<html>

Salve e veja o resultado.

0 comentários: