Com o que seu site vai parecer? discute o planejamento e design que você tem que fazer para seu site antes de escrever o código, incluindo "Quais informações meu site vai oferecer?" "Quais fontes e cores eu quero?" "O que meu site faz?"
Primeiro, as primeiras coisas: planejamento
Antes que você faça qualquer coisa, você precisa de algumas ideias. O que seu site realmente vai fazer? Um site pode fazer praticamente tudo, mas primeiro você deve manter as coisas em um nível simples. Nós vamos começar criando um site simples com um cabeçalho, uma imagem e alguns parágrafos.
Para começar, você deve responder às seguintes questões:
- Sobre o que é seu site? Você gosta de cachorros, Nova Iorque ou Pacman?
- Qual informação você quer apresentar dentro do seu assunto? Escreva um título e alguns parágrafos e pense em uma imagem para ilustrar sua página.
- Como seu site deve parecer, em termos simples. Qual é a cor de fundo? Qual é o tipo de fonte apropriado?: formal, desenhado, negrito e gritante, sutil?
Nota: Projetos complexos precisam guias detalhados que abordam todos os detalhes de cores, fontes, espaçamento entre itens de uma página, estilo de escrita apropriado, e por aí vai. Isso é denominado um guia de design ou brand book, e você pode ver um exemplo na Firefox OS Guidelines.
Rascunhando seu design
Agora, pegue papel e caneta e faça um rascunho de como seu site vai parecer. Para seu primeiro site, não há muito o que rascunhar, mas você deve criar o hábito desde o começo. Realmente ajuda -- você não precisa ser um Van Gogh!
Nota: Mesmo em sites reais e complexos, os times de design geralmente começam pelo rascunho em papel e depois constroem a versão digital usando um editor gráfico ou tecnologias web.
Times de web são compostos também de um designer gráfico e um user-experience (UX) designer. Designers gráficos, obviamente, constroem a parte visual do site. UX designers tem uma função de certa forma mais abstrata, ditando como os usuários vão interagir e construir a experiência com o site.
Construindo seus ativos
Nesse ponto, é bom começar juntando o conteúdo que vai aparecer no site.
Texto
Você deve ter seu título e parágrafos desde antes. Mantenha eles por perto.
Cor do tema
Para escolher a cor, vá no the Color Picker e escolha a cor que preferir. Quando escolher a cor, você verá uma sequência de seis caracteres, como #660066. Isso é chamado um código hex(adecimal), e representa sua cor. Copie esse código em algum lugar seguro por enquanto.
Imagens
Para escolher uma imagens, vá no Google Imagens e procure por algo que se encaixe no seu site.
- Quando você achar a imagem que você quer, clique nela.
- Pressione o botão Ver imagem.
- Na próxima página, clique com o botão direito do mouse na imagem (Ctrl + click no Mac), escolha Salvar imagem como, e escolha um lugar seguro para salvar sua imagem. Alternativamente, copie o endereço da imagem para sua barra de endereço, para uso posterior.
Note: Muitas imagens na Web, incluindo no Google Imagens, são copyrighted. Para reduzir suas chances de violação de copyright, use o filtro de licença do Google. Basta 1) clicar em Ferramentas de pesquisa, e em 2) Direitos de uso:
Fonte
Para escolher uma fonte:
- Vá no Google Fonts e role a lista até que você ache uma que você goste. Você também pode usar os controles à esquerda para filtrar os resultados.
- Clique em Add to collection na fonte de sua preferência.
- Clique no Use no fim da página.
- Na próxima página, passe pelas seções 3 e 4, e copie as linhas que o Google te deu para o editor de texto, para ser usado posteriormente.
