Jornalistas e redatores de todo o mundo tem um medo em comum: lidar com pessoas que não dão o devido valor ao seu idioma e, com isso, acabam ferindo-o deliberadamente. Para esses profissionais, que têm na expressão verbal seu principal meio de existência, tal situação causaria repulsa instantânea, náuseas e em quadros cronológicos até depressão. Mas fique claro que não estamos falando das situações coloquiais - afinal, nas conversas do dia a dia todas as nuances da linguagem são muito bem vindas - e sim da conversa que acontece no ambiente de trabalho.

Ao analisar o perfil do workflow desse tipo de profissional e de tantos outros no contexto da era digital, podemos perceber o motivo de tanta importância à boa comunicação - objetiva e clara.

Hoje, é muito recorrente numa rotina de negócios que se conheça, converse e passe por pessoas apenas por contatos via email e, nesse tipo de diálogo, fica sempre a mercê do seu receptor criar uma persona que te represente (na cabeça dele, com os parâmetros de mundo dele) para então direcionar o tom de abordagem de uma resposta.

Desconstruindo essa “dinâmica da conversa” fica evidente o poder de articulação que alguém pode exercer ao entender minuciosamente o seu público alvo, porém, organicamente esse processo todo acontece no minúsculo tempo de algumas sinapses. Saber se comunicar adequadamente torna-se então a melhor via de fazer a pessoa do outro lado entender o que você precisa e, sutilmente, induzi-la também a concluir essa tarefa.

Retomando e aprofundando nosso contexto digital, dentro de qualquer agência de marketing digital - como a nossa - a produção de conteúdo textual representa uma das artérias criativas centrais, seja em blogs, redes sociais, relações públicas, atendimento ou mesmo na comunicação interna.

Aí vem a questão que motivou esse artigo: todo esse texto produzido precisa ser entregue em seu melhor formato para a internet, afinal no marketing tudo pode ser modelado para performance. A proposta mais estratégica que enxergo para essa situação é que os produtores de conteúdo incorporem as marcações HTML ao seu arsenal de trabalho.

Se você já pensou em SEO, é disso mesmo que estamos falando. Dentre todo o conjunto de técnicas que podem ser aplicadas para os buscadores, a marcação textual contextualizada é a lapidação técnica final de um conteúdo online. E as marcações HTML não devem ser encaradas como apenas um “invólucro” para o conteúdo. Pelo contrário, a poesia se faz também na hora de interpretar e formatar um texto. Além das ferramentas de busca, não menos importantes, as ferramentas de acessibilidade se beneficiam ainda dessa boa prática de escrita.

O órgão que padroniza as marcações HTML no mundo é o W3C. No site deles está disponível toda a relação de tags exemplificada.

Para os que exercem a redação e já querem começar a praticar, compilei abaixo minha apresentação desse recurso e algumas as marcações básicas.

HTML

A maioria das siglas das marcações utilizadas no HTML são contrações do nome de sua funcionalidade direta, em inglês. Partindo desse princípio, o próprio termo HTML significa HyperText Markup Language, ou seja, Linguagem de Marcação de Hipertexto.

Atualmente o HTML está em sua quinta versão oficial, o tão falado HTML5, que incorpora alguns recursos que antes dependiam de programação. Aliás, um erro comum é chamar o HTML de linguagem de programação, quando na verdade se trata de uma linguagem de marcação. Isso quer dizer a grosso modo que o HTML fornece recursos estruturais ao código, enquanto as animações, funções lógicas e mais complexas são reservadas a outras linguagens (de programação) adequadas.

Tags

São as marcações propriamente ditas. Existem dois tipos, sendo que a mais comum é aquela que tem abertura e fechamento:

<tag> texto </tag>

As tags que funcionam dessa maneira na verdade delimitam um trecho de código a ser trabalhado. Tudo que for contido entre sua abertura e fechamento será interpretado como seu conteúdo.

Existem também tags únicas, que não necessitam fechamento:

<br/> <hr/> <img/>

