Mestrado design de produto pós ergonomia usabilidade pós em comunicação graduação em design gráfico webdesigner nov/2008 a ago 2009 gerente de projeto.

Apresentação em tema: "Mestrado design de produto pós ergonomia usabilidade pós em comunicação graduação em design gráfico webdesigner nov/2008 a ago 2009 gerente de projeto."— Transcrição da apresentação:

1 mestrado design de produto pós ergonomia usabilidade pós em comunicação graduação em design gráfico webdesigner nov/2008 a ago 2009 gerente de projeto dez/2008 a jul/2008 gerente dos webdesigners out/2004 a set/2006 diretora da agência jan/1999 a jul/2003 design gráfico house anglo americano 1995 sócia e diretora de arte desde jul/1995 professora da graduação publicidade e propaganda fev/1999 à jul/2004 professora da pós-graduação webdesign 2007 professora da graduação design digital desde 2007 professora da graduação publicidade e propaganda jul/2008 à fev/2009 professora das graduações redes e sistemas 2009 professora da pós-graduação ergonomia e usabilidade 2009 curriculum vitae professora desde ago/2009

2 cabeçalho e corpo HTML o código da página HTML é inserido na área de influência de e esses TAGS têm como objetivo indicar o início e o final de sua página HTML…entre estes TAGS estão os TAGS que irão indicar o cabeçalho e o corpo de sua página HTML. o código é dividido em 2 partes cabeçalho/testeira área de influência; TAGS que levam informações para o servidor (internet), para o navegador e outras. e corpo/conteúdo visível e 2|14

3 corpo – conteúdo visível CaBEçaLHO é uma área de configuração da página que pode ter os seguintes elementos: metas informação sobre o documento título* da página; aparece na barra de título do navegador …. scripts * o título não é o nome do arquivo! 3|14

4 corpo – conteúdo visível CaBEçaLHO Título … … 4|14

5 é nesta área que é definido o título da página; é o TAG mais importante do cabeçalho! o título não aparece na tela do browser, mas na barra do navegador, como um resumo do conteúdo da página; hábito: incluir o mesmo título em todas as páginas do website; quando adicionar uma página a Favoritos o browser guarda, além do endereço, o título da página … os dados que estão entre os TAGS e e caso esse nome não identifique corretamente o conteúdo da página, com certeza os usuários ficarão perdidos ao procurá-la posteriormente em seus Favoritos, podendo com isso nunca mais acessá-las! com a implementação de ABAS pelos últimos browsers (as páginas abertas em novas “ABAS”), sem um título adequado, fazem o usuário não identificá-las!! ABAS 5|14

6 extensão… HTML o título não se refere ao nome do arquivo HTML; o título pode ser descritivo, possuir caracteres especiais, espaços e maiúsculas (embora não se recomende); o nome do arquivo deve ter a extensão “.htm” * ou “.html” * recomenda-se! 6|14

7 corpo – conteúdo visível CoRPo TAGS e definem a área do corpo da página; é na área de influência deste TAG que é incluído todo código de uma página web, ou seja, textos, links, imagens, tabelas e demais formatações! Título … conteúdo da página … 7|14

8 inserindo conteúdo de texto TeXTo o conteúdo deve ser inserido na área de influência do par de TAGS e tomar cuidado com acentos e caracteres especiais das línguas latinas! por exemplo: caracteres em branco Senac Senac Acentuação Acentuaç ão 8|14

9 inserindo TAGS de HeADinG cabeçalhos de texto: existem 6 tipos de TAGS usados para exibir frases como headings em páginas HTML; … os TAGS de headings provocam 3 efeitos: alteram o tamanho da fonte; colocam o texto em negrito; dão o efeito de parágrafo, isto é, inserem uma quebra de linha; os TAGS de cabeçalho são muito usados em conjunto com CSS; com eles podemos melhorar a aparência dos estilos! 9|14

10 código da página HTML HeADinG Página de exemplo de cabeçalhos” Nível 1 Nível 2 Nível 3 Nível 4 Nível 5 Nível 6 10|14

11 headings da página HeADinG Nível 1 – 32px Nível 2 – 24px Nível 3 – 18,5px Nível 4 – 16px Nível 5 – 13,5px Nível 6 – 11px 11|14

12 projeto sma petrobras LAyOut

13

14 www.sschnaider.com.br silvia@sschnaider.com.br sschnaider.wordpress.com silviaschnaider@hotmail.com silvia schnaider 14|14