O que é a AmaWebs? A AmaWebs é um Software Constructor de Páginas Webs que lhe permite criar, publicar e fazer manutenção da sua pagina na internet. Este.

Apresentação em tema: "O que é a AmaWebs? A AmaWebs é um Software Constructor de Páginas Webs que lhe permite criar, publicar e fazer manutenção da sua pagina na internet. Este."— Transcrição da apresentação:

1

2 O que é a AmaWebs? A AmaWebs é um Software Constructor de Páginas Webs que lhe permite criar, publicar e fazer manutenção da sua pagina na internet. Este Software foi desenhado especialmente para os Anunciantes Qualificados da AmarelasInternet.com O Nosso construtor está desenhado de forma a que qualquer pessoa, com conhecimentos básicos de computação, possa criar a sua própria Pagina Web; por isso colocamos à sua disposição a possibilidade de escolher entre centenas de desenhos criados por profissionais altamente qualificados. A AmaWebs fornece serviço de desenho?

3 Aplicações que usamos na Amawebs

4 Mas todos seguem sempre iguais, de alguma forma…

5 HTML é uma linguagem com a qual se definem as páginas web. ¿ O que é HTML ? CSS, é uma tecnologia que nos permite criar páginas web de uma forma mais exata. Graças aos CSS somos muito mais donos dos resultados finais da página. ¿ O que é CSS ? Página Web

6 Começamos Adicionamos o nosso codigo E que código colocamos? Este é um exemplo de código CSS Vamos ensinar à nossa Amawebs o que desejamos que faça, passo a passo, mediante CSS. Objetivo : Construir as nossas amawebs distintas umas das outras

7 ¿ Onde e como colocamos o nosso código CSS ? Todas as linguagens de programação têm uma chave de entrada e uma chave de saída, isto é, para ensinar ao nosso Amawebs sobre CSS, primeiro temos que lhe dizer que vamos usar códigos CSS. Exemplo o Abre a chave de CSS o Este é o nome do seletor que vamos modificar o Os seletores, também têm chave de entrada e saída o O nosso codigo CSS, está dentro o E encerramos o nosso CSS

8 Cabeceira Cabeceira Menú principal Menú principal Corpo principal Corpo principal Fundo de pagina Fundo de pagina Menú bar Menú bar Sombras de pagina Sombras de pagina Rodapé da pagina Rodapé da pagina Mas antes, vamos conhecer o nosso Amawebs O Nosso Amawebs é formado por partes. Cada uma destas partes tem um nome no CSS, por exemplo: Cabeceira = #Header{}, Menú Principal = #main.menu{}

9 ¿ Como trocamos o fundo da pagina web ? Este fragmento de código CSS, modifica o fundo do nosso Amawebs; lembre-se que o deve inserir dentro das chaves CSS, e não esquecer as {} corpo da pagina = body{} fundo imagem = background-image:url (url de imagen); ¡ Colocamos o fundo que desejamos! Resultado

10 ¿ Como apagamos as bordas sombreadas ? As bordas sombreadas na verdade são o fundo da imagem, e é por isso que vamos utilizar o código background e lhe dar valor NONE, para não ter imagem. Cabeceira = #headerContainer{} Corpo principal = #mainContainer{} Pé de pagina = #footContainer{} E apagamos o fundo imagem = background- image:none; ¡ Já não temos sombras ! Resultado

11 ¿ Como apagamos a sombra que tem a barra de Menus ? Este é um caso especial, já que, se a nossa barra de Menus estiver à esquerda, no CSS se chamará «.mainleft» e se estiver à direita chamar-se-á «.mainright». Principal esquerdo =.mainleft Fundo = background:none; Cor de fundo = background-color:#fff; Nota: Por defeito o fundo branco = #fff Mas podemos alterar a cor para a que mais gostarmos Exemplo : Cinza = #dadada ¡ Desapareceu a barra ou sombra ! Resultado

12 ¿ Como apagamos os botões da Barra de Menus ? No CSS os botões têm o nome de «#main.icon1», Em que 1 é o numero do botão, isto é, deve copiar e pegar as mesmas propiedades, trocando o 1, pelo 2, 3 e 4, Isto aplica-se a todos os botões da barra de menus. Embora possamos apagar os botões da barra de menus, eles estarão presentes no momento de dar informação, por isso recomendo a inserção de uma tabela. Usando a nossa ferramenta TABLA inserimos uma tabela, de 900px de largura e 550px de altura, e cor de fundo branco. Resultado ¡ Trabalhamos preenchendo informação dentro da nossa tabela !

13 ¿ Como trocamos a cor de fundo do menú principal ? No nosso menú principal, podemos trocar o fundo de todos os modelos, por um fundo personalizado, ou apagar e substituir apenas por texto, também podemos lhe dar uma cor sólida. Se desejarmos colocar uma imagem§ no nosso botão, inserimos o url da imagem dentro das (), ou se desejarmos eliminar o fundo usamos - background-imagen:none; ¡ Eliminamos o fundo da imagem do botão ! Resultado

14 ¿ Como trocamos a color de fundo do rodapé da pagina? No CSS o rodapé da pagina chama-se «#foot». É importante saber como modificar o nosso FOOT, porque tem que haver relação entre as cores e fundos usados no nosso Amawebs. Se desejarmos colocar uma imagem no nosso rodapé, inserimos a url da imagem dentro das (), ou se desejarmos eliminar o fundo usamos - background-imagen:none; ¡ Colocamos uma cor sólida… muito bem ! Resultado

15 http://mejores.amawebs.com ¿ E como pode ficar a nossa pagina Amawebs ? Vejamos um exemplo..!! Testando e usando diversos códigos pode-se conseguir uma grande variedade.

16 Recomendação O segundo hábito é fundamental porque para levar a cabo qualquer coisa que desejamos, primeiro devemos de ter o resultado em mente, pois para querer fazer algo primero tem que saber o que pretende para depois saber como o vai conseguir e quais os beneficios ou resultados que vai ganhar com isso. Hábito 2: Comece com uma ideia em mente Windows 8 – Metro Style Construa os seus Layouts

17 Ferramentas Extras http:// kuler.adobe.com http://bgmaker.ventdaval.com http://www.htmlya.com.ar http://www.cssya.com.arhttp://www.templatemonster.com http://www.iconfinder.com Nestas paginas vai encontrar informação, utilidades, icones, cores, códigos, fundos, templates, etc.

18