En el siguiente tutorial hablaremos de Blueprint el cual es un complemento para desarrolladores de webs que aumentará la productividad en las tareas de diseño y maquetación de páginas. Se trata de una serie de librerías de Hojas de Estilo en Cascada que contienen código útil para maquetar una página web y aplicar otros tipos de estilos tipográficos o de impresión, algo que comúnmente conocemos como Framework CSS.
Este sistema nos ofrece una serie de archivos con código CSS que podremos incluir en las páginas web para aplicar estilos de una manera rápida, y solucionar también muchos de los problemas de compatibilidad entre navegadores que pueden surgir durante la etapa de maquetación.
Existen diversos Framework CSS que están disponibles de manera gratuita en Internet, creados por varios desarrolladores distintos. Blueprint es quizás el más conocido, o almenos uno de los más populares y prueba de ello es que se han creado incluso algunas variantes o productos derivados para ajustar Blueprint a las distintas necesidades de los desarrolladores.
Nota: Otro de los Frameworks CSS que tenemos bien documentado en DesarrolloWeb.com es 960 Grid System, del que podemos encontrar un manual amplio y un ejemplo completo de maquetación CSS en vídeo.
Qué es un Framework CSS
Quizás convendría definir qué se conoce como framework CSS. Pues simplemente se trata de una serie de declaraciones de estilos definidos de forma estándar para que sirvan como base para el diseño de todo tipo de webs. Por decirlo de otra manera, es un poco de código CSS que se podría considerar útil para desarrollar cualquier tipo de web y que se pone a disposición para solucionar diversos problemas o situaciones, comunes en el desarrollo de webs.
Cada framework CSS, aunque quizás deberíamos llamarles simplemente "Librerías CSS", tiene su propia filosofía a la hora de crear el código para solucionar esos problemas. Algunas veces las formas de actuar son similares y otras veces distintas, por ello el uso o no de los frameworks CSS, así como la elección del mismo es una decisión muy particular de cada programador o desarrollador web.
Existe además una discusión sobre si es o no conveniente el uso de Frameworks CSS, pero es un asunto donde no vamos a entrar en este artículo. Simplemente queremos contaros cómo funciona Blueprint y cada persona podrá elegir o no usarlo.
Características de Blueprint
El framework CSS Blueprint está creado sobre una sólida base de código CSS que ayudará a desarrollar el diseño y maquetación de sitios web. Entre las cosas que nos aporta podemos destacar:
- Una rejilla, que nos permitirá crear cualquier estructura de página web. Básicamente se trata de un conjunto de clases CSS para posicionar cualquier elemento en un espacio de 950 píxeles de anchura, dividido en 24 columnas.
- Una definición de tipografía predeterminada, de manera precisa para todos los elementos de la página que pueden tener texto.
- Estilos para formularios, con los que mejorar las interfaces de usuario.
- Estilos para impresión, con las definiciones CSS más útiles para que las páginas se lean bien cuando se imprimen en papel.
- Estilos específicos para IE, con los que resolver algunos de los problemas más comunes de Internet Explorer.
Con todo esto conseguimos una base con la que comenzar fácilmente a hacer páginas web complejas y que serán más compatibles en distintos navegadores. Además, Blueprint se completa con algunos plugins creados por terceras personas que sirven para hacer cosas más avanzadas o diferentes. Por ejemplo hay plugins para conseguir iconos, para hacer páginas fluidas (que se adaptan a la anchura de la ventana del navegador), etc.
Para comenzar a usar Blueprint tenemos que acceder a su página web y descargarlo, a través de su página web:
En los siguientes artículos del Manual de Blueprint te explicaremos todo lo que tienes que conocer para comenzar con buen pie y que te sea muy sencillo adaptarte al framework CSS.
Fuente:enlace
Si quieres seguir aprendiendo con nosotros, puedes ingresar a nuestros
Cursos y Diplomados de Tecnología Web visita www.uneweb.edu.ve para más información
No hay comentarios:
Publicar un comentario