Código básico para criar uma página HTML.
Salve sempre o conteúdo com os nomes "Change.html" ou "Index.html"
Código com tabelas para personalizar paginas diferentes no HTML.
Instruções para fazer uma Galeria de Imagens
1 - Copie o código da pagina change e cole em um novo documento. Salve a pagina com o nome que quiser (de preferencia "galeria").
2 - Faça duas pastas na área de trabalho, uma chamada "fotos" e outra "destino". Salve 20 imagens na pasta "fotos".
3 - Abra o Photoshop>Menu Arquivo>Automatizar>Galeria de fotos na web (procure a opção que esta em português).
Escolha o estilo da galeria de imagens, depois combine as pastas "Procurar=pasta_fotos" e "destino=pasta_destino" e clique no OK.
4 - Quando abrir sua galeria no Google, aperte com o botão direito e vá em "exibir o código da fonte da pagina". Copie todo o código apresentado no Google e cole na parte de conteúdo da pagina de galeria.
5 - Copie os arquivos da pasta "destino" e cole na pasta do seu site.
Montando Hiperlinks
O código para hiperlinks é <a> ele sempre terá um atributo chamado "href" que determina o destino do link
Ex: <a href="change.html">Pagina Inicial</a>. "change.html" seria o nome do arquivo endereçado para que quando clicasse em "Pagina Inicial" a pagina fosse redirecionada.
Montando o efeito nos BOTÕES
O código que usamos no botões para o menu de paginas é o mesmo código de imagens com alguns atributos. (Montamos os botões pelo site 'dabutonfactory", baixamos dois estilos de cada botão, um normal e outro do mesmo tamanho mas com a formatação de cores diferentes)
Ex: <img src="img1.png" onmouseover=src="img2.png" onmouseout=src="img1.png">. A imagem inicial é a imagem apresentada ao abrir o site, "onmouseover=src=img2.png" seria a alteração quando passasse o mouse por cima e nessa opção pedimos para colocar a imagem com o efeito, "onmouseout=src="img1.png" é para voltar a imagem original sem efeito, é importante usar esse codigo se não pode ficar 'bugado' o lugar da imagem no menu.
Montando a pagina de VIDEOS
Para montar essa parte, pode copiar o código da primeira pagina básica que só tenha o banner e os botões.
Incorpore os videos do youtube no lugar desejado para o conteúdo.
Montando a pagina de Contato
Para montar essa parte, pode copiar o código da primeira pagina básica que só tenha o banner e os botões.
Incorpore os códigos de formulário no lugar desejado para o conteúdo.
Site pronto: https://drive.google.com/file/d/1LuYsIUvCI8rPL5RjbiwxqJ07frZicleK/view?usp=sharing
Site com a galeria pronto: https://drive.google.com/file/d/1knF0O6H7hM94K7KrYFgvyyj6Sj5JIWda/view?usp=sharing
Comentários
Postar um comentário