SlideShare uma empresa Scribd logo
1 de 5
Baixar para ler offline
Componentes
                                                      •   Home
         Criação de um Web site                       •   Menu
                                                      •   Conteúdo
                                                      •   Navegação
              Clara Pereira Coutinho                  •   Páginas do site: ligações internas e externas




                Página inicial                                  Processo de Concepção
• Deve caber no rectângulo do monitor (evitar o
  scrolling)                                          •   Planear o site (organizar a informação)
• deve compreender o assunto do site,
                                                      •   conteúdo
• como o usar
• e ter indicações sobre o que pode ver (encontrar)
                                                      •   navegação no site
  quando o percorrer                                  •   E os níveis de interacção.
• autor do site
• data da concepção/última alteração
• optimização do site (I.E. e resolução do monitor)




                                                                                                          1
Navegação no site                                            Texto
• Deve proporcionar confiança ao utilizador       • Simplicidade e clareza
  – saber onde está
                                                  • Legibilidade e efeito estético
  – saber como ir para...
                                                  • Tipo de letra: sem serifa

• Torna-se intuitiva quando existe consistência                Exemplos: arial, helvética
  na sua localização                              • Tamanho: 10 ou 12




                        Cor                                           Cuidados!
• Web palette (216 cores)                         • Não coloque demasiadas opções
• É importante haver contraste entre o fundo e    • O conteúdo central deve ficar acima da linha
  os caracteres                                     do “scroll”
• A cor pode ser um indicador da relevância da    • Não conceba uma página pesada que vai
  informação                                        demorar a ser descarregada




                                                                                                   2
