Como usar as ferramentas de Design do SitePX

Publicado por Lucia Freitas em 06/02/2012 às 12h32

A primeira dica para usar bem nossas ferramentas é conferir nossos vídeos-tutoriais. Antes de começar a usar. Este tutorial é para aprender a usar melhor as ferramentas de design do SitePX.

Quando você entra na aba design surgem diversos comandos em sua tela. Note, na figura abaixo, que é possível mexer no menu, criar e reorganizar a barra lateral. O pulo do gato é o botão Visualizar (em cima, à direita), que mostra em tempo real tudo o que você fez.

1. Para começar criar site, é preciso escolher um modelo. Temos centenas de modelos prontos que funcionam muito bem. Ao passar o mouse sobre eles, você vê melhor as suas funções e escolhe o que é melhor para o seu negócio.

2. Em seguida, é bacana você personalizar as cores. É possível escolher uma palheta (conjunto) de cores e usar na página como você quiser. Cada elemento pode ser definido a seu gosto: títulos, barras, fundos, texto.

 

Veja que você tem total liberdade para colocar o seu desejo nas fontes, margens, bordas, cantos e sombras... tudo com a cor e o desenho que você escolher.

 

Nas categorias, você define cada detalhe dos módulos que colocar em sua(s) página(s). Crie seu siste como quiser e clique em visualizar e confira o resultado. Não gostou? Descarte! Aprovou? Salve.

Dica preciosa: fundo preto e letra branca dificultam a leitura e costumam afastar o leitor. A velha combinação fundo branco e letra preta é muito bacana para textos.

3. O próximo passo é escolher o desenho das fontes (letras). Note que há três opções básicas: o título do site, os títulos do menu e os textos. Nos modelos, há fontes pré-definidas ? e, sim, você pode mexer o quanto quiser. No estilo e nos tamanhos.

Alguns lembretes importantes para quem nunca “brincou” com fontes:

  • Os tamanhos são definidos em pixels (px). O ideal é que o espaço entre as linhas (espaçamento entrelinhas) seja igual ao tamanho da fonte (1:1).
  • Não escolha fontes muito pequenas (abaixo de 10 px) para os textos ? os olhos de seu cliente vão sofrer.
  • Na internet, as letras sem serifa (sem perninhas) são mais fáceis de ler ? e as serifadas (com perninhas) são muito boas para os títulos. (Eu, pessoalmente, sempre fiz o inverso e funciona também).
  • Evite misturar mais de 3 tipos (nomes) diferentes de fontes ? isso dá um tom de esquizofrenia visual para o site. Escolha letras específicas para títulos e texto e mantenha sempre um padrão.

4. Tudo isso definido, vamos passar às dimensões do site. Nesta sessão você vai definir o tamanho da sua página, seu alinhamento e margens. As configurações são muito simples de fazer. O que você realmente precisa saber é: ele será bem visualizado tanto num iPad quanto num monitor de 25’ (ou mais?). Por isso, a convenção é que se use 960 px de largura nos sites.

5. Se você quiser usar uma imagem de fundo no site - em vez de uma cor sólida - use a aba Fundo. Primeiro é preciso carregar a imagem em seu banco. Depois você escolhe como ela vai ser exibida em repetição, rolagem e posição. Nesta aba, você também define a cor de fundo de cada página do seu site.

6. Pensando em facilitar a vida de nossos clientes, colocamos várias funções bacanas (e fundamentais) na área Módulos. Basta clicar na função que deseja e indicar onde quer que ela seja inserida. E lembre: todos os módulos podem ser rearranjados nas páginas através da função mover. Faremos um post só sobre nossos módulos, para explicar como usar cada uma destas funções, combinado?

7. Por último, mas não menos importante, oferecemos integrações com diversas plataformas. Sabe o blog que você tem lá no Blogger ou no WordPress? Você pode colocar na sua página. A mesma coisa para Facebook, Flickr, Picasa, Twitter e YouTube. Além disso, com o RSS, você pode publicar o conteúdo de outras páginas na sua barra lateral. Para configurar cada um deles, basta clicar em Módulo e fazer as configurações.

 

Em caso de dúvida, lembre: basta entrar em contato com o nosso suporte. Ou deixar um comentário aqui no Blog do SitePx.

Categoria: Tutoriais

voltar para Dicas para criar um site

left show tsN fwR fsN|left tsN b01e fwR bsd show|left fwR tsN show|bnull||image-wrap|news login c05|fsN fwR normalcase tsN|c05|login news fwR normalcase|tsN fwR normalcase|normalcase fwR c05|content-inner||