REGRAS DE ESCRITA PARA A WEB

Transcrição

1 REGRAS DE ESCRITA PARA A WEB ESTRUTURA BÁSICA... 2 ESCRITA PARA A WEB Layout para a web... 3 Classificação... 5 Navegação... 5 Design e layout do site Adaptado de: in MCGOVERN, Gerry, NORTON, Rob, O'DOWD, Catherine, Como escrever para a web, 1ª Ed. Centro Atlântico, Abril de 2002, 104 pp. 1

2 Estrutura básica - A página principal do site, normalmente chamada index.html, localizada directamente na pasta principal do site - Para sites extensos, várias subpastas dentro da pasta principal do site respeitantes às várias áreas do site, cada uma contendo as páginas de cada área - Uma pasta só para as imagens do site - Para sites extensos, várias subpastas dentro da pasta principal de imagens, respeitantes às imagens das várias áreas do site. Escrita para a web 1 Fontes mais adequadas para ler online: Arial, Verdana, Tahoma O utilizador na web: - lê na diagonal; - olha primeiro para os títulos e subtítulos; - procura links e palavras específicas; - salta de um lado para o outro, sobe e desce na página e clica, nunca muito longe do botão Back do browser Impaciência. A escrita para a web tem de ser tão breve quanto possível: - cortar palavras - texto conciso - escrever para o leitor e não para nós próprios - Cuidado com os adjectivos e advérbios - usar Títulos sugestivos e destacados (headlines) - títulos curtos e directos - evitar páginas confusas - utilizar linguagem forte - usar subtítulos - parágrafos 1 Adaptado de: in MCGOVERN, Gerry, NORTON, Rob, O'DOWD, Catherine, Como escrever para a web, 1ª Ed. Centro Atlântico, Abril de 2002, 104 pp. 2

3 - frases simples - fazer o papel de editor: - a informação: - está clara? - existe uma forma mais simples de dizer o mesmo? - existe uma forma mais curta de dizer o mesmo? - será necessária? Layout para a web - O utilizador: - não se pode perder dentro do site - tem de encontrar a informação que procura rapidamente - Todos os sites são directórios: - tudo está arrumado em prateleiras sistema de classificação acessível ao utilizador - Fazer notar a nossa marca mas sem cansar a vista do utilizador - Manter uma estrutura coerente ao longo de todo o site - O utilizador gosta de ser ensinado a aprender os destaques, novidades e a encontrar a informação que procura - O layout da web tem de ser simples - Usar design convencional, uniforme: - Navegação global: uma pequena selecção de links essenciais que são apresentados em cada página. Esta navegação global começa com uma ligação para a Home. - Cabeçalho principal: área de topo da página. Normalmente, contém um logótipo no lado esquerdo e, geralmente, uma caixa de pesquisa no lado direito ou esquerdo, imediatamente abaixo do logótipo. Cada vez mais, os cabeçalhos se estão a tornar mais estreitos (70 a 90 px) para maximizar a apresentação de conteúdo. - Layout de três colunas: os designers descobriram que a forma óptima para dispor a máxima quantidade de conteúdo e de navegação em conjunto com a máxima legibilidade é a utilização de 3 colunas. A coluna da esquerda contém a navegação, a do meio, conteúdo e a da direita, breves. - Rodapé: cada página deve ter um rodapé que contém links de navegação global, de contacto, de copyright e de privacidade. 3

