miércoles, 18 de enero de 2012

Sesion 4. Pagina para llenado de contenidos

Jarabe de palo
Hace días que te observo
y he contado con los dedos
cuantas veces te has reído
una mano me ha valido.

Hace días que me fijono sé que guardas ahí dentro
a juzgar por lo que veo
nada bueno, nada bueno.
De qué tienes miedo
a reir y a llorar luego
a romper el hielo
que recubre tu silencio
Suéltate ya y cuéntame
que aquí estamos para eso
pa' lo bueno y pa' lo malo
llora ahora y ríe luego(estribillo)
si salgo corriendo, tú me agarras por el cuello
y si no te escucho, grita !
te tiendo la mano tu agarras todo el brazo,
y si quieres más pues, grita !
Hace tiempo alguien me dijo
cual era el mejor remedio
cuando sin motivo alguno
se te iba el mundo al suelo
Y si quieres yo te explico
en que consiste el misterio
que no hay cielo, mar ni tierra
que la vida es un sueño
(estribillo)
si salgo corriendo, tú me agarras por el cuello
y si no te escucho, grita !
te tiendo la mano tu agarras todo el brazo,
y si quieres más pues, grita !





El editor basico de texto de mi blog: Los contenidos a publicarse en mi bitacora comienzan y terminan con el editor de texto que viene  cuando presiono el boton de crear una entrada nueva.
Las herramientas basicas para dar formato a los textos que introduzca son las siguientes:
1.- Fuente o tipografia (boton F): Este boton nos permite seleccionar el tipo de letra que se va a emplear para a redaccion.
La seleccion es limitada porque utiliza los estilos basicos de letra que vienen intalados en la computadora

2.- Boton de tamaños: (Boton T) Con esta opcion podemos seleccionar de una lista de posibles tamaños para la letra que impacta en como se va a mirar mi escrito en el monitor.

31/10/11 Ejercicio de repaso: Captura de audio en mp3 y publicacion en Soundcloud

Utilizando los conocimientos adquiridos hasta el momento realizar el siguiente ejercicio de repaso:

1.- Seleccionar el video de nuestra preferencia en www.youtube.com que puede ser musical, de comedia, informativo, discursos, etc. Con una duracion no mayor a los 4:30minutos.
2.-Utilizar la pagina www.keepvid.com para obtener el audio en formato mp3 de dicho video, grabandolo en nuestro escritorio.
3.-Utilizando el servicio de www. souncloud.com, subir la grabacion mp3 a nuestro perfil de soundloud.
4.-Exportar el codigo de Share y pegarlo en esta misma entrada al pie del texto.

Personalizacion de diapositivas avanzadas 19-10-11

Introduccion a la edicion de plantillas: Los Gadgets

Los Gadgets en Blogger:

Se les llama asi a los pequeños modulos de codigo que modifican el comportamiento de la plantilla de nuestro blig. esto es, mas que sr una nueva entrada, es un componene del diseno de nuestro blog que le aporta funcionalidad extendida o adicional. Aparte no estan sujetos al comodo cronologico de las entradas donde cada nuevo articulo que publiquemos va a colocarle inmediatamente encima de lo anterior, relegando el contenido al fondo de nuestro blog. Los gadgets por su parte estan anclados en la plantilla de nuestra pagina, incorporados permanentemente al menu de nuestra pagina.

aplicaciones comunes de los diferentes tipos de gadgets:

1.- Ventanas de video. podemos copiar la direccion de algun video favorito y anclarlo a la comunma izquierda o derecha de nuestro blog, dependiendo de su diseño, para que, cada vez que se cargue la pagina, se corra dicho video.

2.- Galerias fotograficas fijas: podemos mandar llamar una pelicula de diapositivas y asignarla a algun espacio en las columns laterales de nuestro blog.

3.-Directorios blogs/paginas adicionales: podemos crear listados de nuestras paginas favoritas, o bien listados de blogs de nuestros compañeros en la forma de una relacion de links convenientemente colocados a los lados de la pagina.

4.-Subscripciones y RSS: este Gadget permite a las personas que visiten nuestra pagina subscribirse a nuestro blog utilizando su correo electronico, de este modo les llegan notificaciones y copias de nuestros contenidos de modo automatico a sus respectivos correos en el momento en que son publicados.

5.-Listado de nuestros post o entradas favoritas: nos permite mantener siempre a la mano un listado de contenidos sobresalientes para su rapida visualizacion y referencia.
6.-listado de etiquetas: relacion de palabras clave que facilita la busqueda de contenidos en nuestras publicaciones.

7.-Cuadro de busquedas: similar a google pero con la opcion de buscar dentro de nuestra pagina exclusivamente o bien realizar una busqueda general en toda la web.

lunes, 16 de enero de 2012

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

En la interface 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 de 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 drasticos 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 dinamica. se llama asi porque refleja inmediatamente (esto es, sin tener que refrescar la pagina) los cambios realizados en el menu principal. estos cambios se convierten en ajustes permanentes y solo si presionamos el boton de aplicar al blog.



