Sesión 11: "ESTADISTICAS"

ESTADISTICAS

Esta sección nos permite conocer el tráfico (visitas) que ha recibido nuestro blog desde el momento que se publica cada entrada.

Esto nos permite medir la polularidad de las entradas y de nuestro blog en general.

Entradas

En esta sección es posible conocer el número de visitas que ha recibido cada entrada de nuestro blog.

Fuentes de tráfico

Esta sección nos permite determinar las direcciones de internet que referencían visitas a nuesrro blog.

Público

Esta sección nos permite conocer la ubicación geográfica de las visitas, así como el exportador de Internet utilizado y el sistema operativo utilizado por los usuarios que visitan el blog.

Sesión 10.- "EDICIÓN DE PLANTILLA"

EDICIÓN DE PLANTILLA

En esta sesión veremos como estilizar nuestra plantilla de acuerdo a nuestras necesidades de diseño utilizando el diseñador de plantilla de Blogger.

El diseñador de plantillas de blogger nos permite estilizar las plantillas, fondos, el ancho y el diseño general de nuestro blog.

Para iniciar, entramos a nuestro blog en la sección de visión general.


Seleccionamos la sección de plantilla.

Seleccionamos personalizar para entrar al diseñador de plantillas de Blogger.

El diseñador de plantillas Blogger

El diseñador de plantillas de Blogger cuenta con cinco secciones: 

plantillas, fondo, ancho, diseño y avanzado.

Plantillas

Esta sección nos permite modificar el diseño de nuestro Blog utilizando diseños predeterminados. Aquí es posible seleccionar un diseño general para blog, y debajo del diseño blogger nos da la opción para modificar los colores del diseño.

Seleccionamos el diseño y seleccionamos "aplicar al Blog".

Fondo

Esta sección nos permite modificar el fondo de nuestro Blog, de acuerdo a una lista de fondos predeterminados, o de acuerdo a una imagen de nuestra elección.

Fondos predeterminados

Para utilizar los fondos predeterminados, Blogger nos permite elegir entre múltiples tipos de fondos seleccionados "imagen de fondo".

Imagen de fondo personalizada

En la sección de imagen de fondo es posible insertar una fotografía o dibujo de nuestra elección como fondo. Para hacer esto seleccionamos "imagen de fondo" y posteriormente "subir imagen", donde elegiremos la imagen que deseamos agregar como fondo.

Gama de colores principal

La gama de colores principal, nos permite cambiar el color del texto del blog, de forma que combinen con la imagen seleccionada.

Ajustar ancho

Esta sección nos permite ajustar el tamaño de las entradas del blog y las barras laterales derecha e izquierda.

Diseño

Esta sección nos permite elegir entre varios tipos de diseño para el acomodo de las entradas y el cuerpo de nuestro blog.

Los distintos tipos de diseño del cuerpo del blog nos permiten acomodar las entradas y datos personales en diferentes lugares de la pantalla (del lado izquierdo, derecho, arriba o abajo).

AVANZADO 

La sección avanzada del diseñador de la plantilla Blogger, nos permite personalizar el tipo de letra y color de los textos del Blog, así como el color de los fondos y enlaces.

Texto de la página
Esta opción nos permite determinar el tipo de letra que tendrá el texto de las entradas y el archivo blog.

Fondos
Esta sección nos permite determinar el color del fondo exterior, fondo de cabecera y el color del fondo de las entradas.

Enlaces
Esta  sección nos permite determinar el color de los enlaces del blog. Aquí es posible determinar el color de enlace, el color del enlace visitado y el color del enlace cuando se coloca el ratón sobre el.

Titulo de la entrada
En esta opción es posible determinar el tipo de letra que tendrá el texto de las entradas.

Cabecera de fecha
En esta sección es posible determinar el colorde la cabecera de fecha.

Gadgets
Esta sección nos permite determinar el tipo de letra de "Datos personales", "archivo del blog" y la "fecha de cada entrada".
También nos permite delimitar el color de los "datos personales" y "archivo del blog"

Sesión 9: "EDICIÓN DE IMAGEN ACDSEE"

ACDsee

Es un programa que permite la edición de imágenes y fotografías, utilizando herramientas avanzadas de diseño gráfico.

Nosotros utilizaremos ACDsee para diseñar una cabecera personalizada para nuestro blog.

1.-Abrimos programa

2.-Abrimos un nuevo documento (file-new) en el programa de ACDsee:

Elegimos el tipo de fondo para el nuevo documento:

Elegimos el tipo de fondo (Backgruound): Trasparente

Elegimos la imagen (image) :Custom

Elegimos el ancho (width): 760 pixeles

Elegimos la altura (height): 300 pixeles

Elegimos la resolución (resolution): 96 pixeles/inch

Nota: El tamaño elegido para el fondo permitirá que el encabezado se despliegue de forma correcta y que no se salga de los límites de la pantalla.

3.-Eligiendo el Color de rectángulo

Elegimos el fondo que llevará nuestra imagen, eligiendo la herramienta de rectángulo.

Posteriormente elegimos el color del rectángulo, con la herramienta de selección de color.

