Manual Webwriting CNC Versaoweb 14.12.2011

MANUAL DE WEBwRITING
CONFEDERAO NAcIONAL DO COMRcIO DE BENS, SERVIOS E TURISMO CNC
MANUAL DE WEBwRITING
CONFEDERAO NAcIONAL DO COMRcIO DE BENS, SERVIOS E TURISMO CNC RIO DE JANEIrO, 2011
2011 Confederao Nacional do Comrcio de Bens, Servios e Turismo Qualquer parte desta publicao pode ser reproduzida, desde que citada a fonte. Confederao Nacional do Comrcio de Bens, Servios e Turismo www.cnc.org.br Braslia SBN Quadra 1, Bloco B 14 ao 18 andar Edifcio Confederao Nacional do Comrcio CEP: 70040-000 Braslia/DF PABX: (61) 3329-9500 | 3329-9501 E-mail: cncdf@cnc.org.br Rio de Janeiro Avenida General Justo, 307 CEP: 20021-130 Rio de Janeiro/RJ PABX: (21) 3804-9200 E-mail: cncrj@cnc.org.br
Contedo: agncia Palavra-Chave (www.palavrachave.net) Diagramao: Pictorama Design (www.pictorama.com.br) Colaboraram na produo deste manual: Bruna Croce, Daniel Aisenberg, Daniele Neiva, Danielle Lima, Gabriela Bittencourt, Gabriela Ferraz, Marcos Lobo, Marcus Siqueira, Paulo Schueler, Yves Galvo Coordenao Estratgica: Assessoria de Comunicao (Ascom) e Deplan Apoio Grco: Programao Visual | Assessoria de Comunicao CNC
Sumrio
Introduo Usabilidade e Arquitetura de Informao Tcnicas de Redao Tcnicas de Edio e Publicao Imagens e Multimdia 5 9 21 33 47 59 71 81 81 85 86
Anlise de Mtricas Bsicas Direitos Autorais Apndice
Glossrio Bibliograa
ndice Temtico
Introduo
Voc conhece o empresrio do seu segmento melhor do que ningum. E se ele quiser conhecer melhor o Sindicato que o representa, conseguir entender a sua atuao e servios? Isso vai depender da habilidade do sindicato em comunicar-se de forma clara e atraente pelo site. Quanto mais bem explorado o canal internet, maior a chance de estreitar o relacionamento com o empresrio e com a sociedade em geral. Na prtica, isso signica atrair novos associados, vender mais servios, agilizar o atendimento e aumentar a visibilidade do seu sindicato. Para chegar l, voc precisa de um bom contedo. O Manual de Webwriting um instrumento para facilitar o seu trabalho de criao e atualizao do seu site fonte de consulta preferencial de cada vez mais empresrios. Com recomendaes e dicas prticas, ele servir como referncia rpida no seu dia a dia.
Neste captulo
Estrutura dos captulos Sobre o PDA Sobre o projeto
Manual de Webwriting PDA CNC | Captulo 1 Introduo
Estrutura dos captulos

Se voc quiser ler esta publicao de ponta a ponta, ter uma viso abrangente sobre planejamento e produo de contedo para sites institucionais. Agora, se a sua ideia for consult-lo de vez em quando, tudo bem: cada captulo do Manual de Webwriting foi subdividido em blocos menores, por assunto e pela etapa do trabalho. Para facilitar ainda mais a localizao de informaes, criamos os seguintes recursos: Ponto de ateno: alerta para um risco ou conito que voc pode enfrentar na rotina de gerenciamento do site; Dica: sugesto de ideia ou boa prtica, que pode ser aplicada para resolver um desao; Leia mais: recomendao de leitura, tanto dentro ou fora do manual, relacionada ao assunto abordado; Glossrio: chamada para um verbete descrito no glossrio, localizado no m do manual; Temas: assuntos relacionados a cada Ponto de ateno e Leia mais. Todas essas indicaes temticas esto listadas no m do manual. Voc vai notar que os cones de destaque incluem palavras-chave, relacionadas ao contexto da dica ou do ponto de ateno. Essas marcaes esto organizadas em um ndice prprio, no m do manual, para servir de atalho quando voc tiver dvidas especcas. Tudo para que o Manual de Webwriting seja uma ferramenta til, de verdade, para voc e o seu sindicato.
Sobre o PDA
Com as frequentes mudanas nos cenrios poltico, econmico e empresarial do Pas, as entidades sindicais patronais precisam repensar sua gesto e forma de atuao para garantir a sua sustentabilidade e a de seus representados. O associativismo surge como uma ferramenta que ir alavancar o desenvolvimento de mecanismos de atrao dos empresrios, e o fortalecimento da marca e da imagem institucional garantindo as mudanas necessrias para a representao sindical patronal nesta nova era. Para criar a cultura do associativismo nas entidades do Sistema Comrcio, a Confederao Nacional do Comrcio de Bens, Servios e Turismo (CNC) lanou, em 2010, o Programa de Desenvolvimento Associativo (PDA), numa iniciativa conjunta com a Confederao Nacional da Indstria (CNI).
Manual de Webwriting PDA CNC | Captulo 1 Introduo
Sobre o projeto
Para conectar ainda mais o Sistema Comrcio ao universo digital, a CNC lana agora um novo produto: os sites dos sindicatos. O projeto, desenvolvido no mbito do Programa de Desenvolvimento Associativo (PDA), disponibiliza um modelo de site para os sindicatos liados ao Sicomrcio, com reas para os seguintes contedos: Local: para divulgao de informaes institucionais, produtos, servios e notcias do sindicato; Regional: para divulgao das notcias da federao; Setorial: para divulgao de notcias de acordo com a rea de atuao da entidade; Nacional: para divulgao de anlises, estudos tcnicos e vdeos de interesse do setor tercirio. Esse sistema de comunicao permite que o sindicato oferea a dirigentes, empresrios, imprensa e governos uma fonte de informaes constantemente atualizada sobre assuntos que afetam o dia a dia do comrcio de bens, servios e turismo. Um modelo-padro, personalizvel, ser disponibilizado aos sindicatos liados ao Sistema Confederativo da Representao Sindical do Comrcio (Sicomercio), e participantes do Sistema de Excelncia em Gesto Sindical (SEGS). O site divulgar as principais aes e iniciativas do sindicato, da federao qual ele liado, da CNC e, ainda, notcias setoriais, classicadas de acordo com a rea de atuao da entidade. O site ser a vitrine do sindicato, levando a sua representao a um novo patamar. Alm de ampliar o alcance das informaes, o novo canal de comunicao estabelecer uma relao mais prxima da entidade com os empresrios de sua categoria, dando mais visibilidade e transparncia s iniciativas e aes sindicais. E permitir, ainda, mais integrao entre todos os elos que compem o Sistema Comrcio: sindicatos, federaes e CNC, demonstrando o tamanho e a fora do Sistema. Esta iniciativa vinculada ao SEGS Sistema de Excelncia em Gesto Sindical da CNC, que busca melhorar a gesto das nossas entidades. Faa parte deste movimento. O Sistema Comrcio de Bens, Servios e Turismo est on-line. Faa parte dessa rede.
Usabilidade e Arquitetura de Informao
Voc j usou um celular com menus confusos ou um software com funes complicadas demais? Pois , usabilidade fcil de entender quando faz falta: algo difcil de operar gera uma experincia frustrante para o usurio. O site de qualquer organizao precisa ter uma estrutura clara e intuitiva, para que o pblico encontre a informao desejada ou use um servio rapidamente. Sobram exemplos negativos de usabilidade na internet e, mais ainda, fora dela. Todo mundo j se perdeu em um estacionamento mal sinalizado e, nas compras de ms, bateu perna procura de sees escondidas em um supermercado. A mesma lgica vale para o seu site. O usurio no deve encontrar obstculos para procurar um produto, solicitar um servio, preencher um cadastro ou enviar dvidas. Tudo deve ser pensado de forma a garantir uma boa experincia aos que j so clientes e aos que podem passar a ser. Vamos supor que voc receba ligaes dirias de clientes com diculdades para baixar uma guia de pagamento. Se a origem do problema for um boto de download difcil de achar, a sua instituio ganha duplamente ao fazer uma simples adaptao na pgina: aumenta a satisfao do pblico e economiza recursos de atendimento. este o foco da usabilidade que vamos discutir neste captulo: como retirar obstculos e criar condies para gerar negcios via internet, respeitando o comportamento do internauta. A boa notcia que, muitas vezes, pequenas mudanas no site j fazem uma tremenda diferena nos seus resultados.
Neste captulo
O mantra: foco no usurio Como o usurio l na web A navegao nas mos do usurio Cada contedo em seu lugar Arquitetura de informao: a organizao por trs do site Como o usurio encontra o seu contedo Acessibilidade: portas abertas para todos Animaes e banners com moderao
10
Manual de Webwriting PDA CNC | Captulo 2 Usabilidade e Arquitetura de Informao
O mantra: foco no usurio

Todos ns temos hbitos. Seja em casa, no trabalho ou num supermercado, certas atitudes nos acompanham por toda a vida. E na web no diferente. Ao acessarmos um site, temos o costume de passar os olhos nas mesmas regies da tela. como se percorrssemos um caminho imaginrio at encontrar a informao que buscamos. Nossas manias no param por a. Num site de buscas, por exemplo, dicilmente seguimos at a segunda ou terceira pgina procura do resultado ideal da pesquisa. como se tudo aps a primeira pgina j no valesse a pena o esforo. Isso justo? No importa, como as pessoas agem na internet. Estudar o comportamento do usurio nada mais do que levar em considerao esses e outros detalhes ao administrar o seu site. por isso que textos, fotos, grcos, vdeos e animaes jamais devem ser jogados nas pginas. Voc ver que todos esses elementos devem conviver em harmonia e cumprir, cada um, seu papel para atingir os objetivos comerciais do site. Mas o maior desao que voc vai enfrentar dentro de casa: convencer seus chefes e clientes internos de que o ponto de vista mais importante est do outro lado do balco. Esse aculturamento gradual e delicado, porque mexe com egos, inseguranas e preconceitos. Prepare-se, com argumentos e jogo de cintura, para encarar o trabalho de formiguinha de defender o foco no usurio.
relacionamento
Como o usurio l na web

Um vcio comum em sites institucionais reproduzir contedo de publicaes impressas, com pouca ou nenhuma adaptao. Ora, no preciso ser especialista em usabilidade para perceber que a leitura de livros, jornais e sites tm caractersticas bem diferentes. Reformular d trabalho, claro, mas o seu site precisa estar sintonizado com o comportamento do usurio para dar retorno.
Leia mais: captulo 6 Anlise de Mtricas Bsicas
Na prxima vez que entrar em um site, repare como voc caa a informao. Isto o que especialistas chamam de leitura escaneada: passamos os olhos pela pgina, procura de algo que j temos em mente ou simplesmente esperando encontrar algo de interesse. Essa leitura aparentemente catica comprovada por estudos de eyetracking ( imagens 1 e 2), uma tcnica que rastreia como os olhos dos internautas percorrem pginas na tela. Na web, ao escanear um site, o usurio induzido a parar quando encontra palavraschave do seu interesse. Este ponto importante para que voc saiba trabalhar o seu contedo mais importante e fazer com que ele seja visto. A tambm entram diversas tcnicas de redao on-line, a maioria de simples aplicao.
Leia mais: captulo 3 Tcnicas de Redao
11
Imagem 1 Amostra de teste de eyetracking em estilo mapa de calor, com ateno representada em cores
Imagem 2 Amostra de teste de eyetracking com sequncia de pontos de ateno dos usurios
12
A navegao nas mos do usurio

Na mdia impressa, o autor quem comanda a narrativa. J na web, cada usurio monta sua prpria histria, de acordo com seus interesses e objetivos. Podemos iniciar um assunto, ir para o nal direto ou ler algo relacionado. Isto possvel graas ao recurso mais elementar da web, o hipertexto . como uma estrada com milhares de opes de caminhos, todos interligados. Essas ligaes so feitas pelos hiperlinks (ou simplesmente links) elementos clicveis em uma pgina, como palavras, imagens e banners, que apontam para outras pginas e arquivos. Por mais simples que sejam, os links costumam ser pouco explorados em sites institucionais. Ser por uma dificuldade tcnica? No, a questo bem outra: a dificuldade de manter o foco no usurio. Talvez voc j tenha ouvido crticas como: Esses links vo interromper a leitura do texto. Cuidado para no levar o usurio para fora do nosso site. Quem quiser outras informaes, que use o menu de nave gao.
navegao comportamento
Reconhecer que a web um ambiente comandado pelo internauta o primeiro passo para construir um bom site. Continua sendo importantssimo desenhar uma estrutura clara e fcil de navegar, mas o usurio precisa ser apoiado a traar sua prpria rota. E no preso a uma lgica de livro com incio, meio e m denidos pelo dono do site. Use e abuse dos links. Por outro lado, todo esse vai e vem traz alguns desaos. O internauta tpico imediatista, impaciente e tem diculdade para manter o foco na leitura. Alm disso, as telas dos computadores emitem luz e piscam de modo imperceptvel, o que cansa a vista rapidamente. Mais do que nunca, seja objetivo. Voc deve estar se perguntando como fazer para que seu usurio se concentre naquele documento extenso, mas essencial para ele e para a sua instituio. Antes de simplesmente digitalizar o arquivo e public-lo na ntegra em seu site, pense em alternativas: voc pode subdividi-lo em blocos menores interligados, ilustr-los para aumentar sua atratividade, entre outras tcnicas. Voc e o seu pblico-alvo sairo ganhando.
Leia mais: captulo 3 Tcnicas de Redao e captulo 4 Tcnicas de Edio e Publicao
Cada contedo em seu lugar

Bem, j deu para notar que voc tem poucos segundos para capturar a ateno do visitante. E saber onde posicionar um contedo importante, de acordo com as preferncias do seu usurio. Aqui voltamos a falar da leitura escaneada e do eyetracking.
13
Esse mapeamento mostra que, de maneira geral, ao entrar em um site pela primeira vez, o olhar do internauta ca voltado para a parte superior esquerda da pgina e desce em um movimento que lembra a lembra a letra F (imagem 1) . Estas so as reas quentes da pgina. Os mesmos estudos mostram pouca ateno para o lado direito da pgina e a parte de baixo. Estas so as reas frias. Com base nesses dados, responda rpido: onde voc publicaria chamadas para servios e contedo que geram receita? Essa foi fcil. Mas lembre-se de que o seu maior desao instruir os seus clientes internos a seguir as boas prticas de usabilidade. No porque o usurio vai car feliz, mas porque isso bom para os seus negcios.
eyetracking comportamento
Arquitetura de informao: a organizao por trs do site

