lunes, 16 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 caracteristicas de nuestra pagina 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 ilimitada 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 funcionalidads de nuestro sitio recurrimos a la interfase del diseñador de plantillas.

Este apartado de nusetro panel de control esta dividido en 2 partes.

1.- (Parte inferior) La vista previa dinámica: Se llama así porque refleja inmediatamente (esto es, sin tener que refrescar la pagina) los cambios realizados en el menú principal.Estos cambios son solo aparentes en este página y se convierten en ajustes permanentes si y solo si presionamos el boton 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 especificos
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 estan trraducidas este apratado 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 lña interfase. También podemos seleccionar de nuestra computadora una imagen de aproximadamente las mismas medidas y subirla para hacer usadas 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 la columna secundaria. que contiene por lo regular los gadgets que hemos incorparado a la plantilla además de los directorios e índices de nuestro blog. Consideraciones: el ancho de pantalla promedio es de aproximadamente 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) Apàrtado 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 indices, etc.

Trabajando de la mano con el apartado anterior, donde ajustabamos el  tamaño, podemos crear un espacio libre de distracciones visuales donde sólo muestre el texto las entradas, o bién un espacio que concentre mucha imformación en un area reducida, como es 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 plantilla nos permite avanzar de manera precisa todo lo relativo a las tipografias y colores que se emplean para desplegar los contenidos de nuestras entradas.
-Sección de texto de páginas: Este apartado nos permite definir el tamaño, color y tipografia 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 los textos a desplegar.
-Sección de fondos: Aqui se definen los colores especificos de cada sección de mi blog en el renglón 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 tipografia, el estilo y el color del titulño del blog. En el caso particular de nuestro diseño, este ha sido substituido por un encabezado diseñado en ACDSEE photo editor, asi, 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 imagenes: En este punto podemos modificar la manera con la que se encargan las imagenes utilizando el boton de insertar imagen, ya que podemos ponerles fondos de color o bien delinear con un remarco de color variable los contornos de las imageners.

lunes, 9 de enero de 2012

Sesion 25.- 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

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

Glosario de términos básicos para el el diseño gráfico a través de 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 3 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 más usada hasta antes de los monitores SVGA y aun 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 columnas e hileras para conformar una imagen en un medio electrónico. Mientras más megapixeles tenga una imágen no necesariamente se hace más detallada, si no  que permite capturar imágenes mas grandes , lo que favorece su ampliación  sin que suceda la pixelización o que aprezcan las deformaciones de baja resolución denominadas artefactos.

3.-Pixelización:
Deformación común que experimentan las imágenes cuando son ampliadas o observadas a un tama@ al que fueron creadas para observarse, por ejemploen el caso de fotos que fueron tomadas para verse por pantalla de 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 aparecen en pantalla cuando forzamos la ampliación de una imágen 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 fue comprimida (no está en su máxima resolución) y que esta optimizada para  mandarse por internet, verse en monitor o bién 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 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 2 características que la diferencían de otros formatos:

1.- Permite varios cuadros  de imágenes en un solo archivo, por ejemplo, fotos animadas.

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.

TIFF:  Es un formato de imágenes digitales que no tiene comprensión, esto es, que fue creado en la calidad y resolución máxima que puede generar nuestro aparato (ya sea cámara digital, imágen 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 un 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 imagenes) 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

SESION 18.' RECORDATORIO DE LOS VISTO HASTA EL MOMENTO. CREANDO UNA RED INTERGRUPAL.

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

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

2.-Haber creado exitosamente el canal de comunicación de TwitterFeed entre nuestro blog en www.blogspot.com y dicha página 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 en Twitter (en configuración/perfil/conectar con facebook) una comunicación entre Twitter y Facebook, 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 interes, un cuento corto o un extracto de alguna lectura, con un título descriptivo de su contenido (Ej. Extracto de columna de Deportes).

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

8.- Comprobar que todo lo anterior se ha publicado automatizadamente en las 3 Páginas mencionadas (Blogger, Twitter y Facebook).

9.- Tan-tán!

miércoles, 16 de noviembre de 2011

Interconectividad en redes sociales y nuestro blog 2: Microblogging.

