As configurações de Cores e Tipografia no Document360 permitem que você controle a aparência visual do seu site de base de conhecimento, desde o tema do site e as cores da marca até as fontes em artigos e navegação. Todas as configurações são configuradas a partir da personalização do site e se aplicam no nível do projeto - a cor da marca flui para CTAs, estados de seleção e elementos interativos; A cor do hiperlink controla como os links aparecem em todos os artigos; O pareamento de fontes dos artigos determina as fontes usadas nos títulos e no conteúdo do corpo dos artigos, e as mesmas fontes aparecem no editor para que os escritores possam pré-visualizar como os artigos ficarão quando publicados; A fonte do site controla a navegação, cabeçalhos, rodapés e controla separadamente do conteúdo do artigo.
Essas configurações funcionam juntas para criar uma experiência visual consistente para os leitores em todas as páginas.
Quando atualizar as cores e a tipografia
- Ao configurar uma nova base de conhecimento – estabeleça a cor da sua marca, a cor do hiperlink e as fontes como parte da configuração inicial para que o site reflita sua identidade desde o início.
- Após uma atualização da marca – se sua empresa atualizar sua cor principal, fonte ou diretrizes visuais, atualize as configurações da base de conhecimento para manter o alinhamento.
- Quando os leitores relatarem problemas de acessibilidade - use a opção Ajustar contraste de cor para atender aos padrões WCAG para aplicar automaticamente razões de contraste compatíveis com WCAG com base na cor da sua marca.
- Ao alternar entre temas claros e escuros - cores que funcionam no modo claro podem não ter contraste suficiente no modo escuro. Revise e ajuste as cores dos dois temas ao ativar o suporte a modo duplo.
- Quando o conteúdo do artigo é difícil de ler – se os leitores acharem a fonte padrão muito pequena, densa ou incompatível com seu produto, atualize o par de fontes do artigo e do site para melhorar a legibilidade.
Tema do local
O tema do site controla quais modos de cor estão disponíveis para os leitores no site da sua base de conhecimento.
- Navegue até Configurações () na barra de navegação à esquerda do portal da Base de Conhecimento.
- No painel de navegação esquerdo, navegue até Site da base de conhecimento } > Personalização do site.
- No campo Tema do Site , selecione uma das seguintes opções:
- Tanto Claro quanto Escuro - Leitores podem alternar entre modos claro e escuro usando a opção de alternar tema no cabeçalho do site.
- Apenas luz - O site está sempre exibido no modo luz. A opção de alternar o tema está oculta.
- Apenas escuro - O site está sempre exibido no modo escuro. A opção de alternar o tema está oculta.
- Clique em Salvar.
Cores
Cor da marca
A cor da marca é a cor primária aplicada aos CTAs, estados de seleção e elementos interativos em todo o seu site de base de conhecimento.
- Navegue até Configurações () na barra de navegação à esquerda do portal da Base de Conhecimento.
- No painel de navegação esquerdo, navegue até Site da base de conhecimento } > Personalização do site.
- Na seção Cores , selecione uma cor usando o seletor de cores ou insira um código HEX no campo de cor Marca .
- Clique em Salvar.
Se o Auto configurar o contraste de cor para atender aos padrões WCAG estiver ativado, tanto as cores claras quanto as escuras do tema são definidas automaticamente com base na cor da sua marca. Se estiver desativado, você deve definir manualmente as cores de cada tema separadamente.
Cor do hiperlink
Você pode personalizar como os hiperlinks aparecem em todo o seu site de base de conhecimento. Três opções estão disponíveis:
| Opção | O que ele faz |
|---|---|
| Uso padrão da indústria | Aplica a cor padrão do hiperlink comumente usada |
| Use a cor da marca | Aplica a mesma cor selecionada da cor da sua marca |
| Use uma cor diferente | Permite definir cores padrão, de passar o mouse e de visitas separadas para hiperlinks |
Para definir a cor do hiperlink:
- Navegue até Configurações () na barra de navegação à esquerda do portal da Base de Conhecimento.
- No painel de navegação esquerdo, navegue até Site da base de conhecimento > Personalização do site.
- Na seção Cores , vá em Hyperlink de cor e selecione sua opção preferida.
- Se você selecionar Usar uma cor diferente, configure os estados padrão, passe o mouse e visitado.
- Clique em Salvar.
Contraste automático WCAG
Ativar o contraste automático WCAG ajusta automaticamente os elementos de cor do seu site para atender aos padrões de acessibilidade WCAG 2.1 , com base na cor da marca escolhida.
- Navegue até Configurações () na barra de navegação à esquerda do portal da Base de Conhecimento.
- No painel de navegação esquerdo, navegue até Site da base de conhecimento } > Personalização do site.
- Na seção Cores , selecione a caixa Auto definir contraste de cor para atender aos padrões WCAG .
- Clique em Salvar.
Tipografia
Pareamento de fontes de artigos
O pareamento de fontes de artigos controla as fontes usadas para títulos e conteúdo de artigos em todo o seu site de base de conhecimento. As fontes selecionadas também aparecem no editor, para que os autores possam pré-visualizar como os artigos ficarão quando publicados.
- Navegue até Configurações () na barra de navegação à esquerda do portal da Base de Conhecimento.
- No painel de navegação esquerdo, navegue até Site da base de conhecimento > Personalização do site.
- Na seção Fontes, selecione um par de fontes do bloco de pareamento de fontes Artigo. A primeira fonte se aplica aos títulos dos artigos, e a segunda ao conteúdo dos artigos.
- Para escolher uma combinação específica, clique em Tem uma combinação de fontes específica em mente? para acessar opções adicionais de fontes e selecionar fontes para títulos e conteúdo individualmente.
- Clique em Salvar.
Por exemplo, se você rascunhar conteúdo em Verdana no portal da base de conhecimento, mas selecionar Ubuntu + Open Sans como par de fontes do artigo, o título do artigo aparecerá no Ubuntu e o conteúdo no Open Sans no site da base de conhecimento.
Fonte do local
A fonte do site se aplica em toda a navegação do site da base de conhecimento — incluindo o painel de navegação esquerdo (categorias, subcategorias, títulos de artigos), cabeçalho, rodapé, navegação secundária e controles.
- Navegue até Configurações () na barra de navegação à esquerda do portal da Base de Conhecimento.
- No painel de navegação esquerdo, navegue até Site da base de conhecimento } > Personalização do site.
- Na seção Fontes , selecione sua fonte preferida no menu suspenso da fonte do Site .
- Clique em Salvar.
Para mais informações sobre como mudanças de fontes em nível de projeto afetam artigos existentes, fontes obsoletas e métodos de gerenciamento de fontes, veja Gerenciar fontes em sua base de conhecimento.
Fonte personalizada
Se as opções de fonte embutidas não combinarem com sua marca, você pode configurar uma fonte personalizada para o site da sua base de conhecimento. Para um guia passo a passo, veja Como configurar uma fonte personalizada na base de conhecimento.
Melhores práticas
- Ative o contraste automático WCAG se a conformidade com acessibilidade for importante para seu público – isso elimina a dúvida de verificar manualmente as razões de contraste para cada combinação de cores.
- Defina a cor da sua marca primeiro antes de configurar as cores dos hiperlinks – se você planeja usar a cor da marca para hiperlinks, a configuração da cor da marca deve ser salva primeiro.
- Teste os modos claro e escuro após fazer mudanças de cor – uma cor de marca que fica boa no modo claro pode ter baixo contraste no modo escuro. Use a prévia do site para conferir ambos.
- Use o pareamento de fontes de artigos para legibilidade – escolha um par onde a fonte do título seja distinta da fonte do corpo para criar uma hierarquia visual clara.
- Evite mudanças frequentes de fonte – trocar de fonte após a publicação do conteúdo pode afetar a forma como os artigos existentes são renderizados, especialmente se estilos personalizados já foram aplicados no nível do artigo.