Category Archives: HTML y CSS

Entendiendo el funcionamiento de “z-index” en CSS

Interesante artículo, con su página de demostración, que explica qué es y como funciona la

propiedad "z-index" en el CSS. Según el artículo, estas son las reglas de oro aplicables a esta propiedad:

  • A box is at the

    same stack level as its parent’s unless it is given a different stack level through the ‘z-index’ property.

  • z-index applies only to objects that have the position property set to relative,

    fixed or absolute.

  • Assigning an opacity value less than 1 to a positioned element implicitly creates a stacking context, just like adding a z-index value.

For a positioned

box, the z-index property specifies:

  1. The stack level of the box in the current stacking context.
  2. Whether the box establishes a local stacking

    context.

If there is no z-index specified, elements are stacked in the following order (from back to front):

  1. boxes in the normal flow, according to the sequence in

    the source code

  2. floating boxes
  3. positioned boxes, according to the sequence in the source code

Artículo completo: http://tjkdesign.com/
Demo: Understanding z-index

Notas acerca de HTML y su correcta visualización en e-mails

Cada vez es más popular el envío masivo de correo electrónico por parte empresas, particulares y

cualquier de nosotros que quisiera llegar a un público específico o a la mayor cantidad de gente en general.

Esta labor podría sonar bastante simple, contando con

herramientas estándar como el Outlook o Mail (Mac) o cualquier otro cliente de mail que utilicemos y contando con una base de datos de personas a las que querramos llegar. Copiar y pegar las

direcciones en el BCC, copiar y pegar el contenido que queremos incluir en el e-mail, agregar un "subject" vendedor y enviar!

Pero, quién nos garantiza que lo que

enviamos se verá igual en las pantallas de todos nuestros recipientes? Habiendo hoy en día una cantidad moderadamente grande de servicios de e-mail gratuito, clientes de mail, etc

(refiriéndonos a los más utilizados, como Gmail, Hotmail, Yahoo, etc.).

Pues nada nos garantiza ese desplegado impecable y sin errores en la bandeja de entrada de quien

recibe nuestro e-mail. A menos que tomemos una serie de precauciones y recomendaciones al momento de crear el contenido a enviar.

Aquí algunos sitios con información muy

útil acerca de cómo lograr los mejores resultados con envíos masivos de e-mail:
Continue reading Notas acerca de HTML y su correcta visualización en e-mails

125 “snippets” útiles para desarrollo web

Empezemos por definir qué es un "snippet",

"A small amount

of something. In the computer field, it often refers to a small piece of program code." (Una pequeña cantidad de algo. En el mundo computacional, se refiere normalmente a un pequeño

pedazo de código.) PCMagazine

Este listado es una

compilación de una gran cantidad de pedazos útiles de código para usar directamente en un sitio.

Ver listado en: http://www.paulspoerry.com/

Interesante técnica para armar layouts con precisión

La

técnica consiste básicamente en utilizar una imagen de fondo temporal con el diseño (layout) del sitio, al momento de armar el HTML/CSS del mismo.

Esta imagen se

convertirá en una guía visual para posicionar y dimensionar con precisión los elementos de nuestro sitio.

Ver artículo y ejemplos en:

55 buenas razones para usar estándares de HTML y CSS

Buenas razones para escribir en XHTML y CSS al momento de armar un sitio web.

  1. You can get free links from showcase sites like zengarden, stylegala, cssimport or cssbeauty
  2. You don’t have to spend extra thought and time deciding on styling the mark up of

    your document (upper- or lowercase, quotes or no quotes on attributes)

  3. You don’t need to spend extra thought on which tags should be closed and which can (or should) be left

    open

  4. You “help” the search engines to deliver more relevant content using semantic markup
  5. You can save in bandwidth costs and visitors will see them

    faster by making slimmer pages

  6. It’s going to be easier for you to switch to XHTML 2.0 which will give you more semantic tools
  7. Once you’ve practised enough,

    coding pages becomes a whole lot simpler and faster than any table/tr/td tagsoup

  8. When the coding is faster you can spend more time on thinking about the user experience
  9. Thinking about semantics of a document helps you to make design and information architecture decisions
  10. You can quickly make a dummy site to test your sites information architecture

    and append a look and feel later with only minor code changes
    ….

Artículo completo en: http://www.programimi.com/