domingo, 26 de septiembre de 2010

Qué son las CSS y cuales son sus ventajas?

CSS son las siglas de Cascading Style Sheets - Hojas de Estilo en Cascada - que es un lenguaje que describe la presentación de los documentos estructurados en hojas de estilo para diferentes métodos de interpretación, es decir, describe como se va a mostrar un documento en pantalla.



¿Para que sirve?
CSS es una especificación desarrollada por el W3C (World Wide Web Consortium) para permitir la separación de los contenidos de los documentos escritos en HTML, XML, XHTML, SVG, o XUL de la presentacin del documento con las hojas de estilo, incluyendo elementos tales como los colores, fondos, márgenes, bordes, tipos de letra..., modificando la apariencia de una página web de una forma más sencilla, permitiendo a los desarrolladores controlar el estilo y formato de sus documentos.

¿Cómo funciona?

El lenguaje CSS se basa en una serie de reglas que rigen el estilo de los elementos en los documentos estructurados, y que forman la sintaxis de las hojas de estilo. Cada regla consiste en un selector y una declaración, esta última va entre corchetes y consiste en una propiedad o atributo, y un valor separados por dos puntos.

Ventajas de CSS

  • La principal ventaja de CSS sobre el lenguaje HTML o similar, es que el estilo se puede guardar completamente por separado del contenido siendo posible, por ejemplo, almacenar todos los estilos de presentación para una web de 10.000 páginas en un sólo archivo de CSS.CSS permite un mejor control en la presentación de un sitio web que los elementos de HTML, agilizando su actualización.
  • Aumento de la accesibilidad de los usuarios gracias a que pueden especificar su propia hoja de estilo, permitiéndoles modificar el formato de un sitio web según sus necesidades, de manera que por ejemplo, personas con deficiencias visuales puedan configurar su propia hoja de estilo para aumentar el tamaño del texto.
  • El ahorro global en el ancho de banda es notable, ya que la hoja de estilo se almacena en cache después de la primera solicitud y se puede volver a usar para cada página del sitio, no se tiene que descargar con cada página web. Por otro lado, quitando todo lenguaje de marcado en la presentación en favor del uso de CSS reduce su tamaño y ancho de banda hasta más del 50%, esto beneficia al dueño del sitio web con menos ancho de banda y costes de almacenamiento, as como a los visitantes para los cuales las páginas se van a cargar más rápido.
  • Una página puede tener diferentes hojas de estilo para mostrarse en diferentes dispositivos, como pueden ser impresoras, lectores de voz, o móviles.

domingo, 12 de septiembre de 2010

Widgets en Dreamweaver CS5

En Dreamweaver hay una herramienta muy util que son los widgets, son componentes para la interfaz de usuario. Pero estos en especial ya han sido creados y son compartidos por algunos usuarios de la suite de adobe.

La guia de utilización de un widget es la siguiente:


1. Creamos una pagina base en dreamweaver.











http://tinyurl.com/3yh74jr

2. Despues nos vamos a este menu de la derecha y ahi le damos click al boton widget browser.





http://tinyurl.com/3xqzkzp

3. Luego en el menu de los widgets escogemos uno. (Nota: Si no tienes el widget search instalado, lo instalas).









http://tinyurl.com/2da9gry

4. En mi caso escogi jSocial.






http://tinyurl.com/2c2duns

5. Despues le das click en la parte inferior derecha, para agregar este widget a "Mis widgets". (Nota: Para tener "Mis widgets" tienes que ser usuario de la pagina www.adobe.com)







http://tinyurl.com/33ulyh3

6. Ya entre mis widgets, puedo modificarlo. Este tiene previsualizacion del codigo y del diseño.












http://tinyurl.com/32khk4c

7. Luego me voy a mi pagina y en el panel insert, esta la opcion de widget, le doy click.







http://tinyurl.com/2wdp5lc

8. Despues escogo el widget que quiero utilizar en mi pagina y que personalize.









http://tinyurl.com/3xffdma



9. Finalmente puedo apreciar como quedo mi widget insertado en mi pagina web.










jueves, 2 de septiembre de 2010

La critica constructiva

La crítica constructiva es la que propone nuevas soluciones a los problemas o defectos que se expongan en la crítica.

La motivación para dar a conocer esta opinión debe de ser el bien común y la prevención de problemas potenciales.

Utilizar la crítica constructiva puede tener efectos muy positivos en un equipo de trabajo o en cualquier grupo de personas que se reúnen por un objetivo común. Sin embargo, será indispensable plena conciencia de que la critica no es algo personal, sino algo que beneficiara al equipo de trabajo. Asimismo, para que pueda funcionar exitosamente, se requerirá por parte de los individuos involucrados entre otros: altura intelectual, visión de la problemática actual y futura, despersonalización, unidad de dirección y humildad por parte de todos los involucrados.

