AS EMPRESAS ESTÃO "DESESPERADAS" POR ESTE TIPO DE PROFISSIONAL... - VOCÊ É UM DELES?

MEGA FORMAÇÃO EM INFRAESTRUTURA DE TI - O Conhecimento que Vira Dinheiro - CLIQUE AQUI

Você está em: PrincipalArtigosWebdesign : Toposite002
Quer receber novidades e e-books gratuitos?

CRIAÇÃO DE TOPO PARA O SITE – PARTE II

 

E aí galera, tudo bem com vocês?

 

Neste artigo iremos dar continuidade a primeira parte onde tratamos do assunto “Criação de topo para o site”.

 

Iremos aprender a incrementar tal topo inserindo efeitos diversos. Vamos lá?! Mãos a obra.

 

1- Abra o arquivo com extensão .png criado no artigo passado.

 

 

2- Teremos o nosso topo criado no artigo anterior. Veja:

 

 

3- Agora vamos ao que interessa, os novos efeitos. De princípio criaremos o efeito TV, que consiste em um efeito onde o resultado mostra o topo todo “riscado”. Teremos um efeito final muito agradável e bastante utilizado pela web.

 

4- Crie um retângulo do tamanho de seu topo. Para saber qual o tamanho exato de seu topo, basta selecionar as imagens que utilizou na criação. Confira na imagem abaixo:

 

 

5- Configurações para o retângulo criado:

Cor: azul

Contorno: sem contorno

 

Obs: Para deixar o retângulo sem contorno, com o retângulo selecionado, clique no lápis e selecione de acordo com a imagem abaixo:

 

 

6- Agora iremos definir o efeito em si. Para tal, devemos (estando com o retângulo selecionado) selecionar a textura “Linha Horizontal 3”. Podemos manter a porcentagem padrão (50%).

 

7- O próximo passo é definir a opacidade do retângulo criado, para que o mesmo obtenha um grau de transparência capaz de se visualizar o topo que está localizado atrás do retângulo. A propriedade a ser modificada, opacidade, se encontra à direita da barra de propriedade. Temos como padrão o valor de 100%. Devemos mudar para 20%. Veja como deve ficar sua barra de propriedades após as alterações:

 

 

8- Definimos a opacidade em 20% para que o azul ficasse bem clarinho, criando o efeito de transparência.

 

9- No momento temos vários objetos em nosso documento. Para facilitar o manuseio após todas as configurações necessárias, é ideal que se agrupe o arquivo, ou seja, teremos os vários objetos agrupados em apenas um. Para agrupar o documento, selecione todos os objetos com a ferramenta Seta Preta. Logo após acesse o menu Modificar, Agrupar ou acione o atalho Ctrl+G. Veja:

 

 

10- Teremos nosso arquivo com todos os objetos agrupados. Veja o efeito final:

 

 

Dica: Caso não esteja conseguindo visualizar o efeito criado com detalhes, podemos aumentar a imagem dando um zoom. Acione o seguinte comando para aumentar a imagem: Ctrl +. Cada Crtl + que der, a imagem irá ficar maior, melhorando assim a visualização. Para diminuir o tamanho da imagem, acione o comando Ctrl -. Veja um exemplo utilizando o comando Ctrl +:

 

 

11- Podemos explorar ainda mais a barra de propriedades e buscar novas texturas, mudar a cor do retângulo e por aí vai. Para explorar estas outras opções devemos desagrupar nosso arquivo. Para tal acesse o menu Modificar, Desagrupar ou acionar o atalho Ctrl+Shift+G.

 

 

12- Confira os exemplos que criei e que você poderá utilizar em seu site. O importante é usar a criatividade!!!

 

 

 

 

Muito bem galera, espero que todos tenham adquirido novos conhecimentos para que utilizem na prática os conceitos e efeitos vistos neste artigo.

 

Um cordial abraço a todos e até a próxima!

 

