Image Image Image Image Image
Scroll to Top

Topo

20

abr
2012

Sem Comentários

Em Blog
Código
Wordpress

Por Allison

Como Escolher as Melhores Cores para o Blog?

Em 20, abr 2012 | Sem Comentários | Em Blog, Código, Wordpress | Por Allison

Fonte: CriarSites

Este é um guest post que foi escrito por Vinicius Horta do blog Dinheiro Web.

O Blog é formado por um conjunto, não adianta ter o melhor conteúdo se o layout é desagradável, boa parte do que pode tornar um layout simplesmente insuportável é uma má escolha de cores na hora de customizar seu theme wordpress.

Sempre vale lembrar aquelas velhas dicas de evitar cores muito fortes e/ou excessivamente contrastantes (principalmente próximo ao texto), evitar uma diversidade de cores muito grande também é bom, ajuda a manter o layout mais clean.

Entre diversos ótimos themes que já observei na web algo que encontre como fator em comum é ter uma única cor predominante além do branco que é trabalhada em suas tonalidades assim compondo o theme. Um ótimo exemplo disto pode ser visto aqui mesmo no theme do Criar Sites, que possui basicamente apenas 3 cores (branco, amarelo e cinza), assim se tornando um blog de leitura agradável, não cansa a vista e não nos confunde com muitas cores.

Como escolher uma Boa combinação de cores?

É natural vermos ótimas combinações, porém saber que combinação ficará agradável é que fica realmente difícil sem ter ferramentas que possam ajudar nesta tarefa, mas existem ótimas soluções online para isso!

Uma ótima ferramenta online gratuita para escolher um padrão de cores é o Color Blender, com ele poderá inserir a cor principal que deseja para seu theme. Para que tenha uma melhor noção de como esta ferramenta funciona peguei a cor principal aqui do Criar Sites, onde a cor predominante é o amarelo da barra superior de navegação e vejam as cores oferecidas pelo Color Blender:

Os números e símbolos em vermelho eu que editei para poder fazer alguns comentários explicando o quanto esta ferramenta pode ser útil.

1 – A cor inserida por mim para uso do Color Blender.

O site me sugeriu 5 cores que combinam com esta cor inicial, repare que a cor marcada como cor número 2 está sendo utilizada como backgruond aqui no Criar Sites!

A cor número 3 se por acaso ainda está procurando se encontra nos links! Como pode ver um blog de sucesso como o Criar Sites não se faz apenas de ótimos artigos, mas também de outros recursos que também são importantes. Não sei se Celso Lemes utilizou esta, outra ferramenta ou se utilizou sua experiência, o fato é que acertou na mosca!

Até mesmo as variações da cor principal irá encontrar no blog se olhar atentamente, fazendo este post observei com cuidado cada uma das cores, e encontrei todas as cores sendo utilizadas com perfeição!

Como Fazer a Alteração de cores de seu Theme WordPress

Alterar as cores em seu theme é bem simples, basta que abra o arquivo style.css em um editor (até o bloco de notas serve), mas recomendo o notepad++ que possui funções bem interessantes e certamente poderá ajudar no processo.

Vamos partir do princípio de que seu objetivo seja alterar a cor daquela pequena linha que separa um post do próximo no expert de seu theme, aquela cor não lhe agrada e deseja mudar, ok! Com seu style.css aberto encontre as referência a seu excerpt (ctrl + F ajudará muito), encontrará algo mais ou menos como isso:

excerpt {

margin:0 0 25px 0;

position:relative;

padding:10px 0 20px 0;

height:100%;

border-bottom:1px solid #cfcfcf;

overflow:hidden;

}


Como pode ver há um código hexadecimal de cor para linha, que neste caso é “#cfcfcf”, que poderá ser trocada por qualquer outra cor que desejar, tanto uma cor que obteve no Color Blender como também de qualquer cor, que pode inclusive ser facilmente consultada na tabela de cores do Dreamweaver, que é uma tabela que possui tanto os códigos Java (RGB) como também os HTML, para o CSS utiliza-se o hexadecimal que é o HTML e pode ser facilmente consultado.

O mesmo processo deve ser feito com todas as cores que pretende alterar em seu blog, se por acaso não encontrar a cor de um elemento em seu style.css certifique-se de que seu theme não possui outros arquivos css (o que é bastante frequente).

Redes Sociais

Tags | , , ,

Enviar um Comentário