A arquitetura de informao (AI) uma aliada da usabilidade na criao de uma boa experincia de navegao ao visitante. Ela organiza os sistemas de informao de maneira que as pessoas encontrem o que querem de maneira fcil, rpida e sem dor de cabea.
Imagem 3 Rodap do site da CNC, que destaca a clareza do sistema de navegao
14
Assim como na construo de uma casa, um site precisa passar pela etapa de planejamento, em que todos os elementos so desenhados e calculados para aproveitar o espao da melhor forma possvel. E o layout vem s depois, porque, c entre ns, no d para chamar o decorador antes de saber onde as paredes vo car. A arquitetura de informao est no nosso dia na dia, mesmo sem percebermos. J notou como fcil encontrar tudo em um bom supermercado? Os produtos so separados de acordo com a sua categoria, com nomes de fcil entendimento. Nessa simples ida ao mercado, encontramos dois conceitos de AI: sistema de organizao, que divide a informao em grupos, de maneira lgica e de entendimento simples para todos; e sistema de rotulao, em que cada rtulo (ou etiqueta) representa a informao do grupo. Voc tem alguma dvida sobre o que vai encontrar na seo Carnes? Nos corredores desse mesmo supermercado, esto dispostos mapas do local, com a sua posio exata e para quais sees pode ir. Este outro componente da arquitetura de informao: o sistema de navegao. Com ele, o seu usurio sabe onde est no seu site, como voltar a uma pgina anterior e qual pode ser o seu prximo passo.
Como o usurio encontra o seu contedo

Todo usurio entra em um site com um objetivo, seja encontrar uma receita de bolo, saber o resultado do jogo do time do corao ou baixar uma guia para pagamento. Quem est na sua pgina tambm est atrs de algo, tem tarefas a cumprir. Para pr em prtica o to falado foco no usurio, voc precisa levantar quais tarefas so essas e fazer ajustes de navegao e contedo para torn-las mais acessveis. O caminho at o contedo desejado passa pela navegao ou pela busca. A primeira opo usada, geralmente, por usurios que conhecem o contexto da informao e navegam por associao de ideias; j a segunda preferida por quem sabe exatamente o termo ou arquivo procurado e no precisa percorrer os nveis de navegao do site. Independentemente do mtodo escolhido pelo usurio, o seu contedo precisa ter uma qualidade chamada de encontrabilidade. um termo estranho, verdade, mas grave isso: a facilidade de localizao de informaes e servios na web, tanto para usurios que j esto dentro do site quanto para quem est pesquisando em um buscador. Ambos os mtodos merecem total ateno de quem administra o site e devem funcionar juntos, j que cada um tem suas vantagens. No d para contar com uma ferramenta de busca para resolver problemas de arquitetura de informao, por exemplo. Assim como uma boa estrutura de navegao no dispensa um mecanismo de busca.
15
Por falar em busca, cuide da edio do contedo com carinho, porque ela faz toda a diferena na qualidade dos resultados de pesquisas. Todo contedo precisa ser classicado de maneira correta na hora da publicao, para ajudar o sistema a entender no que consiste cada pgina. Isso feito pelo preenchimento de metadados campos que descrevem as informaes essenciais da prpria pgina, como se fossem marcadores.
metadados busca
Leia mais: captulo 4 Tcnicas de Edio e Publicao
Acessibilidade: portas abertas para todos

Instalar uma rampa para cadeirantes em uma loja uma ao de responsabilidade social ou uma deciso comercial? As duas coisas. Facilitar o acesso a pessoas com alguma decincia solidrio e simptico, mas tambm gera negcios. Isso tambm vale na web, claro. Mais do que oferecer possibilidades de navegao aos portadores de decincia, um site precisa estar apto a receber usurios com diculdades de viso ou coordenao motora, conexes lentas ou que usem dispositivos mveis. E vrios outros pblicos com limitaes. Com apenas algumas providncias, voc pode tornar o site da sua instituio mais acessvel. Por exemplo: Permitir que um deciente visual aumente a fonte do texto; Viabilizar aes de navegao pelo teclado, j que nem todos podem usar o mouse; Adicionar um texto alternativo para todas as imagens; Redigir texto alternativo para vdeos e animaes. Essas so amostras das vrias tcnicas para aprimorar a acessibilidade de sites. Vale a pena estudar mais o assunto.
Leia mais: artigos e documentos sobre acessibilidade www.cnc.org.br/ webwriting
Animaes e banners com moderao

Animaes trazem dinamismo e ajudam a comunicar contedos visualmente, mas, em excesso, podem comprometer a navegao do seu site por diversos motivos. Se voc pensou em poluio visual, est certo, mas no s isso. Usurios com conexo lenta sofrem para baixar pginas com animaes pesadas. Outro risco o acesso via dispositivos mveis como iPad e o iPhone, que no exibem o formato Flash.
Leia mais: captulo 5 Imagens e Multimdia
16
O banner, que pode ser animado ou esttico, tem sido questionado em termos de usabilidade e eficcia, mas ainda est longe da aposentadoria. Voc pode explorar esse formato publicitrio, desde que tomando certos cuidados e escolhendo bem seu posicionamento. Lembre-se de que o seu foco deve estar no cliente, e se tem algo que ele no gosta em um site um amontoado de chamadas piscantes. O uso dessa pea precisa ser estudado com cuidado por mais uma razo: o fenmeno da cegueira a banners , isto , o comportamento de cada vez mais usurios ignor-los por reexo. Os banners, quando mal empregados, perdem pontos por: No ter relao com o contedo; Anunciar produtos que no interessam; Embarreirar a leitura; Enfeiar a pgina; Piscar continuamente. E por a vai. Para evitar um efeito de tiro pela culatra, cuide para que os banners: Ofeream algo relacionado ao contedo apresentado; Estejam posicionados na parte superior da pgina, antes da rolagem; Respeitem a identidade visual do site; Estejam prximos ao melhor contedo da pgina.
Leia mais: artigos sobre cegueira a banners www.cnc.org.br/ webwriting
17
Imagens 4 e 5 Exemplos de sites mal estruturados Fontes: http://www.dennetworks.com/digital-cable/ http://www.angelre.com/super/badwebs/
18
Resumo do captulo
O que fazer:
Capturar a ateno do usurio rapidamente com chamadas e ttulos atraentes e autoexplicativos Subdividir o contedo em blocos menores, interligados por links, para que o usurio monte sua prpria histria Concentrar o contedo mais importante no incio da pgina Enriquecer as principais chamadas com fotos, cones ou ilustraes Lembrar que a navegao e a leitura no seguem uma ordem sequencial como no papel Destacar os canais de atendimento, como telefone e e-mail, para o pblico tirar suas dvidas Adequar o site ao nvel cultural e tecnolgico do seu pblico-alvo Priorizar o raciocnio e as referncias do empresrio, e no os da entidade Lembrar que a maioria dos usurios chega ao site com uma tarefa a cumprir (ex.: baixar uma guia) Distribuir as sees, pginas e blocos de informao de modo claro e autoexplicativo Oferecer instrues e referncias que ajudem o usurio a se localizar e decidir seu prximo passo Descrever cada imagem com o atributo texto alternativo (ALT) Manter os padres visuais e de comportamento de navegao em todo o site Caso seja preciso baixar um programa para visualizar um contedo (ex.: Flash, PDF), oferecer instrues de download e instalao
19
O que evitar:
Formatar uma chamada importante como banner, pois peas publicitrias so cada vez mais ignoradas pelo internauta Esperar que o usurio leia a pgina em uma determinada ordem, como se o site fosse um livro Apresentar em formato de animao (Flash) um contedo que funcionaria bem em texto esttico com ilustraes Combinar dois ou mais elementos animados em uma mesma pgina, para evitar poluio visual Posicionar elementos importantes direita ou abaixo da rolagem, que so reas mais escondidas da pgina Publicar textos centralizados ou justicados (blocados), salvo em legendas ou grcos Acreditar que somente a busca suciente para o pblico localizar informaes no site, desmerecendo a estrutura de nave gao Manter pginas sem contedo ou com justicativas como em breve ou em construo Criar pginas que no deixem claro seu propsito Pressupor que o usurio j conhece o seu site e domina as ferramentas da web Usar fontes e imagens de baixo contraste ou pequenas demais Sobrecarregar a homepage de chamadas e banners, pressupondo que esta a nica porta de entrada do site Contar com o feedback espontneo do pblico para detectar erros e aperfeioar o site Estruturar a navegao do site espelhando o organograma da entidade ao p da letra Apresentar instrues genricas e pouco esclarecedoras (ex.: consulte documentao) Apontar links para uma pgina ou ao no esperada (ex.: o usurio clica em Fale Conosco e cai em uma janela de e-mail, em vez de um formulrio de contato)
Tcnicas de Redao
O contedo do seu site institucional o primeiro ponto de contato para muitos clientes. Se eles no entenderem ou no forem atrados por essa comunicao, podero deixar de solicitar servios e ir embora com uma m impresso. Alguns at entraro em contato por telefone, mas isso no to bom quanto parece: o atendimento a dvidas gerais sai caro, enquanto muitas delas poderiam estar respondidas no site. Muita gente acha que o layout de um site muito mais importante do que seu contedo. Outras at valorizam o papel da informao na teoria, mas no investem em sua pesquisa e produo. Longe de dizer que a programao visual no merea ateno, mas no contedo que o usurio encontra (ou no) solues para suas dvidas e necessidades. Percebeu que no estamos falando apenas de textos bonitos, e sim de explorar o site como uma ferramenta de negcios? Ento, vamos s principais tcnicas de redao on-line. Com elas, o seu trabalho de atualizao do site vai car fcil e ecaz.
Neste captulo
Antes de comear a redigir Durante a produo dos textos Produzi os textos. E agora?
22
Manual de Webwriting PDA CNC | Captulo 3 Tcnicas de Redao
Antes de comear a redigir

Para comear, bom saber o que esse tal webwriting: numa traduo livre do ingls, signi ca redao para a web. Mas, na prtica, vai alm do simples texto e envolve um conjunto de prticas para produzir e distribuir contedo para os mais variados ambientes da internet, desde sites e intranets at blogs, newsletters por e-mail e redes sociais. Entram a recursos como fotos, vdeos, animaes e infogrcos.
Escrever para a internet, portanto, vai requerer de voc uma srie de cuidados antes, durante e depois da redao. A m de que encontre e compreenda melhor as tcnicas de webwriting na hora em que mais precisar, conra as recomendaes para cada uma das etapas de produo.
O mais importante no topo

Antes de voc comear a trabalhar na redao, importante reforar que, na internet, o usurio constri sua prpria narrativa. Se ele se interessar em aprofundar o conhecimento em determinado tema abordado numa pgina, recorrer a links e sugestes de contedo relacionado que voc propuser. Pesquisas comprovam que o internauta tpico escaneia visualmente pginas na web, diferen temente da leitura linear no papel. Ento, evite textos longos e cansativos. Seja objetivo para ajudar o usurio a chegar mais rapidamente at a informao. E prepare-se para defender essa boa prtica em discusses na sua organizao. Quanto mais tcnicos e conservadores forem os seus clientes internos, mais eles insistiro em uma linguagem complexa e coalhada de jarges. Essa miopia praticamente inevitvel e precisa ser combatida com fatos e dados. Para lidar com a leitura supercial na web, estruture o seu texto pela tcnica de pirmide invertida, que concentra o que h de mais importante logo no incio, deixando o que h de menos relevante para o m da pgina. Quando for comear a redigir, lembre-se de concentrar as informaes mais importantes logo no primeiro pargrafo, tomando como base os objetivos editoriais e comerciais da pgina. fundamental que voc seja capaz de, at o segundo pargrafo, no mximo, responder as seguintes perguntas: O qu?
Leia mais: captulo 2 Usabilidade e Arquitetura de Informao
linguagem relacionamento
edio navegao
Quem? Quando? Onde? Como? Por qu?
23
Leia o texto abaixo:
A Confederao Nacional do Comrcio de Bens, Servios e Turismo (CNC) foi fundada para ser a grande representante do empresariado comercial brasileiro. Para poder estar contribuindo com este setor, a Confederao Nacional do Comrcio de Bens, Servios e Turismo rene grandes entidades e importantes representantes de empresas extremamente atuantes em todas as categorias do comrcio em todo o territrio do Brasil. Com essa atuao signicativa, bem planejada e integrada, a CNC est contribuindo no apenas para o fortalecimento e o desenvolvimento de um dos setores mais importantes e signicativos do Pas. Essa atuao dos integrantes da CNC importante para o segmento e tambm para favorecer o desenvolvimento econmico e social do Brasil, j que o comrcio de bens servios e turismo de extrema importncia para o Pas. Para atuar a favor do comrcio, a Confederao Nacional do Comrcio de Bens, Servios e Turismo agrupa federaes patronais estaduais e nacionais e sindicatos do setor em sua estrutura. Esto agrupadas na CNC, 34 federaes patronais estaduais e nacionais, sendo 27 estaduais e sete nacionais. Essas federaes patronais estaduais e nacionais que fazem parte da estrutura da CNC so compostas pelos 955 sindicatos mais atuantes nos segmentos do comrcio no Pas. Importantes para o comrcio brasileiro, os sindicatos so organizados e liderados por representantes de micro, pequenas, mdias e grandes empresas brasileiras. Esses empresrios que lideram os sindicatos esto envolvidos com a atuao signicativa em prol da defesa do cumprimento dos direitos de suas categorias e prossionais. Esses empresrios so a slida base sobre a qual est estruturada a Confederao Nacional do Comrcio de Bens, Servios e Turismo, a CNC.
24
E a, conseguiu entender quais so as principais informaes? Achou o texto claro, objetivo e correto? Agora, leia o segundo exemplo:
Reunindo entidades e representantes de empresas atuantes nas categorias do comrcio, a Confederao Nacional do Comrcio de Bens, Servios e Turismo (CNC) contribui no apenas para um dos setores mais importantes para o Pas. A atuao de seus integrantes favorece ainda o desenvolvimento econmico e social do Brasil. A Confederao agrupa, em sua estrutura, 34 federaes patronais estaduais e nacionais. Integram essas entidades os 955 sindicatos mais atuantes nos segmentos do comrcio no Pas. Os sindicatos, por sua vez, so organizados e liderados por representantes de micro, pequenas, mdias e grandes empresas. Envolvidos com a defesa dos direitos de suas categorias e pros sionais, esses empresrios so a base da CNC.
Notou como o ltimo texto passou as mesmas informaes, porm de forma mais objetiva e convincente? Isso porque as recomendaes que vimos at agora foram colocadas em prtica durante a sua produo. Uma dica para evitar textos longos subdividi-los em mais de uma pgina sempre que for necessrio ampliar o enfoque. Mas tome cuidado ao criar esses outros nveis de navegao, para ter certeza de que aquele assunto precisa estar numa nova pgina. Se o usurio tiver que dar cliques demais at a informao procurada, voc tambm corre o risco de ele abandonar o seu site.
priorizao
No caso das matrias, a primeira dica importante restringir o nmero de fontes, isto , pessoas entrevistadas ou consultadas. Inclua apenas a quantidade indispensvel para abordar o assunto pretendido. Esta orientao fundamental para que os seus textos sejam mais curtos. Nas matrias, tambm vale quebrar o texto quando for entrar numa nova abordagem sobre o tema e de incluir links que complementem a leitura. J quando for produzir entrevistas no formato pingue-pongue, planeje-se para no fazer introdues muito longas. Crie alguns pargrafos de abertura e parta logo para as perguntas e respostas.
Sabe com quem est falando?

