10 CSS Tips de un profesional Front-End Architect

Tomado de una Conferencia en OSCON (Open Source Convention). El autor de la conferencia es Ryan Parr http://www.parrfolio.com. Esta es la primera entrega de sus consejos para todo novato diseñador:

1. La marca del cliente es importante.

Para ejemplificar la marca visual es la clave. Mantener el logotipo en su conjunto es un ejemplo. Ahora que la base tradicionalse ha ido, podemos mantener la integridad de nuestra presentación en línea imágenes.

2. Mantener todo el contenido de las imágenes.

Las imágenes que residen en el contenido de flujo se debe permitir la estabilidad en esa estructura. Esto incluye el logotipo o cualquier apoyo a las imágenes en el documento. Me gusta mucho hacer clic derecho una imagen, un logotipo especial, y recibir un buen conjunto de PNG transparentes. Decidir desde el principio es perjudicial para el mantenimiento de la integridad del diseño y la marca. Incluso las marcas. Puede que esto no importa a su cliente sino que los asuntos a los colegios de sus empleados o futuros que puedan editar sus documentos.

Cómo es este hecho?. Aprovecha las ventajas de PNG's transparentes. Desde el nacimiento de IE 7 y es la inyección de fluido en la industria, actualmente el 25% del mercado, ahora podemos aprovechar plenamente transparentes PNG's *.

* ¿Qué pasa con el IE 6? Sus técnicas son muchos para aliviar de IE6 es la transparencia de error.

Piense en su composición como capas de Photoshop. Mantener las imágenes en su conjunto le permiten capa de sus imágenes utilizando z-indexación. No hay que olvidar que el motor Trident (IE) cree que el el orden de apilamiento comienza en 0. El motor Gecko comienza en 1. Con cuidado, la organización de su orden de apilamiento le permite realizar un seguimiento de las capas elementales.

3. Ir con la corriente.

Un diseñador sabe qué es lo mejor para el cliente y el usuario y hará que las decisiones concretas sobre la estructura donde se vive, donde el logotipo será, en donde la principal llamada a la acción en vivo, etc Si el logotipo está en la esquina superior izquierda de la competición, también debe vivir en la parte superior de la marcación. Antes de comenzar, revisar la composición y decidir qué imágenes resto en la presentación de CSS y qué imágenes de descanso en la línea en el documento. Es evidente que si la composición muestra el logotipo en la parte inferior debe descansar todavía en la parte superior del documento. Intente y lo mantenga cerca de lo que el diseñador o equipo de proyecto previsto.

4. Complejo diseños en simples secciones.

Considere el valor de cada sección del sitio cuando se trata de complejos diseños. Por ejemplo, cuando se presentó con una columna 3 comp, determinar el valor de cada sección. En caso de que la navegación por debajo del resto logo? ¿Reinado tener contenido sobre todos los demás elementos? Tomando tiempo antes de empezar le ahorrará muchos dolores de cabeza por el camino. Aquí está un ejemplo de sección de pedidos con tres columnas:

1. Logo / Branding
2. Navegación (vertical u horizontal)
3. Contenido principal
4. Contenido Secundaria (lateral y dos o complementaria contenido)
5. Artículos de promoción (anuncios o promociones internas)
6. Pie de página / Copyright

5. Mantenga los contenedores a un mínimo.

Guardar sus documentos resultan muy pesados. Nuevos desarrolladores utilizar muchos div similar a celdas de tabla para alcanzar el diseño. Tome ventaja de los muchos elementos estructurales para lograr el diseño. No añadir más div. Considere todas las opciones antes de añadir nuevos envoltorios (div) para lograr un efecto cuando se usa un poco de excelente CSS usted puede conseguir ese mismo efecto deseado.

No hay comentarios: