domingo, 2 de septiembre de 2012

martes, 17 de enero de 2012

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

En la interfase de diseño de nuestro plantel de control podemos realizar ajustes relacionados con el funcionamiento general de nuestro blog. De la misma manea podemos aumentar las funciones y caracteristícas 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 mas 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 esta dividido en 2 partes:


1.-(Parte inferior) La vista previa dinámica. Se llama asi porque refleja inmediatamente esto es, (sin tener que refrescar la pagina) los cambios realizados en el menú principal. Estos cambios son solo aparentes en esta pagina y se convierten en ajustes permanenetes si y solo si presionamos el botón de APLICAR AL BLOG.




2.-(Parte superior) El menú de ajustes:

Este menú afecta la pariencia y disposición de los elementos gráficos de nuestro blog, y abarca varios apartados especifícos:
 a)Plantilla General: Este apartado nos permite seleccionar 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 en alguna variante en tonos de color o algun ajuste e las decoraciones de la página.


b) Apartado de Fondo:(en algunas páginas que no están traducidas 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 bién podemos seleccionar una imágen (por lo regular de 1800x1600 pixels) Aqui se cierra el parentesis. 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 limite 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 2 deslizadores que nos permiten incrementar/decrementar el ancho de la columna principal de nuestro blog. Ojo, aqui viene un parentesis (En donde se publican las entradas principales, las fechas y los títulos del contenido) Y cerramos el parentesis. 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 indices de nuestro blog. Consideraciones: el ancho de pantalla promedio es de aproximadamente 1024 pixels, lo que nos permite ajustar medidas de 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 seccion nos permite organizar y orientar los elementos de la página de acuerdo a la relacion entre las entradas principales y las columnas secundarias que cuentan con gadgets e indices, etc.

Trabajando de la mano con el apartado anterior, donde ajustabamos el tamaño, podemos crear un espacio amplio libre de distracciones visuales donde sólo se muestre el texto de las entradas, o bién un espacio que concentre mucha información en un area 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 relativo a las tipografías y colores que se emplean para desplegar los contenios de nuestras entradas.
Seccion 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, Italicas, Condensadas, etc. Ya que todas estas variantes son utilizadas en diferentes secciones de texto a desplegar.
-Seccion 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.
-Seccion 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 tipografía y el color respectivamente.
-Seccion del titulo del blog: Aqui definimos la tipografía, el estilo y el color del titulo del blog. En el caso particular de nuestro diseño, este ha sido subtituidopor un encabezado diseñado en ACDSEE photo editor, asi que este apartado no se emplea en nuesto 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.
-Aparatado de imágenes: En este punto podemos modificar la manera en que se cargan las imágenes utilizando el boton de insertar imágenes, ya que podemos ponerle fondos de color o ben delinear con un remarco de color variable los contornos de las imágenes.

lunes, 9 de enero de 2012

UTILIZANDO EDITORES DE FOTOS PARA REDISEÑAR MI BLOG

1.- Rediseño del Encabezado: Vamos a recurrir al programa ACDSee Photo Editor para crear un proyecto con la siguiente medida: 960 pixeles de ancho por 250 pixeles de alto, que es la medida aproximada del encabezado de mi blog.
El proyecto debe de reunir los siguientes requisitos:
Debe estar en resolucion WEB (96 pixeles 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 titulo de nuestro blog, con la cual podemos seleccionar la tipografía, el tamaño y el color.
Una vez que redactamos el titulo lo convertimos en objeto haciéndole doble click, esto nos permite ponerle efectos como sombra y bisel, creando de este modo texto artístico decorativo.

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

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.

miércoles, 7 de diciembre de 2011

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 los medios electrónicos.


1.- ¿Qué es un Pixel?
El pixel es la unidad de color con luz mínima que puede representar un medio electrónico. su forma física más tangible es un punto de color en la pantalla . En televisiones y monitores más 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 todos 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 más usada hasta antes de los monitores SVGA y aún mayores con los monitores de alta definición y pantalla plana.


2.- ¿ Qué es un megapixel?


Se le llama megapixel a una matriz de aproximadamente un millón de pixels, dispuestos en columna de hileras para conformar una imagen de un medio electrónico. Mientras más megapixeles  tenga una imagen no necesariamente se hace más detallada, si no que permite capturar 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 denominadas artefactos.


3.- 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 fotos que fuero tomadas para verse en pantallas celular, cuando son amplificadas en un monitor de mayor tamaño, se pixelean.


4.- Artefactos: son las deformaciones regularmente de formas cuadradas o rectangulares que aparece 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 por la WEB, cuando una imagen esta en este formato nos indica que ya fue comprimida (que no esta en su máxima resolución) y que esta optimizada para mandarse por Internet, verse por 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 ideal para ver imágenes  en pantalla y tamaños relativamente pequeños que no ocupen mucho espacio en memoria (por ejemplo que excedan del tamaño permitido en un correo electrónico) pero tiene dos características que la diferencia de los otros formatos: 1.- Permite variar cuadros de imágenes en un solo archivo, por ejemplo, fotos animadas . y 2.- 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.


FORMATOS MAS COMUNES DE IMAGENES

En JPG-usado en we
En GIF-usado en web
En TIF-alta calidad
En PNG-transparencias
En RAW-el mas alto


TIFF: Es un formato de imágenes digitales que no tienen comprensión, esto es, que fue creado en la calidad y resolución máxima que puede generar nuestro (ya sea cámara digital, imagen escaneada o cámara de video que puede tomar fotos.) Por lo regular el formato TIFF es muy pesado (asumiendo el peso del archivo como valor elevado en MEGABYTES) y es el ideal para ampliaciones o reproducciones en gran formato.






PNG: Este formato es una versión mejorada del archivo de imágenes tipo GIF en el sentido de que permite excelentes imágenes para su uso en web y presentaciones en proyector, además de transparencia (evitando el remarco blanco que acompaña a ciertos formatos de imágen) teniendo mayor calidad que el GIF.
En contraparte, el hecho de que tenga mayor calidad impide el uso de animaciones.





lunes, 28 de noviembre de 2011

Recordatorio de lo Visto hasta el momento. Creando una red intergrupal

La siguiente práctica  parte de que reunamos los siguientes requisitos:

1.- Haber dado de alta en usuario en Facebook y dentro de este haber creado una página independiente con el nombre de una escuela/ institución o diplomado.

2.- Haber creado exitosa mente  el canal de comunicación de TwitterFeed entre nuestro blog en el www.blogspot.com y dicha pagina en facebook.

3.- Haber creado un usuario en twitter.com y haber cumplido con: confirmar la cuenta, seguir a 10 personas ( que pueden ser celebridades, conocidos etc.) y haber intercambiado los nombres  de usuario de Twitter entre los miembros del salón.

4.- Crear en TwitterFeed un canal de comunicación entre nuestro blog y twitter.

5.- Crear un Twitter ( en configuración/perfil/conectar con Facebook) una comunicación entre Twitter  y Feccebook, de modo que queda el siguiente canal de comunicación automatizada: Nuestro Blog/Twitter/Facebook.

6.- Publicar en nuestro Blog una entrada nueva, que sea el párrafo de un artículo de interés , un cuento corto o un extracto de alguna lectura, con un titulo descriptivo de su contenido (ej. " Extracto de columna de Deportes")

7.- Esperar a que los compañeros hagan lo mismo, utilizar la opción  RETWEET para que se publique en nuestro perfil de Twitter.

8.- Comprobar que todo lo anterior se ha publicado automatizada-mente en las tres páginas mencionadas (Blog, Twitter, Facebook)

9.- Tan-Tán!!

  

jueves, 24 de noviembre de 2011

Interconectividad en Redes Sociales y Nuestro Blog 2 Microblogging

1.-Microblogging :
Esta variente en la publicación de bitacoras  en linea se se distinge por ser la más consisa y estar implemengtada para su rápida asimilció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 bitacora electronica, como son las respuestas , la re publicaciones, los hipervinculos, las etiquetas y las busquedas por tópicos, periodicidad, autor o región geográfica.

El servicio de microblogging es popular es twitter.

Twitter es creado por una plataforma de comunicación cuya particularidad es la extención de sus mensajes: sólo 140 caracteres, incluyendo letras, número y espacios.
Estos mensajes o Tweets (comparandolos con el trinar de un ave o tweeting) puede estar conformados por frases o una combinación de enunciados con hipervinculos (url) o una serie de marcadores precedidos por un símbolo de número (#) que hace fácil su búsqueda y localización.

- Pasos para ingresar a la TWITTER a nuetra red social:
a) Crear una cuenta de http://twitter.com
b) acceder a nuetro cliente de información de TWITTERFEED
c) activar|la cuenta de TWITTER integrandola al sevicio que alimenta a FACEBOOK.