S uma perguntinha antes de partirmos para a criao de um texto: quem o pblico-alvo do seu site? Parece simples, mas muitas empresas tm diculdades para responder a quem pretendem se dirigir. Esta denio fundamental para que a sua instituio fale a mesma lngua do usurio. Seja claro e evite expresses
25
que possam deixar o texto pesado e confuso, alm de no abusar de jarges e termos tcnicos. Agora, e se os clientes forem da rea, tudo bem usar linguagem tcnica? Cuidado, porque esse raciocnio parece fazer sentido mas a recomendao continua valendo. que, muitas vezes, numa pesquisa na internet, outros usurios encontram o seu site. Se o contedo for tcnico demais, visitantes leigos vo car desorientados e frustrados. E voc poder perder negcios. Para tornar a leitura ainda mais atrativa, procure incluir exemplos ilustrados com fotos, tabelas, infogrcos e outros recursos de apoio visual. Vale ainda usar macetes editoriais como: Declaraes: aspas de especialistas ou autoridades entrevistadas; Personagens: histrias de pessoas reais para ilustrar e explicar os conceitos; Pingue-pongue: entrevista compacta, com perguntas e respostas breves de uma pessoa de interesse para o contedo. Estes recursos no apenas humanizam o contedo, como tambm representa uma recompensa a quem contribuir para sua pesquisa. A exposio no site uma moeda social. Use-a. Pronto, vamos prxima etapa do seu trabalho: colocar a mo na massa!
linguagem
Durante a produo dos textos

Boas prticas de estilo
Se voc comea o texto pelo ttulo, que vontade. Mas saiba que, provavelmente, ele ser modicado durante e aps a redao exceto quando for produzir contedo de pginas institucionais, que devem ter o mesmo ttulo exibido no menu do site. S ao m da produo, voc saber exatamente qual a principal informao da pgina, que dever ser enfatizada no ttulo. Para comear a escrever para a web, evite frases longas, voz passiva, ordem indireta e tudo mais que possa retardar a leitura. Comeando pela voz ativa, veja como essa forma de construir as frases faz toda diferena para permitir a melhor compreenso da informao pelo leitor: Servios teis ao empresrio so oferecidos pelo sindicato Exemplo de voz passiva. O sindicato oferece servios teis ao empresrio Viu como a frase cou melhor na voz ativa?
linguagem
26
Exemplicando o uso da ordem direta, prera criar frases como: A assessoria est disponvel de segunda a sexta em horrio comercial E evite a forma abaixo: De segunda a sexta, em horrio comercial, a assessoria est disponvel. Agora, aposente de vez o gerundismo (ex.: estarei escrevendo), adjetivos, advrbios que no agreguem sentido (como seguramente, extremamente ou exatamente) e substantivos abstratos que poderiam ser transformados em verbos de ao por exemplo: a considerao do especialista que (...) se converte em o especialista considera que (...).
Voltando ao que levantamos no incio deste captulo: textos para a internet precisam de uma formatao especca. E ela deve ser atrativa para o usurio. A quebra de par grafos um desses recursos fundamentais para organizar o texto num site. Ao deixar uma linha em branco entre cada um deles, voc facilitar a leitura em blocos menores. Talvez o seu publicador j faa essa quebra automaticamente, ento vale testar antes.
atratividade formatao
O uso de tpicos outra medida para otimizar a leitura e chamar a ateno do leitor. Sem contar que eles transmitem uma impresso de organizao para a pgina. Por isso, sempre que quiser enumerar itens ao longo de um texto, recorra aos marcadores para criar os tpicos. Na primeira publicao, verique como a ferramenta de publicao do seu site trabalha com marcadores. Ao escolher as palavras-chave, procure saber como os usurios se referem a determinados assuntos. Por exemplo, se escrever sobre um novo modelo de carro, verique se os termos mais buscados incluem sinnimos como automvel. Se for o caso, use variaes para aumentar a visibilidade do seu contedo.
Leia mais: Manual do Publicador
relacionamento metadados
Voc trabalhar com base em uma lista de palavras-chave predenida, ento procure o seu ponto de contato para o site em caso de dvidas ou sugestes.
Maisculas e minsculas
Aqui vai uma dica que pode parecer questo de esttica, mas envolve bons modos: ateno ao uso de letras maisculas (ou caixa alta). Elas devem ser utilizadas como numa escrita normal, ou seja, apenas em incio de frases e em nomes prprios. que, alm de dicultar a leitura, o uso de letras maisculas, na internet, d a ideia de grito e voc no quer se dirigir ao seu leitor desta forma. Outro motivo que os leitores de tela para decientes visuais soletram as palavras em caixa alta, em vez de l-las.
27
Termos estrangeiros
Cuidado tambm com o emprego de palavras estrangeiras. Se for us-las, use o itlico e explique o seu sentido depois de inseri-las no texto. O mesmo vale para a utilizao de siglas. Neste caso, escreva o seu contedo por extenso e, em seguida, coloque a abreviao entre parnteses. Leitores parte, quem escreve diariamente sabe que no so apenas as palavras estrangeiras que podem causar confuso. Quando se produz um texto, normal ficar na dvida sobre a grafia correta de alguns termos. O que se deve fazer nesses casos? Uma coisa certa: no d para confiar cegamente no corretor ortogrfico do Word e outros processadores de texto. Confira normas de ortografia no site da Academia Brasileira de Letras (www.academia.org.br) e consulte um bom dicionrio com frequncia. Como acabamos de passar pelas dicas que ajudaro voc a redigir para a internet, est na hora de conhecer as recomendaes de formatao para textos web.
ortograa linguagem
Produzi os textos. E agora?

Em primeiro lugar, volte ao ttulo para inserir a ideia principal do texto. Use um verbo de ao ao escrev-lo. E no se esquea de que, assim como os textos, os ttulos tambm devem ser curtos e diretos. Ateno ainda para no usar ponto nal em ttulos. Esta dica tambm vale para as chamadas. Falando nisso, importante lembrar que alguns dos seus textos tero destaque na homepage do site. Desta forma, quando redigi-los, produza tambm as suas chamadas, que devem descrever claramente o contedo da pgina para a qual o link direcionar. Aposte numa linguagem persuasiva, mas evitando frases de efeito, trocadilhos e sensacionalismo.
homepage chamadas
Ttulos, chamadas e links

Comeando pelos links, jamais nomeie-os de forma genrica, como: Clique aqui para consultar o Manual do Publicador Prera uma denio autoexplicativa e signicativa dentro do link. Por exemplo: Consulte o Manual do Publicador
28
link navegao
Quando for colocar os hiperlinks no corpo do texto, insira-os apenas nas palavras ou expresses que remetam ao contedo que voc quer sugerir ao leitor. Tenha o cuidado, ainda, de apontar os links para pgina cujo contedo pertinente leitura, e no quelas que so genricas, como a home do site. Se for inserir um link para download de um PDF, udio ou vdeo, por exemplo, indique ao usurio o que acontecer ao clicar. Faa como nas sugestes abaixo, indicando a extenso e o peso do arquivo quando possvel: Consulte o Manual do Publicador (formato PDF) Consulte o Manual do Publicador (PDF, 1MB) Estudos de usabilidade apontam que os usurios se frustram quando passam para outro meio sem serem avisados previamente. Isso acontece principalmente quando a conexo lenta ou quando a visualizao do arquivo requer a instalao de um plug-in.
formatao
Para ajudar o leitor a identicar o que h de mais importante no texto, use o negrito em palavras e pequenos trechos. Ateno para no aplicar esse recurso em pargrafos inteiros ou frases longas o que anula o efeito do destaque. O negrito pode ser usado ainda nas perguntas de entrevistas pingue-pongue e tambm em itens enumerados com marcadores. O itlico tambm pode ser adotado para mudar a velocidade da leitura e chamar a ateno alm de indicar neologismos, palavras estrangeiras ou trechos de um texto original (ex.: artigos de uma lei, trechos de uma obra literria). Quando o objetivo destacar uma determinada palavra, quebrando a uniformidade do texto, alguns especialistas defendem a substituio do itlico por aspas simples. Adote um padro.
Newsletters e e-mail marketing

J no caso das chamadas de newsletters, o resumo do assunto deve ser produzido sem que voc d toda a informao ao usurio. Assim, voc o deixar curioso e estimulado a clicar no link. O campo de assunto deve ser redigido com clareza, sem exageros publicitrios. Texto, ttulos e chamadas prontos, o momento de dar uma ateno formatao e incluso dos links. Alm de transmitir mais credibilidade, assim voc reduz o risco de o e-mail car preso em um sistema antispam que varre certas palavras e formataes frequentes em mensagens promocionais.
formatao hipertexto
Otimizao para buscadores

Ferramentas de busca como Google, Yahoo! e Bing tm se tornado portas de entrada cada vez mais frequentes para sites empresariais. Por isso, as tcnicas de Search Engine Optimization (SEO) so to importantes. Com elas, possvel melhorar a posio do
29
seu site nos resultados desses mecanismos. Alguns desses macetes so tcnicas e dependem de programao, mas vrios passam por ajustes nos na redao e edio. Uma dessas prticas simples tem um duplo benefcio: facilitar a leitura dos seus textos e aumentar a visibilidade do seu site em buscadores. Trata-se da repetio de palavras-chave. Isso signica que as expresses mais importantes do seu texto devem aparecer mais de uma vez ao longo da pgina. Mas use esse recurso com moderao, porque repetir demais compromete a qualidade do texto e pode ser entendido por buscadores como um artifcio desleal. Outra providncia fundamental a edio de metadados. Funciona assim: mecanismos de busca enxergam o contedo pelo seu cdigo-fonte e no como ele aparece na tela do seu computador. Nas varreduras dos sites, os buscadores procuram pelas palavras-chave usadas tanto no corpo do texto como no ttulo da pgina, entre outros elementos de contedo. Agora que voc chegou ao nal do processo de redao para web, d uma revisada no seu texto. Conte com o corretor ortogrco e no tenha vergonha de tirar o dicionrio da gaveta. Ah, e pedir que um colega leia o seu texto tambm pode ser uma boa ideia, principalmente quando voc j tiver feito outras revises sozinho.
30
Resumo do captulo
O que fazer:
Redigir textos claros, considerando a compreenso do pblico-alvo Prezar pela objetividade e conciso Usar exemplos para ilustrar explicaes tcnicas Humanizar o contedo com declaraes e histrias de pessoas reais Concentrar as informaes mais importantes no incio do texto Iniciar o texto respondendo: o qu, quem, quando, onde, como e por qu Dar preferncia a frases curtas Preferir frases em voz ativa Optar pelas frases em ordem direta Usar listas em tpicos (marcadores) para destacar os itens Repetir as expresses mais importantes ao longo da pgina, para aumentar a visibilidade do site em buscadores Explicar o signi cado de abreviaes e siglas Conferir normas de ortograa no site da Academia Brasileira de Letras Consultar o dicionrio com frequncia Redigir ttulos preferencialmente com verbo de ao Escrever ttulos curtos e diretos Produzir chamadas que descrevam claramente o destino do link Usar linguagem persuasiva em chamadas Em newsletter, redigir o campo de assunto com clareza, sem exageros publicitrios Nas chamadas da newsletter, resumir o assunto sem entregar o ouro Usar links tambm no corpo do texto Apontar links para pginas espec cas com o contedo pertinente, e no para uma pgina genrica (ex.: homepage) Nomear links de forma especca e autoexplicativa Revisar o contedo com corretor ortogrco
31
O que evitar:
Abusar de jarges e termos tcnicos, sobretudo sem a devida explicao Usar gerundismo Exagerar nos adjetivos e recursos de nfase Usar muitas estruturas em voz passiva e ordem indireta, que retardam a leitura Utilizar termos em lnguas estrangeiras, a menos que no haja traduo adequada Utilizar ponto nal em ttulos e chamadas Grafar palavras em maisculas Conar demais no corretor ortogrco Nomear links genericamente (ex.: Clique aqui)
Tcnicas de Edio e Publicao
Como em qualquer publicao, o acabamento faz toda a diferena na web. Alm de contedo de qualidade, o seu site precisa de uma formatao que facilite a localizao e compreenso das informaes. Mais do que mero capricho visual, uma boa edio contribui para a eccia da comunicao. Se voc est preparando uma publicao on-line, saiba que todo esforo para se comunicar de forma clara e atraente com seu pblico-alvo ser recompensado. Seja para captar novos parceiros comerciais, divulgar bem os seus servios ou, simplesmente, transmitir valores positivos que podem ser estendidos sua empresa (como organizao, transparncia, objetividade, relevncia). Que tal, ento, conhecer algumas ferramentas de edio que vo deixar o seu contedo na web mais compreensvel, pertinente e visualmente interessante?
Neste captulo
Editando um contedo Estratgias para complementar a informao Formatando um contedo para publicao Metadados: as etiquetas do contedo
34
Manual de Webwriting PDA CNC | Captulo 4 Tcnicas de Edio e Publicao
Editando um contedo
Seu chefe imediato procurou voc com a demanda urgente de publicar um determinado contedo no site da sua empresa ou entidade. Por maior que seja a presso, pode ter certeza: somente copiar e colar o texto, a imagem ou o documento, sem traar uma estratgia para esta divulgao no site, no vai surtir o efeito desejado. Por falta de tempo, diculdade em compreender um assunto mais tcnico ou por pura preguia, seu leitor potencial deixar de ser capturado e poder nem passar do primeiro pargrafo daquela carta to especial do presidente. Digamos que voc j tenha revisado a gramtica e a pontuao de um texto e considere que ele esteja muito bem escrito. Ser que ele ainda no pode ser encurtado? Em alguma sentena ou pargrafo, h ideias se repetindo sem necessidade? vivel eliminar palavras em excesso (como adjetivos ou conjunes) sem alterar o sentido original da frase? Se a resposta for sim, v em frente! Quanto mais conciso car o texto, menor a chance de o leitor se entediar, desistir da leitura, ou simplesmente se perder em meio a um raciocnio muito longo.
Quebrando a monotonia do texto