2.-Parte superior. El menu de ajustes: Este menu afecta la apariencia y disposicion de los elementos graficos 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 grafico definido. A la vez cada una cuenta con un submenu que muestra variaciones del mismo concepto, como puede ser alguna variante en todos de color o algun ajuste en las decoraciones de la pagina.





b) Apartado de fondo: en algunas paginas que no estan traducidas este apartado puede aparecer como Background o colorways. En este menu podemos seleccionar fondos de color solido, que vienen combinados con colores adicionales, para el fondo de nuestra pagina, o bien podemos seleccionar una imagen por lo regular de 1800x1600pixels.
De las que vienen precargadas en la interfase. tambien podemos seleccionas desde nuestra computadora una imagen de aprximadamente las mismas medidas y subirla para ser usada como fondo. El limite de peso/resolucion de la foto no debe exceder los 300 kilobytes.






c) Ajuste de medida de 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. (En donde se publican las entradas principales, las fechas y los titulos del contenido) Adicionalmente contamos con el deslizador del ancho de columna secundaria, qeu contiene por lo regular los gadgets que hemos incorporado a la plantilla ademas 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 dentro del rango de los 980 pixels hasta los 780 aproximadamente, para fines de no truncar la longidut de los encabezados o crear un sitio que no se muestre completoen pantalla debido a su medida excesiva.





d) Apartado de diseño:
Esta seccion nos permite organizar y orientan los elementos de la pagina de acuerdo a la relacion entre las entradas principales y las columnas secundarias que cuentan con los 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 solo se muestre el texto de las entradas, o bien un espacio que concentre mucha informacion 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) Edicion avanzada:
Este apartado de nuestra pantalla de edicion de plantillas nos permite ajustar de manera precisa todso lo relativo a las tipografias yc olores que se emplean para desplegar losc ontenidos de nuestras entradas.
-Seccion de texto de pagina: Este apartado nos permite definir el tamaño, color y tipografia de los textos en general de nuestra pagina. Es conveniente siempre seleccionar una familia tipografica 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.
-Seccion de fondos: aqui se definen los colores especificos de cada seccion de mi blog, en el renglon de fondos. Con dos posibles opciones:  color o transparencia. Los fondos a determinar son 3, los del encabezado, los de las entradas y ols de las columnas.
-Seccion de enlaces: Este apartado determina el comportamiento e los hipervinculos en el documento escrito en tres posibles estados: uno es 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.
-Seccion del titulo del blog: aqui definimos la tipografia, el estilo y el color del titulo del blog. En el caso particular de nuestro diseño, este ha sido sustituido 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 lateriales, cuya ubicacion fue determinada en el apartado de diseño.
-Apartado de imagenes: En este punto podemos modificar la maenra en que se cargan 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 imagenes.

miércoles, 7 de diciembre de 2011

Introduccion al diseño grafico: La apariencia de nuestro blog.

Glosario de terminos basicos para el diseño grafico a traves de medios electronicos.

1.-Pixel: Es la unidad de color con luz minima que puede representar un medio electronico. Su forma fisica mas tangible es un punto de color en la pantalla. En televisiones y monitores grandes, tambienen pantallas gigantes de LCD como en las que encuentran en los anuncios publicitarios en las vialidades, es un punto de color que puede ser rojo, verde, azul o cualquier combinacion de los 3 colores, generando luz blanca cuando se combinan en la misma proporcion.

Todas las medidas de graficos en cualquier medio electronico se expresan en pixeles siendo la medida de 800x600 la mas usada antes de los monitores SVGA  y aun mayores con los monitores de alta definicion, pantalla plana.

2.-Megapixel: se le llama megapixel a una matriz de aproximadamente un millon de pixels, dispuestos en columnas e hileras para conformar una imagen en un medio electronico. Mientras mas megapixeles tenga una imagen no necesariamente se hace mas detallada, si no que permite capturar imagenes mas grandes, lo que favorece su ampliacion sin que suceda la pixelizacion o que aparezcan las deformaciones de baja resolucion denominadas artefactos.

3.-Pixelizacion: deformacion comun que experimentan las imagenes cuando son ampliadas u observadas a un tamaño mayor al que fueron creadas para observarse.

4.-Artefactos:  son las deformaciones que experimentan las imagenes.
Pasa muy seguido con imagenes que fueron bajadas de internet y se imprimen en papel revelando su pixelizacion.

*Formatos de imagenes mas populares y sus usos:

JPG Es el mas usado en la web. cuando una imagen esta en este formato nos indica que ya fue comprimida ( no esta en su maxima resolucion) y que esta 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 mas.

GIF al igual que JPG es un formato ideal para ver imagenes 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 electronico) pero tiene dos caracteristicas que la diferencian de otros formatos: Permite varios cuadros de imagenes en un solo archivo y para poder almacenar este tipo de informacion, de animacion, sacrifica colores, ya que cuenta con un numero limitado de colores para mostrar.