4 - Navegação e pesquisa são fundamentais: - utilização de metadados ( quem, o quê, onde, quando e como ), senão o nosso site é uma agulha no palheiro Chamar a atenção para os diversos tipos de navegação: - navegação global - navegação por idioma/localização geográfica - navegação central: por produto - navegação central: por segmento de cliente - O utilizador deve saber sempre onde está (utilizando títulos de secção em destaque), onde esteve (cores dos links perceptíveis) e para onde vai (utilizando nomes auto-explicativos). - A navegação deve seguir as convenções da web: utilizando aquilo com que o utilizador está mais familiarizado o link Home em primeiro lugar na barra de navegação global que existe em todas as páginas do site. - Metadados de qualidade pesquisa de qualidade - Páginas leves com poucas imagens (para que possam ser descarregadas rapidamente mais de 10 segundos, a maior parte dos utilizadores desiste) - Oferecer o produto logo na primeira página. Não utilizar páginas desneccessárias. - Colocar os contactos acessíveis, não escondidos. - Fomentar a opinião dos utilizadores, através da formação de uma comunidade. Encorajar os utilizadores a manifestarem a sua opinião. - Fidelizar os utilizadores, através de newsletters por com conteúdo de qualidade e com regularidade. Não usar mal os dados dos utilizadores. Respeitar a sua privacidade. - Manter o design simples, estruturado e pensado para o cliente. A Web foi inventada como meio de comunicação para a publicação de conteúdo. O conteúdo deve ser: - conciso - bem escrito - bem organizado - bem apresentado - bem focalizado Ao desenhar um site, ter em conta: - desenhar para o utilizador; dar-lhe o conteúdo que ele quer e apresentado como ele quer; - conteúdo bem organizado para que seja fácil de pesquisar e navegar 4

5 - o layout tipo jornal : conteúdo curto e apelativo - seguir as convenções da web; não ser original no layout mas sim ser original no conteúdo; - pensar na interactividade; encorajar o feedback do utilizador; - manter o site simples: um site web deve ser tão simples que mesmo um adulto deve perceber como é que ele funciona. Classificação Normas gerais: - nomes curtos e exactos - não mais de 5 níveis ideal 3 níveis Mais links do que níveis hierárquicos: - todos os níveis de topo devem ser mostrados em simultâneo (no scroll) - nunca mais de 15 níveis 10 ou menos - é preferível mais links bem organizados do que saltos de página em página. Navegação Navegação conjunto de links índice do site (ter a noção global do site) Classificação é a ciência que desenvolve uma ordem lógica para a forma como o conteúdo está organizado Navegação é a arte de apresentar ao utilizador os caminhos mais intuitivos e comerciais através do conteúdo. Tem de se encontrar um equilíbrio entre as duas. Navegação e pesquisa inter-ligados. A pesquisa é uma forma de navegação. Disponibilizar uma variedade de opções de navegação. Pode ser por: - categorias - principal - documento - drop-down - função do e-commerce - global - página principal - idioma - localização geográfica - personalizada - faseada num processo - assuntos/documentos relacionados - por URL 5

6 O utilizador deve saber: - onde se encontra (títulos, cores coerentes e consistentes ao longo do site) - onde andou (links com uma cor diferente=visitado, manter cores tradicionais dos links) - para onde vai (descrição do que vai encontrar, alterar a cor de um link qdo se faz rollover) Fornecer contexto Descrever os conteúdos que vão ver e relacioná-los com outros do mesmo género. Interligar conteúdos com links no meio do texto. Ser consistente Design de navegação consistente e familiar, facilmente reconhecível. Seguir as convenções da web Deve haver semelhanças de navegação com as convenções. O utilizador assim sentir-se-á familiarizado e não se perde. - Navegação global: a navegação que aparece no topo e final de cada página, contendo ligações para as secções principais do site. Começar o sistema global de navegação com Home. Outros itens de classificação normalmente usados são Acerca de e Contacto. - Home é a regra utilizada para o nome da página principal (homepage) - Acerca de contém conteúdo que descreve a entidade que o site representa, p.ex., história, objectivos, missão etc. - Contactos ou Contacte-nos serve para interagir com o utilizador através do envio da parte deste, de , telefone, morada, localização etc. - Logótipo deve aparecer em todas as páginas no canto superior esquerdo e deve ter link para a homepage (pág. principal) - Quando existir navegação no corpo da página (2º nível) deve ser na coluna da esquerda. - Pesquisar deve ter este nome; deve estar disponível em cada página do site; deve ser colocado no canto superior direito, ou esquerdo, abaixo do logótipo. - Cada página deve ter um rodapé com o sistema de navegação global em hipertexto, links de contacto, condições de utilização, copyright e privacidade. - Cores utilizadas para o hipertexto são azul para não clicado e violeta para clicado. 6