1.-Esta variante de la publicación de bitácoras en línea se distingue por ser la más concisa y estar implementada para su rápida asimilación en la forma de enunciados limitados por un número predeterminado de carácteres, pero integrado en su mensaje todas las herramientas básicas que conforman una bitácora eléctronica, como lo son las respuestas, las re-publicaciones, los hipervinculos, las etiquetas y las búsquedas por tópico, periodicidad, autor, o región geográfica.
El servicio de microblogging más popular es Twitter.
Twitter es creado como una plataforma de comunicación cuya particularidad es la extensión de sus mensajes: sólo 140 carácteres, incluyendo letras, números y espacios.
Estos mensajes o Twetts (comparándolos con el trinar de un ave o tweeting) pueden estar conformados por frases o una combinación de enunciados con hepervínculos (url) o una serie de marcadores precedidos por el símbolo de número ( #) Que hace fácil su búsqueda y localización.

2.- Pasos para integrar a TWITTER a nuestra red social:

a).- Crear una cuenta en http:twitter.com.

b).- Acceder a nuestro cliente de información de TWITTERFEED.

c).- Activar la cuenta de TWITTER integrandola al servicioque alimenta a FACEBOOK.

d).- Aplique, frote, enjuague, y repita.

PUBLICAR NUEVA ENTRADA

HOY SE PUBLICO UNA NUEVA ENTRADA EN DONDE CREE UNA PAGINA EN MI BLOG

lunes, 14 de noviembre de 2011

Sesion 16.- Interconectividad en redes sociales y nuestro blog.

           Una de las herramientas más útiles para la comunicación entre un grupo de personas que revisan consuetudinariamente sus correos eléctronicos son los boletines y las notificaciones de redes sociales.
En este aspecto, la comunidad virtual de Facebook ofrece una gama de de servicios que facilitan la creación de páginas dedicadas a organizaciones/grupos/negocios/clubes y/o instituciones, que además cuentan con una amplia gama de características que permiten el trabajo en conjunto con nuestro blog, creando un solo canal de comunicación que opera en varios niveles.
     En este ejercicio vamos a integrar las notificaciones en Facebook con las publicaciones de Blogger, logrando que se notifiquen de manera personalizada los miembros de un grupo de usuarios de Facebook que accedan a formar parte de nuestra red social.

Pasos para integrar Facebook y Blogspot:

1.- Crear un usuraio en Facebook, mediante una cuenta de correo existente y un password nuevo. Llenamos los formularios y presionamos¨siguiente¨ hasta llegar a nuestra página personal.

2.- Al pié de nuestro perfil personal existe el apartado para CREAR PAGINAS, hacemos click para pasar al menú de selección.

3.- En este menú podemos definir el carácter de nuestra página, ya sea de carácter educativo, institucional, de negocios, grupos musicales, hobbies, deportes, etc. Esto facilita a Facebook ayudarnos a promover los contenidos que se publiquen ahí.

4.- Una vez que definimos el sesgo de nuestra página, procedemos a llenar los formularios. Si por ejemplo la hacemos en base a una escuela, llenamos campos como nombre, dirección, contacto,etc.
Acompañando todo de una  descripción breve para cuando seamos localizados por el motor de busqueda de Facebook.

5.- Accesamos a www.twitterfeed.com, que es la página que va a ligar el funcionamiento de nuestro blog con FB, mediante un sistema de alimentacion de información que es conocido con las siglas de RSS, que significan en inglés Real Simple Syndication, Distribucion Realmente Simple, para nuestra conveniencia, TwittterFeed no requiere programación, sólo crear un usuario en una cuenta de correo existente y un password o clave que no debe ser necesariamente la del correo mencionado.

6.- Para activar TwitterFeed hay que copiar la dirección de nuestro blog(http://nombredemiblog.blogspot.com), y probar si funciona la alimentación RSS usando el boton de PROBAR.

7.- Le damos SIGUIENTE y seleccionamos el servicio FACEBOOK del menú. Este formulario nos pide que permitamos a TWITTERFEED accesar nuestro usuario de FB y luego nos permite seleccionar páginas que hayamos creado ahi.
Aqui es donde seleccionamos específicamente la página que creamos en los pasos 2 y 3 . Ahora nuestras entradas se publican automáticamente en Blogger y Facebook y se les notifica con un mensaje a cualquier usuario que este inscrito en dichas páginas.