Dicas sobre Sites

  • O conteúdo é o mais importante de uma página/site, mas um design agradável e uma navegação amigável são importantes também
  • Menu de topo, em todas as páginas e fixo
  • Ter uma página inicial bonita e com link para as demais, mesmo que em landing page
  • Em landing pages os links do menu levam a IDs
  • Muito importante aumentar a área clicável dos links, para assim facilitar a vida do visitante
  • O menu de topo fica mais bonito se tiver uma altura que seja mais que apenas para caber os itens.
  • A página inicial, que não precisa conter conteúdo, apenans a logomarca, o menu e um botão que alternativamente irá chamar os itens da landing page
  • Usar caracteres unicode (https://www.w3schools.com/charsets/ref_utf_symbols.asp) ou icon fonts (https://icofont.com/), tornam o site mais leve. Neste caso os ícones devem acompanhar as cores do tema. Exemplo:
    https://bootstrapmade.com/bizpage-bootstrap-business-template/
  • Preocupe-se com o conforto do usuário ao visitar o site: site leve, fontes agradáveis e com tamanho para leitura confortável, bonitas imagens, cores com tons em um tema suave, etc.
  • Rodapé bonito, alto e dividido em 3 ou 4 partes, conendo vários links tipo um mapa do site, como este:
    https://bootstrapmade.com/bizpage-bootstrap-business-template/
  • Cuidado com os menus drop down na direita da página, para que não abram novos links para a direita, escondendo todo ou parte. Se estiver a direita os novos devem abrir para a esquerda, como este:
    https://bootstrapmade.com/free-one-page-bootstrap-template-amoeba/<br>
  • Existem bonitos, responsivos e modernos tempaltes free em HTML 5, Bootstrap e noutro. Exemplo:
    https://bootstrapmade.com/<br>
  • Quando usar um dos templates acima, na customização elimine os arquivos que não vá usar e limpe o código de acordo. Quanto mais ensutas suas páginas mais lve será para os visitantes.
  • Caso use um slide show evite que ele comece a rolar automaticamente. Deve rolar apenas quando se clica nos botões. Exemplo
    https://bootstrapmade.com/bizpage-bootstrap-business-template/
  • A página inicial não deve ser menor nem maior que a tela do computador do visitante. Exemplo:
    https://jsfiddle.net/aslancods/mW9WF/
  • Um botão no rodapé e em outras regiões para voltar ao topo ajuda
    https://www.w3schools.com/howto/tryit.asp?filename=tryhow_js_scroll_to_top
  • Uma boa ideia é oferecer no rodapé de cada artigos links de artigos relacionados e com imagens representativas e boa descrição, em fontes grandes não somente links. Para isso dividir a tela em duas partes e em cada lado aparecer um. Assim:
    https://walmarandrade.com.br/checklist/
  • Ícones das redes sociais com links para compartilhar a página atual, assim como seção de contato