sábado, 14 de enero de 2012

Sesión 14: Personalización de nuestro blog con la interfase de diseño avanzado

En la interfase de diseño de nuestro panel de control podemos realizar ajustes relacionados con el funcionamiento general de nuestro blog, de la misma manera podemos aumentar las funciones y características de nuestra página en la manera de gadgets que aportan nuevas y variadas aplicaciones.

Fuera de esto, podemos reacomodar el orden en que estas funciones aparecen en el espacio designado a nuestro blog, pero con todo es una herramienta limitada en cuanto a la flexibilidad y capacidad de personalización de nuestro blog.

Es entonces que, para hacer ajustes más drásticos en la apariencia y funcionalidad de nuestro sitio recurrimos a la interfase del diseñador de plantillas.

Este apartado de nuestro panel de control está dividido en dos partes:
  • (Parte inferior) La vista previa dinámica. Se llama así porque refleja inmediatamente (esto es sin tener que refrescar la página) los cambios realizados en el menú principal. Estos cambios son solo aprantes en esta página y se convierten en ajustes permanentes si presionamos el botón de aplicar al blog.
  • (Parte superior) El menú de ajustes: Este menú afecta la apariencia y disposición de los elementos gráficos de nuestro blog y abarca varios apartados específicos.
a) Plantilla general: Este apartado nos permite seleccinar de una variedad de plantillas prediseñadas que cuentan con un apariencia o estilo gráfico definido, a la vez, cada una cuenta con un submenú que muestra variaciones del mismo concepto, como puede ser alguna variante en tonos de color o algún ajuste en las decoraciones de la página.

b) Apartado de fondo (en algunas páginas que no están traducidad este apartado puede aparecer como background o colorways). En este menú podemos seleccionar fondos de color sólido que vienen combinados con colores adicionales para el fondo de nuestra página, o bien podemos seleccionar una imagen (por lo regular 1800 x 1600 pixels) de las que vienen precargadas en la intefase. También podemos seleccionar desde nuestra computadora una imagen de aproximadamente las mismas medidas, para subirla y utilizarla como fondo. El límite de peso/resolución de la foto no debe exceder los 300 kilobytes.

c) Ajuste de medidas del Blog. En este apartado, por lo regular, contamos con dos deslizadores que nos permiten incrementar/decrementar el ancho de la columna principal de nuestro blog (en dónde se publican las entradas principales, las fechas y los títulos del contenido). Adicionalmente, contamos con el deslizador del ancho de la columna secundaria que contiene por lo regular los gadgets que hemos incorporado a la plantilla, además de los directorios e índices de nuestro blog

Consideraciones: El ancho de pantalla promedio es aproximadamente  de 1024 pixels, lo que nos permite ajustar medidas dentro del rango de los 980 pixels hasta los 780 aproximadamente para fines de no truncar la longitud de los encabezados o crear un sitio que no se muestre completo en pantalla debido a su medida excesiva.

d)Apartado de diseño. Esta sección nos permite organizar y orientar los elementos de la página de acuerdo a la relación entre las entradas principales y las columnas secundarias que cuentan con gadgets e índices, etc.

Trabajando de la mano con el apartado anterior donde ajustábamos el tamaño, podemos crear un espacio amplio libre de distracciones visuales donde solo se muestra el texto de las entradas, o bien un espacio que concentre mucha información en un área reducida, como en el caso de incluir hasta dos columnas adicionales de contenido extra. Esto por lo regular conlleva a aumentar el ancho de las columnas para no segmentar los textos

sábado, 7 de enero de 2012

Sesión 13: Utilizando editores de fotos para rediseñar mi blog

Rediseño del encabezado:

Vamos a recurrir al programa ACDSEE PHOTO EDITOR para crear un proyecto con la siguiente medida: 960 pixels de ancho x 250 pixels de alto, que es la medida aproximada del encabezado de mi blog. El proyecto debe  reunir los siguientes requisitos:
  • Estar en resolución WEB (96 pixels por pulgada cuadrada)
  • Fondo transparente.
  • La versión final de este archivo se debe de guardar como PNG.
Utilizamos la herramienta de texto para redactar el título de nuestro blog con la cual podemos seleccionar la tipografía, el tamaño y el color.

Una vez que redactamos el título lo convertimos en objeto haciéndole doble clic, esto nos permite ponerle efectos como sombra y bisel, creando de este modo texto artístico decorativo.

Importamos el logotipo de la UEEP y seleccionamos el fondo para eliminarlo usando la herramienta de varita mágica e invertimos la selección, copiamos y pegamos en nuestro documento original.

En este punto el logotipo es un objeto al que se le pueden aplicar efectos también, ajustamos su tamaño y su posición y exportamos todo a PNG

sábado, 10 de diciembre de 2011

Sesión 12: Introducción al diseño gráfico. La apariencia de nuestro blog.