1. ¿Cuál es la primera impresión que tuvo cuando vio el sitio?

  1. En casa: La primera impresión que tuve de este sitio, fue elegancia e innovación en espacios del hogar.
  2. Soy mamá: Me evoco pensar en la mujer, en un espacio femenino por los colores de los botones principales y por la fotografía de fondo.
  3. El papayaso: En lo que primero que se centro mi vista fue en el logo de la mujer sosteniendo la papaya, de pronto por usar una fotografía literal de la papaya me evoco mas frutería que pagina de chismes.
  4. Library: Pensé en una galería de música o de libros.
  5. Pagina para dummies: Un sitio web de tareas, de aprendizaje, por las gafas del logo y por los mini tableros.
  6. Croma: Me dio la impresión de un sitio de fotografía profesional.

2. ¿Pónganse los zapatos del usuario, cumpliría mi objetivo en este sitio?

  1. En casa: Yo que hago parte de los usuarios a los que está centrado esta página, y tuviera mi apartamento propio seguramente desearía aprender a decorarlo como las fotografías lo indican. Pero pensaría que está un poco lejos de mí presupuesto por la elegancia de los lugares que se muestran en las fotografías. Pero si cumpliría con el objetivo de poder encontrar fácilmente fotografías y ejemplos de cómo debería hacer la decoración.
  2. Soy mamá: Si, seguramente respondería muchas preguntas y dudas respecto a esta nueva etapa de vida que tanto para mí como para muchas mujeres es desconocida. Ya que cuenta con artículos y videos relacionados con los temas, además de la opción de enviar preguntas a un especialista.
  3. El papayaso: Si, encontraría un momento de diversión, además que los chismes de por si son muy divertidos, añadirles iconos que representen la esencia del chisme es muy apropiado. Aunque seria más llamativo al tema del chisme si hubieran mas fotografías en el home de los artistas, donde sea fácil escoger a los famosos del momento.
  4. Library: Si se cumpliría con el objetivo ya que tengo la opción de buscar el libro que necesito de forma rápida y eficiente, aunque yo buscaría darle un valor agregado para poder tener competencia con librerías tan reconocidas como la “Librería Nacional”.
  5. Pagina para dummies: Pienso que en el home debería enfocarse un poco más a dar definiciones como tal, en vez de colocar ejemplos, ya que si el usuario es inexperto en estos temas, sería más fácil para el entender el significado a la pregunta que se formula, digamos ¿Qué es el internet?, tener una respuesta puntual y después si formular los diferentes ejemplos.
  6. Croma: El objetivo principal que se propusieron es el de vender revistas Croma, yo pienso que yo como usuaria al ver que tengo la opción de leer los artículos y de apreciar las imágenes en internet, preferiría hacerlo en la pagina gratuitamente a comprar una suscripción a la revista, además porque la pagina está estructurada de forma bastante adecuada para un diseñador, la preferiría a la revista.

3. ¿En qué acertaron?

  1. En casa: En la presentación de la información, ya que hay jerarquía de tipografías, imágenes en buena resolución, además de que el sitio es muy limpio y agradable a la vista.
  2. Soy mamá: En darle la apropiación adecuada al tema, ya que los colores son apropiados, además del logo de la pagina.
  3. El papayaso: En la iconografía y en la explicación de esta. Además de comunicar los chismes de forma divertida.
  4. Library: En la limpieza del sitio, y en la forma como se presentan las opciones que tiene el usuario para encontrar libros, ya que tiene varias opciones para navegar en el sitio.
  5. Pagina para dummies: En el logo y en la creación de un personaje que vaya asesorando al inexperto usuario.
  6. Croma: Totalmente adecuado el diseño propuesto en cuanto a la tipografia, el uso de los espacios, la simplicidad de la organización de información, las fotografías, y las opciones puntuales.

4. ¿En que no acertaron?

  1. En casa : Pienso que de pronto debieron haber propuesto que en una de las opciones la persona pueda usar una aplicación en la que decore un espacio con unos elementos que estén predeterminados ya que muchas veces las personas buscan innovación como tal, pero no que la sala de su casa quede exacta a la de todo el mundo.
  2. Soy mamá: De pronto en el menú de navegación en la parte inferior de la pagina, además de que es un menú que le resta mucho espacio a la pagina que podría ser usado para otras opciones, como de contáctenos, ya que la usuaria puede tener dudas cuando esta leyendo los artículos y va a querer tener un botón de ayuda o contáctenos todo el tiempo presente
  3. El papayaso: De pronto pudo haber sido más vectorial en cuanto al logo y mas colorida en la interfaz, ya que los chismes son por excelencia diversión.
  4. Library: Haber creado una opción en la que se pueda comprar libros para leer digitalmente, ya que los libros físicos están en proceso de extinción.
  5. Pagina para dummies: No hay jerarquización de tipografia, pienso que pudieron haber explorado un poco mas ese aspecto.
  6. Croma: Promocionar la suscripción a la revista desde el momento que el usuario entra al home.