Fábio Almeida

e-mail: webdesigner.pro@pop.com.br

 

 

Untitled Document
PHOTOSHOP - BÁSICO
1 Lição 01 - Conhecendo o Photoshop
1 Lição 02 - Navegando pelas imagens
1 Lição 03 - Organizando o ambiente de trabalho
1 Módulo 01 - Conceitos iniciais
1 Módulo 02 - Ferramentas - Parte 1
1 Módulo 03 - Ferramentas - Parte 2
1 Módulo 04 - Ferramentas - Parte 3
1 Módulo 05 - Ferramentas - Parte 4
1 Módulo 06 - Ferramentas - Parte 5
1 Módulo 07 - Ferramentas - Parte 6
1 Módulo 08 - Manipulação de Cores e Trabalho com Arquivos
1 Módulo 09 - Funcionamento das Paletas - Parte 1
1 Módulo 10 - Funcionamento das Paletas - Parte 2
1 Módulo 11 - Detalhamento da Paleta Camadas
1 Módulo 12 - A Paleta Histórico
1 Módulo 13 - Menu Arquivo
1 Módulo 14 - Formatos de Arquivos
1 Módulo 15 - Configurações de Página
1 Módulo 16 - Menu Imagem - Parte 2
1 Módulo 17 - Menu Imagem - Parte 2
1 Módulo 18 - Menu Imagem - Parte 3
1 Módulo 19 - Menu Imagem - Parte 4
1 Módulo 20 - Menu Imagem - Parte 5
1 Módulo 21 - Menu Imagem - Parte 6
1 Módulo 22 - Menu Imagem - Parte 7
1 Módulo 23 - Menu Camada
1 Módulo 24 - Menu Camada e Menu Solucionar
1 Módulo 25 - Menu Filtro - Parte 1
1 Módulo 26 - Menu Filtro - Parte 2
1 Módulo 27 - Menu Filtro - Parte 3
1 Módulo 28 - Menu Filtro - Parte 4
1 Módulo 29 - Menu Filtro - Parte 5
1 Módulo 30 - Menu Filtro - Parte 6
1 Módulo 31 - Menu Filtro - Parte 7
1 Módulo 32 - Menu Filtro - Parte 8
1 Módulo 33 - Menu Filtro - Parte 9
1 Módulo 34 - Menu Filtro - Parte 9
1 Módulo 35 - Filtros de Estilização
1 Módulo 36 - Filtros de Nitidez e Pixelização
1 Módulo 37 - Filtros de Ruído e Textura
1 Módulo 38 - Filtros de Traçados de Pincel - Parte 1
1 Módulo 39 - Filtros de Traçados de Pincel - Parte 2
1 Módulo 40 - Outras Opções de Filtros
1 Módulo 41 - Menu Visualizar - Parte 1
1 Módulo 42 - Menu Visualizar - Parte 2
1 Módulo 43 - Menu Janela
1 Módulo 44 - Menu Ajuda
1 Módulo 45 - Digitalizando Figuras
1 Módulo 46 - Exemplos Práticos
1 Módulo 47 - Exemplos Práticos
1 Módulo 48 - Exemplos Práticos
PAGEMAKER - BÁSICO
1 Page Maker 7.0 - Parte 01
1 Page Maker 7.0 - Parte 02
1 Page Maker 7.0 - Parte 03
1 Page Maker 7.0 - Parte 04
1 Page Maker 7.0 - Parte 05
1 Page Maker 7.0 - Parte 06
1 Page Maker 7.0 - Parte 07
1 Page Maker 7.0 - Parte 08
1 Page Maker 7.0 - Parte 09
1 Page Maker 7.0 - Parte 10
1 Page Maker 7.0 - Parte 11
1 Page Maker 7.0 - Parte 12
1 Page Maker 7.0 - Parte 13
1 Page Maker 7.0 - Parte 14
1 Page Maker 7.0 - Parte 15
1 Page Maker 7.0 - Parte 16
1 Page Maker 7.0 - Parte 17
1 Page Maker 7.0 - Parte 18
1 Page Maker 7.0 - Parte 19
1 Page Maker 7.0 - Parte 20
1 Page Maker 7.0 - Parte 21
1 Page Maker 7.0 - Parte 22
1 Page Maker 7.0 - Parte 23
COREL DRAW
1 Conceitos Iniciais
1 Tela do Corel Draw
1 Caixa de Ferramentas
1 Uso de Transformadores, Espelhamento e Rotacionamento
1 Configurando a Área de Trabalho - Parte 1
1 Configurando a Área de Trabalho - Parte 2
1 Configurando a Área de Trabalho - Parte 3
1 Configurando a Área de Trabalho - Parte 4
1 Utilização da Régua
1 Visualização de Trabalhos - Parte 1
1 Visualização de Trabalhos - Parte 2
1 Menus Rápidos e Barras de Ferramentas
1 Salvando Arquivos e Objetos Selecionados
1 Construção de Desenhos e Modelagem de Objetos - Parte 1
1 Construção de Desenhos e Modelagem de Objetos - Parte 2
1 Construção de Desenhos e Modelagem de Objetos - Parte 3
1 Modificando as Propriedades de um Polígno
1 Seleção e Movimentação de Objetos - Parte 1
1 Seleção e Movimentação de Objetos - Parte 2
1 Dimensionamento de Objetos com Precisão
1 Girando um Elemento com Precisão - Parte 1
1 Girando um Elemento com Precisão - Parte 2
1 Redefinindo a âncora de inclinação com o Centro de um Elemento
1 Módulo Intermediário - Parte 01 - Desenhando Linhas e Curvas
1 Módulo Intermediário - Parte 02 - A Ferramenta Bézier
1 Módulo Intermediário - Parte 03 - Curvas em modo Pré-definido
1 Módulo Intermediário - Parte 04 - Curvas em modo Caligráfico
1 Módulo Intermediário - Parte 05 - Exemplificando Linhas e Objetos de Curvas
1 Módulo Intermediário - Parte 06 - Ponto de Ancoragem de Escala
1 Módulo Intermediário - Parte 07 - Modificando partes de um elemento de curva
1 Módulo Intermediário - Parte 08 - Dividindo um elemento com a ferramenta Faca
1 Módulo Intermediário - Parte 09 - Preenchendo e contornando elementos
1 Módulo Intermediário - Parte 10 - Preenchendo Elementos
1 Módulo Intermediário - Parte 11 - Como Gerenciar Preenchimentos
1 Módulo Intermediário - Parte 12 - Como Trabalhar com Preenchimentos Gradientes
1 Módulo Intermediário - Parte 13 - Criar e Salvar Preenchimentos Gradiente Personalizados
1 Módulo Intermediário - Parte 14 - Modificando a Condição de um Preenchimento Gradiente
1 Módulo Intermediário - Parte 15 - Modificando a Transição de um Preenchimento Gradiente
1 Módulo Intermediário - Parte 16 - Como Trabalhar com Preenchimentos de Padrão
1 Módulo Intermediário - Parte 17 - Trabalhando com Contornos
1 Módulo Intermediário - Parte 18 - Colocando formas de extremidade de linha
1 Módulo Intermediário - Parte 19 - Copiando propriedades de um elemento
1 Módulo Intermediário - Parte 20 - Duplicando um elementos usando a duplicação inteligente
1 Módulo Intermediário - Parte 21 - Alinhando e distribuindo elementos
1 Módulo Intermediário - Parte 22 - Expandindo elementos horizontal e verticalmente
1 Módulo Intermediário - Parte 23 - Trabalhando com Texto - Parte 1
1 Módulo Intermediário - Parte 24 - Trabalhando com Texto - Parte 2
1 Módulo Intermediário - Parte 25 - Trabalhando com Texto - Parte 3
1 Módulo Intermediário - Parte 26 - Trabalhando com Texto - Parte 4
1 Módulo Intermediário - Parte 27 - Trabalhando com Texto - Parte 5
1 Módulo Intermediário - Parte 28 - Trabalhando com Texto - Parte 6
1 Módulo Intermediário - Parte 29 - Trabalhando com Texto - Parte 7
1 Módulo Intermediário - Parte 30 - Trabalhando com Texto - Parte 8
1 Módulo Avançado - Parte 1 - Desenvolvendo Efeitos Especiais
1 Módulo Avançado - Parte 2 - Alterando os Objetos Intermediários de uma Mistura
1 Módulo Avançado - Parte 3 - Configurar o Progresso de Cores
1 Módulo Avançado - Parte 4 - Alterando Objetos
1 Módulo Avançado - Parte 5 - Aprendendo a editar distorções Zíper
1 Módulo Avançado - Parte 6 - Distorção Torcer - Aajustando sua rotação
1 Módulo Avançado - Parte 7 - Envelopes Pré-definidos
1 Módulo Avançado - Parte 8 - Preenchimento de Extrusões Vetoriais
1 Módulo Avançado - Parte 9 - Como Acertar a Intensidade de uma Fonte de Luz
1 Módulo Avançado - Parte 10 - Como Editar Sombreamentos
1 Módulo Avançado - Parte 11 - Como Dissolver o Sombreamento
1 Módulo Avançado - Parte 12 - Colocando Contornos nos Objetos
1 Módulo Avançado - Parte 13 - Lentes - Parte 1
1 Módulo Avançado - Parte 14 - Lentes - Parte 2
1 Módulo Avançado - Parte 15 - Lentes - Parte 3
1 Módulo Avançado - Parte 16 - Como Copiar a Perspectiva de um Objeto.
1 Módulo Avançado - Parte 17 - Impressão no CorelDraw
1 Módulo Avançado - Parte 18 - Como Imprimir Trabalhos de Impressão Grandes, Como Ladrilhos
3D Stdio MAX
1 3D Studio Max - Introdução
1 3D Studio Max - Barra de Ferramentas Lateral
1 3D Studio Max - Menus
1 3D Studio Max - Barra de Ferramentas Principal
FIREWORKS - BÁSICO
1 Interface do Fireworks
1 Criação de Topo para o Site
1 Criação de Topo para o Site – Parte II
1 Criação do Topo do Site – Parte III
1 Misturar Imagens
1 Criando Botões no Estilo do Windows XP
1 Menu superior do site
1 Menu Lateral do Site - Versão I
1 Menu Lateral do Site - Versão II
1 Reflexo em Imagem e Texto
1 Montando o Corpo do Site - Parte 1
1 Montando o Corpo do Site - Parte 2
1 Efeito para títulos e textos
1 Efeito para títulos e textos – Novo Modelo
1 Efeito Fogo no Fireworks – Parte 1
1 Efeito Fogo no Fireworks – Parte II
1 Limitar Imagens em Formas
1 Atar ou Unir textos em letras
1 Visualizador de Imagens – Parte 2
1 Visualizador de Imagens – Parte 1
1 Criando Desenho a partir de uma Foto
1 Transparência em Texto
1 Criação de Banner Animado
1 Efeito Diferença
1 Trabalhando com Processo em Lote
1 Animando com o Fireworks – Parte 1
1 Animando com o Fireworks – Parte 2
1 Série Logomarca – Logo Macromedia
1 Série Logomarca – Logo AMD
1 Série Logomarca – Logo HSBC
1 Série Logomarca – Logo Navegador Opera
1 Série Logomarca – Logo Windows XP
1 Série Logomarca – Logo Claro
1 Série Logomarca – Logo Especial - Parte 1
1 Série Logomarca – Logo Especial - Parte 2
1 Série Logomarca – Logo Especial - 03
1 Série Logomarca – Logo Especial - 04
1 Série Logomarca – Logo Especial - 05
1 Série Logomarca – Logo Especial - 06
1 Série Logomarca – Logo Especial - 07
1 Série Logomarca – Logo Especial - 08
1 Série Logomarca – Logo Especial - 09
1 Série Logomarca – Logo Especial - 10
1 Criação de Newsletter – Parte 1
1 Criação de Newsletter – Parte 2
1 Criação e Edição de Tabelas no Fireworks – Parte 1
1 Criação e Edição de Tabelas no Fireworks – Parte 2
1 Teclas de Atalho do Fireworks
1 Trabalhando com Máscaras
1 Efeito Grid em 3D
1 Imagem em Texto
1 Modelos de Degrade – Macromedia Fireworks – Parte 1
1 Modelos de Degrade – Macromedia Fireworks – Parte 2
1 Aplicando Sombra na Perspectiva com o Fireworks
1 Efeito em Texto – Parte 1
1 Efeito em Texto – Parte 2
1 Efeito em Fotografia
1 Folha de Caderno pelo Fireworks
1 Interação entre o Fireworks e o Dreamweaver para edição de imagens
1 Série Copa 2006 – Bandeira Personalizada
1 Série Copa 2006 – Gooool Personalizado
1 Série Copa 2006 – Bandeira Personalizada – Modelo 02
1 Série Copa 2006 – Camisa do Brasil
1 Vetorizando Imagens
1 Criação de Newsletter – Parte 3
1 Criação de Newsletter – Parte 4
1 Série Efeitos – Parte 1
1 Série Efeitos – Parte 2
1 Série Efeitos – Parte 3
1 Série Efeitos – Parte 4
1 Série Efeitos – Parte 5
1 Série Efeitos – Parte 6
1 Série Efeitos – Parte 7
1 Série Efeitos – Parte 8
1 Série Efeitos – Parte 9
1 Série Efeitos – Parte 10
1 Série Efeitos – Parte 11
1 Série Efeitos – Parte 12
1 Série Efeitos – Parte 13
1 Série Efeitos – Parte 14
1 Série Efeitos – Parte 15
1 Série Efeitos – Parte 16
1 Série Efeitos – Parte 17
1 Série Efeitos – Parte 18
1 Série Efeitos – Parte 19
1 Série Efeitos – Parte 20
1 Série Efeitos – Parte 21
1 Série Efeitos – Parte 22
1 Série Efeitos – Parte 23
1 Série Efeitos – Parte 24
1 Série Efeitos – Parte 25
1 Série Efeitos – Parte 26
1 Série Efeitos – Parte 27
1 Série Efeitos – Parte 28
1 Série Efeitos – Parte 29
1 Série Efeitos – Parte 30
1 Série Efeitos – Parte 31
1 Série Efeitos – Parte 32
1 Série Efeitos – Parte 33
1 Série Efeitos – Parte 34
1 Série Efeitos – Parte 35
1 Série Efeitos – Parte 36
1 Série Efeitos – Parte 37
1 Série Efeitos – Parte 38
1 Série Efeitos – Parte 39
1 Série Efeitos – Parte 40
1 Série Efeitos – Parte 41
1 Série Efeitos – Parte 42
1 Série Efeitos – Parte 43
1 Série Efeitos – Parte 44
1 Série Efeitos – Parte 45
1 Série Efeitos – Parte 46
1 Série Efeitos – Parte 47
1 Série Efeitos – Parte 48
1 Série Efeitos – Parte 49
1 Série Efeitos – Parte 50
FIREWORKS - AVANÇADO
1 Criando Banner com o Fireworks
1 Criando Menu Pop-up no Fireworks
1 Criando Botões no Fireworks
1 Criando Banners no Fireworks
FLASH - BÁSICO
1 Conceitos Iniciais
1 Ferramentas de Criação
1 A Janela de Criação de Filmes
1 Elementos Gráficos e Textos
1 Desenhando com o Flash
1 Criando uma Animação - Exemplo Prático
1 Exemplos de Ferramentas
1 Animando com o Flash
1 Usando Máscaras e Linhas Guia
1 Usando Movie Clips - Introdução
1 Usando Movie Clips Para Eexibir Funções de Data
1 Criando Botões
1 Usando Cenas
1 Desenhando com o Pincel
1 Pincel, Borracha e Cores
1 Cores
1 Combinação, Movimentação e Transformação de Elementos Selecionados
1 Botões do Flash
1 Alinhamento dos Elementos na Tela
1 Disposição e Organização dos Níveis
1 Usando preloaders
1 Banner Dropdown
1 Usando a Action Load Movie
1 Usando o compnente Scroll Pane
1 Trabalhando com Textos - Parte 1
1 Trabalhando com Textos - Parte 2
1 Trabalhando com Bitmaps - Parte 1
1 Caixas de texto de Entrada e Dinâmicas
1 Trabalhando com Bitmaps - Parte 2
1 Botão Liga/Desliga para Som no Flash
1 Especialidades simples de Animação
1 Exemplo Prático - Passo-a-passo - Parte 1
1 Exemplo Prático - Passo-a-passo - Parte 2
1 Recursos do Flash e Movimento com Interpolação
1 Aceleração e Desaceleração
1 Criando Menus Pop-Up
1 Usando seu programa gráfico para criar a interface de uma página em Flash.
1 Interpolação com modificação de Formas
1 Símbolos - Parte 1
1 Símbolos - Parte 2
1 Criando um banner transparente
1 Criando uma barra de botões Flash para um arquivo HTML
1 Criando movie clips arrastáveis
1 Criando um álbum de fotos com loadMovie
1 Mostrando legendas num mapa com Flash
1 Clipes de Filmes
1 Botões
1 Biblioteca e Guia de Recursos
1 Máscaras e propriedades de camada
1 Ações e cenas
1 Mostrando Legendas em um Mapa com Flash
1 Mouse trails no Flash
Quer receber novidades e e-books gratuitos?