7 - Normalmente um link vai para uma página HTML, quando não, o utilizador deve ser informado. P.ex., um ficheiro áudio, pdf e nestes casos deve fornecer-se nesse local um download para a aplicação que vai poder ler o ficheiro que se lhe quer fornecer. - Não enganar o utilizador, p.ex., num site de compras online, só no fim informar de algo importante. Design e layout do site Design e layout de páginas - O layout deve estar optimizado para uma largura de 800 pixeis para assegurar uma compatibilidade máxima. (na prática deve ser 760 para dar lugar à barra de scroll vertical) - É preferível o scrolling do que o clique repetido de uma página para outra. Mas as páginas não devem ter mais do que 3 ecrãs e um máximo de 6. As páginas principais devem ter um máximo de 2 ecrãs de altura, ou menos. O scroll só deve ser vertical e nunca horizontal. - A navegação global deve ser consistente em cada página. Nunca usar texto em forma de imagem. (mais tempo a descarregar e cria problemas de acessibilidade) Cabeçalho - Área de topo de uma página web que contém informação essencial acerca da entidade (nome, logótipo,..) - Deve ter uma altura máxima entre 70 a 90 pixeis, permitindo a maior área possível de apresentação de conteúdos na primeira página. - Deve ter o logótipo, a navegação global e uma caixa de pesquisa. O logótipo e as imagens associadas não devem ter mais do que 30% da área do cabeçalho. - Se for uma página de 2º nível, deverá conter o logótipo e o Título do Departamento, sub-divisão ou grupo de produtos em causa. Este deverá ser maior do que o logótipo para ajudar o utilizador a perceber em que área do site se encontra. Todas as páginas web devem ter um cabeçalho principal e um rodapé. Todas as páginas web devem ter uma caixa de pesquisa no lado direito do cabeçalho principal ou perto do canto superior esquerdo da página, debaixo do logótipo. Utilizar um layout de 3 colunas na página principal. Design e layout da página principal - A página principal é a mais crítica: deve-se assegurar que lá se encontra a informação sobre todo o conteúdo e a navegação principal. Nunca fazer abrir páginas sobre páginas. 7

8 Criar destaques: apresentar um conteúdo pelo seu título, que deve ser curto e apelativo e 2 ou 3 linhas iniciais com um link tipo mais info ou artigo completo para uma página interior com todo o conteúdo. Não se deve ter, contudo, mais do que 5 conjuntos destes e devem estar na coluna central. Podem criar-se outros destaques menos importantes só com o seu título e devem ser colocados abaixo dos anteriores ou na coluna da direita. Deve incluir-se a data de criação nestes destaques. Pode existir uma imagem no resumo dos destaques que deve também manterse na página do artigo completo. Design e layout de documentos As páginas que mostram os documentos (artigos) devem idealmente ter 3 colunas, com o corpo do documento na coluna do centro. Orientações para o layout de documentos na web: - usar tipos de letra sans serif como o Arial ou o Verdana com um tamanho de 10 pontos; - usar texto preto num fundo 85% branco; - especificar as datas dos documentos no início do documento; - fornecer um título para cada documento; - fornecer um link de byline, ligado a uma biografia ou a um do autor do documento; Byline link para o endereço de do autor de um documento. Também deve haver um link para a bibliografia, com outros artigos do autor. Também pode ter uma foto do autor. A posição recomendada para o byline é após o título e o resumo e antes do corpo principal do artigo, utilizando o mesmo tamanho de letra que o texto do artigo. - fornecer um resumo ou parágrafo introdutório; - ter entre 9 a 12 palavras por linha para o texto do documento, dado que isto optimiza a legibilidade; Comprimentos de linha os leitores têm dificuldade em ler texto que seja apresentado em colunas muito largas. Embora o comprimento ideal de uma linha de texto dependa da disposição dos elementos na página e do tamanho de letra utilizado no site, de forma geral deverá ser inferior a 10 palavras (cerca de 70 caracteres). A maior parte das revistas utiliza colunas ainda mais pequenas 7 ou 8 palavras por linha (50 a 60 caracteres) - usar frases em destaque para facilitar a leitura na diagonal; - fornecer a facilidade de enviar por e imprimir ; Enviar esta notícia por uma facilidade do marketing de sites que permite que os leitores interajam entre si permitindo o envio, através de , de informação sobre um artigo que acabaram de ler. 8