Assim como a vrgula ajuda o leitor a respirar enquanto l e apreende as informaes de uma frase, de forma pausada, outros recursos editoriais ajudam a arejar o texto para a web. o caso dos entrettulos (ou interttulos), pequenos ttulos colocados no meio do texto, para torn-lo menos denso. Eles no costumam ter mais do que trs ou quatro palavras e so bastante teis para realar uma mudana de assunto. Observe, a cada quatro ou cinco pargrafos, se no h oportunidade de separar os blocos de informao usando este elemento. Por isso mesmo, quando a ideia fazer a ponte com o novo tema que ser introduzido a seguir, o melhor que as palavras escolhidas para compor o entrettulo sejam concretas e fortes alm de diferentes das usadas no ttulo. Outro artifcio que facilita a compreenso do texto e deixa a diagramao mais leve ao mesmo tempo so os boxes (em portugus, caixas). Eles servem para condensar informaes citadas em uma matria, artigo ou texto institucional e que precisam complementadas, contextualizadas ou explicadas didaticamente. Na web, alm de textos, tambm possvel encontrar animaes ou imagens dentro de boxes (imagem 1). Se a matria est longa e pobre visualmente, tambm interessante extrair deste contedo uma frase de impacto, que represente bem o tema central abordado, e public-la fora da massa de texto. Este elemento chamado de olho (imagem 2) e, quando bem escolhido, pode ser o responsvel por capturar a ateno de um potencial leitor.
edio formatao
35
Imagem 1 Box com cotaes de aes no site da BBC
Imagem 2 Exemplo de olho em pgina do Jornal da UFRJ
36
Imagem 3 Relao de nomes e cargos em texto corrido
Imagem 4 Relao de nomes e cargos em lista com marcadores
37
Mas, antes de tomar a iniciativa de formatar um olho, conra se o seu site tem um padro visual para esse recurso, e se a ferramenta de publicao tem um comando especco. Em caso de dvida, melhor usar tcnicas mais simples, que no exijam uma edio sosticada. Textos escritos em tpicos e distribudos em bullets (ou marcadores) so outra alternativa para destacar dados importantes. Usamos este recurso intuitivamente, toda vez que elaboramos uma lista de compras, por exemplo. Alm de separar as ideias mais importantes do resto do texto, os bullets quebram a uniformidade da pgina, ao criar pequenos espaos em branco em meio massa de pargrafos. E, por isso, atraem nossa viso na hora, como os produtos na lista do supermercado. Veja a diferena entre um texto corrido (imagem 3) e uma lista (imagem 4), exatamente com o mesmo contedo: Sentiu a diferena? No s voc. Pesquisas comprovam que o uso de marcadores acelera a leitura, aumenta a absoro do contedo e atrai o olhar do usurio.
Padronizao
Se voc for o responsvel pela gesto de contedo web na sua organizao, considere padronizar este tipo de regra em um manual de redao e estilo especco para o site. Prera, claro, adotar as mesmas regras e convenes j consolidadas em sua comunicao interna ou externa. Caso estas regras no existam, coloque-as voc mesmo no papel, cuidando para que todo o contedo publicado no site siga o mesmo padro. Isto vale para a forma como voc ir descrever siglas, nmeros, cifras, ttulos de obras de arte (como livros, msicas, lmes, programas de TV) etc.
formatao qualidade
Estratgias para complementar a informao

Um contedo bem trabalhado deve oferecer caminhos para que o leitor tire eventuais dvidas sobre o que acabou de ler, ou informe-se sobre assuntos relacionados. As informaes complementares podem estar presentes dentro ou fora do seu site e vir em forma de imagens, grcos ou tabelas. Se a notcia menciona um relatrio nanceiro, a assinatura de algum acordo, uma reunio importante ou traz aspas de um executivo sobre o desempenho da empresa no ltimo ano, vale a pena embas-la anexando ao texto algum material de consulta.
anexos hipertexto
38
O relatrio, a minuta do acordo, a ata da reunio e o balancete da empresa, respec tivamente, so exemplos de contedos relacionados matria e, sempre que possvel, devem ser disponibilizados ao pblico. Alm de dispensarem o redator de repetir todos os detalhes destes documentos dentro do texto, tais complementos reforam a credibilidade do que foi noticiado.
anexos hipertexto
Aqui, tambm, o excesso algo prejudicial. Pendurar uma lista de arquivos rela cionados ao nal de cada pgina no gera o destaque pretendido e banaliza a importncia de cada documento. S utilize este recurso se o material extra realmente tiver ligao com o tema central do texto em questo. Procure, ainda, disponibilizar anexos no formato mais adequado para o usurio. Alguns exemplos: Documentos que precisam ser preenchidos ou adaptados: verses editveis, como arquivos do Word e PowerPoint; Documentos apenas para leitura e impresso: formatos no-editveis, como Adobe PDF e imagens; Tabelas e bases de dados: arquivos que o usurio possa exportar para outros programas, como Excel e Access. A informao complementar da sua pgina tambm poder estar em um site qualquer. No tem problema apontar para fontes de informao externa, desde que voc tome alguns cuidados. Verique se o site tem credibilidade (prera fontes ociais, como as do Governo e de entidades de classe), se no tem erros grosseiros de portugus e se no fechado para assinantes. Por m, certique-se de redigir chamadas atraentes, claras e que entregam o que prometem. No mande o leitor para uma homepage, mas sim para a pgina interna do site indicado, onde ele encontrar a informao especca da chamada.
link navegao
Mais do que mil palavras

sempre desejvel enriquecer o texto com elementos visuais, cuidando para que eles tragam aspectos da informao que o texto no abordou. Mesmo artigos mais densos e sem carter factual podem perder o aspecto endurecido com o auxlio de uma ilustrao. Inserir uma foto simptica de seu autor tambm pode convidar leitura. H notcias, alis, que pedem uma fotogaleria e merecem o esforo extra no momento da publicao como os eventos e comemoraes internos da sua organizao. o tipo de registro que desperta um interesse espontneo dos colegas de trabalho. Assuntos tcnicos, difceis de explicar apenas com palavras, podem ser ilustrados com o auxlio de tabelas e infogrcos (imagens 5 e 6).
Se algum departamento da sua organizao tiver este tipo material grco, em con-
39
dies de veiculao na web, corra atrs. Muitas vezes, contedos ricos cam nas gavetas porque ningum imaginou que eles pudessem ser publicados na web. udios e vdeos de palestras, tutoriais ou eventos tambm devem ser aproveitados.
Imagem 5 Infogrco no site Good Magazine Crdito: http://www.ickr.com/photos/nunoluciano/
Imagem 6 Infogrco no site Column 5 Crdito: http://www.ickr.com/photos/ralphpaglia/
40
Formatando um contedo para publicao

Chegou a hora dos nalmentes: a insero do contedo na ferramenta de publicao do site. E, depois de tanto capricho com texto, imagens e arquivos anexos, voc no quer que nada saia errado. Tenha calma, pois faltam apenas os ajustes nos.
Textos e imagens
O contedo est no editor de texto? Ou ser importado de outra ferramenta, como o Word? Seja como for, comece copiando e colando toda a parte de texto (ttulo, corpo, legendas) no Bloco de Notas do Windows. Isto limpar a formatao original denida pelo redator (como marcadores e negritos), exigindo, claro, que voc as refaa manualmente dentro do publicador. Como alternativa, voc tambm pode usar o recurso de importao da ferramenta de publicao. Faa alguns testes para decidir qual mtodo funciona melhor no seu dia a dia. Aps esse cuidado inicial, verique se o texto est alinhado esquerda (alguns publicadores fazem isso automaticamente). Por que no usar o alinhamento justicado, isto , blocado? que ele cria grandes espaos em branco entre as palavras, prejudicando a leitura que j no l muito confortvel na tela do computador. Na hora de inserir as imagens, vale conferir se todos os textos esto alinhados conforme padro do seu site. A ferramenta de publicao est programada para fazer essa formatao automaticamente.
Links
hipertexto navegao
Os links para outras pginas do seu prprio site, indicados como complemento informao principal, devem abrir preferencialmente na mesma janela do navegador. Como vimos anteriormente, o usurio constri sua prpria narrativa ao navegar entre os links de um mesmo site, podendo retornar pgina inicial quando quiser pelo boto Voltar ou pelo breadcrumb das pginas, onde a hierarquia das sees evidente. Se voc deseja propor a leitura de assuntos correlatos (mas independentes) do contedo de sua pgina, sugerindo para pginas de outro site, faa esses links abrirem em outra janela do navegador. Sim, existe a possibilidade de o visitante car neste novo site e no voltar em seguida. Mas no se preocupe, porque o objetivo comercial de um site institucional no segurar o usurio pelo maior tempo possvel e sim oferecer informao, solues e servios com agilidade. Diversas ferramentas de publicao apresentam um campo de resumo, que voc precisa preencher com uma espcie de chamada do contedo que est colocando no ar. Dependendo do site, esta sntese pode aparecer como um destaque na pgina
41
principal (convidando leitura do contedo na ntegra) ou mesmo nos resultados de uma busca interna do seu site, ao lado dos ttulos. Independentemente de como o resumo for aproveitado na programao e na capa do seu site, as palavras que voc usar para redigi-lo tambm sero importantes para a visibilidade externa da homepage. Enquanto estiver acertando estes ltimos detalhes de formatao, trabalhe no modo rascunho de sua ferramenta ou seja, deixe a pgina em edio ainda oculta, na lista de no publicadas. Utilize a opo preview (prvia) para visualizar o resultado nal antes de partir para a publicao. Aqui vo algumas sugestes de passos para o seu controle de qualidade, que fundamental para reduzir o risco de erros no ar: Clique nos links sugeridos e veja se eles apontam para onde deveriam; Observe se as imagens foram carregadas e se no esto grudadas no texto; Conra se os tamanhos das fontes do ttulo e do corpo esto no padro correto; Veja se elementos externos aparecem corretamente (ex.: vdeo do YouTube); S ento, conrme a publicao do contedo.
Metadados: as etiquetas do contedo