Nesse caso, a tag representa um elemento único. Os estilos e comportamento dela serão definidos por parâmetros expressos dentro da própria estrutura da tag:

<img alt=“Descrição da Imagem” />

Recursos práticos

<br/>

Break. Esse elemento cria uma quebra de linha no texto. Ideal para quando precisamos ir para a próxima linha antes do limite natural das margens.

<p>

Paragraph. É o elemento parágrafo. O conteúdo entre <p> e </p> é considerado um parágrafo de texto.

<hr/>

Horizontal Rule. Esse elemento cria a quebra de texto com uma linha horizontal. Ideal para dividir sessões dentro de um texto.

<a>

Anchor. Esse é o elemento que cria hyperlinks. O conteúdo entre <a> e </a> é considerado um link para outro conteúdo.

<b> & <strong>

Bold. Ambas as tags criam o mesmo efeito visual de negrito no texto, porém, usando a tag <b> estaremos apenas criando o destaque visual em si, enquanto ao utilizar <strong> estaremos, além de manifestando visualmente, declarando às ferramentas de acessibilidade que esse trecho de conteúdo merece ser diferenciado em sua interpretação.

Para ilustrar a importância desse recurso trago esse vídeo do Olhar Digital sobre Tecnologias Assistivas:

<i> & <em>

Italic. Novamente, ambas as tags criam o mesmo efeito visual de itálico no texto, porém, a tag <em> traz o indicativo de ênfase para os robôs de acessibilidade.

<u>

Underline. Sublinhado.

<iframe>

Inline Frame. O iframe é um dos métodos mais comuns para compartilharmos o conteúdo de um plataforma (Postagens, vídeos, áudios etc) dentro de uma página web. O vídeo acima por exemplo foi incorporado a esse artigo através de um elemento <iframe>.

<ul> & <ol>

Unorganized List e Organized List. Os nomes já nos contam a diferença. <ul> é utilizado para criar listas simples, sem ordenação, enquanto <ol> cria listas com valores de importância:

<ul>

  • Ítem
  • Ítem
  • Ítem

<ol>

  1. Ítem
  2. Ítem
  3. Ítem

<li>

List Item. Dentro de uma lista, cada ítem é declarado atavés de um elemento deste tipo:

Aparência:

  • Ítem
  • Ítem
  • Ítem

Marcação:

<ol>
  <li> Ítem <li>
  <li> Ítem <li>
  <li> Ítem <li>
<ol>

Começar a trabalhar com esses elementos seguramente vai te dar mais segurança para explorar outros recursos do HTML em seus textos.

É muito importante que produtores de conteúdo digital se familiarizem com esses recursos para usufruir mais ainda do potencial da web enquanto plataforma de comunicação.

Nos próximos artigos aguardem a continuação desse pensamento, com mais exemplos de recursos práticos de HTML para os produtores de conteúdo na web.

Leo Cucco
Enviado por

Diretor de arte

Um web designer bon vivant e paulistano por vocação. Além de suas contas, colabora com a equipe de marketing digital e com o branding da agência. É interessado por tudo que envolve internet e música eletrônica.

Todos os posts por Leo Cucco
Clique aqui para solicitar um contato telefônico

Preencha os campos abaixo, e em breve entraremos em contato.

Nome * * Campo obrigatório
Telefone * * Campo obrigatório
Solicitar ligação

(11) 3675-6710
(11) 3803-5873
comercial@idst.com.br

Rua Crasso, 199
Lapa, São Paulo - SP
05043-010

Copyright 2015 © ID Studio
Todos os direitos reservados

Vamos trabalhar juntos?

solicite um orçamento!

(11) 3675-6710
(11) 3803-5873
comercial@idst.com.br

Rua Crasso, 199
Lapa, São Paulo - SP
05043-010

Copyright 2015 © ID Studio | Todos os direitos reservados
Vamos trabalhar juntos?
solicite um orçamento!

(11) 3675-6710
(11) 3803-5873
comercial@idst.com.br

Rua Crasso, 199
Lapa, São Paulo - SP
05043-010

Copyright 2015 © ID Studio | Todos os direitos reservados