5 princípios de design                                         Site
               (J. Davis e S. Merritt (1998)

• Comunique com clareza                            Três condições de sucesso:
• Mantenha consistência visual, conceptual e       • Rápido acesso
  mecânica                                         • Atraente
• Tire partido dos contrastes                      • deve ser fácil e rápido encontrar a informação
• Evite a confusão e a desordem: equilíbrio
• Aplique os princípios do cinema: início,
  meio e o fim




Padrão de comportamento visual para a leitura de          Zonas prioritárias para colocação de
              conteúdos on-line.                                   conteúdos on-line




                                                                                                      3
10 principais erros num site (Nielsen,
                 1994)
1. Frames                                                3. Movimento do texto e animações em loop
Embora a maioria dos browsers já suporte os frames, o
   uso de frames continua a não permitir que o
   utilizador recomende um link de uma determinada       - É difícil ler um texto em deslocamento
   página dentro do site.                                - o uso intensivo de animações causa cada vez mais
                                                            problemas sendo associados pelos utilizadores a
2. Usar tecnologia de ponta                                 publicidade.
Os upgrades do software leva a que muitos utilizadores
    desistam de visitar um site ao mínimo erro de
    javascript.




4. URL complexas e longas                                7. Falta de suporte na navegação

5. Páginas orfãs                                         É importante o utilizador saber sempre onde se
                                                             encontra num documento Web e poder aceder
                                                             sempre a qualquer parte do documento.
6. Páginas com barras de scroll                          Suportes á navegação: logótipo no canto superior
90% dos utilizadores da Web não fazem o scroll               esquerdo, link para a homepage ou indicação clara
  das páginas. Preferem navegar através dos                  de que parte do site a pagina corrente pertence.
  botões e de links visíveis.




                                                                                                                 4
Concepção e gestão do site
8. Utilização de cores não standard para os links
                                                    • Pasta principal com o nome do projecto e
                                                      uma pasta para guardar as imagens
9. Informação desactualizada
                                                    • Defina previamente as pastas que vai
                                                      precisar e onde vai colocar os ficheiros
10. Tempo de download elevado                         (deslocar ficheiros para outras pastas obriga-o a refazer os links)

+ do que 10 segundos de espera para carregar uma    • designe os seus ficheiros de uma forma
   página leva a que o utilizador desista             correcta e consistente




• Quando designar os ficheiros e links não use
  espaços. Por ex:
             manualEd.html ou manual_Ed.html
• seja cuidadoso na actualização do site (designe
  a versão antiga)




                                                                                                                            5

Mais conteúdo relacionado

Mais procurados

Apresentação site
Apresentação siteApresentação site
Apresentação siteFelipe Perin
 
Princpiosdowebwriting 111206150428-phpapp02
Princpiosdowebwriting 111206150428-phpapp02Princpiosdowebwriting 111206150428-phpapp02
Princpiosdowebwriting 111206150428-phpapp02eramos7senac
 
Site profissional em wordpress - emerson01@gmail
Site profissional em wordpress - emerson01@gmailSite profissional em wordpress - emerson01@gmail
Site profissional em wordpress - emerson01@gmailEmersonGonalves43
 
Webdesign - Elementos de um página web
Webdesign - Elementos de um página webWebdesign - Elementos de um página web
Webdesign - Elementos de um página webOdair Cavichioli
 
Princípios do Webwriting
Princípios do WebwritingPrincípios do Webwriting
Princípios do Webwritingduradez
 
Minicurso de desenvolvimento de sites com cms Joomla
Minicurso de desenvolvimento de sites com cms JoomlaMinicurso de desenvolvimento de sites com cms Joomla
Minicurso de desenvolvimento de sites com cms JoomlaJosé Roberto Ferreira
 
SEO – A PEÇA CHAVE DO QUEBRA-CABEÇA
SEO –  A PEÇA CHAVE DO QUEBRA-CABEÇASEO –  A PEÇA CHAVE DO QUEBRA-CABEÇA
SEO – A PEÇA CHAVE DO QUEBRA-CABEÇALeonardo Ferreira
 
Introdução ao desenvolvimento Web
Introdução ao desenvolvimento WebIntrodução ao desenvolvimento Web
Introdução ao desenvolvimento WebSérgio Souza Costa
 
Apresentação básica do breadcrumb, o que é e como funciona.
Apresentação básica do breadcrumb, o que é e como funciona.Apresentação básica do breadcrumb, o que é e como funciona.
Apresentação básica do breadcrumb, o que é e como funciona.Paulo Henrique Mendes
 
Desvendando padrões para desenvolvimento web, base para o sucesso
Desvendando padrões para desenvolvimento web, base para o sucessoDesvendando padrões para desenvolvimento web, base para o sucesso
Desvendando padrões para desenvolvimento web, base para o sucessoUbiratan Z. do Nascimento
 

Mais procurados (12)

Apresentação site
Apresentação siteApresentação site
Apresentação site
 
Princpiosdowebwriting 111206150428-phpapp02
Princpiosdowebwriting 111206150428-phpapp02Princpiosdowebwriting 111206150428-phpapp02
Princpiosdowebwriting 111206150428-phpapp02
 
Site profissional em wordpress - emerson01@gmail
Site profissional em wordpress - emerson01@gmailSite profissional em wordpress - emerson01@gmail
Site profissional em wordpress - emerson01@gmail
 
Webdesign - Elementos de um página web
Webdesign - Elementos de um página webWebdesign - Elementos de um página web
Webdesign - Elementos de um página web
 
Princípios do Webwriting
Princípios do WebwritingPrincípios do Webwriting
Princípios do Webwriting
 
Minicurso de desenvolvimento de sites com cms Joomla
Minicurso de desenvolvimento de sites com cms JoomlaMinicurso de desenvolvimento de sites com cms Joomla
Minicurso de desenvolvimento de sites com cms Joomla
 
SEO – A PEÇA CHAVE DO QUEBRA-CABEÇA
SEO –  A PEÇA CHAVE DO QUEBRA-CABEÇASEO –  A PEÇA CHAVE DO QUEBRA-CABEÇA
SEO – A PEÇA CHAVE DO QUEBRA-CABEÇA
 
Web Design Responsivo
Web Design ResponsivoWeb Design Responsivo
Web Design Responsivo
 
Introdução ao desenvolvimento Web
Introdução ao desenvolvimento WebIntrodução ao desenvolvimento Web
Introdução ao desenvolvimento Web
 
Apresentação básica do breadcrumb, o que é e como funciona.
Apresentação básica do breadcrumb, o que é e como funciona.Apresentação básica do breadcrumb, o que é e como funciona.
Apresentação básica do breadcrumb, o que é e como funciona.
 
Desvendando padrões para desenvolvimento web, base para o sucesso
Desvendando padrões para desenvolvimento web, base para o sucessoDesvendando padrões para desenvolvimento web, base para o sucesso
Desvendando padrões para desenvolvimento web, base para o sucesso
 
Projeto website
Projeto websiteProjeto website
Projeto website
 

Destaque

Renan Dantas - Coordenador Seven Computação
Renan Dantas - Coordenador Seven ComputaçãoRenan Dantas - Coordenador Seven Computação
Renan Dantas - Coordenador Seven ComputaçãoWe Do Logos
 
Edição de páginas para a Web
Edição de páginas para a WebEdição de páginas para a Web
Edição de páginas para a WebElisabete Cruz
 
Criar Páginas Web
Criar Páginas WebCriar Páginas Web
Criar Páginas WebModeradora
 
Revisão AP1 Construção de Páginas Web - CEDERJ
Revisão AP1 Construção de Páginas Web - CEDERJRevisão AP1 Construção de Páginas Web - CEDERJ
Revisão AP1 Construção de Páginas Web - CEDERJDeyvid Nascimento
 
Tic-excel-03
Tic-excel-03Tic-excel-03
Tic-excel-03diogoa21
 
M5-Desenvolvimento-Paginas-Web
M5-Desenvolvimento-Paginas-WebM5-Desenvolvimento-Paginas-Web
M5-Desenvolvimento-Paginas-Webdiogoa21
 
Introdução ao desenvolvimento de páginas web estáticas
Introdução ao desenvolvimento de páginas web estáticasIntrodução ao desenvolvimento de páginas web estáticas
Introdução ao desenvolvimento de páginas web estáticasSusana Oliveira
 
Introdução à Criação De Páginas Web Aula1
Introdução à Criação De Páginas Web Aula1Introdução à Criação De Páginas Web Aula1
Introdução à Criação De Páginas Web Aula1marioreis
 
Criação de páginas web
Criação de páginas webCriação de páginas web
Criação de páginas webarturramisio
 
5 – Desenvolvimento de Páginas Web Dinâmicas PHP: introdução
5 – Desenvolvimento de Páginas Web Dinâmicas PHP: introdução5 – Desenvolvimento de Páginas Web Dinâmicas PHP: introdução
5 – Desenvolvimento de Páginas Web Dinâmicas PHP: introduçãoAgrupamento de Escolas da Batalha
 
Regras básicas na construção de um site
Regras básicas na construção de um siteRegras básicas na construção de um site
Regras básicas na construção de um siteAna Santos
 
Criação de uma base de dados para gestão de uma biblioteca
Criação de uma base de dados para gestão de uma bibliotecaCriação de uma base de dados para gestão de uma biblioteca
Criação de uma base de dados para gestão de uma bibliotecaDavid Canjamba 2D
 

Destaque (17)

Renan Dantas - Coordenador Seven Computação
Renan Dantas - Coordenador Seven ComputaçãoRenan Dantas - Coordenador Seven Computação
Renan Dantas - Coordenador Seven Computação
 
Matéria sobre criação de páginas Web
Matéria sobre criação de páginas WebMatéria sobre criação de páginas Web
Matéria sobre criação de páginas Web
 
Edição de páginas para a Web
Edição de páginas para a WebEdição de páginas para a Web
Edição de páginas para a Web
 
As TIC...
As TIC...As TIC...
As TIC...
 
Criar Páginas Web
Criar Páginas WebCriar Páginas Web
Criar Páginas Web
 
Apresentação CPW Cederj
Apresentação CPW CederjApresentação CPW Cederj
Apresentação CPW Cederj
 
Revisão AP1 Construção de Páginas Web - CEDERJ
Revisão AP1 Construção de Páginas Web - CEDERJRevisão AP1 Construção de Páginas Web - CEDERJ
Revisão AP1 Construção de Páginas Web - CEDERJ
 
Tic-excel-03
Tic-excel-03Tic-excel-03
Tic-excel-03
 
M5-Desenvolvimento-Paginas-Web
M5-Desenvolvimento-Paginas-WebM5-Desenvolvimento-Paginas-Web
M5-Desenvolvimento-Paginas-Web
 
Introdução ao desenvolvimento de páginas web estáticas
Introdução ao desenvolvimento de páginas web estáticasIntrodução ao desenvolvimento de páginas web estáticas
Introdução ao desenvolvimento de páginas web estáticas
 
Modulo 3 tic
Modulo 3 ticModulo 3 tic
Modulo 3 tic
 
Introdução à Criação De Páginas Web Aula1
Introdução à Criação De Páginas Web Aula1Introdução à Criação De Páginas Web Aula1
Introdução à Criação De Páginas Web Aula1
 
Criação de páginas web
Criação de páginas webCriação de páginas web
Criação de páginas web
 
5 – Desenvolvimento de Páginas Web Dinâmicas PHP: introdução
5 – Desenvolvimento de Páginas Web Dinâmicas PHP: introdução5 – Desenvolvimento de Páginas Web Dinâmicas PHP: introdução
5 – Desenvolvimento de Páginas Web Dinâmicas PHP: introdução
 
Regras básicas na construção de um site
Regras básicas na construção de um siteRegras básicas na construção de um site
Regras básicas na construção de um site
 
Criação de uma base de dados para gestão de uma biblioteca
Criação de uma base de dados para gestão de uma bibliotecaCriação de uma base de dados para gestão de uma biblioteca
Criação de uma base de dados para gestão de uma biblioteca
 
Projeto de WEB Site
Projeto de WEB SiteProjeto de WEB Site
Projeto de WEB Site
 

Semelhante a Criar um website

Padrões em Governo Eletrônico - Cartilha de Codificação e Guia de Administraç...
Padrões em Governo Eletrônico - Cartilha de Codificação e Guia de Administraç...Padrões em Governo Eletrônico - Cartilha de Codificação e Guia de Administraç...
Padrões em Governo Eletrônico - Cartilha de Codificação e Guia de Administraç...GovBR
 
A usabilidade na interface
A usabilidade na interfaceA usabilidade na interface
A usabilidade na interfaceOdair Cavichioli
 
Usabilidade e Navegabilidade
Usabilidade e NavegabilidadeUsabilidade e Navegabilidade
Usabilidade e NavegabilidadeDaniel Tavares
 
Acessibilidade de websites.
Acessibilidade de websites.Acessibilidade de websites.
Acessibilidade de websites.josemfcarvalho
 
Criando temas em PSD pensando no Front-end e Back-end
Criando temas em PSD pensando no Front-end e Back-endCriando temas em PSD pensando no Front-end e Back-end
Criando temas em PSD pensando no Front-end e Back-end@cristianoweb
 
Html - capitulo 04
Html - capitulo 04Html - capitulo 04
Html - capitulo 04Alvaro Gomes
 
Redação para Web
Redação para WebRedação para Web
Redação para WebGovBR
 
Apresentacao 091017061004-phpapp02
Apresentacao 091017061004-phpapp02Apresentacao 091017061004-phpapp02
Apresentacao 091017061004-phpapp02youfoliodev
 
A Web para todos - Acessibilidade na web
A Web para todos  - Acessibilidade na webA Web para todos  - Acessibilidade na web
A Web para todos - Acessibilidade na webRogério Chiavegatti
 

Semelhante a Criar um website (20)

Aula16
Aula16Aula16
Aula16
 
659 html
659 html659 html
659 html
 
Padrões em Governo Eletrônico - Cartilha de Codificação e Guia de Administraç...
Padrões em Governo Eletrônico - Cartilha de Codificação e Guia de Administraç...Padrões em Governo Eletrônico - Cartilha de Codificação e Guia de Administraç...
Padrões em Governo Eletrônico - Cartilha de Codificação e Guia de Administraç...
 
A usabilidade na interface
A usabilidade na interfaceA usabilidade na interface
A usabilidade na interface
 
Usabilidade e Navegabilidade
Usabilidade e NavegabilidadeUsabilidade e Navegabilidade
Usabilidade e Navegabilidade
 
Caderno05
Caderno05Caderno05
Caderno05
 
Web Standards
Web StandardsWeb Standards
Web Standards
 
Acessibilidade de websites.
Acessibilidade de websites.Acessibilidade de websites.
Acessibilidade de websites.
 
Web acessível
Web acessívelWeb acessível
Web acessível
 
Criando temas em PSD pensando no Front-end e Back-end
Criando temas em PSD pensando no Front-end e Back-endCriando temas em PSD pensando no Front-end e Back-end
Criando temas em PSD pensando no Front-end e Back-end
 
Html - capitulo 04
Html - capitulo 04Html - capitulo 04
Html - capitulo 04
 
Redação para Web
Redação para WebRedação para Web
Redação para Web
 
Web mobile dicas
Web mobile dicasWeb mobile dicas
Web mobile dicas
 
Aula 04 layout e composição do site
Aula 04   layout e composição do siteAula 04   layout e composição do site
Aula 04 layout e composição do site
 
Desenvolvimento Web
Desenvolvimento WebDesenvolvimento Web
Desenvolvimento Web
 
Apresentacao 091017061004-phpapp02
Apresentacao 091017061004-phpapp02Apresentacao 091017061004-phpapp02
Apresentacao 091017061004-phpapp02
 
Javascript, HTML5 e CSS3
Javascript, HTML5 e CSS3Javascript, HTML5 e CSS3
Javascript, HTML5 e CSS3
 
Slides .pptx.pdf
Slides .pptx.pdfSlides .pptx.pdf
Slides .pptx.pdf
 
A Web para todos - Acessibilidade na web
A Web para todos  - Acessibilidade na webA Web para todos  - Acessibilidade na web
A Web para todos - Acessibilidade na web
 
Palestra Webstandards
Palestra WebstandardsPalestra Webstandards
Palestra Webstandards
 

Mais de ricaselmavera

Texto apoio 6 pesquisar na web
Texto apoio 6 pesquisar na webTexto apoio 6 pesquisar na web
Texto apoio 6 pesquisar na webricaselmavera
 
Texto apoio 5 indicqualsitesedaac
Texto apoio 5 indicqualsitesedaacTexto apoio 5 indicqualsitesedaac
Texto apoio 5 indicqualsitesedaacricaselmavera
 
Texto apoio 4 conceitos emergentes
Texto apoio 4 conceitos emergentesTexto apoio 4 conceitos emergentes
Texto apoio 4 conceitos emergentesricaselmavera
 
Texto apoio 3 david jonassen ferramentas-cognitivas
Texto apoio 3 david jonassen ferramentas-cognitivasTexto apoio 3 david jonassen ferramentas-cognitivas
Texto apoio 3 david jonassen ferramentas-cognitivasricaselmavera
 
Texto apoio 2 educação sociedade informação
Texto apoio 2 educação sociedade informaçãoTexto apoio 2 educação sociedade informação
Texto apoio 2 educação sociedade informaçãoricaselmavera
 
Texto apoio de te em portugal
Texto apoio de te em portugalTexto apoio de te em portugal
Texto apoio de te em portugalricaselmavera
 
Elearning, b- d-m-learning
Elearning, b- d-m-learningElearning, b- d-m-learning
Elearning, b- d-m-learningricaselmavera
 
Multimédia e hipermédia
Multimédia e hipermédiaMultimédia e hipermédia
Multimédia e hipermédiaricaselmavera
 
Da arpa net à internet
Da arpa net à internetDa arpa net à internet
Da arpa net à internetricaselmavera
 
Conhecimento e aprendizagem
Conhecimento e aprendizagemConhecimento e aprendizagem
Conhecimento e aprendizagemricaselmavera
 
O conceito de te [modo de compatibilidade]
O conceito de te [modo de compatibilidade]O conceito de te [modo de compatibilidade]
O conceito de te [modo de compatibilidade]ricaselmavera
 

Mais de ricaselmavera (19)

Quiz de estética
Quiz de estéticaQuiz de estética
Quiz de estética
 
Quiz de estética
Quiz de estéticaQuiz de estética
Quiz de estética
 
Arte
ArteArte
Arte
 
Texto apoio 6 pesquisar na web
Texto apoio 6 pesquisar na webTexto apoio 6 pesquisar na web
Texto apoio 6 pesquisar na web
 
Texto apoio 5 indicqualsitesedaac
Texto apoio 5 indicqualsitesedaacTexto apoio 5 indicqualsitesedaac
Texto apoio 5 indicqualsitesedaac
 
Texto apoio 4 conceitos emergentes
Texto apoio 4 conceitos emergentesTexto apoio 4 conceitos emergentes
Texto apoio 4 conceitos emergentes
 
Texto apoio 3 david jonassen ferramentas-cognitivas
Texto apoio 3 david jonassen ferramentas-cognitivasTexto apoio 3 david jonassen ferramentas-cognitivas
Texto apoio 3 david jonassen ferramentas-cognitivas
 
Texto apoio 2 educação sociedade informação
Texto apoio 2 educação sociedade informaçãoTexto apoio 2 educação sociedade informação
Texto apoio 2 educação sociedade informação
 
Texto apoio de te em portugal
Texto apoio de te em portugalTexto apoio de te em portugal
Texto apoio de te em portugal
 
Web Quest aulaCC
Web Quest aulaCCWeb Quest aulaCC
Web Quest aulaCC
 
Web2
Web2Web2
Web2
 
Elearning, b- d-m-learning
Elearning, b- d-m-learningElearning, b- d-m-learning
Elearning, b- d-m-learning
 
Multimédia e hipermédia
Multimédia e hipermédiaMultimédia e hipermédia
Multimédia e hipermédia
 
A world wide web
A world wide webA world wide web
A world wide web
 
Da arpa net à internet
Da arpa net à internetDa arpa net à internet
Da arpa net à internet
 
Pesquisar na web
Pesquisar na webPesquisar na web
Pesquisar na web
 
Conhecimento e aprendizagem
Conhecimento e aprendizagemConhecimento e aprendizagem
Conhecimento e aprendizagem
 
O conceito de te [modo de compatibilidade]
O conceito de te [modo de compatibilidade]O conceito de te [modo de compatibilidade]
O conceito de te [modo de compatibilidade]
 
Programa
ProgramaPrograma
Programa
 

Último

Texto dramático com Estrutura e exemplos.ppt
Texto dramático com Estrutura e exemplos.pptTexto dramático com Estrutura e exemplos.ppt
Texto dramático com Estrutura e exemplos.pptjricardo76
 
PROJETO DE EXTENSÃO I - SERVIÇOS JURÍDICOS, CARTORÁRIOS E NOTARIAIS.pdf
PROJETO DE EXTENSÃO I - SERVIÇOS JURÍDICOS, CARTORÁRIOS E NOTARIAIS.pdfPROJETO DE EXTENSÃO I - SERVIÇOS JURÍDICOS, CARTORÁRIOS E NOTARIAIS.pdf
PROJETO DE EXTENSÃO I - SERVIÇOS JURÍDICOS, CARTORÁRIOS E NOTARIAIS.pdfHELENO FAVACHO
 
PROJETO DE EXTENSÃO I - Radiologia Tecnologia
PROJETO DE EXTENSÃO I - Radiologia TecnologiaPROJETO DE EXTENSÃO I - Radiologia Tecnologia
PROJETO DE EXTENSÃO I - Radiologia TecnologiaHELENO FAVACHO
 
E a chuva ... (Livro pedagógico para ser usado na educação infantil e trabal...
E a chuva ...  (Livro pedagógico para ser usado na educação infantil e trabal...E a chuva ...  (Livro pedagógico para ser usado na educação infantil e trabal...
E a chuva ... (Livro pedagógico para ser usado na educação infantil e trabal...andreiavys
 
Teoria heterotrófica e autotrófica dos primeiros seres vivos..pptx
Teoria heterotrófica e autotrófica dos primeiros seres vivos..pptxTeoria heterotrófica e autotrófica dos primeiros seres vivos..pptx
Teoria heterotrófica e autotrófica dos primeiros seres vivos..pptxTailsonSantos1
 
EDUCAÇÃO ESPECIAL NA PERSPECTIVA INCLUSIVA
EDUCAÇÃO ESPECIAL NA PERSPECTIVA INCLUSIVAEDUCAÇÃO ESPECIAL NA PERSPECTIVA INCLUSIVA
EDUCAÇÃO ESPECIAL NA PERSPECTIVA INCLUSIVAssuser2ad38b
 
Responde ou passa na HISTÓRIA - REVOLUÇÃO INDUSTRIAL - 8º ANO.pptx
Responde ou passa na HISTÓRIA - REVOLUÇÃO INDUSTRIAL - 8º ANO.pptxResponde ou passa na HISTÓRIA - REVOLUÇÃO INDUSTRIAL - 8º ANO.pptx
Responde ou passa na HISTÓRIA - REVOLUÇÃO INDUSTRIAL - 8º ANO.pptxAntonioVieira539017
 
Slides Lição 6, CPAD, As Nossas Armas Espirituais, 2Tr24.pptx
Slides Lição 6, CPAD, As Nossas Armas Espirituais, 2Tr24.pptxSlides Lição 6, CPAD, As Nossas Armas Espirituais, 2Tr24.pptx
Slides Lição 6, CPAD, As Nossas Armas Espirituais, 2Tr24.pptxLuizHenriquedeAlmeid6
 
PROJETO DE EXTENSÃO I - TECNOLOGIA DA INFORMAÇÃO Relatório Final de Atividade...
PROJETO DE EXTENSÃO I - TECNOLOGIA DA INFORMAÇÃO Relatório Final de Atividade...PROJETO DE EXTENSÃO I - TECNOLOGIA DA INFORMAÇÃO Relatório Final de Atividade...
PROJETO DE EXTENSÃO I - TECNOLOGIA DA INFORMAÇÃO Relatório Final de Atividade...HELENO FAVACHO
 
Os editoriais, reportagens e entrevistas.pptx
Os editoriais, reportagens e entrevistas.pptxOs editoriais, reportagens e entrevistas.pptx
Os editoriais, reportagens e entrevistas.pptxTailsonSantos1
 
SSE_BQ_Matematica_4A_SR.pdfffffffffffffffffffffffffffffffffff
SSE_BQ_Matematica_4A_SR.pdfffffffffffffffffffffffffffffffffffSSE_BQ_Matematica_4A_SR.pdfffffffffffffffffffffffffffffffffff
SSE_BQ_Matematica_4A_SR.pdfffffffffffffffffffffffffffffffffffNarlaAquino
 
O PLANETA TERRA E SEU SATÉLITE NATURAL - LUA
O PLANETA TERRA E SEU SATÉLITE NATURAL - LUAO PLANETA TERRA E SEU SATÉLITE NATURAL - LUA
O PLANETA TERRA E SEU SATÉLITE NATURAL - LUAJulianeMelo17
 
A EDUCAÇÃO FÍSICA NO NOVO ENSINO MÉDIO: IMPLICAÇÕES E TENDÊNCIAS PROMOVIDAS P...
A EDUCAÇÃO FÍSICA NO NOVO ENSINO MÉDIO: IMPLICAÇÕES E TENDÊNCIAS PROMOVIDAS P...A EDUCAÇÃO FÍSICA NO NOVO ENSINO MÉDIO: IMPLICAÇÕES E TENDÊNCIAS PROMOVIDAS P...
A EDUCAÇÃO FÍSICA NO NOVO ENSINO MÉDIO: IMPLICAÇÕES E TENDÊNCIAS PROMOVIDAS P...PatriciaCaetano18
 
Projeto de Extensão - ENGENHARIA DE SOFTWARE - BACHARELADO.pdf
Projeto de Extensão - ENGENHARIA DE SOFTWARE - BACHARELADO.pdfProjeto de Extensão - ENGENHARIA DE SOFTWARE - BACHARELADO.pdf
Projeto de Extensão - ENGENHARIA DE SOFTWARE - BACHARELADO.pdfHELENO FAVACHO
 
migração e trabalho 2º ano.pptx fenomenos
migração e trabalho 2º ano.pptx fenomenosmigração e trabalho 2º ano.pptx fenomenos
migração e trabalho 2º ano.pptx fenomenosLucianoPrado15
 
Projeto_de_Extensão_Agronomia_adquira_ja_(91)_98764-0830.pdf
Projeto_de_Extensão_Agronomia_adquira_ja_(91)_98764-0830.pdfProjeto_de_Extensão_Agronomia_adquira_ja_(91)_98764-0830.pdf
Projeto_de_Extensão_Agronomia_adquira_ja_(91)_98764-0830.pdfHELENO FAVACHO
 
6ano variação linguística ensino fundamental.pptx
6ano variação linguística ensino fundamental.pptx6ano variação linguística ensino fundamental.pptx
6ano variação linguística ensino fundamental.pptxJssicaCassiano2
 
LISTA DE EXERCICIOS envolveto grandezas e medidas e notação cientifica 1 ANO ...
LISTA DE EXERCICIOS envolveto grandezas e medidas e notação cientifica 1 ANO ...LISTA DE EXERCICIOS envolveto grandezas e medidas e notação cientifica 1 ANO ...
LISTA DE EXERCICIOS envolveto grandezas e medidas e notação cientifica 1 ANO ...Francisco Márcio Bezerra Oliveira
 
Slides Lição 05, Central Gospel, A Grande Tribulação, 1Tr24.pptx
Slides Lição 05, Central Gospel, A Grande Tribulação, 1Tr24.pptxSlides Lição 05, Central Gospel, A Grande Tribulação, 1Tr24.pptx
Slides Lição 05, Central Gospel, A Grande Tribulação, 1Tr24.pptxLuizHenriquedeAlmeid6
 

Último (20)

Texto dramático com Estrutura e exemplos.ppt
Texto dramático com Estrutura e exemplos.pptTexto dramático com Estrutura e exemplos.ppt
Texto dramático com Estrutura e exemplos.ppt
 
PROJETO DE EXTENSÃO I - SERVIÇOS JURÍDICOS, CARTORÁRIOS E NOTARIAIS.pdf
PROJETO DE EXTENSÃO I - SERVIÇOS JURÍDICOS, CARTORÁRIOS E NOTARIAIS.pdfPROJETO DE EXTENSÃO I - SERVIÇOS JURÍDICOS, CARTORÁRIOS E NOTARIAIS.pdf
PROJETO DE EXTENSÃO I - SERVIÇOS JURÍDICOS, CARTORÁRIOS E NOTARIAIS.pdf
 
PROJETO DE EXTENSÃO I - Radiologia Tecnologia
PROJETO DE EXTENSÃO I - Radiologia TecnologiaPROJETO DE EXTENSÃO I - Radiologia Tecnologia
PROJETO DE EXTENSÃO I - Radiologia Tecnologia
 
E a chuva ... (Livro pedagógico para ser usado na educação infantil e trabal...
E a chuva ...  (Livro pedagógico para ser usado na educação infantil e trabal...E a chuva ...  (Livro pedagógico para ser usado na educação infantil e trabal...
E a chuva ... (Livro pedagógico para ser usado na educação infantil e trabal...
 
Teoria heterotrófica e autotrófica dos primeiros seres vivos..pptx
Teoria heterotrófica e autotrófica dos primeiros seres vivos..pptxTeoria heterotrófica e autotrófica dos primeiros seres vivos..pptx
Teoria heterotrófica e autotrófica dos primeiros seres vivos..pptx
 
EDUCAÇÃO ESPECIAL NA PERSPECTIVA INCLUSIVA
EDUCAÇÃO ESPECIAL NA PERSPECTIVA INCLUSIVAEDUCAÇÃO ESPECIAL NA PERSPECTIVA INCLUSIVA
EDUCAÇÃO ESPECIAL NA PERSPECTIVA INCLUSIVA
 
Responde ou passa na HISTÓRIA - REVOLUÇÃO INDUSTRIAL - 8º ANO.pptx
Responde ou passa na HISTÓRIA - REVOLUÇÃO INDUSTRIAL - 8º ANO.pptxResponde ou passa na HISTÓRIA - REVOLUÇÃO INDUSTRIAL - 8º ANO.pptx
Responde ou passa na HISTÓRIA - REVOLUÇÃO INDUSTRIAL - 8º ANO.pptx
 
Slides Lição 6, CPAD, As Nossas Armas Espirituais, 2Tr24.pptx
Slides Lição 6, CPAD, As Nossas Armas Espirituais, 2Tr24.pptxSlides Lição 6, CPAD, As Nossas Armas Espirituais, 2Tr24.pptx
Slides Lição 6, CPAD, As Nossas Armas Espirituais, 2Tr24.pptx
 
PROJETO DE EXTENSÃO I - TECNOLOGIA DA INFORMAÇÃO Relatório Final de Atividade...
PROJETO DE EXTENSÃO I - TECNOLOGIA DA INFORMAÇÃO Relatório Final de Atividade...PROJETO DE EXTENSÃO I - TECNOLOGIA DA INFORMAÇÃO Relatório Final de Atividade...
PROJETO DE EXTENSÃO I - TECNOLOGIA DA INFORMAÇÃO Relatório Final de Atividade...
 
Os editoriais, reportagens e entrevistas.pptx
Os editoriais, reportagens e entrevistas.pptxOs editoriais, reportagens e entrevistas.pptx
Os editoriais, reportagens e entrevistas.pptx
 
Aula sobre o Imperialismo Europeu no século XIX
Aula sobre o Imperialismo Europeu no século XIXAula sobre o Imperialismo Europeu no século XIX
Aula sobre o Imperialismo Europeu no século XIX
 
SSE_BQ_Matematica_4A_SR.pdfffffffffffffffffffffffffffffffffff
SSE_BQ_Matematica_4A_SR.pdfffffffffffffffffffffffffffffffffffSSE_BQ_Matematica_4A_SR.pdfffffffffffffffffffffffffffffffffff
SSE_BQ_Matematica_4A_SR.pdfffffffffffffffffffffffffffffffffff
 
O PLANETA TERRA E SEU SATÉLITE NATURAL - LUA
O PLANETA TERRA E SEU SATÉLITE NATURAL - LUAO PLANETA TERRA E SEU SATÉLITE NATURAL - LUA
O PLANETA TERRA E SEU SATÉLITE NATURAL - LUA
 
A EDUCAÇÃO FÍSICA NO NOVO ENSINO MÉDIO: IMPLICAÇÕES E TENDÊNCIAS PROMOVIDAS P...
A EDUCAÇÃO FÍSICA NO NOVO ENSINO MÉDIO: IMPLICAÇÕES E TENDÊNCIAS PROMOVIDAS P...A EDUCAÇÃO FÍSICA NO NOVO ENSINO MÉDIO: IMPLICAÇÕES E TENDÊNCIAS PROMOVIDAS P...
A EDUCAÇÃO FÍSICA NO NOVO ENSINO MÉDIO: IMPLICAÇÕES E TENDÊNCIAS PROMOVIDAS P...
 
Projeto de Extensão - ENGENHARIA DE SOFTWARE - BACHARELADO.pdf
Projeto de Extensão - ENGENHARIA DE SOFTWARE - BACHARELADO.pdfProjeto de Extensão - ENGENHARIA DE SOFTWARE - BACHARELADO.pdf
Projeto de Extensão - ENGENHARIA DE SOFTWARE - BACHARELADO.pdf
 
migração e trabalho 2º ano.pptx fenomenos
migração e trabalho 2º ano.pptx fenomenosmigração e trabalho 2º ano.pptx fenomenos
migração e trabalho 2º ano.pptx fenomenos
 
Projeto_de_Extensão_Agronomia_adquira_ja_(91)_98764-0830.pdf
Projeto_de_Extensão_Agronomia_adquira_ja_(91)_98764-0830.pdfProjeto_de_Extensão_Agronomia_adquira_ja_(91)_98764-0830.pdf
Projeto_de_Extensão_Agronomia_adquira_ja_(91)_98764-0830.pdf
 
6ano variação linguística ensino fundamental.pptx
6ano variação linguística ensino fundamental.pptx6ano variação linguística ensino fundamental.pptx
6ano variação linguística ensino fundamental.pptx
 
LISTA DE EXERCICIOS envolveto grandezas e medidas e notação cientifica 1 ANO ...
LISTA DE EXERCICIOS envolveto grandezas e medidas e notação cientifica 1 ANO ...LISTA DE EXERCICIOS envolveto grandezas e medidas e notação cientifica 1 ANO ...
LISTA DE EXERCICIOS envolveto grandezas e medidas e notação cientifica 1 ANO ...
 
Slides Lição 05, Central Gospel, A Grande Tribulação, 1Tr24.pptx
Slides Lição 05, Central Gospel, A Grande Tribulação, 1Tr24.pptxSlides Lição 05, Central Gospel, A Grande Tribulação, 1Tr24.pptx
Slides Lição 05, Central Gospel, A Grande Tribulação, 1Tr24.pptx
 

Criar um website

  • 1. Componentes • Home Criação de um Web site • Menu • Conteúdo • Navegação Clara Pereira Coutinho • Páginas do site: ligações internas e externas Página inicial Processo de Concepção • Deve caber no rectângulo do monitor (evitar o scrolling) • Planear o site (organizar a informação) • deve compreender o assunto do site, • conteúdo • como o usar • e ter indicações sobre o que pode ver (encontrar) • navegação no site quando o percorrer • E os níveis de interacção. • autor do site • data da concepção/última alteração • optimização do site (I.E. e resolução do monitor) 1
  • 2. Navegação no site Texto • Deve proporcionar confiança ao utilizador • Simplicidade e clareza – saber onde está • Legibilidade e efeito estético – saber como ir para... • Tipo de letra: sem serifa • Torna-se intuitiva quando existe consistência Exemplos: arial, helvética na sua localização • Tamanho: 10 ou 12 Cor Cuidados! • Web palette (216 cores) • Não coloque demasiadas opções • É importante haver contraste entre o fundo e • O conteúdo central deve ficar acima da linha os caracteres do “scroll” • A cor pode ser um indicador da relevância da • Não conceba uma página pesada que vai informação demorar a ser descarregada 2
  • 3. 5 princípios de design Site (J. Davis e S. Merritt (1998) • Comunique com clareza Três condições de sucesso: • Mantenha consistência visual, conceptual e • Rápido acesso mecânica • Atraente • Tire partido dos contrastes • deve ser fácil e rápido encontrar a informação • Evite a confusão e a desordem: equilíbrio • Aplique os princípios do cinema: início, meio e o fim Padrão de comportamento visual para a leitura de Zonas prioritárias para colocação de conteúdos on-line. conteúdos on-line 3
  • 4. 10 principais erros num site (Nielsen, 1994) 1. Frames 3. Movimento do texto e animações em loop Embora a maioria dos browsers já suporte os frames, o uso de frames continua a não permitir que o utilizador recomende um link de uma determinada - É difícil ler um texto em deslocamento página dentro do site. - o uso intensivo de animações causa cada vez mais problemas sendo associados pelos utilizadores a 2. Usar tecnologia de ponta publicidade. Os upgrades do software leva a que muitos utilizadores desistam de visitar um site ao mínimo erro de javascript. 4. URL complexas e longas 7. Falta de suporte na navegação 5. Páginas orfãs É importante o utilizador saber sempre onde se encontra num documento Web e poder aceder sempre a qualquer parte do documento. 6. Páginas com barras de scroll Suportes á navegação: logótipo no canto superior 90% dos utilizadores da Web não fazem o scroll esquerdo, link para a homepage ou indicação clara das páginas. Preferem navegar através dos de que parte do site a pagina corrente pertence. botões e de links visíveis. 4
  • 5. Concepção e gestão do site 8. Utilização de cores não standard para os links • Pasta principal com o nome do projecto e uma pasta para guardar as imagens 9. Informação desactualizada • Defina previamente as pastas que vai precisar e onde vai colocar os ficheiros 10. Tempo de download elevado (deslocar ficheiros para outras pastas obriga-o a refazer os links) + do que 10 segundos de espera para carregar uma • designe os seus ficheiros de uma forma página leva a que o utilizador desista correcta e consistente • Quando designar os ficheiros e links não use espaços. Por ex: manualEd.html ou manual_Ed.html • seja cuidadoso na actualização do site (designe a versão antiga) 5