Voc j procurou livros em uma biblioteca, pesquisando naquelas chas de papel em gavetinhas? Os termos de cada uma delas, com o resumo do tema de cada livro, autor, data de publicao etc. so os parmetros de busca entre milhares, at milhes de ttulos. Pois bem, esses so os metadados, e eles funcionam de modo seme lhante na internet. Estamos falando de etiquetas, legendas de contedo invisveis que separam o joio do trigo. Invisveis entre aspas, porque esse verdadeiro inventrio do que est publicado na Rede ca oculto para ns, usurios, mas muito importante para a visibilidade de uma pgina web. Isto porque a tecnologia de metadados ajuda os sistemas de busca de contedo a reconhecer o que est por trs dos arquivos e catalog-los corretamente. Assim, eles podem ser encontrados mais facilmente. Existem vrios componentes dos metadados, mas suas principais partes (ou meta tags) so o ttulo, a descrio e as palavras-chave. A m de que sua pgina seja bem categorizada e pontuada por buscadores como Google, Yahoo! e Bing, voc deve inseri-las corretamente na seo <head> do cdigo-fonte de cada pgina produzida. Mas calma, voc no precisa virar dubl de programador. A parte tcnica ser resolvida pela sua ferramenta de publicao ou pelo webmaster do seu site.
42
O importante que as meta tags sejam nicas, claras e informativas, permitindo a asso ciao mais direta possvel com o contedo da tela em questo. Anal, elas servem, literalmente, como etiquetas do contedo. No adianta ter uma sacada para um ttulo que deixe o usurio na dvida sobre onde ele est e para que serve essa pgina. A meta tag de ttulo (Title) aparece tanto na barra superior do seu navegador quanto no resultado de uma busca ( o ttulo clicvel da sua pgina), como ilustrado na imagem 7.
Imagem 7 Exibio do ttulo de uma pgina web
De to importante no processo de otimizao de sites (SEO), ela a nica obrigatria: para que um cdigo HTML seja criado, gerando um site, o prprio programa preenche uma title tag genrica. Como o ttulo de um livro, a title tag a primeira coisa que um internauta examina quando se depara com a pgina e quer entender, rapidamente, de que assunto ela trata. para l que o usurio olha quando est com vrias janelas abertas no seu navegador e quer saber o que ler em seguida. Ao preencher a title tag, comece com o nome da sua empresa, por exemplo, seguido da palavra-chave mais importante sobre a pgina em questo, sem ultrapassar 65letras limite de caracteres que o Google consegue exibir no resultado de buscas por uma pgina. Se voc o ultrapassar, sua mensagem car cortada na tela. A cada contedo, este ttulo deve mudar. Ex.: Construtora Joo de Barro Sobre a organizao Construtora Joo de Barro Programa de Estgio
43
A descrio (description tag) deve oferecer um resumo do que a sua pgina contm, em at 160 caracteres. Pense, por exemplo, no que as pessoas precisam/gostariam de saber a respeito da sua empresa ou organizao (o que ela faz, onde est localizada) e use os termos mais importantes no texto da pgina para compor este resumo. Em algumas ferramentas, esse campo chamado de resumo ou descrio. Ex: Histrico da atuao da Construtora Joo de Barro no Brasil, obras mais importantes e contratos recm-conquistados Estes termos que esto j espalhados pelo texto e melhor denem o teor de sua pgina so justamente as palavras-chave (keywords) que voc precisa inserir no cdigo de sua publicao para os motores de busca funcionarem a seu favor. No h limite de keywords para cadastrar, mas procure ser especco: foque em frases ou palavras que representem os assuntos de maior destaque na pgina e em seus principais sinnimos. Ex: Construtora Joo de Barro, construo, engenharia, histria, trajetria, negcios no Brasil, obras, principais empreendimentos, principais projetos Ento, agora que voc conheceu os metadados, no h mais desculpas para no etiquetar o seu contedo. Tenha sempre em mente que, assim, facilitar a navegao do seu usurio e garantir que o seu site aparea cada vez melhor posicionado nos buscadores.
Leia mais: artigo sobre a importncia das palavras-chave em textos: www.cnc.org.br/ webwriting
44
Resumo do captulo
O que fazer:
Resumir o texto ao mximo Criar entrettulos (frases de destaque em negrito) para quebrar textos longos, como nas revistas Usar listas com tpicos (marcadores) sempre que possvel Grifar as palavras mais importantes de um texto (negrito) Enriquecer o contedo com fotos, tabelas e outros recursos grcos Buscar e incluir links para outros contedos relacionados com a pgina publicada Avaliar a relevncia e pertinncia de um arquivo antes de anex-lo auma pgina Subdividir um contedo extenso em blocos menores, interligados por links Redigir chamadas claras e atraentes ao sugerir links para contedo complementar Alinhar o texto esquerda, para facilitar a leitura Alinhar imagens esquerda ou direita do corpo de texto, com margem entre eles (consulte o Manual do Publicador) Programar links para abrir na mesma janela quando a pgina for do seu prprio site (consulte o Manual do Publicador) Programar links para abrir em uma nova janela quando a pgina for de um site externo (consulte o Manual do Publicador) Preencher o campo resumo de modo claro e sinttico, para fazer sentido inclusive num resultado de busca (consulte o Manual do Publicador) Atribuir palavras-chave que facilitem a localizao da pgina pelos termos mais representativos Visualizar uma nova pgina pronta (rascunho) antes de public-la no site
45
O que evitar:
Subdividir o contedo em pginas sequenciais com navegao apenas por nmeros (paginao), sem chamadas que descrevam ocontedo das telas a seguir Copiar textos do Word com recursos avanados de formatao (consulte o Manual do Publicador) Inserir imagens soltas na pgina, entre pargrafos, sem alinhamento com o texto
Imagens e Multimdia
Visualize duas lojas do mesmo ramo, uma ao lado da outra. A primeira est bonita, limpa, com uma vitrine bem organizada; j a segunda tem rachaduras na pintura e cartazes improvisados na vitrine. Em qual delas voc entraria? E mais: a quem conaria o seu dinheiro para contratar um produto ou servio? Se voc optou pelo estabelecimento mais bonito, no tem motivo para se envergonhar. Anal, natural que a boa aparncia cause uma impresso positiva em nosso inconsciente. Se isso justo ou no, uma outra histria, mas o impacto nos negcios bem real. A mesma lgica vale para o comportamento do cliente na web. O cuidado com o acabamento do site ajuda a passar uma imagem prossional da sua organizao. Quem no se preocupa com a identidade da empresa na web corre o srio risco de perder oportunidades. Pior: um visual amador pode comprometer a sua credibilidade, mesmo se o contedo estiver adequado. To importante quanto a qualidade do texto na web o cuidado reservado seleo e ao tratamento de fotos, ilustraes, grcos, vdeos e udios. Neste captulo, voc vai aprender fundamentos do que preciso fazer para deixar seu site mais atraente. So dicas sobre como editar, salvar e publicar imagens com preciso e qualidade. E voc ver tambm como tirar o mximo proveito de um contedo multimdia esteja ele em formato de vdeo, udio ou animao para enriquecer a experincia do usurio. Sites institucionais tm se tornado a principal porta de entrada para potenciais clientes. Aproveite essa oportunidade. E cause uma boa impresso nesse primeiro encontro.
Neste captulo
Fotos Vdeo
48
Manual de Webwriting PDA CNC | Captulo 5 Imagens e Multimdia
Fotos
O cuidado com as imagens de um site institucional no apenas uma questo esttica. claro que voc deve se preocupar em dar uma aparncia bacana pgina da sua organizao na web. Mas que sabendo que seus efeitos podem ser bem mais abrangentes e lucrativos. Um site com fotos de baixa qualidade um convite para afugentar qualquer visitante. E se voc no souber dimension-las corretamente, adeus! No h nada pior para o internauta do que gastar tempo esperando uma imagem pesada carregar. Outro erro comum no ter critrio na hora da edio de uma foto. Acredite: saber recortar uma imagem uma arte que no deve ser desprezada. Se bem feito, o recorte valoriza a pgina e desperta a ateno do usurio; mas, se mal executado, pode colocar a perder todo o seu sentido. Boas imagens tambm ajudam voc a divulgar as aes da sua organizao para alm do prprio site. E, o mais importante, quem aprende a manuse-las evita retrabalho e ganha tempo para se dedicar a outras tarefas. Mos obra!
Antes do clique
Saber o que pixel o primeiro passo antes de comear a dominar tcnicas de trata mento de imagens. simples: toda imagem composta por pequenas partculas. Na tela do computador, so quadrados coloridos. Pixel nada mais do que cada um desses quadradinhos. No d para identicar pixels a olho nu. preciso aumentar bem o tamanho de uma imagem para conseguir enxerg-los, conforme indica as imagens 1 e 2. Lembre-se deste conceito. Ele ser sempre til para quem trabalha com tratamento de imagens.
Imagem 1 Foto em tamanho original
Imagem 2 Detalhe expandido, evidenciando os pixels
49
Se voc o responsvel por tirar as fotos dos eventos corporativos, no precisa usar o mximo de resoluo da sua cmera digital para obter boas fotos para a web. Com 72 ou 100 dpi (pontos por polegada, em portugus), j possvel conseguir um bom resultado. Mais do que isso desperdcio de espao, porque os monitores ainda esto longe da denio grca do papel. Mas ateno: se voc tambm planeja aproveitar essas imagens em materiais impressos, a tudo muda de gura. Nesse caso, o melhor tirar as fotos com a maior resoluo e o maior tamanho possvel. O recomendvel a partir de 300 dpi. Quem usa o celular para registrar eventos deve ter cuidado redobrado. No porque seu aparelho tem uma cmera de cinco ou dez megapixels que a festa estar garantida. No se engane: a qualidade da imagem vai depender de uma srie de outros fatores, como a lente, o software e a performance do ash da cmera. Por isso, prera uma cmera digital dedicada, que oferece boa qualidade por preos razoveis. Uma opo para quem no tem tempo ou equipa mentos adequados para tirar fotos buscar imagens conceituais em bancos de imagens na internet. Hoje, existe uma boa variedade deles, como iStock e Valorpix, onde voc pode comprar fotos e ilustraes em diversos tamanhos. H tambm bancos de imagens gratuitos, como Every Stock Photo e Free Digital Photos. Outra alternativa baixar fotos de comunidades virtuais novamente, o Flickr um dos exemplos. Mas tome cuidado, pois no qualquer imagem que pode ser reutilizada. Fique atento s regras de uso de cada site.
imagens
Leia mais: captulo 7 Direitos Autorais
ACONTECE NO SEU SINDICATO Sabe aquela galeria de imagens da nova diretoria do seu sindicato? Se voc planeja coloc-las para download no site, que atento para que tenham resoluo acima de 300 dpi. Isso porque um jornalista, por exemplo, poder us-las para ilustrar uma matria de jornal feita com vocs. Mas no publique as fotos em alta resoluo no corpo da pgina, pois assim ela caria pesada demais para carregar. Basta disponibilizar os arquivos para download ou publiclos em um site de compartilhamento gratuito como Flickr ou Fotki.
Cuidados para salvar
Agora que voc j tirou as fotos que pretende publicar no site, hora de salv-las em local seguro. Pode parecer banal, mas muito comum ouvir casos de pessoas que perderam horas e horas de trabalho, simplesmente porque deixaram de fazer backup. No cometa o mesmo erro. Essa tarefa, alis, pede algumas regrinhas. Grave sempre uma verso original ou cpia de segurana. Isso porque, ao mexer na imagem, voc pode no car contente com o resultado e querer resgatar a foto anterior. O ideal criar duas pastas: uma para as imagens originais e outra para as editadas. Outra dica prtica sempre usar uma nomenclatura padro para todas as imagens. Facilita a pesquisa interna no publicador do site e a sua acessibilidade. E evite usar acentos na hora de nomear os arquivos. Veja o exemplo abaixo: produto X_lancamento01.jpg produto X_lancamento02.jpg
imagens
50
Resoluo x dimenso
O tratamento da imagem o momento que exige maior ateno. O primeiro passo saber distinguir entre resoluo e dimenso. A resoluo de uma imagem indica sua densidade, quanticada pelo o nmero de pixels impressos ou exibidos por unidade de medida em geral, polegada. Quanto mais pixels (pontos) uma foto tiver, maior a sua resoluo e, consequentemente, sua qualidade. Para a exibio de imagens em tela de computadores, devemos car mais atentos s dimenses da imagem, para sabermos o tamanho relativo que ela ocupar na tela. J a dimenso nada mais do que o tamanho (rea) da imagem em polegadas ou centmetros, relacionando largura x altura. Agora, guarde esta regra: quanto maiores as dimenses de uma foto, maior dever ser a sua resoluo. Para facilitar a sua compreenso, imagine um suco de fruta concentrado. Quanto mais gua voc misturar, mais suco vai ter no copo, s que menos concentrado. Resultado: o produto nal pode car ralo. O raciocnio o mesmo para explicar as diferenas entre dimenso e resoluo, como ilustram as imagens 3 e 4.
Imagem 3 Foto com resoluo adequada
Imagem 4 Qualidade prejudicada pela baixa resoluo
imagens
Resoluo voc reduz, mas no pode aumentar. E uma vez reduzida, um abrao! como esticar uma massa de macarro: ao expandi-la, voc no consegue aumen tar o seu volume. Com a superfcie mais na, furos vo aparecer. J a dimen so pode ser aumentada, mas sob o risco de afetar a qualidade da imagem.
Formatos de arquivos
E qual a melhor extenso de imagens para web? Depende. Se voc costuma trabalhar com fotos ricas em detalhes e cores ou com ilustraes complexas, o melhor usar JPG. Isso porque esse formato comprime a imagem mantendo ao mximo suas caractersticas originais. J o GIF um formato menos renado, prprio para imagens chapadas, isto , com pouca riqueza de detalhes e variaes de cores. Logotipos, ttulos e tabelas em imagem geralmente tm a extenso GIF. Faa voc mesmo o teste e compare os dois formatos.
51
E o BMP (Bitmap) nada mais que a extenso padro do Windows. o formato usado para salvar uma imagem com a melhor qualidade possvel o que no o nosso caso. Anal, estamos falando de tratamento de imagens para web, que privilegia a leveza. Portanto, nada de publicar imagens em formato BMP.
Recorte e redimensionamento
Muita ateno na hora de cortar as fotos. Se voc tem uma imagem de um grupo de mais de 20 pessoas em uma reunio de trabalho, por exemplo, reduzi-la apenas no vai adiantar. Mesmo que no distora, a foto car incompreensvel para o usurio. O melhor escolher um pedao da imagem que faa sentido. Por exemplo: recorte o trecho em que um dos participantes aparece claramente prestando ateno ao que est sendo apresentado no encontro. Veja as imagens 5, 6 e 7 para comprovar a diferena de um recorte bem feito em fotos reduzidas. Mas, se a foto no car boa mesmo assim, no perca tempo. Procure outra imagem que funcione melhor em dimenses menores.
imagens
redimensionamento
Imagens 5, 6 e 7 Foto original em tamanho maior, com uma verso apenas reduzida ( esquerda) e uma reduzida com recorte Fonte: Divulgao/Fecomercio-AM
52
importante lembrar que diversas ferramentas de publicao permitem recortar imagens e redimension-las no ato da edio da pgina na web. A essa funo d-se o nome de crop (recorte, em portugus). Voc tambm pode fazer esses e outros ajustes com o auxlio de editores de imagens, como os gratuitos Serif PhotoPlus, Gimp ou Microsoft Picture Manager (embutido no Windows). Outra opo so os softwares que acompanham algumas cmeras digitais. Tenha isso em mente na hora de comprar a sua.
Publicao e hospedagem
imagens acessibilidade
Para tornar as imagens do site da sua organizao acessveis a mecanismos de buscas, como Google e Yahoo!, preencha sempre o atributo ALT. Trata-se de um texto alternativo que identica a foto para os buscadores e aparece quando o usurio passa o mouse em cima da imagem. E ainda serve para ferramentas de leitura para cegos, um elemento importante de acessibilidade. Uma imagem no deve ser meramente ilustrativa. Como vimos anteriormente, um recorte bem feito ajuda a dar sentido foto. Mas voc tambm deve se preocupar com o seu posicionamento na pgina. Certique-se de que a imagem ser publicada acima da barra de rolagem (scroll). Estudos de usabilidade indicam que o usurio presta mais ateno ao contedo exibido na parte superior do site. Ah, e no se esquea de incluir a legenda e o crdito da imagem! Tudo pronto? Agora ler atentamente ao manual de publicao do site, seguir o passo a passo e colocar sua imagem no ar.
Leia mais: captulo 2 Usabilidade e Arquitetura da Informao
Voc poder turbinar a divulgao de imagens de eventos na empresa para alm do seu prprio site. Hoje, existem diversos servios on-line de fotogalerias, como Flickr, Picasa e Fotki, onde voc pode armazenar seus arquivos gratuitamente. E o que melhor: eles abrem o mundo para o contedo publicado no seu site.
Leia mais: captulo 7 Direitos Autorais
ACONTECE NO SEU SINDICATO J pensou em usar um desses servios on-line de fotogalerias para postar imagens de um evento do seu sindicato? uma oportunidade de levar contedo do seu site para as redes sociais, onde poder ser compartilhado e curtido por todos aqueles que tm algum envolvimento com o setor. At existe algum risco de fotogalerias on-line carem fora do ar momentaneamente, devido a instabilidades tcnicas. Anal, as imagens cam hospedadas em servidores externos, de terceiros. Mas, se voc procura uma relao custo x benefcio imbatvel, esse um risco bem pequeno a assumir.
53
Vdeo
Usar ou no usar?
Vdeos humanizam histrias, aproximam pessoas e dinamizam o site. Estudo recente feito nos EUA indica que o nmero de pessoas que assistem a vdeos em seus aparelhos celulares disparou 43%1 em 2010. No Brasil, a audincia do YouTube engordou 33%2 no mesmo ano. Esses dados j do uma noo de como a multimdia tem ganhado espao na web. Apesar dessa crescente popularidade, nem sempre vale a pena colocar vdeos em um site institucional. Como em qualquer formato de comunicao, preciso avaliar se o assunto, o contedo e os recursos de produo so apropriados. Se voc tiver a ideia de publicar um vdeo do seu presidente falando do ltimo lana mento de um servio, por exemplo, que atento a algumas questes: Metas: importante saber denir bem o que voc planeja fazer. Um vdeo pode nem ser a melhor soluo para o seu problema. Se a sua empresa deseja anunciar algum novo servio, por exemplo, j parou para pensar em um tutorial animado? Ele pode sair muito mais em conta do que um vdeo. Tempo: as pessoas no tm pacincia para vdeos muito longos na web. O especialista em usabilidade Jakob Nielsen recomenda que as gravaes no ultrapassem um minuto de durao. Achou pouco? Pois , muito mais do que isso correr o risco de perder o interesse do usurio na sua mensagem. Custo: se voc dispe de recursos para contratar uma equipe ou manter equipamentos sosticados de gravao de vdeo, parabns! Mas se esse no o seu caso, para que insistir em solues amadoras? Existem outras manei ras interessantes e ecazes de despertar a ateno de potenciais clientes. Atratividade: certos cenrios e formatos so mais atraentes do que outros. Um vdeo pode ser bem roteirizado e surpreender o usurio com imagens impactantes e uma edio dinmica; por outro lado, tambm pode dar sono ao mostrar uma pessoa parada, falando por dez minutos. Alis, uma pesquisa de Nielsen enfatiza como vdeos montonos simplesmente passam despercebidos.3
vdeos
1 Fonte: Nielsen http://blog.nielsen.com/nielsenwire/online_mobile/americans-watchmoremobile-video-now-than-ever/ 2 Fonte: ComScore http://iabbrasil.ning.com/proles/blogs/audiencia-do-youtube-no-brasil 3 Fonte: http://www.useit.com/alertbox/video.html
54
Formatos
Se voc realmente sente necessidade de produzir vdeos para o seu site e tem recursos para assumir essa empreitada, timo. Nesse caso, importante car por dentro dos formatos de vdeo mais comuns: AVI Pontos fortes: alta qualidade, embutido no Windows Pontos fracos: arquivos pesados, s funciona na plataforma Windows WMV (Windows Media Video) Pontos fortes: boa relao qualidade x peso Pontos fracos: s funciona na plataforma Windows MOV (Quicktime Video) Pontos fortes: boa relao qualidade x peso, multiplataforma, compatvel com Mac Pontos fracos: exige software de reproduo compatvel FLV (Flash Video) Pontos fortes: arquivos leves, popularidade do Flash, pr-instalado no Windows Pontos fracos: exige plug-in na verso compatvel com o vdeo
vdeos compartilhamento
Se o seu plano for subir os vdeos para um site de compartilhamento, como YouTube ou Vimeo, a preocupao com o formato praticamente deixa de existir. Basta fazer upload, e a converso ser automtica.
1, 2, 3, gravando
Certique-se de escolher uma lmadora digital adequada o que no quer dizer necessariamente cara. Algumas cmeras fotogrcas gravam vdeos razoavelmente ( bom testar antes de comprar) e so alternativas econmicas, enquanto a maioria dos smartphones no d nem para o gasto. Agora, se quiser obter vdeos de alta qualidade, voc vai precisar de uma lmadora mesmo.
vdeos
Lembre-se de fazer testes antes de gravar. Conra o tempo de bateria nos diversos mdulos de captura, o zoom, a qualidade do udio para som ambiente e outros detalhes. Se a lmagem de um evento corporativo car ruim, voc no ter uma segunda chance. E sabe como funciona a Lei de Murphy...
Escolhendo ferramentas de edio

