Grande parte das visualizações de um site na Internet tem sido por meio de dispositivos móveis. Por conta disso, um layout deve ser responsivo e integrado com a nova realidade de comunicação. E há recursos que vem a incrementar ainda mais o mobile de modo a chamar atenção, a atrair mesmo.
E um desses casos é a coloração da barra de endereços do Google Chrome para Android. Esse recurso do Material Design (diretriz de design do Google) está disponível desde a versão 5 do Android, o Lollipop.
Em alguns sites, e eu vou mostrar o segredo, se bem que não tem, a cor que aparece na barra do navegador é a mesma do padrão do site. Como aqui no Blog Josivandro Avelar, onde a coloração é azul-clara, que nem nas bordas do site.
Outros sites famosos adotam esse recurso (se você estiver no Chrome via Android, clique em um deles e veja):
*G1
*Globo Esporte
*GShow
*Terra
*Yahoo
*WordPress.com
*TecMundo
*Tudo Celular
*AndroidPit
*Facebook
Aqui temos outros sites desenvolvidos por mim que ganharam as colorações de suas respectivas identidades visuais.
E sim, qualquer um que tiver um site, até mesmo no Blogger, pode fazer isso. Porque não tem segredo. O segredo é o código:
<meta name="theme-color" content="#000">
Onde #000 é a cor que você deseja inserir. A que está no Blog Josivandro Avelar é #1e73be, que vem a ser esse azul. Procure a cor que deseja e altere o código hexadecimal para essa cor.
Como se insere
Agora sim, vamos começar a mágica.
Para WordPress.org (em WordPress.com não se mexe nos arquivos de tema), o código deve ser inserido entre as tags <head> e </head>, que ficam no cabeçalho do site (header.php). O arquivo está em Aparência> Editor. E é só procurar o header.php; o <head> está lá. Coloque o código acima abaixo de <head>, simples.
Só salvar e ver o resultado.
Para Blogger, o código deve ser inserido no editor de HTML (ir para Modelo > Editar HTML). O código deve ser inserido abaixo da tag <head>.
Além de adicionar o código, feche a tag, adicionando ao lado a tag </meta>, ficando assim:
<meta name="theme-color" content="#000"></meta>
Sem ela, não vai, dá o erro, pede essa dica de fechar a tag. Então faça já fechando a tag.
Só salvar e ver o resultado.
Há temas preparados, sabia?
É o caso do tema do OCD Holding. O tema está em WordPress.com, não pode ser mexido, porém o tema Blaskan, empregado no site, possui o código em questão embutido, e por isso, a coloração aparece. Um trabalho a menos para o editor.
E é o que eu digo: os temas e recursos da Internet estão disponíveis para todos, do maior grupo de comunicação do mundo até um site simplezinho de pouquinhas visitas, e até para quem não gasta nada. É onde todos somos iguais e temos de certa forma o mesmo peso.