9 Imprimir é difícil ler na web e, por isso, muitos leitores quererão imprimir os documentos para os ler off-line. Idealmente, deverá ser disponibilizada uma versão printer-friendly de cada documento existente no site. Esta versão deverá conter todo o documento (mas sem gráficos irrelevantes), a data de publicação, o nome do autor, o nome da empresa e o contacto, informação de copyright, e o URL da versão web do documento. Se estas versões não puderem ser disponibilizadas, então devese assegurar que se utiliza um layout com 3 colunas, com o corpo do documento na coluna central, dado que tal permite que não seja cortada nenhuma parte do documento qdo este for impresso. - fornecer uma nota de copyright no fim de cada documento, bem como um link de copyright no rodapé de cada página. Copyright a informação sobre o copyright, como p.ex., Copyright 2007 PH deve aparecer na informação em rodapé de cada página com um link para uma página onde aparece a informação legal (como marcas registadas e copyrights) ou, caso existe, para uma secção com as Condições de utilização. A página sobre copyright deve apresentar claramente as condições de utilização do conteúdo por parte de outras entidades, e o procedimento a seguir para essas entidades solicitarem a permissão de utilização. A página deve incluir o nome legal da empresa, o nome do grupo empresarial a que pertence (se for o caso), condições de utilização (se existirem) e informação sobre quaisquer marcas registadas pertencentes à empresa. - Quando um documento for comprido (mais de 10 parágrafos), fornecer um índice, e coloque-o entre o resumo e o corpo principal do texto. O índice deve ser gerado a partir dos subtítulos do documento. Em documentos longos, utilize subtítulos a cada 4 ou 5 parágrafos. O índice deve estar ligado ao correspondente subtítulo no documento. - Quando um documento for mais comprido do que 30 parágrafos, ou 1500 palavras, além de fornecer um índice divida o documento em páginas separadas, pelo menos, cada 1000 palavras ou 20 parágrafos. Fornecer detalhes sobre o número de páginas que compõem o documento. Idealmente, esta informação deve ser fornecida no início e no fim da página. Deve ser apresentada no formato Seguinte > Cada número é um link para a página correspondente, excepto o número da página actual. Devem ter as cores convencionais de links. Deve haver também um link para a página imediatamente anterior. 9

10 - Os documentos sem imagens podem parecer nus e intimidativos. Embora se deva assegurar que a página é descarregada rapidamente, uma imagem de qualidade pode muitas vezes ajudar o leitor a compreender melhor a informação que está a ser comunicada. Uma imagem deve aparecer normalmente alinhada à direita ou horizontalmente ocupando toda a coluna (o alinhamento à esquerda pode provocar problemas de acessibilidade). Um bom local para as imagens aparecerem é no topo do documento, debaixo do título. Uma imagem não deve dominar o ecrã. Se a imagem possui um copyright diferente do documento, a informação de copyright deve aparecer antes do texto descritivo. Se a informação de copyright já está incluída na imagem, não é necessário repetir a informação. Deve-se seguir as regras normais para as imagens. 10