4.- Eligiendo el Color de la orilla del rectángulo

Seleccionamos el color de la orilla del rectángulo

Ajustamos el tamaño de la orilla del rectángulo (Line style)

5.- Insertando el texto

Elegimos la herramienta de texto

Elegimos el tamaño del texto

Elegimos el color del texto

6.- Sombreado del texto

Seleccionar texto (text tool)

Seleccionamos menú objeto (Drop Shadow)

7.- Parámetros de sombreado

Angle

Representa el ángulo de la sombra

Offset

Representa la posición de la sombra con respecto al texto

Blur

Representa el difuminado de la sombra

Opacity

Es el control de la opacidad de la sombra

Insertar imagen


Se busca una fotografía o dibujo para complementar el diseño del encabezado


Una vez localizada la imagen, se copìa (Ctrl+c)


Dentro de ACDsee se pega la imagen (Ctrl+v)

8.- Salvando la imagen para insertarla en Blogger

Una vez terminado la edición de la imagen, es necesario exportarla a un formato que pueda ser importado al encabezado dentro de blogger.


Se selecciona file-Save as


Selecciona el formato PNG, en la pestaña de tipo de archivo 


Selecciona guardar.


Utilizamos el formato PNG ya que este formato optimiza las imágenes para internet, y respeta la transparencia del dibujo.












9.- Insertando la imagen en blog


Para insertar la imagen en el blog, nos ubicamos en la sección de visión general.


Posteriormente se elige "Diseño"


Se selecciona "editar" en la sección de cabecera


En la sección de imagen se selecciona examinar en "desde su equipo"


Se elige la imagen que se salvó en ACDsee


Seleccionar en ubicación "en el lugar del título y la descripción"


Se selecciona "guardar"

Sesión 5: "DIAPOSITIVAS INTERACTIVAS EN BLOGGER"

DIAPOSITIVAS INTERACTIVAS EN BLOGGER

Uno de los archivos que pueden hacer mas lenta la navegación en internet es el mapa de bits.

Una pagina que esta cargada de imágenes tarda considerablemente mas tiempo en cargar que una con solo texto, si queremos ilustrar una entrada con un contenido determinado de fotos nos puede convenir a fines de hacer más fácil el acceso a nuestra entrada, incorporar una presentación de diapositivas interactiva directamente de un sitio administrador de imágenes como FLICKR. Una alternativa viable también lo puede ser PICASA o PHOTOBUCKET.

La manera en que se incorpora dicha presentación es la siguiente:

Buscamos en nuestro respectivo perfil de FLICKR la opción de EMBED, que nos generara un código en donde determinamos la medida de la ventana que vamos a importar a nuestro blog. Observar el tamaño de la ventana de diapositivas es basico para asegurar que no se desborde del area de escritura.

El código de la presentacion se pega directamente en la modalidad de HTML, de nuestro editor de texto.

Hay que tener cuidado de recorrer el texto hasta el fondo del documento para no sobreescribir alguna instrucción.

En esta sesión emplearemos dos variantes de la diapositiva integrada a nuestro blog, la básica ofertada por FLICKR, y la avanzada a través de PICTOBUILDER.

A continuación incluimos ejemplos de cada una.

Pasos para utilizar el servicio PICTOBROWSER de PICTOBUILDER

ACCESAMOS en nuestro navegador www.db798.com/pictobrowser o www.pictobrowser.com

En la pagina de bienvenida de PICTOBROWSER presiono el botón de PICTOBUILDER que se encuentra ubicado en la parte superior derecha. 

En donde nos indica "ENTER YOUR SCREEN NAME" escribimos el nombre de usuario de nuestra cuenta de FLICKR que se encuentra directamente en nuestra bienvenida a FLICKR (el saludo en varios idiomas). Presionamos el botón de CONTINUE. 

En la siguiente pantalla seleccionamos la opción de SETS.

Esta opción nos despliega los títulos de álbumes que hemos creado en nuestra cuenta de FLICKR.Seleccionamos uno de esta lista. 

Nos aparece la pantalla de vista previa en la columna de la izquierda aparecen los controles de la diapositiva a la derecha se reflejan inmediatamente los cambios que realizamos. 

Controles:

A) Image Settings: Predeterminamos el tamaño y calidad de las fotos. Si fueron extraídas directamente de internet puede no presentar cambios, si en contraparte fueron subidas a FLICKR de una cámara digital, podemos bajar la calidad para que no tarden tanto en visualizarse.

B) Alineación de la imagen: orientamos las fotografías en función de como fueron tomadas (retrato o paisaje) cargándolas hacia cualquiera de los dos costados de la ventana o bien centrándola en el espacio del reproductor. 

C) Opción de SCALE TO FILL: esta opción aumenta o disminuye el tamaño de las imágenes para que llenen la mayor parte de la ventana posible.

MUY IMPORTANTE: si las fotos no cuentan con suficiente resolución, esta opción pixelea las imágenes. 

D) PLAYER SETTINGS: Son los ajustes del reproductor. Aquí podemos determinar el ancho y el largo del reproductor expresados como valores de HEIGHT and WIDTH (alto y ancho), medidos en pixels que se ajustan en relación al tamaño de nuestra pantalla.