Existe uma innidade de ferramentas de edio de vdeo, e naturalmente as melho res so pagas. As mais conhecidas so Adobe Premiere Pro, Pinnacle e Sony Vegas Movie Studio. Caso esteja na dvida se precisa de um software prossional, voc pode baixar verses de teste da internet e comparar essas ferramentas com alternativas gratuitas.
vdeos
55
Para vdeos mais simples, vale usar o Windows Movie Maker, que j vem instalado no sistema operacional e tambm serve para edio de udio. possvel baixar gratuitamente o Lightworks indicado como um dos mais completos por especialistas entre os editores gratuitos. Na web, tambm h editores on-line como o Video Toolbox e o Stroome. Na maioria das vezes, eles so integrados ao YouTube, o que facilita a publicao. Em uma rpida pesquisa na web, voc encontrar uma srie de ferramentas gratuitas ou baratas para experimentar. E se o seu vdeo estiver em um formato incompatvel com o editor ou o publicador? Isso acontece em alguns modelos de cmeras e smartphones, mas tem soluo: baixe a ferramenta gratuita Any Video Converter, que permite a converso das extenses mais populares. Se preferir, procure outras opes, que no faltam no mercado. Depois de tudo isso, s falta publicar o seu vdeo na ferramenta do site ou em um servio on-line de compartilhamento. E torcer para que eles sejam campees de audincia.
56
Resumo do captulo
O que fazer:
Descrever cada imagem no campo texto alternativo, para melhorar a acessibilidade Usar fotos e ilustraes preferencialmente no formato JPG Usar cones e grcos preferencialmente no formato GIF Publicar arquivos de udio no formato MP3 ou WMA Publicar vdeos em WMV, Flash Video ou outro formato compacto Subdividir udios ou vdeos extensos em blocos/captulos menores Subir imagens em baixa resoluo (consulte o Manual do Publicador) Observar as dimenses mximas de imagens, principalmente a largura Fazer melhorias bsicas a imagens quando necessrio (brilho, contraste) Recortar a foto, quando preciso, para melhorar seu enquadramento ou adequ-la ao espao Considerar ferramentas da web para fotogalerias, que so gratuitas e favorecem o compartilhamento (ex.: Flickr, Picasa) Considerar ferramentas da web para vdeos, que so gratuitas e favorecem o compartilhamento (ex.: YouTube, Vimeo) Considerar ferramentas da web para apresentaes, que so gratuitas e favorecem o compartilhamento (ex.: SlideShare, Issuu) Se usar cones para ilustrar contedos (ex.: servios), seguir a mesma linha grca do site
57
O que evitar:
Salvar imagens em BMP e outros formatos pesados, que demoram a carregar Usar imagens em alta resoluo (consulte o Manual do Publicador) Subir imagens maiores do que a largura da pgina do site Esticar ou espremer uma imagem ao redimension-la (consulte o Manual do Publicador) Usar GIFs animados e Flash sem real necessidade Criar banners animados com muito texto Reduzir uma foto com muitos elementos sem recort-la Subir vdeos em AVI e outros formatos pesados Publicar udios ou vdeos extensos demais
Anlise de Mtricas Bsicas
Se voc j sabe redigir textos para web, se j compreendeu como se d o comportamento do usurio no site e se j assimilou as dicas para conferir um tratamento adequado a imagens e vdeos, hora de dar um passo alm. A partir de agora, vamos ajud-lo a pensar estrategicamente o seu site. A virar a chave em sua mente e a encarar o site institucional no como uma pgina bonitinha na web. Mas a enxerg-lo como uma ferramenta de negcio, cujo foco o cliente. Voc sabia que a qualidade das informaes disponveis no seu site pode ter impacto direto no caixa da sua empresa? Se no, vejamos: se a pgina de cadastro de novos associados estiver escon dida, como espera gerar mais receita para a empresa via web? Como planeja usar esse banco de dados a seu favor? Pense nisso. Se voc nunca parou para reetir sobre essas questes, melhor comear a se preocupar. hora de passar a medir, testar e fazer avaliaes sobre o desempenho do seu site. So as mtricas que vo ajudar a sua organizao a tomar decises baseadas em informaes concretas. o momento de romper de vez com os velhos achismos! Estabelecer mtricas para avaliar a performance do seu site abraar uma nova viso de trabalho. Nada contra quem usa a intuio para conduzir negcios. Mas para fazer do seu site uma pode rosa ferramenta de marketing, preciso conhecer bem como ele funciona nos bastidores. Voc est pronto?
Neste captulo
Pensando estrategicamente Fazendo a sua seleo de mtricas Tornando essa anlise uma rotina
60
Manual de Webwriting PDA CNC | Captulo 6 Anlise de Mtricas Bsicas
Pensando estrategicamente
O que so mtricas
Calma, mtrica no um bicho de sete cabeas. De maneira simples e objetiva: ela nada mais do que um dado que pode indicar performance no nosso caso, de um site empresarial. Ao estabelecer mtricas para o seu site, voc ser capaz de identicar elementos como: Quantidade de visitas em um perodo; Quantidade de pessoas cadastradas; Quantidade e ranking das pginas mais visitadas; Dias e horrios com maior e menor acesso; Origem dos cliques, isto , de onde os usurios vieram; Caminhos mais comuns percorridos pelos usurios no site. As opes de usos e combinaes entre elas so muitas, como veremos mais adiante.
Foco nos objetivos de negcio

Fique sabendo que entender o comportamento do usurio o trunfo de toda empresa. No seu caso, a arma secreta para aproveitar ao mximo o que a web capaz de oferecer. Com poucas mtricas, j possvel tomar decises que atendam aos objetivos de negcio da instituio.
estratgia
Agora, chegamos a um ponto crucial. Se voc ainda no sabe quais so as metas e objetivos do seu negcio, melhor parar e reetir. Saber responder a esta questo fundamental antes de retomarmos qualquer discusso sobre anlise de mtricas. Mas, se j sabe de cor e salteado para onde o negcio deve seguir, ca muito mais fcil fazer o seu site trabalhar para voc. Encare a anlise de mtricas como uma rotina, um programa, como tantos outros conduzidos pela sua organizao. Como exerccio, tente responder s seguintes questes: Qual a funo do site dentro dos objetivos de negcio? O que o cliente espera do site? Como essa plataforma pode ajudar a reduzir custos?
61
Como o site pode otimizar o trabalho da equipe, liberando funcionrios de atividades braais? Quais servios posso automatizar por meio do site? Para facilitar o seu entendimento sobre como mudanas num site podem ser determi nantes para o sucesso ou fracasso de um negcio, vamos usar novamente o exemplo da pgina de cadastro. Por meio de mtricas previamente selecionadas, foi possvel identicar o caminho que o usurio costumava percorrer at a pgina de cadastro. E constatou-se que o trajeto era muito longo at que conseguisse preencher o formulrio. Ou seja, o mais importante para a empresa no estava sendo atendido: a captao de potenciais clientes! Com base nessa observao, foram realizadas mudanas no layout do site, de forma a facilitar o acesso e o preenchimento de dados pelos usurios. No m das contas, graas a uma inteligente anlise de mtricas, foi possvel tomar decises que tiveram impacto na receita da empresa. Anal, as pessoas agora no encontram mais diculdades para fazer o cadastro. O pulo do gato em saber fazer uma anlise de mtricas que muitas vezes ela tambm exige mudanas fora do ambiente on-line. Quer ver um exemplo? Como avaliar se o FAQ (relao de perguntas e respostas frequentes) do site tem sido ecaz se a sua instituio no registra as chamadas recebidas pela central de atendimento? Manter esse banco de dados atualizado crucial para fazer comparaes e identicar se as demandas no site so as mesmas recebidas por telefone. Se forem, provavelmente existe algum problema com seu FAQ. Concluso: voc pode estar perdendo tempo e dinheiro mantendo uma equipe superdimensionada para atender ligaes que poderiam ser facilmente resolvidas pelo site, via autoatendimento.
mtricas estratgia
O que so indicadores de sucesso

A essa altura voc j deve estar se perguntando: Certo. Mas como posso saber quais so os indicadores de sucesso para o meu site? A resposta simples, mas exige uma boa discusso gerencial: depende do negcio da sua empresa. Um portal de notcias, por exemplo, deve privilegiar mtricas que indiquem audincia e exposio publicidade (principal fonte de receita desses veculos): Nmero de visitantes nicos que acessam o site; Nmero de visitas ou sesses; Quantidade de page views;
62
Nmero de assinaturas efetuadas; Taxa de cliques dos banners de anunciantes. J um site de e-commerce deve privilegiar mtricas que indiquem converses: Nmero de cadastros efetuados; Percentual de usurios cadastrados que efetivamente zeram compras no site (taxa de converso); Tquete-mdio das compras; Nmero de usurios que retornaram ao site para realizar novas compras (delizao).
estratgia
Se os objetivos de negcio da sua organizao estiverem claros, voc no ter proble mas em fazer o site trabalhar para cumprir esta misso. Caso contrrio, melhor dar um passo para trs e discutir estratgia com a diretoria.
Fazendo a sua seleo de mtricas

Como escolher e priorizar
Agora que voc j tem em mente os objetivos de negcio da sua organizao e sabe de que forma seu site pode ajudar a atingi-los, hora de colocar a mo na massa. Denir quais mtricas sero teis para acompanhar o desempenho do site uma tarefa extremamente importante. Anal, so elas que permitiro testar, correlacionar, interpretar e fazer eventuais correes para tirar o melhor proveito do seu site.
Leia mais: post no blog de Avinash Kaushik (em ingls) www.cnc.org.br/ webwriting
Mas no se preocupe em abraar o mundo de uma s vez. Procure, por enquanto, selecionar as mtricas que sejam realmente essenciais para esse incio de trabalho. Uma dica preciosa usar o simples mas implacvel teste do E da?, proposto pelo especialista em mtricas web Avinash Kaushik.
mtricas desempenho
O resumo o seguinte: ao escolher uma mtrica para analisar periodicamente, pergunte a si mesmo por que ela to importante. Se a resposta no estiver na ponta da lngua at o terceiro E da, descarte-a. Ela certamente no far diferena para o seu negcio neste momento. Conhea, a seguir, as mtricas web mais comuns e suas principais aplicaes: Page views ou impresses: indica a quantidade total de pginas exibidas no seu site em um determinado perodo (dia, semana ou ms). Se uma pessoa
63
entrar no seu site uma vez e abrir dez pginas, ter gerado dez page views. A mesma coisa, se ele entrar dez vezes e abrir uma pgina a cada visita. Aplicaes: Se avaliada isoladamente, diz pouca coisa. Mas, se correlacionada ao nmero de downloads, por exemplo, pode indicar se os usurios tm ou no baixado arquivos do site; Mensurao de desempenho do site em termos de audincia; Avaliao de retorno de campanhas pontuais. Visitantes nicos: a quantidade absoluta de visitantes que o seu site recebe em um determinado perodo. Ao contrrio da Page View, se um visitante entrar no seu site mais de uma vez por dia, somente a primeira vez ser considerada. Aplicaes: Mensurao da taxa de ativao, que expe a penetrao efetiva do site em relao base cadastrada; Avaliao de retorno de campanhas pontuais; Anlise histrica de delizao do usurio. Visitas nicas ou sesses: a quantidade de vezes que a massa de usurios acessou o site, independentemente do nmero de pginas vistas cada vez. Aplicaes: Quanticao global de visitas efetivas ao site; Avaliao de retorno de campanhas pontuais; Anlise histrica de delizao do usurio. Origem do usurio: indica de onde vm os usurios que acessam o seu site. Com esta mtrica, voc pode saber se a maior parte das visitas tem origem em sites de busca (Google, Yahoo! etc.), em sites de parceiros da sua empresa (clientes, fornecedores, sindicatos etc.), ou ainda em cliques em banners, e-mail marketing ou via trfego direto, isto , pela digitao do seu endereo na barra do navegador. Aplicaes: Avaliao de desempenho de campanhas por plataforma/veculo;
64
Direcionamento e otimizao dos investimentos em comuni cao dirigida; Anlise histrica de delizao do usurio. Ranking das dez principais pginas de entrada (landing pages): aponta as pginas que servem de ponto de partida mais frequentes para a navegao do usurio. Hoje em dia, com o avano dos mecanismos de busca, a pgina inicial (homepage) nem sempre a principal porta de entrada de um site. Aplicaes: Estudo do comportamento do usurio; Subsdios para melhorias da arquitetura de informao; Apoio ao posicionamento de peas publicitrias no site; Avaliao de desempenho de campanhas por pgina de entrada. Taxa de rejeio geral (bounce rate): o percentual de acessos que no geram uma continuidade de navegao (usurio entra e vai embora do site). Aplicaes: Se analisada isoladamente, tambm no quer dizer nada. Mas, se voc sabe que quem entrou e saiu seu pblico-alvo, melhor se preocupar. Altas taxas de rejeio podem sugerir problemas no seu site. Anal, quem voc mais quer atrair para o site no est gostando do que v ou no est encontrando o que procura; Subsdios para melhorias da arquitetura de informao; Cruzamento com as principais Landing Pages para identicar razes para o abandono; Cruzamento com a origem de acesso permite a otimizao de campanhas. Horrios de maior/menor acesso: dias e horrios da semana que registram maior/menor nmero de acessos ao site. Aplicaes: Apoio programao de dias e horrios para disparo de e-mail marketing; Apoio programao de publicao de notas e comunicados; Identicao dos horrios mais apropriados para manutenes tcnicas do site.
navegao busca
65
Locais fsicos de acesso mais comuns: so os dispositivos de onde o usurio costuma acessar o site (computadores, smartphones etc.). Aplicaes: Estudo do comportamento do usurio; Mensurao de demanda reprimida por aplicativos mveis. Ranking das sees mais acessadas: indica quais sees tiveram maior apelo entre os usurios no ltimo perodo. Aplicaes: Estudo do comportamento do usurio; Subsdios para melhoria da arquitetura de informao; Anlise histrica de relevncia das sees; Identicao de pginas com maior potencial de retorno para determinadas campanhas. Ranking dos dez caminhos mais percorridos pelo usurio no site: a lista gem das rotas de navegao mais frequentes percorridas pelo usurio dentro do seu site. Aplicaes: Estudo do comportamento do usurio; Subsdios para melhorias da arquitetura de informao; Apoio ao posicionamento de peas publicitrias ou comunicados no site. Frequncia de visitao do usurio ao site: a listagem da periodicidade de visitao agrupada por faixas (x% todo dia; y% uma vez por semana; z% uma vez por ms). Aplicaes: Estudo do comportamento do usurio; Otimizao do cronograma de publicao; Estudo de necessidade de chamarizes para ativao do usurio (newsletters, alertas etc.). Ranking dos temas mais comentados pelo fale conosco: a listagem dos assuntos que despertam maior dvida e/ou comentrios dos usurios.
66
Aplicaes: Identicao de pginas com maior potencial de retorno para determinadas campanhas; Acompanhamento contnuo do nmero de manifestaes e sua categorizao (elogio, reclamao, sugesto); Subsdios para mudanas no FAQ do site. Quantidade de downloads: nmero de vezes que usurios baixaram arquivos do seu site, como guias de pagamento, por exemplo. Aplicaes: Identicao dos documentos de maior relevncia para o usurio; Cruzamento com visitas nicas ou sesses permite identicar perodos de maior pico de downloads de arquivos; Avaliao da quantidade de downloads em relao meta de nida. Taxa de converso: percentual de usurios que visitaram o site e compraram um produto, contrataram um servio ou tornaram-se associados, entre outras aes comerciais. Aplicaes: Cruzamento com o nmero de visitantes nicos para saber a penetrao do site no seu pblico-alvo; Subsdios para o lanamento de promoes; Subsdios para campanhas de liao.
ACONTECE NO SEU SINDICATO Um dos maiores interesses de todo sindicato atrair novos associados. E ser uma fonte convel de prestao de servios. Para que o seu site atinja esses objetivos, que de olho nas seguintes mtricas: Quantidade de downloads de arquivos (guias, simuladores, planilhas); Percentual de atualizao de cadastros; Percentual de novos cadastros; Ranking dos temas mais comentados no Fale Conosco; Origem do clique do usurio.
67
Tornando essa anlise uma rotina

