Nesta aula você aprendera: <ul><li>Plano de planejar seu Site </li></ul><ul><li>Estilos de Páginas </li></ul><ul><li>Ativi...
Desenho de Interface
<ul><li>Na Web, passados alguns anos, certas convenções já são utilizadas e respeitadas em uma série de websites.  Algumas...
<ul><li>Marca da empresa:  Geralmente localizada  no topo esquerdo da página . Este foi um padrão que surgiu derivado da c...
<ul><li>Em seu livro Projetando Websites, Jakob Nielsen mostra que 55% dos websites disponibilizam as informações instituc...
<ul><li>A combinação das informações levantadas por vários autores leva a um wireframe que pode ser considerado como padrã...
Marca (Link p/ a Home) Buscar Navegação global Navegação de rodapé Navegação  local Breadcrumbs Conteúdo global e contextual
Navegação de rodapé Navegação  local Breadcrumbs Conteúdo global e contextual Navegação global Ferramentas Buscar Login OK...
Navegação  global Navegação de rodapé Navegação local Breadcrumbs Conteúdo global e contextual Ferramentas Buscar Login OK...
Marca (Link p/ a Home) Buscar Navegação  global Navegação de rodapé Navegação local Breadcrumbs Conteúdo global e contextual
<ul><li>Resolução do monitor </li></ul><ul><li>“ Área gráfica segura” em telas de 1024 x 768 pixels de resolução: </li></u...
Área gráfica segura em 960 X 570 Deslocamento da página em relação ao  browser : 8  pixels .
Atividade <ul><li>Criar a Interface do Seu site usando os conhecimento em aula </li></ul>
Próximos SlideShares
Carregando em…5
×

Aula dreamweaver interface

768 visualizações

Publicada em

Publicada em: Tecnologia
0 comentários
0 gostaram
Estatísticas
Notas
  • Seja o primeiro a comentar

  • Seja a primeira pessoa a gostar disto

Sem downloads
Visualizações
Visualizações totais
768
No SlideShare
0
A partir de incorporações
0
Número de incorporações
1
Ações
Compartilhamentos
0
Downloads
27
Comentários
0
Gostaram
0
Incorporações 0
Nenhuma incorporação

Nenhuma nota no slide

Aula dreamweaver interface

  1. 2. Nesta aula você aprendera: <ul><li>Plano de planejar seu Site </li></ul><ul><li>Estilos de Páginas </li></ul><ul><li>Atividade </li></ul>
  2. 3. Desenho de Interface
  3. 4. <ul><li>Na Web, passados alguns anos, certas convenções já são utilizadas e respeitadas em uma série de websites. Algumas pesquisas já tratam desta questão. </li></ul>
  4. 5. <ul><li>Marca da empresa: Geralmente localizada no topo esquerdo da página . Este foi um padrão que surgiu derivado da cultura ocidental de leitura da esquerda para a direita, de cima para baixo . </li></ul><ul><li>Por ser um comportamento repetido que se tornou um padrão, é recomendado também que a marca da empresa possua um link para a homepage do website em todas as telas, menos na própria homepage. </li></ul>
  5. 6. <ul><li>Em seu livro Projetando Websites, Jakob Nielsen mostra que 55% dos websites disponibilizam as informações institucionais em links &quot;About (nome da empresa)&quot;, 21% como &quot;About Us (Sobre Nós)&quot; , 7% como &quot;Company Information (Informações da Empresa)&quot; e 5% como &quot;Who We Are (Quem Somos)&quot;. </li></ul>
  6. 7. <ul><li>A combinação das informações levantadas por vários autores leva a um wireframe que pode ser considerado como padrão para o posicionamento de elementos de interface de websites. </li></ul>Elemento de Interface Posicionamento Pesquisador Marca da empresa Canto superior esquerdo Nielsen, Adkisson e Bernard Busca Parte superior Nielsen, Adkisson e Bernard Navegação global Parte superior com links na horizontal Nielsen, Adkisson e Krug Navegação local Coluna da esquerda Nielsen, Adkisson e Bernard Breadcrumbs Parte superior, abaixo da marca da empresa Adkisson, Lida e Chaparro e Krug Conteúdo global e contextual Área central Bernard Navegação de rodapé Parte inferior Nielsen, Krug e Lynch e Horton
  7. 8. Marca (Link p/ a Home) Buscar Navegação global Navegação de rodapé Navegação local Breadcrumbs Conteúdo global e contextual
  8. 9. Navegação de rodapé Navegação local Breadcrumbs Conteúdo global e contextual Navegação global Ferramentas Buscar Login OK Senha Marca (Link p/ a Home)
  9. 10. Navegação global Navegação de rodapé Navegação local Breadcrumbs Conteúdo global e contextual Ferramentas Buscar Login OK Senha Marca (Link p/ a Home) Destaques e ou Conteúdo Relacionado
  10. 11. Marca (Link p/ a Home) Buscar Navegação global Navegação de rodapé Navegação local Breadcrumbs Conteúdo global e contextual
  11. 12. <ul><li>Resolução do monitor </li></ul><ul><li>“ Área gráfica segura” em telas de 1024 x 768 pixels de resolução: </li></ul><ul><ul><li>Largura máxima: 960 pixels; </li></ul></ul><ul><ul><li>Altura máxima: 570 pixels (visível sem precisar utilizar a barra de rolagem). </li></ul></ul>Dimensões válidas para o Netscape Navigator e Internet Explorer
  12. 13. Área gráfica segura em 960 X 570 Deslocamento da página em relação ao browser : 8 pixels .
  13. 14. Atividade <ul><li>Criar a Interface do Seu site usando os conhecimento em aula </li></ul>

×