O princípio de "ser saudado por roupas" é válido não só para as pessoas, mas também para os sites. O vestido do site é o seu design. E é o design que determina a impressão que o visitante tem nos primeiros segundos de visualização do recurso. Essa impressão é especialmente importante porque determina seu comportamento futuro. O primeiro elemento de design que todo usuário que visita o site vê é o seu "cabeçalho". O limite é a cara do recurso da web. Portanto, todo web designer novato deseja, antes de tudo, aprender a criar cabeçalhos para sites.
Necessário
- - acesso à internet;
- - navegador moderno;
- - editor de gráficos raster (GIMP, Photoshop);
- - opcional: editor de gráficos vetoriais (CorelDraw);
- - opcional: ambiente de modelagem 3D (Blender, 3DStudio);
- - opcional: folha de papel, lápis ou caneta.
Instruções
Passo 1
Desenvolva um conceito para o futuro cabeçalho do site. Idealmente, o conceito deve ser baseado na ideia original. Quando faltam ideias, a inspiração pode ser obtida analisando as boas soluções existentes. Reflita o resultado da pesquisa criativa na forma de um esboço em um pedaço de papel. O esboço deve refletir a estrutura do futuro cabeçalho do site com a indicação de locais "emborrachados" e áreas preenchidas com imagens. Nesse estágio, é uma boa ideia pensar em um esquema de cores aproximado para o design do cabeçalho.
Passo 2
Selecione o tamanho do cabeçalho. Na verdade, vale a pena definir claramente apenas um de seus parâmetros - a altura. Como regra, a altura dos cabeçalhos do site é fixa e não depende da resolução lógica que afeta os parâmetros de exibição das fontes. Em outras palavras, você deve escolher um valor para a altura do cabeçalho em pixels. Nesse caso, faz sentido levar em consideração a possibilidade de colocar banners ou blocos de publicidade contextual no cabeçalho. No que diz respeito à largura, deve-se determinar o valor mínimo, destacando pelo menos uma área "emborrachada" que permite que o cabeçalho se adapte aos diferentes tamanhos da página web.
etapa 3
Crie um modelo de cabeçalho em um editor gráfico. Em um novo documento, adicione uma camada transparente para a qual você arrastará o esboço de acordo com os parâmetros geométricos selecionados. A altura da camada deve corresponder à altura do cabeçalho. A largura pode ser considerada arbitrária, mas maior do que o tamanho mínimo, deixando espaço para áreas horizontais de “borracha”.”No modelo, designe zonas de tamanhos fixos e variáveis, zonas destinadas a serem preenchidas com imagens estáticas, imagens de fundo.
Passo 4
Pesquise ou crie imagens estáticas para colocar em seu modelo de cabeçalho. O logotipo e alguns elementos exclusivos podem ser criados em um editor de vetor ou ambiente de modelagem 3D. É muito fácil encontrar imagens temáticas em bancos de fotos gratuitos na Internet.
Etapa 5
Insira o plano de fundo, o logotipo e as imagens estáticas no modelo de cabeçalho do site em um editor gráfico. Adicione o fundo e cada imagem a uma camada transparente separada. Organize as camadas da melhor maneira. Ao mover as imagens em camadas, consegue seu layout perfeito, correspondendo ao modelo criado anteriormente.
Etapa 6
Salve a imagem de cabeçalho resultante. Salve o projeto de trabalho no formato nativo do editor gráfico. Em seguida, salve a imagem de cabeçalho achatada em um formato sem perdas (por exemplo, PNG).
Etapa 7
Crie um modelo de cabeçalho HTML, se necessário. Abra a imagem achatada no editor. Corte imagens dele que correspondam a áreas de tamanho fixo. Dos locais correspondentes às áreas "emborrachadas", recorte as imagens de 1 pixel de largura. Salve todas as imagens no disco. Faça o layout do cabeçalho HTML usando as imagens salvas.