O que fazer com os nmeros
Existem muitas ferramentas para extrao de relatrios de mtricas. A principal delas o Google Analytics (imagem 1), que permite gerar dados e grcos personalizados sobre o comportamento do usurio em seu site. E ainda oferece recursos para voc fazer experimentaes que otimizem ao mximo os seus resultados. O Google Analytics gratuito e funciona on-line, exigindo apenas a insero de um cdigo nas pginas do site.
Imagem 1 Tela do Google Analytics
68
estratgia qualidade
Voc j deve ter percebido que preciso ter muita disciplina para fazer uma apurada anlise de mtricas. verdade. No adianta realizar essa avaliao s a cada seis meses. preciso criar uma rotina de trabalho. O ideal que voc acompanhe mensal mente os nmeros extrados do relatrio de mtricas. Mas h casos especcos que exigem tambm um monitoramento quase dirio. Procure, ainda, fazer comparaes entre diferentes perodos para avaliar o sucesso de uma campanha ou melhoria no site. Certas tendncias s cam claras dentro de uma viso histrica o mesmo ms no ano passado, os ltimos trs anos, e da por diante. E lembre-se de registrar eventos ou anncios que tenham inuenciado um aumento de visitao ou uso de um servio no site. Isso precisa car claro no seu relatrio.
ACONTECE NO SEU SINDICATO Se a guia de contribuio para o seu Sindicato retirada todo incio de ano, bom voc estar preparado para monitorar de perto esse trfego no seu site. Se possvel, faa isso diariamente. uma forma de estar alerta para identicar problemas e resolv-los de imediato, sem causar grandes transtornos para seus associados.
Tenha sempre em mente que trabalhar com mtricas adotar uma nova viso de trabalho. Quem atua nesse ramo sabe que muito comum enfrentar resistncias dentro do ambiente de trabalho para realizar as mudanas necessrias para um bom aproveitamento do site. No se desespere! Seus superiores, provavelmente, no vo prestar muita ateno aos seus primeiros relatrios. normal. Uma dica fazer uma bela apresentao, com os nmeros levantados naquele perodo, suas avaliaes e recomendaes para mudanas. E insista, porque essa conscientizao leva tempo. As mtricas so um dos melhores recursos disponveis para vericar se os objetivos do seu site esto sendo plenamente atendidos. Acima de tudo, conhecer anlise de mtricas vai ajudar voc a crescer prossionalmente. Anal, quem sabe embasar as suas concluses bem mais respeitado e inuente em seu ambiente de trabalho. Aproveite esse potencial.
estratgia relacionamento
69
Resumo do captulo
O que fazer:
Denir metas e objetivos voc precisa saber aonde quer chegar antes de medir o desempenho do site Priorizar as mtricas e indicadores de sucesso para gerar relatrios Analisar relatrios de visitao periodicamente Comparar dados de acesso com os de perodos anteriores Apresentar um sumrio executivo para a presidncia/diretoria, destacando os indicadores-chave Decidir aes concretas com base na anlise dos relatrios Revisitar a lista de mtricas de tempos em tempos, mantendo as mais teis Cruzar dados do site com outras fontes (ex.: atendimento telefnico) Correlacionar diferentes mtricas para embasar concluses Discutir dados e concluses dos relatrios com colegas e/ou superiores Comparar dados de desempenho do Sistema e do mercado
O que evitar:
Tratar o site como uma ferramenta que traz s benefcios intangveis (ex.: reputao) Denir mtricas demais para serem rastreadas e analisadas Dedicar tempo anlise de mtricas que no trazem informaes teis ao negcio Gerar relatrios extensos e maantes Encerrar uma discusso de mtricas sem concluses e prximos passos Analisar relatrios esporadicamente, sem uma rotina denida Tirar concluses precipitadas sobre o sucesso ou no de um servio on-line Encaminhar um relatrio apenas com dados brutos, sem comentrios e recomendaes.
Direitos Autorais
Ter acesso a contedo nunca foi to fcil. Pass-lo adiante tambm no. Fotos, vdeos, textos... a web nos oferece uma innidade de coisas interessantes para publicar e compartilhar. Isso pode nos trazer tanto boas oportunidades quanto processos judiciais. A diferena entre os dois extremos est em algo simples: conhecer os direitos autorais e saber us-los a seu favor. Embora envolva uma srie de leis, com aquela linguagem nunca amistosa, fcil saber como agir na maioria das vezes. As principais fontes de informao, como portais e sites de compartilha mento, divulgam o que o que se pode e o que no se pode fazer com o contedo ali exposto. Reserve poucos minutinhos para ler. Anal, a internet no uma terra de ningum, e nem tudo o que publicado de domnio pblico. E agora voc tambm ver a questo por outro ngulo: anal, vai gerar contedo no site da sua insti tuio. Assim, no se esquea de estabelecer uma poltica de uso e deix-la clara para os visitantes. E vamos em frente.
Neste captulo
A Lei de Direitos Autorais Modelos de licena Boas prticas
72
Manual de Webwriting PDA CNC | Captulo 7 Direitos Autorais
A Lei de Direitos Autorais

O direito autoral existe para proteger a criatividade, esforo e trabalho daqueles que se propuseram a criar um texto, uma ilustrao, um vdeo. Lembrando um ditado popular, ele est a para comprovar que feio ou bonito, todo lho tem um pai o autor. Voc pode adotar este contedo em seu site, mas precisa tomar alguns cuidados para no desrespeitar a legislao e correr riscos legais. Anal de contas, o autor de um texto, fotograa ou qualquer outra criao conta com a proteo da Lei 9.610, que estabelece o que pode e o que no pode ser feito com essas obras. A primeira regrinha bsica seguir o velho e correto bom senso: ao usar o contedo de terceiros em seu site, sempre cite de onde voc o conseguiu. E o principal: no use o material para obter lucro.
legislao
Leia mais: ntegra da Lei de Direitos Autorais www.cnc.org.br/ webwriting
Mas ateno: uma reviso da Lei de Direitos Autorais estava em discusso no Congresso Nacional quando este manual foi elaborado. Entre as medidas que poderiam ser implementadas, estava a incluso de novas permisses para o uso de obras sem necessidade de pagamento ou autorizao. Fique de olho.
Modelos de licena
Se voc est em um site, interessou-se por determinado contedo e quer republic-lo na sua pgina, a primeira coisa a fazer observar o modelo de licena utilizado. Os mais comuns so o Copyright e o Creative Commons. Geralmente, essa informao est disponvel na parte inferior da tela.
Copyright
Conra as principais caractersticas desse modelo de licenciamento, o mais comum entre os veculos de comunicao com ns comerciais: proibida a execuo de partes ou de toda a obra sem autorizao; O autor detm todos os direitos reservados sobre a obra; No permitida alterao, distribuio ou obra derivada sem permisso. O grau de destaque e detalhamento sobre a licena varia entre os veculos de comu nicao. Observe os exemplos do sites dos jornais The New York Times (imagem 1) e O Globo (imagem 2), onde as restries esto bem mais enfatizadas do que no Portal da CNC Confederao Nacional do Comrcio de Bens, Servios e Turismo (imagem 3).
73
Imagem 1 O aviso de Copyright do NYT assertivo, mas explica didaticamente as aes possveis
Imagem 2 O site do jornal A Folha de S.Paulo enfatiza a proibio de reproduzir seu contedo sem autorizao
Imagem 3 Mensagem de copyright no site da CNC
74
Creative Commons
O modelo de licenciamento Creative Commons (CC), lanado em 2002, muito mais recente do que o Copyright. Pensado em meio revoluo digital, ele segue uma losoa bem mais exvel: Esse modelo permite ao autor decidir que direitos pretende resguardar; As licenas vo desde a renncia quase completa sobre a obra at algumas opes restritivas, que probem a derivao ou o uso comercial; O autor tem liberdade de escolher um tipo de licena para cada contedo. Conhea as diferentes licenas do Creative Commons:
Leia mais: site da Creative Commons (em ingls) www.creativecommons.org
CC BY Permite distribuio, remixagem, adaptao e utilizao em outras obras, at com ns comerciais, desde que haja crdito pela criao original. CC BY-SA Permite distribuio, remixagem, adaptao e utilizao em outras obras, at com ns comerciais, desde que haja crdito pela criao original e que a nova obra seja licenciada da mesma forma. CC BY-ND Permite redistribuio desde que a obra no sofra alterao e que haja crdito pela criao. CC BY-NC Permite distribuio, remixagem, adaptao e utilizao em outras obras apenas para ns no comerciais. preciso atribuir crdito pela criao original, mas sem necessidade de licenciar da mesma forma. CC BY-NC-SA Permite distribuio, remixagem, adaptao e utilizao em outras obras apenas para ns no comerciais. preciso atribuir crdito pela criao origina e licenciar da mesma forma. CC BY-NC-ND A licena mais restritiva: s permite download e compartilhamento da obra, atribuindo o crdito e sem alter-la ou us-la para ns comerciais.
75
Boas prticas
Em caso de dvida, entre em contato com o autor
Voc j percebeu que so muitas e variadas as possibilidades de uso da obra de terceiros. Em alguns casos, as denies de direitos autorais no esto explicitadas, como na maioria dos blogs. Portanto, no hesite caso tenha alguma dvida: entre em contato com o autor.
Cite a fonte
Alm de respeitar as regras do direito autoral, voc pode demonstrar sua boa-f: cite a fonte do contedo que voc usar em seu site, inclua o link original em seu site e informe isso ao autor. Voc poder se surpreender e at mesmo criar boas parcerias.
Pea autorizao para usar a imagem de uma pessoa

Para usar a foto de uma pessoa, preciso estabelecer um termo por escrito, pelo qual ela autoriza voc a utilizar sua imagem. Isso ocorre porque a pessoa fotografada tem ao seu lado o direito de imagem, previsto em Lei. Vrios modelos esto disponveis na web, para sua adaptao.
Use sites de compartilhamento

Existem comunidades especcas de compartilhamento de ilustraes e at mesmo vdeos. Esses matrias podem enriquecer seu site, mas mesmo assim preciso observar algumas regras de convivncia. O risco de no estar atento a isso o mesmo do de no cumprir com as regras do direito autoral: no limite, voc pode ser processado. O Flickr, dedicado a fotograas, uma dessas comunidades. Conra a licena delas, no fundo da imagem. Dentro do site, h opo de busca apenas daquelas que utilizam as licenas Creative Commons, o que pode facilitar sua vida (imagem 4). Tambm possvel encontrar bancos de imagens 100% gratuitos. No espere mate rial de altssima qualidade, mas vale a pena ter essa carta na manga em caso de necessidade. O YouTube uma boa opo para encontrar vdeos com permisses de repro duo parciais ou integrais. Assim como no Flickr, h direitos a respeitar e opes de contedo a ser compartilhado. O site desenvolveu sua prpria licena padro, mas tambm divulga vdeos sob a Creative Commons CC-BY.
76
Leia mais: site do Flickr www.ickr.com/commons
Imagem 4 Seo do Flickr com imagens licenciadas no modelo Creative Commons
Leia mais: www.youtube.com/t/ copyright_center
Imagem 5 Centro de direitos autorais do YouTube
Recorra a fontes gratuitas de fotos jornalsticas

Alguns sites oferecem imagens para publicao sem que voc precise fazer muita pesquisa ou se deparar com uma innidade de licenas o que sempre traz o risco de incorrer em erros. De acordo com eles, para reproduzir o material, basta citar autor e fonte. So os casos das organizaes estatais Agncia Cmara (imagem 6) e Agncia Brasil (imagem 7).
Compre imagens econmicas

Quando no conseguir fotos ou ilustraes gratuitas, procure bancos de imagens royalty-free , que autorizam o uso sem exclusividade por preos mais em conta. O nome pode confundir, mas royalty-free no significa uma obra gratuita, e sim que pode ser utilizada em mais de um canal, inclusive por empresas concorrentes.
legislao imagens
77
Use o clipping para informar