TITLES: define si se muestran o no los títulos de cada imagen de acuerdo a lo que indique FLICKR.

NOTES: incluye o no la descripción de cada foto esta opción también depende de lo que hayamos definido en FLICKR. 

AUTO-HAIDE: este ajuste hace que los controles de mi presentación se oculten automáticamente cuando no este el mouse sobre la ventana del PICTOBUILDER.

a tecnología de Blogger.

Sesión 8: "EDICIÓN BÁSICA DE PLANTILLA EN BLOGGER"

EDICIÓN BÁSICA DE PLANTILLA EN BLOGGER

La plantilla de blogger cuenta con muchas opciones y características predeterminadas que permiten su implementación y funcionalidad desde que creamos la cuenta. De cualquier modo, nuestro blog cuenta con una serie de herramientas adicionales que, combinándolas con la reestructuración del espacio y ajustes mínimos por parte del administrador (nosotros)  nos permiten crear una página y una experiencia de usuario altamente personalizada y optimizada para nuestro proyecto.

Consideraciones:

Nuestro blog no es una sola página integrada sino una recopilación de pequeños programas ensamblados en un espacio que, integralmente conforma nuestro blog. El Área donde publicamos los contenidos tiene sus propios ajustes y controles, podemos personalizar cualquier dato, como la fecha y activar y desactivar la capacidad de nuestro blog con otros servicios en línea. Podemos también integrar una pequeña encuesta de opinión del visitante sobre nuestros contenidos, etc. La barra o columna de usos múltiples en blogger (que por lo regular se encuentra en el costado derecho de la pantalla) cuenta con mayor flexibilidad aún, ya que tiene una serie de espacios configurables en donde podemos integrar nuevos programas con nuevas características. 

Dichos códigos con nuevas funciones se llaman GADGETS y en algunas otras plataformas se llaman GIZMOS. Son palabras en inglés usadas comúnmente para designar un aparato que realiza alguna función sin ser específicos con su nombre.

Para acceder al menú de configuración básica en nuestro panel de control l, localizamos el apartado de DISEÑO y desde ahí accesamos la paleta de GADGETS.

1.- MENÚ DE ENTRADAS 

Este apartado define el comportamiento de las características básicas en el formato de nuestras entradas, como por ejemplo: el formato de la fecha, las etiquetas, las encuestas para usuario, el texto de salto de página (que veremos a continuación) etc.

2.- LISTADO DE PAGINAS DE NUESTROS COMPAÑEROS


Utilizando el GADGET de listado de páginas podemos crear un pequeño directorio de los miembros de este grupo para no usar la palabra "nuestro". Este apartado logra activar dichos hipervínculos de modo tal que quedan permanentemente añadidos a la columna de usos múltiples de nuestro blog.

3.- GADGET DE SUSCRIPCIONES


Este gadget funciona recopilando los correos electrónicos de los visitantes a nuestra página. Estas direcciones se convierten en una lista de usuarios a los que les llegará de forma automática una copia de nuestra mas reciente entrada, que podrán leer directamente en la bandeja de entrada de su correo (ínbox) o bien dar click para llegar directamente a nuestro blog.

4.- GADGET DE BÚSQUEDA PERSONALIZADA


Esta pequeña aplicación crea un campo de búsqueda (que emplea tecnología de Google) que primero trata de encontrar incidencias, en nuestras publicaciones de palabras claves, etiquetas, redacciones alternas, etc. Podemos también configurarlo para que muestre resultados de las páginas que mencionamos o ligamos desde nuestra página y en un caso extremo resultados de toda la web. 

AÑADIR GADGET "SEGUIR POR CORREO"

AÑADIR GADGET "CUADRO DE BUSQUEDA"

AÑADIR GADGET "CONFIGURAR PRESENTACIÓN"

5.- GALERÍA DE FOTOS POR MEDIO DE UN GADGET DE HTML/JAVASCRIPT


Podemos incorporar directamente desde un servicios como FLICKR una ventana de código permanente pegada en la plantilla de nuestro blog. Las ventajas son varias:
por una parte no se rezaga en entradas pesadas nuestro contenido, además, cualquier cambio realizado directamente en nuestra galería en Flickr se refleja de modo automático en la ventana de nuestro blog, asumiendo que "refrescamos" la página o presionamos la tecla F5. Esta es una manera de mantener vigente el contenido de nuestro blog.















De la mismo modo en que podemos "transplantar" código en nuestras entradas (en la forma de presentaciones interactivas como las de PREZI y/o diapositivas de fotos, tanto de FLICKR  como PICTOBROWSER) podemos emplear un GADGET que pueda interpretar dicho código y fijarlo permanentemente en la barra de usos múltiples a un costado de nuestro blog. 

6.- GADGET DE ENCUESTAS

Esta pequeña aplicación permite generar una pregunta y ofrecer varias respuestas para llevar un consenso dentro del marco de un periodo finito de tiempo. Podemos permitir cualquier número de respuestas, y una vez terminada su ventana de aplicación, podemos mostrar los resultados de la interacción con los usuarios.