sábado, 14 de enero de 2012

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 y 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 ala interfase del diseñador de plantillas.

Este apartado de nuestro panel de control está dividido en dos partes:

1.- (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 aparentes en esta página y se convierten en ajustes permanentes si y solo si presionamos el botón de APLICAR AL BLOG.

2.- (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 seleccionar de una variedad de plantillas prediseñadas que cuentan con una 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 traducidas este apartado puede aparecer como Bacground 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 de 1800 X 1600 píxeles). De las que vienen precargadas en la interfase. También podemos seleccionar desde nuestra computadora una imagen de aproximadamente las mismas medidas y subirla para ser usada como fondo. El límite de peso de una resolución de la foto no debe exceder de 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 donde se publican las entradas principales, las fechas y los título del contenido). Adicionalmente contamos con el deslizador del ancho de 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 de aproximadamente 1024 píxels, lo que nos permite ajustar medidas dentro del rango de los 980 pixeles 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étera.

Trabajando de la mano con el apartado anterior, donde ajustabamos el tamaño, podemos crear un espacio amplio libre de distracciones visuales donde solo se muestre 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.


e) Edición avanzada:
Este apartado de nuestra pantalla de edición de plantillas nos permite ajustar de manera precisa todo lo relatico a las tipografias y colores que se emplean para desplegar los contenidos de nuestras entradas.

-Sección de Texto de página: Este apartado nos permite definir el tamaño, color y tipografía de los textos en general de nuestra página. Es conveniente siempre seleccionar una ¨Familia tipográfica¨ esto es, una letra que cuente con versiones en Negritas, Itálicas, Condensadas, Etc. Ya que todas estas variantes son utilizadas en diferentes secciones de los textos a desplegar.
 
-Sección de fondos: Aqui se definen los colores específicos de cada seccion de mi blog, en el renglon de fondos. Con 2 posibles opciones: Color o transparencia. Los fondos a determinar son 3 los del encabezado, los de las entradas y los de las columnas.

-Sección de enlaces: Este apartado determina el comportamiento de los hipervinculos en el documento escrito en tres posibles estados: uno es el link o hipervinculo en estado inicial, otro es cuando el mouse se posiciona sobre el link y el tercero es sobre los links visitados. En estas tres opciones se puede determinar la tipografia y el color respectivamente.

-Sección del título del blog: Aqui definimos la tipografía, el estilo y el color del título del blog. En el caso particualr d enuestro diseño, este ha sido substituido por un encabezado diseñado en ACDSEE photo editor, así que este apartado no se emplea en nuestro diseño.

-Apartado de gadgets: Aqui definimos los encabezados para las secciones adicionales ubicadas en las columnas laterales, cuya ubicación fue determinada en el apartado de DISEÑO.
 
-Apartado de imágenes: En este punto podemos modificar la manera en que se cargan las imágenes utilizando el botón de insertar imagen, ya que podemos ponerles fondos de color o bien delinear con un remarco de color variable los contornos de las imágenes.

sábado, 7 de enero de 2012

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 por 250 pixels de alto que es la medida aproximada del encabezado de mi blog.

1.- El proyecto debe reunir los siguientes requisitos:
Debe 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.

2.- 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.

3.- Importamos el logotipo de la Universidad Estatal de Estudios Pedagógicos y seleccionamos el fondo para eliminarlo la herramienta de varita mágica e invertimos la selección, copiamos y pegamos en nuestro documento original.
4.- 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.