Voc pode compartilhar informaes importantes com o leitor do seu site atravs do clipping uma compilao de notcias que tenham algo em comum. Porm, isso nunca pode ser feito com ns comerciais. E, para garantir o correto uso dessa difuso de notcias, cite a fonte e mencione os autores.
Imagem 6 Site da Agncia Cmara
Imagem 7 Site da Agncia Brasil
78
Estabelea parcerias
legislao relacionamento
O uso do clipping pode gerar boas oportunidade de parceria para o seu site. Mas que atento: ao apontar o link para o contedo original e entrar em contato com o autor, informando-o sobre a republicao do contedo, voc pode argumentar que a curiosidade dos leitores pode aumentar o trfego em ambos os sites, sendo uma medida benca para ambos. Ao mesmo tempo, pode oferecer a ele que publique material produzido por voc.
Dena a poltica de direitos autorais do seu site

Por ltimo, no perca de vista que o seu site tambm vai gerar contedo exclusivo, produzido por voc e sua equipe. Agora que voc j conhece as regras do direito autoral, comece a estabelecer as regras que devero ser cumpridas pelo internauta que visitar sua pgina e quiser utilizar esse material. Deixe isso claro no site. Direito autoral um assunto srio, mas veja na imagem 8 como as mudanas culturais aceleradas pela internet tambm podem render algumas risadas.
Imagem 8 Tirinha de Robmaia, sobre direitos autorais. Fonte: http://thirinhas.wordpress.com Srie: Noronha o blogueiro pobre de esprito 0031
79
Resumo do captulo
O que fazer:
Antes de republicar um contedo, observar a poltica comercial e o copyright da fonte Citar fonte de contedo reproduzido Incluir link para site externo que originou um contedo citado ou reproduzido Dar crdito ao autor de uma foto ou ilustrao Pedir autorizao, por e-mail ou fax, de uso de imagem de pessoas em fotos Republicar somente imagens comprovadamente de domnio pblico (ex.: Agncia Brasil, rgos pblicos, fontes com autorizao explcita de republicao) Adquirir fotos de bancos de imagens royalty-free, sem exclusividade, que so mais econmicas
O que evitar:
Reproduzir contedo de terceiros com ns lucrativos sem negociar acordo Usar fotos obtidas da internet (ex.: Google Images) sem o devido licenciamento Assumir o crdito por contedo de terceiros Deixar de citar a fonte e incluir link para o site com a ntegra do contedo externo
Apndice
Glossrio
ALT Embutido no cdigo das pginas web, o atributo ALT descreve em palavras o que uma imagem representa. Da o nome ALT, abreviao de texto alternativo. Essa descrio, que deve ser inserida manualmente por quem publicar a pgina, auxilia mecanismos de busca e leitores de pginas para decientes visuais. AVI Formato de udio e vdeo, criado pela Microsoft, que se popularizou por ser reconhecido pela maioria dos computadores com Windows e dos leitores de DVD. AVI, por extenso, Audio Video Interleave. BMP O formato BMP, sigla para Windows Bitmap, um formato comum de grcos no sistema opera cional da Microsoft. Para publicao na web, ele costuma ser convertido para formatos mais leves, como JPG e GIF. Breadcrumb Conhecido como rastro de navegao, breadcrumb signica migalhas de po na traduo literal. representao simples dos nveis de navegao em um site, a partir da pgina em que o usurio se encontra. Com o apoio de links em uma linha de texto, geralmente no topo da tela, possvel retornar para uma pgina anterior ou subir para sua seo, por exemplo. Cdigo-fonte Trata-se das instrues por trs das pginas web, codicadas em HTML HyperText Markup Language, que signica Linguagem de Marcao de Hipertexto. Diversas ferramentas de edio do mercado dispensam o domnio dessa codicao para publicaes simples. Converso Em marketing, signica a realizao de uma determinada ao por parte do cliente que atinja um objetivo comercial. Por exemplo: fechamento de uma compra, assinatura de newsletter, envio de um e-mail comercial. Copyright Direito de autor. So os direitos pertencentes ao criador intelectual de alguma obra. Creative Commons Descrio popularmente difundida para o conjunto de licenas estabelecidas pela ONG Creative Commons.
82
Manual de Webwriting PDA CNC | Captulo 8 Apndice
DPI Do ingls dots per inch, signica pontos por polegada e representa a densidade de pontos em uma foto ou ilustrao. Quanto mais pontos por polegada, maior a quali dade da imagem na tela e no papel. Eyetracking Tcnica de estudo de usabilidade que mede o grau de ateno e a movimentao dos olhos dos usurios, enquanto usam o computador no caso da web, para navegar em pginas. Flash Software utilizado para animaes interativas, popularizado na web, com extenso de arquivo .swf. Flash Video Com extenso de arquivo .v, um formato de vdeo leve que roda no software Flash. GIF Formato de imagem compacto, limitado a 256 cores, usado predominantemente para cones e imagens chapadas na web devido sua leveza. Hiperlink Recurso usado para redirecionamento do usurio para outros contedos na web. Os hiperlinks (ou links) podem apontar para pginas externas ou do prprio site, assim como arquivos para download. Hipertexto Texto publicado em uma plataforma digital que permita a interligao de pginas e elementos por meio de hiperlinks (ou simplesmente links). a base da navegao na web, com interface grca interativa. HTML a linguagem das pginas na web. Infogrco Soluo de comunicao visual que combina textos com fotos, ilustraes, mapas e outros recursos grcos. Trata-se de um recurso til para resumir e explicar informaes complexas no apenas na web, como tambm em jornais, revistas e livros. JPG Tambm conhecido como JPEG, um formato prprio para compactar fotos e ilustraes. Por trazer uma boa relao entre tamanho de arquivo e qualidade da imagem, o formato predominante na web para imagens detalhadas. Layout Termo refere-se ao projeto visual tanto de meios impressos como de sites e outros ambientes na web. Metadados Na web, so dados que descrevem o contedo e as caractersticas de cada pgina no cdigofonte. Os metadados podem ser gerados manual ou automaticamente e servem de orientao aos mecanismos de busca. MOV Formato de arquivo multimdia do software QuickTime, da Apple.
83
Nveis de navegao So as camadas hierrquicas em um site na web. Por exemplo, em uma loja virtual: seo de infor mtica (1 nvel), subseo de notebooks (2 nvel), pgina com modelos de uma determinada marca (3 nvel). Otimizao de sites para buscadores (SEO) Sigla para search engine optimization, em ingls, um mix de estratgias e tcnicas para aumentar a visibilidade de um site nos resultados de buscas no Google, Bing e outros buscadores na web. Tais tcnicas vo desde ajustes na redao das pginas at a insero de metadados e o uso de ferramentas especcas. Pingue-pongue Tipo de entrevista editada e publicada no formato de perguntas e respostas, com um breve texto de abertura para introduzir o assunto e o entrevistado. Nestes casos, faz-se um texto introdutrio para apresentar o tema e, em seguida, alternam-se as questes do jornalista e as declaraes do entrevistado. Pixel o menor elemento em uma tela, isto , um ponto de uma imagem digital. A resoluo de moni tores, por exemplo, medida em pixels: 800 x 600, 1.024 x 768 etc. Pontos por polegadas Ver DPI. QuickTime Video Ver MOV. Royalty-free Modalidade de licenciamento de imagens, textos e outras obras intelectuais em que o contratante no paga royalties, isto , taxas adicionais pelo direito de uso exclusivo. Em geral, contratos royalty-free permitem o uso de obras em determinados canais, mas probem ceder ou revender os direitos de reproduo. Webmaster Prossional encarregado da manuteno essencial de sites e intranets, realizando atividades de webdesign, programao e publicao. Webwriting Conjunto de tcnicas voltadas para a produo e distribuio de contedo web, que pode ser texto, foto, vdeo e udio, entre outros. Com seus estudos sobre usabilidade, realizados a partir de 1997, Jakob Nielsen comprovou que textos para a internet requerem uma formatao diferenciada. A abordagem do webwriting tem evoludo nos ltimos anos, passando a envolver aspectos de usabilidade, arquitetura da informao e gesto do conhecimento. WMV Formato multimdia Windows Media Video, popular por ser compatvel com o sistema opera cional da Microsoft e por gerar arquivos leves, para reproduo na web.
84
Bibliograa
Leitura essencial
Reforce seus conhecimentos em webwriting , usabilidade e webdesign com estes livros em portugus: Rodrigues, Bruno. (2010) Padres Web em Governo Eletrnico Cartilha de Redao Web. Ministrio do Planejamento, Oramento e Gesto Secretaria de Logstica e Tecnologia da Informao. www.governoeletronico.gov.br/biblioteca/arquivos/padroes-brasil-e-gov-cartilha-de-redacao-web Moherdaui, Luciana. (2007) Guia de Estilo Web Produo e Edio de Notcias On-line. Ed. Senac So Paulo. Pinho, J.B. (2003) Jornalismo na internet. Ed. Summus. Ferrari, Pollyana. (2003) Jornalismo Digital. Ed. Contexto Franco, Guillermo. Como Escrever para a Web. Centro Knight de Jornalismo para as Amricas. http://knightcenter.utexas.edu/como_web_pt-br.pdf. 2009. (traduzido por Marcelo Soares). Nielsen, Jakob e Loranger, Hoa. (2007) Usabilidade na Web Projetando Websites com qualidade. Ed. Campus. Krug, Steve. (2006) No me faa pensar. Ed. Alta Books.
PARA CONSULTAR ARTIGOS, SITES, BLOGS E OUTROS RECURSOS ON-LINE, ACESSE WWW.CNC.ORG.BR/WEBWRITING
85
ndice Temtico
A anexos 37, 38 atratividade 26 acessibilidade 52 B busca 15, 64 C chamadas 27 compartilhamento 54 comportamento 12, 13 D desempenho 62 E edio 22, 34 estratgia 60, 61, 62, 68 eyetracking 13 F formatao 26, 28, 34, 37 H hipertexto 28, 37, 38, 40 homepage 27 I imagens 49, 50, 51, 52, 76 L legislao 72, 76, 78 linguagem 22, 25, 27 link 28, 38 M metadados 15, 26 mtricas 61, 62 N navegao 12, 22, 28, 38, 40, 64 O ortograa 27 P priorizao 24 Q qualidade 37, 68 R redimensionamento 51 relacionamento 10, 22, 26, 68, 78
V vdeos 53, 54
Anotaes

Manual Webwriting CNC Versaoweb 14.12.2011

Enviado por

Dados do documento

Título original

Direitos autorais

Formatos disponíveis

Compartilhar este documento

Compartilhar ou incorporar documento

Opções de compartilhamento

Você considera este documento útil?

Este conteúdo é inapropriado?

Direitos autorais:

Formatos disponíveis

Manual Webwriting CNC Versaoweb 14.12.2011

Enviado por

Direitos autorais:

Formatos disponíveis

MANUAL DE WEBwRITING

CONFEDERAO NAcIONAL DO COMRcIO DE BENS, SERVIOS E TURISMO CNC

Anlise de Mtricas Bsicas Direitos Autorais Apndice

Manual de Webwriting PDA CNC | Captulo 1 Introduo

Estrutura dos captulos

Manual de Webwriting PDA CNC | Captulo 1 Introduo

Usabilidade e Arquitetura de Informao

Manual de Webwriting PDA CNC | Captulo 2 Usabilidade e Arquitetura de Informao

O mantra: foco no usurio

Como o usurio l na web

Leia mais: captulo 3 Tcnicas de Redao

Manual de Webwriting PDA CNC | Captulo 2 Usabilidade e Arquitetura de Informao

Manual de Webwriting PDA CNC | Captulo 2 Usabilidade e Arquitetura de Informao

A navegao nas mos do usurio

Leia mais: captulo 3 Tcnicas de Redao e captulo 4 Tcnicas de Edio e Publicao

Cada contedo em seu lugar

Manual de Webwriting PDA CNC | Captulo 2 Usabilidade e Arquitetura de Informao

Leia mais: captulo 6 Anlise de Mtricas Bsicas

Arquitetura de informao: a organizao por trs do site

Imagem 3 Rodap do site da CNC, que destaca a clareza do sistema de navegao

Manual de Webwriting PDA CNC | Captulo 2 Usabilidade e Arquitetura de Informao

Como o usurio encontra o seu contedo

Leia mais: captulo 6 Anlise de Mtricas Bsicas

Manual de Webwriting PDA CNC | Captulo 2 Usabilidade e Arquitetura de Informao

Leia mais: captulo 4 Tcnicas de Edio e Publicao

Acessibilidade: portas abertas para todos

Animaes e banners com moderao

Leia mais: captulo 5 Imagens e Multimdia

Manual de Webwriting PDA CNC | Captulo 2 Usabilidade e Arquitetura de Informao

Leia mais: artigos sobre cegueira a banners www.cnc.org.br/ webwriting

Manual de Webwriting PDA CNC | Captulo 2 Usabilidade e Arquitetura de Informao

Imagens 4 e 5 Exemplos de sites mal estruturados Fontes: http://www.dennetworks.com/digital-cable/ http://www.angelre.com/super/badwebs/

Manual de Webwriting PDA CNC | Captulo 2 Usabilidade e Arquitetura de Informao

Manual de Webwriting PDA CNC | Captulo 2 Usabilidade e Arquitetura de Informao

Manual de Webwriting PDA CNC | Captulo 3 Tcnicas de Redao

Antes de comear a redigir

O mais importante no topo

Leia mais: captulo 4 Tcnicas de Edio e Publicao

Quem? Quando? Onde? Como? Por qu?

Manual de Webwriting PDA CNC | Captulo 3 Tcnicas de Redao

Leia o texto abaixo:

Manual de Webwriting PDA CNC | Captulo 3 Tcnicas de Redao

Sabe com quem est falando?

Manual de Webwriting PDA CNC | Captulo 3 Tcnicas de Redao

Durante a produo dos textos

Manual de Webwriting PDA CNC | Captulo 3 Tcnicas de Redao

Leia mais: Manual do Publicador

Manual de Webwriting PDA CNC | Captulo 3 Tcnicas de Redao

Produzi os textos. E agora?

Ttulos, chamadas e links

Manual de Webwriting PDA CNC | Captulo 3 Tcnicas de Redao

Newsletters e e-mail marketing

Otimizao para buscadores

Manual de Webwriting PDA CNC | Captulo 3 Tcnicas de Redao

Leia mais: captulo 4 Tcnicas de Edio e Publicao

Manual de Webwriting PDA CNC | Captulo 3 Tcnicas de Redao

Manual de Webwriting PDA CNC | Captulo 3 Tcnicas de Redao

Tcnicas de Edio e Publicao

Manual de Webwriting PDA CNC | Captulo 4 Tcnicas de Edio e Publicao

Leia mais: captulo 3 Tcnicas de Redao

Quebrando a monotonia do texto

Leia mais: Manual do Publicador

Manual de Webwriting PDA CNC | Captulo 4 Tcnicas de Edio e Publicao