Quem tem sites e blogs está — ou deveria estar — às voltas com uma preocupação: o bounce rate, ou “taxa de rejeição”. É uma métrica sobre o comportamento de seus leitores. Quando só uma página é visualizada, sem resultar em novas visualizações, o visitante é parte da rejeição, pois não teve interesse em outros conteúdos além do ponto de entrada.
Dependendo do projeto, isso é mais ou menos prejudicial. Se o conteúdo está em página única, como oferta numa página de aterrissagem ou hotsite, não chega a ser grave. Mas quem precisa manter o usuário, como a página inicial de um portal ou uma listagem, é mau sinal. Deve-se buscar formas de “fidelizar” leitores que estão “pulando” por aí.
Em textos, uma das formas de fazer isso é oferecer informações prévias. O leitor deve saber do que se trata o artigo sem ter que ler tudo. Caso se sinta enganado ao final, é quase certo que sairá em seguida, talvez não voltando mais.
Uma opção é disponibilizar é a estimativa de tempo de leitura. Muita gente tem preguiça de textos longos, ou falta tempo na volta do almoço ou fila do banco. Ao ter noção de quanto tempo o artigo vai tomar, a pessoa decide se vale a pena continuar ou partir para outro. ALGUNS AUTORES relatam queda de até 13% na rejeição só por exibir esse dado.
Também podemos usá-lo para entender o leitor. O Medium, um dos grandes que informa o tempo estimado por artigo, fez isso para concluir que o tempo ideal de leitura (no que concerne ao engajamento) é 7 minutos.
Se você usa o WordPress, é fácil exibir uma estimativa de tempo sem plugins. O código que segue pode ser adaptado para qualquer site baseado em PHP.
Serão três métodos:
- Método 1: contagem de palavras e tempo no formato de minutos aproximados.
- Método 2: contagem de caracteres e tempo no formato minutos aproximados.
- Método 3: contagem de caracteres e tempo no formato horas:minutos:segundos.
Já implementado e estilizado, ficaria assim:
Meio óbvio, mas bom lembrar que o tempo estimado é impreciso, pois depende do estilo de escrita, velocidade de leitura do visitante, etc. Portanto, o cálculo é baseado numa média segundo especialistas
Método 1
Adicione o seguinte ao seu arquivo functions.php (usuários do WordPress):
/* TT READING TIME
// Calcula o tempo estimado de leitura do conteúdo
// @www.tutoriart.com.br/
*/
function tt_reading_time() {
$content = get_post_field('post_content');
$word_count = str_word_count(strip_tags($content));
$min = floor($word_count / 200); // tempo médio de leitura: 200 palavras
$tempo = 'Tempo de leitura: ';
if ($min <= 1) {
$tempo .= '1 minuto';
}
else {
$tempo .= $min . ' minutos';
}
return $tempo;
}
/* http://wordpress.stackexchange.com/a/39920/31885 */
function tt_reading_time_filter( $content ) {
$custom_content = '<div id="tt-temp-estim">'.tt_reading_time().'</div>';
$custom_content .= $content;
return $custom_content;
}
add_filter( 'the_content', 'tt_reading_time_filter' );
O estilo vai na style.css, ou se tiver painel de CSS, use.
#tt-temp-estim{font-style: italic;font-size: 0.8em;margin: 0 0 25px}
Só isso. Mande pro servidor e está funcionando.
Desmontando
A primeira parte da função usa str_word_count para contar as palavras no conteúdo post_content.
Esse trecho em especial pode ser modificado:
$min = ceil($word_count / 200);
Ele aplica na função a leitura média do público em 200 palavras por minuto, estimativa tida como normal. Alguns especialistas dizem que, na tela, o número pode ser menor, em torno de 150 palavras. Fica a seu critério alterar o valor após a barra.
O ceil arredonda o valor para cima. Então se o texto tiver 1200 palavras, será: 1237 / 200 = 6,185. No caso, será exibido o tempo de 7 minutos.
Método 2
O problema da função é que str_word_count é impreciso com certos caracteres. Podemos fazer a contagem por caracteres, excluindo os espaços em branco e tags de HTML e PHP.
Mas como saber quantos caracteres lemos por minuto, em média?
Vamos nos basear na média de 200 palavras. Contei os caracteres de cinco textos de diferentes autores. Esse foi o resultado:
- Texto 1 (lorem ipsum): 1309 caracteres.
- Texto 2 (notícia): 1316.
- Texto 3 (artigo científico): 1205.
- Texto 4 (artigo de blog): 1098.
- Texto 5 (fórum): 1078.
Claro que os números podem variar de acordo com o estilo do autor, mas nessa experiência, a média foi de 1201 caracteres em 200 palavras, ou seja, cerca de 1200 caracteres por minuto.
Agora podemos criar a nova função:
/* TT READING TIME
// Calcula o tempo estimado de leitura do conteúdo
// @www.tutoriart.com.br/
*/
function tt_reading_time() {
$content = get_post_field('post_content');
$char_count = mb_strlen(strip_tags($content), "UTF-8");
$min = ceil($char_count / 1200); // tempo médio de leitura: 1200 caracteres
$tempo = 'Tempo estimado: ';
if ($min <= 1) {
$tempo .= '1 minuto';
}
else {
$tempo .= $min . ' minutos';
}
$tempo .= ' ('. $char_count .' caracteres)';
return $tempo;
}
/* http://wordpress.stackexchange.com/a/39920/31885 */
function tt_reading_time_filter( $content ) {
$custom_content = '<div id="tt-temp-estim">'.tt_reading_time().'</div>';
$custom_content .= $content;
return $custom_content;
}
add_filter( 'the_content', 'tt_reading_time_filter' );
O que resulta em algo como:
Palavras e caracteres
Acho desnecessário, mas podemos exibir ambos, usando um deles como parâmetro para o tempo. Algo assim:
/* TT READING TIME
// Calcula o tempo estimado de leitura do conteúdo
// @www.tutoriart.com.br/
*/
function tt_reading_time() {
$content = get_post_field('post_content');
$word_count = str_word_count(strip_tags($content));
$char_count = mb_strlen(strip_tags($content), "UTF-8");
/* $min = ceil($word_count / 200); // tempo médio de leitura: 200 palavras DESATIVADO */
$min = ceil($char_count / 1200); // tempo médio de leitura: 1200 caracteres
$tempo = 'Tempo estimado: ';
if ($min <= 1) {
$tempo .= '1 minuto';
}
else {
$tempo .= $min . ' minutos';
}
$tempo .= ' ('. $word_count .' palavras, '. $char_count .' caracteres)';
return $tempo;
}
/* http://wordpress.stackexchange.com/a/39920/31885 */
function tt_reading_time_filter( $content ) {
$custom_content = '<div id="tt-temp-estim">'.tt_reading_time().'</div>';
$custom_content .= $content;
return $custom_content;
}
add_filter( 'the_content', 'tt_reading_time_filter' );
Resulta em…
Como mudar o estilo?
É só alterar o CSS que você incluiu lá no começo. Pra ficar com fundo amarelo e padding de 7px, por exemplo:
#tt-temp-estim{
font-style: italic;
font-size: 0.8em;
margin: 0 0 25px;
background-color: #ffcc00;
padding: 7px
}
Método 3
Como devem ter notado, o tempo estimado é bem “livre”, sem exibição de segundos. Se o resultado foi 1:05 segundos ou 1:59, tanto faz, vira 2 minutos. Pra muita gente, não deve ter soado legal, então vamos com uma função diferente, com exibição de horas (para textos muuito longos), minutos e segundos.
Primeiro a função, depois a explicação. Aplique no seu arquivo functions.php:
/* TT READING TIME
// Calcula o tempo estimado de leitura do conteúdo
// @www.tutoriart.com.br/
*/
function tt_reading_time() {
$content = get_post_field('post_content');
$word_count = str_word_count(strip_tags($content));
$char_count = mb_strlen(strip_tags($content), "UTF-8");
/* Se em 60 seg lemos 1200 caracteres,
// quantos $x seg para ler $char_count caracteres?
// Exemplo: 3750 caracteres
//
// 1200 ch => 60 seg
// 3750 ch => x seg
//
// 1200x = 3750 * 60 (225000)
// x = 225000 / 1200
// x = 187,5 seg
*/
$char_lmin=1200; $lmin = 60;
$x = $char_count * $lmin;
$x = $x / $char_lmin;
$tempo = 'Tempo estimado: ';
if ($char_count <= 1200) {
$tempo .= '< 1 min';
}
else {
if ($x > 3599) $tempo .= gmdate("H:i:s", $x) . ' min';
else $tempo .= gmdate("i:s", $x) . ' min';
}
$tempo .= ' ('. $word_count .' palavras, '. $char_count .' caracteres)';
return $tempo;
}
/* http://wordpress.stackexchange.com/a/39920/31885 */
function tt_reading_time_filter( $content ) {
$custom_content = '<div id="tt-temp-estim">'.tt_reading_time().'</div>';
$custom_content .= $content;
return $custom_content;
}
add_filter( 'the_content', 'tt_reading_time_filter' );
Lendo os comentários no código já dá pra sacar, mas desmontando as principais partes:
$char_lmin=1200; $lmin = 60;
Aqui definimos os valores-base: 1200 caracteres, e 60 segundos.
$x = $char_count * $lmin; $x = $x / $char_lmin;
Depois, foi calculado o total de segundos para ler os caracteres dados em $char_count.
if ($char_count <= 1200) {
$tempo .= '< 1 min';
}
else {
if ($x > 3599) $tempo .= gmdate("H:i:s", $x) . ' min';
else $tempo .= gmdate("i:s", $x) . ' min';
}
Se a contagem de caracteres for igual ou menor que 1200, o tempo exibido será “inferior a 1 minuto”, não precisa de outros cálculos.
Senão (else), verificamos se o número de segundos é maior que 1 hora (1 hora = 3600 segundos). Se for, o tempo em segundos é formatado usando a função gmdate. com hora, minuto e segundo. Caso contrário, usará o formato minuto e segundo.
O resto é como nas outros métodos. Veja como fica:
