¿Cómo construir un plan de html5 y css3 sitio

Video: Como hacer un sitio web / layout responsive con Flexbox CSS3

A menudo, el trabajo inicial en un sitio importante se refiere a la creación de un plan para el diseño del sitio HTML5 y CSS3. Hacer esto paso temprano ayuda a ver el verdadero alcance del proyecto. UN plan de sitio es una visión general de un sitio web. Normalmente, se dibuja como una tabla de jerarquía.

Imagínese que se le pide que ayudar a diseñar un sitio web para un departamento académico en una universidad importante. La primera pregunta es: “¿Qué desea en el sitio web?” Anote todo.

Pregunte a su cliente lo que quieren. Después de todos los participantes sugieren todo lo que piensan que su sitio necesita, espantar a salir de la habitación. Utilizando sólo papel y lápiz, cree un boceto más organizada sobre la base de cómo cree que la información debe ser organizada.

Video: 15 Веб|дизайн | Макеты

Cómo crear un sitio de información general

Mantener estas sugerencias en cuenta al crear un diagrama general del sitio:

Usar la Ley del Siete. Esta ley indica que las personas generalmente no pueden manejar más de siete opciones a la vez. Trate de no tener más de siete segmentos principales de información en cualquier nivel. Cada uno de estos se pueden separar en hasta siete trozos, y cada uno de estos puede tener siete trozos.

  • Identificar puntos en común. Si bien se mira sobre los datos, agrupaciones generales emergen. En el ejemplo de la universidad, se podía ver fácilmente que tenía una gran cantidad de datos del curso, información, información sobre el grado de la facultad, y la investigación.

  • Tratar de asignar a cada tema a un grupo. Esta es una forma de la normalización de datos aquí. Esta estructura de datos no es necesariamente formal, pero que podría ser.

  • Organizar una jerarquía. Grupo de los temas de más general a más específico. Por ejemplo, el término información sobre el curso es muy amplio. N100 es un curso específico, y puede tener muchas secciones (fecha, hora, y combinaciones de instructor). Por lo tanto, tiene sentido que las secciones de grupo bajo N100 y N100 al grupo bajo cursos.

  • Proporcionar datos representativos. No es necesario cada trozo de información aquí. El punto es tener suficientes datos para que pueda ver las relaciones entre los datos.

    Video: Como Hacer un Slider Automatico para tu sitio web ( html,css y js )

  • Tenga en cuenta que este diagrama hace no representar el diseño del sitio. El propósito de este tipo de diagrama es ver cómo los datos en sí encaja. Por supuesto, este diagrama tiende a informar a la configuración de página y la estructura del menú, pero no tiene que hacerlo.

  • No cada caja es una página. Podría ser, pero no tiene que ser. Más adelante en el proceso, puede decidir cómo organizar las partes del sitio.

  • La construcción de este tipo de diagrama de sitio es absolutamente crítico para los sitios de mayor tamaño, o de lo contrario nunca comprender el alcance del proyecto. Tener los principales interesados ​​revisarlo para ver si refleja con precisión el información usted está tratando de transmitir.

    Cómo construir el diagrama de sitio

    El diagrama de sitio es una versión más específica de la vista general del sitio. En este punto, usted hace un compromiso acerca de las páginas en particular que desee en el sistema y su relación con la organización.

    El diagrama de sitio es un poco diferente de la visión general por estas razones:

    • Cada cuadro representa una página. Ahora usted tiene que tomar algunas decisiones sobre cómo se organizan las páginas. Determinar en qué nivel de la visión general que tiene páginas separadas. Por ejemplo, son todas las zonas del recorrido en una página, o todas las secciones de la N100? ¿Cada sección de cada curso tiene una página diferente? Estas decisiones le ayudarán a determinar qué tecnologías a utilizar en la construcción de la página.

    • El diagrama de sitio todavía no tiene por qué cada página. Si usted tiene 30 clases, que no es necesario dar cuenta de cada uno si usted sabe dónde ir y todos ellos tienen el mismo propósito general y el diseño.

    • La estructura de navegación debe ser clara. La jerarquía debe darle una estructura de navegación clara. (Por supuesto, se puede, y con frecuencia deben, añadir una estructura de navegación secundaria).

    • Nombre cada caja. Cada página debe tener un nombre. Estos nombres de cuadros se traducen en los títulos de página y ayudan a formar un sistema unificado título. Esta disposición es útil para su esquema de navegación.

    • Identificar disposición total para cada cuadro. En general, un sitio utiliza sólo unos pocos diseños. Tiene un diseño estándar para la mayoría de las páginas. A menudo, la primera página tiene un diseño diferente (por noticias e información de navegación). Es posible que tenga diseños especiales, también. Por ejemplo, las páginas de la facultad tienen un diseño específico con una imagen destacada. No planificar el diseño aquí - simplemente identificarla.

    • Resolver el pedido. Si el orden de las páginas que importa, el diagrama del lugar es el lugar de resolverlo.

    El objetivo de esta parte del proceso de planificación del sitio es tener una comprensión clara de lo que cada página requiere. Esta información debería hacer más fácil para usted para completar los datos y medidas de diseño visual. El diagrama de sitio es un documento absolutamente crítico. Después de lograr su aprobación, imprimirlo y la cinta a su monitor. Es su mapa para el resto del proyecto.

    Artículos Relacionados