Posicionamiento HTML - CSS

Esquema absoluto: position

La propiedad position establece el esquema de posicionamiento absoluto de un elemento. Existen cuatro tipos en el esquema de posicionamiento absoluto:

• static: posicionamiento absoluto estático
• relative: posicionamiento absoluto relativo
• fixed: posicionamiento absoluto fijo
• absolute: posicionamiento absoluto absoluto

Para los que no son expertos en CSS, muchas veces es un misterio el modo en que funciona la propiedad z-index. Pero lo cierto es que es bastante utilizada y nos permite corregir rápidamente algún detalle o problema de ubicación de los elementos, trabajando en conjunto con la archiconocida float.

Para arrojar un poco de luz sobre el asunto te propongo conocer las funciones básicas de z-index y probar una demo online interactiva donde cada cambio que vas realizando en los valores se muestra automáticamente.

Las reglas básicas de z-index:

• Un contenedor está apilado al mismo nivel que su objeto “padre” a menos que esto se modifique mediante la propiedad z-index.
• z-index sólo funciona con objetos que tengan la propiedad position seteada como relative, fixed o absolute.
• Asignar un valor de opacidad menor que 1 a un elemento posicionado genera implícitamente un contexto de apilamiento, lo que equivale a usar z-index.

Creación de retículas en indesign

Antes de empezar a maquetar, en primer lugar debemos definir el documento. Para definir un documento, lo primero que debemos hacer es definir el área sobre la cual se desarrollará el trabajo (el papel).

Exiten dos carecterísticas muy impotantes sobre el papel: la primera es el tamaño y la segunda la orientación. Este puede ser horizontal o vertical y el tamaño puede cambiar entre diversas medidas, siendo la más corriente y habitual la DIN A4.

Para maquetar los documentos, los profesionales usan dos herramientas, muy útiles para ellos: el programa QuarkXpress y Adobe InDesign.

Todos los trabajos de maquetación, deben llevar una guía a través de una estructura estudiada y de tamaños fijos. Para ello usamos, la retícula compositiva, que consiste en una guía en los elementos de la maquetación en papel, con la finalidad de conseguir, un orden y estética. Las retículas se subdividen a su vez en superficies bidimensionales o tridimensionales, en campos más pequeños en forma de una reja.

La retícula compositiva, se puede definir como una plantilla, muy útil, cuando necesitamos componer un documento con muchas páginas , que tenga un orden, que sea claro y legible.

Retícula de Manuscrito:
Estructura de base rectangular, ocupa la mayorparte de una página.Acoge textos largos y continuos, tiene unaestructura principal (margen y texto) yestructuras secundarias que se definen otrosdetalles como folio, título de capítulo, notas depie, numeración, etc. 

Retícula de Columnas:
Sirve cuando se presenta información discontinua,así se disponen entre columnas verticales, es decarácter flexible y se utiliza para separar diversostipos información, por ejemplo: columnas paratexto y otras para imágenes.

Retícula Modular:
Sirve para proyectos complejos. Los módulos pueden ser verticales u horizontales dependiendode la organización de las imágenes.Retículas que sirven para diagramar periódicos,sistemas de diseño de información tabulada comocuadros, formularios, programaciones, etc. 

Retícula Jerárquica:
Esta rompe con todos los esquemas anteriores, yaque esta basada en suposición intuitiva dealineaciones relacionadas a las proporciones de los elementos.

Proyecto Gutenberg

El Proyecto Gutenberg (PG) fue desarrollado por Michael Hart en 1971 con el fin de crear una biblioteca de libros electrónicos gratuitos a partir de libros que ya existen físicamente. Estos libros electrónicos se encuentran disponibles desde entonces en Internet.

Los textos que se proporcionan son principalmente de dominio público, bien porque se obtuvo la autorización del autor o titular de los derechos de autor, bien porque éstos derechos ya han expirado y la obra se encuentra en Dominio público. También hay algunos textos bajo derechos de autor que el Proyecto Gutenberg ha hecho disponibles con el permiso de sus escritores. Al proyecto se le puso el nombre del impresor alemán del siglo XV Johannes Gutenberg, quien inventó la imprenta de tipos móviles. En noviembre de 2009 el Proyecto Gutenberg tenía casi 30.000 libros en su colección, de ellos 267 en español. En portugués había 364, en inglés 25496, y en francés 1496.

Empaquetar con indesign

El empaquetado es el último paso para enviar nuestros proyectos a impresión, garantizando que todos sus recursos estén incluidos, listos para procesarse.

El empaquetado nos permite guardar en una sola carpeta todo lo que estamos requiriendo en nuestro proyecto. Para empaquetar tenemos que ir a archivo, empaquetar, o con el atajo de teclado Alt+May+Ctrl+P o Comand+Shift+Option P en Mac.

Creación de tablas

Quizá uno de los elementos de presentación de datos más comunes es las páginas web sea la tabla, que nos ayuda a organizar la información cómodamente en filas y columnas, mejorando notablemente el aspecto visual de la misma.

Sin embargo, la utilidad de las tablas HTML va mucho más allá de la simple presentación ordenada de la información. El lenguaje HTML tiene enormes carencias en lo que a maqetación de los elementos de una página se refiere (posicionamiento de imágenes, márgenes, alineación del texto...). Los diseñadores han suplido tradicionalmente estas deficiencias utilizando tablas de forma profusa.

Si queremos que nuestra tabla nos ocupe todo el ancho de nuestra página web tenemos que crearla al 100% de la pagina.

CSS Zen Garden

El Jardín Zen CSS es un recurso Web de diseño. El objetivo del sitio es mostrar las posibilidades del diseño basado en CSS. Se utilizan hojas de estilo contribuídas por diseñadores gráficos de todo el mundo para cambiar la presentación visual de un único archivo HTML, produciendo cientos de diseños diferentes. Aparte de la referencia a un archivo CSS externo, el código HTML en sí mismo nunca cambia. Todas las diferencias visuales son el resultado del CSS y el conjunto de imágenes que soportan el diseño. El sitio se ha traducido a múltiples idiomas.

Cuando se lanzó en Abril del 2003 contenía sólo cinco diseños.

En Febrero del 2005 se publicó El Zen del diseño CSS por el creador del Jardín Zen CSS Dave Shea y el diseñador web Molly Holzschlag. El libro se basa en 36 diseños destacados del sitio del Jardín Zen.