Como construir um Plano de HTML5 e CSS3 site

Muitas vezes, o trabalho inicial em um importante local envolve a criação de um plano para o design do site HTML5 e CSS3. Fazendo isso passo inicial ajuda a ver o verdadeiro escopo do projeto. UMA o mapa

é uma visão geral de um site. Normalmente, ele é desenhado como um gráfico de hierarquia.

Imagine que você está convidado para ajudar a criar um site para um departamento acadêmico em uma grande universidade. A primeira pergunta é, # 147-O que você quer no site? # 148- Anote tudo.

image0.jpg

Pergunte ao seu cliente o que eles querem. Depois de todos os participantes sugerem tudo o que eles pensam que o seu site precisa, espantar-los para fora da sala. Usando apenas papel e lápis, criar um esboço mais organizada com base em como você acha que a informação deve ser organizada.

image1.jpg

Como criar uma visão local

Manter estas sugestões em mente ao criar um diagrama de site de visão geral:

  • Use a Lei de Sete. Esta lei sugere que as pessoas geralmente não podem lidar com mais de sete opções de cada vez. Tente não ter mais de sete segmentos principais de informação em qualquer nível. Cada um destes pode ser separada em tantos quanto sete pedaços, e cada um deles pode ter sete pedaços.

  • Identificar pontos em comum. Enquanto você olhar sobre os dados, agrupamentos gerais emergir. No exemplo universidade, você poderia facilmente ver que você tinha um monte de dados do curso, informações grau, informações sobre corpo docente e de investigação.

  • Tentar atribuir cada tópico para um grupo. Esta é uma forma de normalização de dados Aqui. Esta estrutura de dados não é necessariamente um formal de um, mas poderia ser.

  • Organizar uma hierarquia. Grupo dos temas de mais geral ao mais específico. Por exemplo, o termo Informação curso é muito amplo. N100 é um curso específico, e pode ter muitas seções (data, hora e combinações instrutor). Assim, faz sentido para as seções de grupo sob N100 e N100 grupo em cursos.

  • Fornecer dados representativos. Não é necessário cada migalha de informação aqui. O ponto é ter dados suficientes para que você possa ver os relacionamentos entre os dados.

  • Tenha em mente que este diagrama faz não representar o design do site. O objectivo deste tipo de diagrama é para ver como os dados propriamente ditos se encaixa. Claro, este diagrama tende a informar a configuração de página e estrutura do menu, mas não precisa.

  • Não cada caixa é uma página. Pode ser, mas não tem que ser. Mais tarde no processo, você pode decidir como organizar as partes do site.

Construir esse tipo de diagrama de site é absolutamente crítico para locais maiores, ou então você nunca realmente compreender o escopo do projeto. Tem as principais partes interessadas olhar sobre ele para ver se ele reflete com precisão a em formação você está tentando transmitir.

Como construir o diagrama local

O diagrama site é uma versão mais específica do panorama site. Neste ponto, você faz um compromisso sobre as páginas específicas que você quer no sistema e sua relação organizacional.

image2.jpg

O diagrama site é um pouco diferente da visão geral por estas razões:

  • Cada caixa representa uma página. Agora você tem que tomar algumas decisões sobre como as páginas são organizadas. Determinar em que nível da visão geral que você tem páginas separadas. Por exemplo, são todas as seções do curso em uma página, ou todas as seções do N100? Será que cada seção de cada curso tem uma página diferente? Estas decisões irão ajudá-lo a determinar quais tecnologias usar na construção da página.

  • O diagrama site ainda não precisa de todas as páginas. Se você tem 30 classes, você não precisa dar conta de cada um, se você sabe onde eles vão e todos eles têm o mesmo propósito geral e design.

  • A estrutura de navegação deve ser clara. A hierarquia deve dar-lhe uma estrutura de navegação clara. (É claro que você pode, e muitas vezes deve, adicionar uma estrutura de navegação secundário).

  • Nome de cada caixa. Cada página deve ter um nome. Estes nomes de caixa de traduzir para títulos de página e ajudá-lo a formar um sistema unificado título. Este arranjo é útil para o seu esquema de navegação.

  • Identificar layout geral de cada caixa. Geralmente, um site usa apenas alguns layouts. Você tem um layout padrão para a maioria das páginas. Muitas vezes, a primeira página tem um layout diferente (para notícias e informações de navegação). Você pode ter layouts especiais, também. Por exemplo, as páginas da faculdade todos apresentam uma disposição específica com uma imagem proeminente. Não planejar o layout aqui - apenas identificá-lo.

  • Resolver a ordem. Se a ordem das páginas importa, o diagrama site é o lugar para trabalhar com isso.

A meta para esta parte do processo local de planejamento é ter uma compreensão clara do que cada página requer. Esta informação deve tornar mais fácil para você completar os dados e as etapas de design visual. O diagrama site é um documento absolutamente crítico. Depois de tê-lo aprovado, imprimi-lo e gravá-lo no seu monitor. É seu mapa para o restante do projeto.

menu