MEGA FORMAÇÃO EM INFRAESTRUTURA DE TI

(Online, Vitalício, Prático e Atualizado)!

  • Chega de ser Ignorado pelo Mercado!

  • A vida não vai Melhorar Sozinha!

  • Quem domina infraestrutura, domina o Mercado.

  • Com esta Formação você vai Dominar o Conhecimento e torne-se o Profissional que as Empresas estão Buscando, "desesperadamente", mas não estão encontrando.

NÃO PROCURE VAGAS, SEJA PROCURADO!

 

Curso Completo de Excel - Curso Online com Certificado - 925 Vídeo Aulas - 22 Cursos - 120:42 horas

 

Para Todos os Detalhes, Acesse:

Curso Completo de Excel - Curso Online com Certificado - 925 Vídeo Aulas - 22 Cursos - 120:42 horas

 

https://juliobattisti.com.br/curso-infra-ti.asp

 

Contato: Telefone: (51) 3717-3796 | E-mail: webmaster@juliobattisti.com.br | Whatsapp: (51) 99627-3434

Júlio Battisti Livros e Cursos Ltda | CNPJ: 08.916.484/0001-25 | Rua Vereador Ivo Cláudio Weigel, 537 - Universitário, Santa Cruz do Sul/RS, CEP: 96816-208

Todos os direitos reservados, Júlio Battisti 2001-2025 ®

LIVRO: MACROS E PROGRAMAÇÃO VBA NO EXCEL 2016 - CURSO COMPLETO E PRÁTICO

DOMINE A PROGRAMAÇÃO VBA NO EXCEL - 878 PÁGINAS - CLIQUE AQUI