Glosario de términos básicos para el diseño gráfico a través de medios electrónicos.

Pixel

El pixel es la unidad de medida de color con luz mínima que puede representar un medio electrónico.
Su forma física mas tangible es un punto de color en la pantalla. En televisiones y monitores mas grandes, también en pantallas gigantes de LCD (como las que se encuentran en los anuncios publicitarios en las vialidades) es un punto de color que puede ser rojo, verde, azul o cualquier combinación de los tres colores generando luz blanca cuando se combinan todas en la misma proporción.

Todas las medidas de gráficos en cualquier medio electrónico se expresan en pixeles siendo la medida de 800 x 600 la mas usada hasta antes de los monitores SVGA y aun mayores con los monitores de alta definición y pantalla plana.

Megapixel

Se le llama megapixel a una matriz de aproximadamente un millón de pixels, dispuestos en columnas e hileras para conformar una imagen en un medio electrónico. Mientras más megapixeles tenga una imagen no necesariamente se hace más detallada, sino que permite capturare imágenes más grandes, lo que favorece su ampliación sin que suceda la pixelización o que aparezcan las deformaciones de baja resolución denominada artefactos.

Pixelización.

Deformación común que experimentan las imágenes cuando son ampliadas u observadas a un tamaño mayor al que fueron creadas para observarse, por ejemplo en el caso de las fotos que fueron tomadas para verse por pantalla celular, cuando son amplificadas e un monitor de mayor tamaño, se pixelean.

Artefactos.

Son las deformaciones regularmente de formas cuadradas o rectangulares que aparecen en pantalla cuando forzamos la ampliación de una imagen que no fue creada para verse de cerca..

Pasa muy seguido con imágenes que fueron bajadas de internet y se imprimen en papel revelando su pixelización.

Formatos de imágenes más populares y sus usos:


JPG


Es el más usado en la web. Cuando una imagen está en este formato nos indica que ya fué comprimida (no está en su máxima  resolución) y que está optimizada para mandarse por internet, verse en monitor o bien ampliarse hasta la medida original en la que fue creada, ya que se pixelea si se amplifica de más.

GIF

Al igual que JPG, es un formato ideas para ver imágenes en pantalla en tamaños relativamente pequeños que no ocupen mucho espacio en memoria (por ejemplo que excedan el tamaño permitido en un correo electrónico) pero tiene dos características que la diferencian de otros formatos: permite varios cuadros de imágenes  en un solo archivo, por ejemplo fotos animadas, y para poder almacenar este tipo de información de animación, sacrifica colores, ya que cuenta con un número limitado de colores para mostrar.

sábado, 3 de diciembre de 2011

Sesión 11: Confirmacion de la interconcectividad entre página

Esta entrada debe aparecer en varias plataformas de comunicación para comprobar que realizamos adecuadamente los siguientes procedimientos:


  1. Que nuestras entradas de blog se comunican a través de Twitterfeed creando un duplicado de nuestra información y reproduciéndolo en la forma de un nuevo tweet.
  2. Que  nuestros twets pueden ser a su vez re-publicados por otros usuarios de twitter en la forma de un retweet.
  3. Que aparte, twitter está debidamente sincronizado con facebook y que facebook reproduce dichos tweets en mi muro.
  4. Que cualquier usuario de facebook que utilice el botón de like en facebook pueda suscribirse a esta información.

Sesion 11: Trabajando con twitter

En esta sesión estuvimos trabajando con la cuenta de twitter, siguiendo a los compañeros del salón.

sábado, 26 de noviembre de 2011

Sesión 10: Interconectividad en redes sociales y nuestro Blog 2: Microblogging

Microblogging:
Esta variante de la publicación de bitácoras en línea se distingue por ser la mas concisa y estar implementada para su rápida asimilación en la forma de enunciados limitados por un número predeterminado de caracteres, pero integrando en su mensaje todas las herramientas básicas que conforman una bitácora electrónica, como lo son las respuestas, la re-publicaciones, los hipervínculos, las etiquetas y la búsqueda por tópico, periodicidad, autor o región geográfica.

El servicio de microblogging mas popular es el twitter.

Twitter es creado como una plataforma de comunicación cuya particularidad es la extensión de sus mensajes: solo 140 caracteres incluyendo letras, números y espacios.

Estos mensajes o Tweets (comparándolos con el trinar de un ave o tweeting) pueden estar conformados por frases o una combinación de enunciados con hipervínculos (url) o una srie de marcadores precedidos por el símbolo de número (#) que hace fácil su búsqueda y localización.

Pasos para integrar a Twitter a nuestra red social:
a) Crear cuenta en http://twitter.com
b) Acceder a nuestro cliente de información Twitterfeed.
c) Activar la cuenta de Twitter integrándola al servicio que alimenta a Facebook.