Guías
CategoríaGuías y ayuda que te ayudará a entender mejor los estilos.
El dilema: ¿Webs compatibles con todos lo navegadores?
Desde siempre todos los diseñadores en algún momento de su vida han tenido que plantearse alguna de estas preguntas ¿Tiene que ser el diseño adaptable a todos los navegadores? ¿Puedo obviar el que parece un navegador obsoleto (IE)? Yo quiero hacer un montón de efectos con css pero en algún navegador no irá ¿Que hago? … Lee más!
¿Cómo ve un usuario la web? La ‘L’ visual
Hay gente que piensa que para diseñar lo más importante es crear un diseño bonito, unos colores que impacten, un menú increíble, etc. Realmente está comprobado que un usuario que no conoce nuestra web y es la primera vez que entra está una media de 15 segundos, cómo mucho medio o un minuto hasta decidir … Lee más!
Empezando con el diseño de una web
Uno de los problemas con los que nos encontramos cualquier diseñador web es el principio del diseño, ¿Por dónde empiezo?, ¿Que colores uso?, ¿Cómo lo estructuro?, etc. Estos son los aspectos con los que yo os recomiendo que podéis empezar para plantearos el diseño de vuestra web: 1) ¿Lo estás haciendo a un cliente? Si … Lee más!
6 guías de tipografías muy útiles
Todo el mundo que tenga un sitio web debe saber unos mínimos acerca de la tipografía, uno de los aspectos más importantes del diseño web. Hace unos días publiqué un artículo sobre cómo elegir correctamente tu tipografía, pero, no está mal complementarlo con esta entrada. Aquí, se muestran varias ayudas y guías acerca de las … Lee más!
Cómo elegir la mejor tipografía para tu diseño
Existen una lista interminable de tipografías, pero sólo unas cuantas encajarán con el estilo que tenemos en el sitio web. Desde aquí os mostraré algunos puntos que os pueden resultar útiles para distinguir entre una tipografía aceptable y otra que no es buena para nuestro sitio. En las tipografías para títulos, se podrían seguir estos … Lee más!
CSS Shorthand: La regla del reloj
Cuando empezamos con CSS, tendemos a poner las propiedades así: margin-top: 1px; margin-right: 1px; margin-bottom: 1px; margin-left: 1px; Pero, podemos agrupar todos estos valores en una sola propiedad, esto se suele llamar shorthand – Podéis ver esta guía para recordar valores en CSS Shorthand -. En el ejemplo anterior, quedaría así: margin: 1px 1px 1px … Lee más!
CSS: position, propiedad
La propiedad position, como su nombre indica, sirve para establecer la posición de un elemento. Su valor por defecto es static (sin posición). Es soportada en todos los navegadores (Cabe destacar que en todas las versiones de IE, incluyendo la 8, no soporta el valor inherit). A continuación mostraremos un ejemplo, los valores de la … Lee más!
Ventajas e inconvenientes al usar CSS
Aunque las hojas de estilo (CSS) tienen muchas ventajas, también tienen algunos inconvenientes. En esta entrada os expongo algunas ventajas e inconvenientes que pueden tener las hojas de estilo: Ventajas – Se obtiene un mayor control de la presentación del sitio al poder tener todo el código CSS reunido en uno, lo que facilita su … Lee más!
Repetir fondo con CSS
Repetir un fondo con CSS es muy básico y efectivo para ahorrarnos KB al tener una única imagen minúscula que se repite por toda la pantalla y así, acelerar la carga de la página. Por ejemplo, en CSSBlog hemos usado la imagen de fondo que ahora tenemos. Vamos a repetir esta imagen uniformemente por toda … Lee más!
@font-face, inserta cualquier tipografía en tu sitio web
Existen una lista de tipografías estándares que todos los navegadores pueden interpretar, pero, ¿qué ocurre con las demás tipografías? ¿Cómo podemos implementarlas? @font-face es una propiedad muy útil para definir en un sitio web una fuente que el usuario no tenga instalada en su ordenador. Sólo debemos subir la fuente deseada a nuestro sitio web … Lee más!
CSS: Text-shadow, propiedad
La propiedad text-shadow permite crear sombra en el texto, pudiendo variar las posiciones de esta y el color de la sombra. Suele usarse en encabezados y títulos que deseen resaltarse, pero no se debe abusar de ella (Un ejemplo incorrecto sería usar esta sombra los párrafos). Solo navegadores basados en Webkit, como Safari o Konqueror, … Lee más!
CSS: Box-shadow, propiedad
Añadir sombra una caja de texto sigue el mismo formato que añadir sombra en el texto, y para ello se utiliza la propiedad Box-shadow. Box-shadow es compatible con Safari 4, Firefox 3 y Chrome 1. El código en CSS3 puro sería así: box-shadow: x y blur color; Pero, como ocurre con la propiedad text-shadow, Mozilla … Lee más!
