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

Glosario de terminos básicos para el diseño gráfico a travès de medios electronicos.
1.- ¿Que es un pixel?
El pixel es la unidad de color con luz minima que puede representar un medio electronico. Su forma física mas tangible es un punto de color en la pantalla. En televisiones y monitores mas grandes tambien 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 combinacion de los 3 colores, generando luz blanca cuando se combinan todas en la misma proporcion.
Todas las medidas de graficos en cualquier medios electronicos se expresan en pixeles, siendo la medida de 800x600 la misma usada hasta antes de los monitores SVGAy aun mayores con los monitores de alta definicion y pantalla plana.

2.- Que es un megapixel?
Se le llama megapixel a una matriz de aproximadamente un millon de pixels, dispuestos en columnas e hileras para conformar una imagen mas grandes, lo que favorece su ampliacion sin que suceda la nivelacion a 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, por ejemplo en 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 ampliacion de una imagen que no fue creada para verse de cerca.

Pasa muy seguido con imagenes que fueron bajadas de internet y se imprimen en papel revelando su pixelizacion.

- Formatos de imágenes mas populares y sus usos:
JPG: es el mas usado en la web. Cuando una imagen está en este formato nos indica que ya fue comprimida (no esta en su máxima resolucion) y que esta optimatizada 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 la pantalla en tamaños relativamente pequeños que no ocupen mucho espacio en memoria) por ejemplo que excedaan el tamaño permitido en el correo electronico) pero tiene 2 caracteristicas que diferenciasn de potros formatos:
1.- Permite varios cuadres de imagenes en solo archivo, por ejemplo, fotos animadas. y 2.- para poder almacenar este tipo de informacion de animacion, sacrifica colores, ya que cuenta con un numero limitado de colores para mostrar.

SESION 11: CONFIRMACION DE LA INTERCONECTIVIDAD ENTRE PAGINAS.-

   Esta entrada debe aparecer en varias plataformas de comunicacion para comprobar que realizamos adecuadamante los siguientes procedimientos:

1.- Que nuestras entradas de Blog se comunican a traves de Twitterfeedcreando un duplicado de nuestra informacion y reproduciendolo en la forma de un nuevo tweet.

2.- Que nuestros Tweets pueden ser a su ver re-publicados por otros usuarios de Twitter en la forma de un Retweer.

3.- Que aparte, Twitter esta debidamente sicronizado cn Facebook y que Facebook reproduce dichos tweets en mi muro.

4.- Que cualquier usuario de Facebook que utilize el boton de Like en mi pagina, puede suscribirse a esta informacion.

Sesion 10: INTERCONECTIVIDAD EN REDES SOCIALES Y NUESTRO BLOG 2 MICROBLOGGING

1.- MICROBLOGGING:


Esta variante de la publicacion de bitacoras en linea se distingue por ser la mas concisa y estar implementada para su rapida asimilacion en la forma de enunciados ilimitados por un numero predetrçerminado de caracteres pero integrado en su mensaje todas las herramientas basicas que snoforman una bitacora electronica, como lo son las respuestas, la republicaciones, los hipervincuilos, las etiquetas y las busquedas por topico. perioricidad, autor, o region geografica.

El servicio de microblogging mas popular es twiter.

Twiter es creado como una plataforma de comunicacion cuya particularidad es la extension de sus mensajes: solo 140 caracteres, incluyendo letras, numeros y espacios.

Estos mensajes, o Tweets )comparandolos con el trinar de una ave o tweeting) puede estar conformados por frases o una combinacfion de enunciados con hipervinculos (url) o una serie de marcadores precedidos por el simbolo de numero ( ) Que hace facil su busqueda y localizacion 


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

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

b) Acceder a nuestro cliente de informacion de TWITTERFEED

c) Activar la cuenta TWITTER integrandola al servicio que alimenta a FACEBOOK 

SESION 9: INTERCONECTIVIDAD EN REDES SOCIALES Y NUESTRO BLOG

Una de las herramientas mas utiles para la comunicacion entre un grupo de personas que revisan   consensadamente sus correos electronicos son los boletines y las notificaciones de redes sociales.

En este aspecto la comunidad virtual de Face Book ofrece una gama de servicios que facilitan la creacion de pags. dedicadas a organizaciones/grupo/negocio/clubes y/o instituciones que ademas cuenta con una amplia gama de caracteristicas quen nos permiten en conjunto con nuesro Blogg crear un solo canal de comunicacion que opera en varios niveles.

En un ejercicio vamos a integrar las notificaciones en Face Book con las publicaciones en blogger logrando que se notifiquen de manera personalizada los miembros de un grupo de usuarios de Face Book que acceden a formar parte de nuestra red social.

Pasos para integrar Face Book y Blogspot:

1.- Crear un usuario en Face Book, mediante una cuenta de correo existente y un password nuevo, Llenamos los formularios y presionamos siguente hasta llegar a nuestra pagina personal.

2.- Al pie de nuestro perfil personal existe el apartado para CREAR PAGINAS hacemos click para pasar al menu de seleccion.

3.- En este menu podemos definir el caracter de nuestra pagina, ya sea de caracter educativo, institucionesl, de negocios, grupos musicales, hobbies deportes, etc. Esto facilita a Face Book ayudarnos a promover los contenidos que se publiquen ahi.

4.- Una vez que definimos el sesgo de nuestra pagina, procedemos a llenar formularios. Si por ejemplo le hacemos en base a una escuela, llenamos campos como nombre, direccion, contacto, etc. Acompañando todo de una descripcion breve para cuendo seamos localizados por el motor de busqueda face Book.

5.- Accesamos a www.twitterfeed.com, que es la pagina que va a ligar el funcionamiento de nuestro blog con FBmediante un sistema de alimentacion de informacion que es conocido con las siglas de RSS, que significan en ingles Real Simple Syndication, Distribucion Tçrealmente Simplepara nuestra conveniencia, TwitterFeed no requiere programcion, solo crear un usuario con 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 las direccion de nuestro blog(http://nombredemi blog.blogspot.com), y probar si funciona la alimentacion RSS usando el boton de PROBAR.

7.- Le damos SIGUIENTE y selecionamos el servicio de Facebook del menu. Este formulacio nos pide que permitamos a TWITTERFEED accesar nuestro usaurio de FB y luego nos permite selecionar paginas que hayamos creado ahi. Aqui es donde seleccionamos espècificamente la pagina que creamos en los pasos 2 y 3. Ahora nuestras entradas se publican automaticamente en Blogger y Facebook y se notifica con un mensaje a cualquier usuario que este inscrito en dichas paginas.

SESION 8: Introduccion a la edicion de plantillas. Los Gadgets

Los Gadgets en Blogger:


Se le llama asi a los pequeños modulos de codigo que modifican el comportamiento del la plantilla de nuestro blog. Esto es, mas que ser una entrada nueva, es un componenete del diseño de nuesto blog que le aporta funcionalidad extendida o adicional. Aparte que no estan sujetos al acomodo cronologico de las entradas donde cada nuesvo articulo que publiquemos va a colocarse inmediatamente encima de lo anterior, relegando el contenido a fondo de nuestro blog. los gadgets por su parte estan anclados en la plantilla de nuestra página incorporados permanentemente al menu de nuestra pàgina.

Aplicaciones comunes de los diferentes tipos de Gadgets:

1.- Ventanas de video: Podemos copiar la direccion de algun video favorito y anclarlo a la columna izquierda o derecha de nuestro blog, dependiendo de su diseño, para que se cargue la pàgina, se corra dicho video.
2.- Galerias fotograficas fijas: podemos mandar llamar una pelicula de diapositivas y asignarla a algun espacio en las columnas laterales de nuestro blog.
3.- Directorios de blogs/paginas adicionales: podemos crear listados de nuiestras paginas favoritas, o bien listados de blogs de nuestros compañeros y mostrarlos de forma de una relacion de links convenientemente colocados a los lados de la pàgina.
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 rapìda visualizacion y referencia.
6.- Listado de etiquetas:relacion de palabras clave que facilita la busqueda de conteridos en nuestras publicaciones.
7.- Cuadro de busquedas: Similar a Google pero con la opcion de buscar dentro de nuestra pagina exclusivamente o bien a realizar una busqueda general en toda la web.
8.- La pestaña de diseño.
8.1.- Editar las opciones de la pagina de entrada.
a) Numero máximo de entradas de la pagina principal:
b) Texto predeterminado para el salto de pagina
c) Opciones adicionales de entrada:
- Tipo de fecha
- Título de la rubrica
- Publicación de horario
- etiqueta de comentarios
- Etiquetas
- Reacciones:

Sesion 7: Entrada de Prueba

Hola compañer@ ..... el esfuerzo y la dedicacion tiene sus recompensas a lo largo del camino se veran reflejados en tu vida.... tomalo en cuenta y nunca lo Olvides!!    AMIG@

Sesion 6: Grabación y alojamiento en linea de audio a través de SOUNCLOUD

Sondcloud es un servicio virtual de grabacion y almacenamiento de audio, que es publicado en la plataforma diseñada para sacar provecho de las redes sociales, ya que esta integrado con FACEBOOK, BLOGGER, TUMBLR, ETC.

Pasos para crear en SOUNCLOUD
1.- Accesamos a www.soundcloud.com
2.- Buscamos el boton de SING IN
3.- Seleccionamos una de dos opciones:
a) Registrarnos con nuestro usuario de Facebook (que nos lleva a una pantalla donde Facebook nos pide aurizamos a SOUNDCLOUD para que use nuestra informacion de usuario) o bien:
b) Registrarnos con una cuenta de correo (este sera nuestro usuario) y un password que sera nuestra clave en
SOUNDCLOUD (no tiene que ser necesariamente el mismo password del correo).
4.- Se va a mandar a un correo de confirmacion a la direccion de mail que isamos en el inciso b. Haciento Click en ese mensaje podremos activar finalemnte nuestra nueva cuenta en SC.
  - Como hacer grabaciones en SOUNDCLOUD
1.- Localizamos enl boton de UPLOAD and SHARE que se encuentra en nuestra pagina de bienvenida de SounCloud
2.- Seleccionamos una de las dos opciones Upload o Rec UPLOAD: se abre la ventana para seleccionar archivos desde nuestra computadora y se suben, los formatos mas comunes son: mp 3, wav, aif, aac, etc.
3,. REC es el boton que activa la gtabaccion, que solo puede hacerse si tenemos conectado un microfono a la computadora (en el conector de color rosa) o a traves del microfono integrado de las laptops. NOTA: Para realizar sisn problemas el proceso de grabacion es necesario revisar quie el reproductor de ADOBE FLASH esta actualizado, buscando en Google "descargar adobe flash".

Sesion 5: 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, discurso, etc. Con una duracion no mayor a los 4:30
2.- Utuilizar 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.soundcloud.com, subir la gravçbacion mp3 a nuestro perfil de SOUNDCLOUD
4.- Exportar el codigo de SHARE y pegarlo en esta misma entrada, al pie del texto. BUSCAR EL TEXTO DE EMBED CODE, copiarlo
5.- Pegarlo en esta entrada, en EDITAR HTML

Nocturninos - Carlos Loret de Mola y Laura G captados en cabaña - Tv Notas by Gigi`s

Sesion 4: Edicion Avanzada de entradas. Diapositivas Interactivas

1.- El servicio de alojamiento de fotografias FLICKR:
 - Este servicio funciona como una comunidad para el almacenamiento. intercambio y distribucion de fotografias digitales y despues de facebook, es la galeria mundial de fotos mas extensa.
El factor importante para nuestro blog que ofrece FLICKR es poder utilizar las presentaciones o los reproductores de diapositivas que se pueden insertar sin problema en nuestro blog.
2.-Pasos para obtener una cuenta en FLICKR
a) Acceder a www.flickr.com y buscar el boton de CREATE ACCOUNT o SING IN (crear cuenta o acceder con usuario a password)



b) Crear usuario con password desde  cero o bien acceder con el usuario con password desde cero o bien acceder usaurio de YAHOO (nombre de correo) o googlee (nombredecorreo@gmail.com) BUSCANDO LOS BOTONES RESPECTIVOS.

c) Desde nuestro panel de control, (en donde FLICKR nos da la bienvenida en varios lenguajes) ubicamos el boton de "subir fotos o video" que se encuentra en la esquina superior derecha.

d) Cuando estemos en la pantalla para subir archivos podemos seleccionar multiples imagenes sin mantener presionada la tecla CTRL: y hacemos click en ABRIR.
e) Esperamos a que FLICK nos muestre la pantalla de avance dosnde nos indica el porcentaje de cada imagen que esta subiendo de modo simultaneo.
f) Seleccionar si las imagenes van a ser publicadas o seran privadas (solo las veremos cuando registradas en el sitio)
g) Despues de guardar las imagenes entramos a la pantalla descripcion donde podemos hacer varias cosas, entre elllas: 
-Darle un nuevo titulo a las imagenes
-Añadir una descripcion
-Editar las etiquetas de todo el lote de imagenes que subimos, o bien etiquetar las etiquetas de una por una
-CREAR UN ALBUM (Que incluya titulo, y descripcion) Tambien podemos añadir el nuevo lote de imagenes a un albun existente previamanete creado.
3.- Compartiendo nuestros albums a traves de correo electronico.
a)Desde nuestra pagina de bienvenida (panela de control) accesamos a nuestra seccion de GALERIAS
b)La seccion de galerias cuenta con dos clolumnas: a la izquierda un listado de todas nuestras fotos e imagenes, ordenadas segun las hemos ido anexando a nuestra coleccion. A la derecha una columna que muestre el titulo de cada uno de nuestros albums acomodados segun nuestro propio criterio.
c)En  el apartado de albums seleccionmamos uno de elllos. Esto nos lleva a la pagina de descripcion del album que incluye su titulo, unos breves parrafos describiendo sus contenidos y reproducciones en miniatura de todas las fotos que contiene.
d)En esta pagiona selecionamos el icono de presentacion, que se encuentra ubicado en la parte superior derecha de la pantalla y tiene la forma de una pantalla para protector.
e)Cuando la pantalla se obscurezca y nos muestre las fotos a manera de dipositiva, ubicamos en el menu superior el boton de COMPARTIR.
f) Porque ahora si me acorde que esta seguia  En el boton de compartir
g)En una pestaña aparte u otra ventana del navegador de internet introducimos la direccion pertinente de la pagina de nuestro correo electronico. (www.hotmail.com, www.yahoo.com,www.gmail.com, etc. seguin sea el caso).
h)Creamos un correo nuevo. Cuando redactemos el contenido de dicho correo PEGAMOS el URL (direccion de internet) que copiamos en el paso (f)

i)Hacemos click en enviar.



o
Procedimiento para importar una presentacin de diapositivas desde flickr.
 1.- Es partiendo de una galeria en flickr que contengan uno o mas albumes, accedemos al de nuestra preferencia y ubicamos el boton de PRESENTACION que se encuentra en la esquina superior derecha de la pantalla.
 2.- Dentro de nuestra PRESENTACION (pantalla negra) encontraremos el boton de COMPARTIR, que cuenta con el apartado de "personalizar código html".
 3.- En la pag. para personalizar el código, podemos escoger 
algunas de las medidas predeterminadas que se incluyen ahi, o bien seleccionar una medida personalizada (expresada en pixels)  si activamos la opcion de preservar relacion de apariencia, FLICKR va complementar la medida que pongamos para que nuestra ventana de fotos no deforme sus proporciones.
 4.- El cópdigo que me brinde la pag. voy a subrayar en azul y voy a copiarlo con CTRL + C O EDITAR/COPIAR
 5.- En mi blog hay dos pestañas para editar el texto de mis entradas: una que dice REDACTAR que sirve para todo lo relacionado con párrafos de texto, fotos y videos, y otro que dice EDITAR HTML, que sirve poara modificar codigo HTML que genra BLOGGER.
Normalmente BLOGGER lo hace sin aistencia del usuario, y rara vez tendremos que editarlo. En este caso lo usaremos porque vamos a insertar código copiado desde otra página (FLICK)
 6.- Recorremos nuestro cursor hasta el ultimo renglón de texto, esto es para no sobreescribir alguna de las instrucciones que aparecen en pantalla.
 7.- Utilizando editar/pegar o CTRL + V, pegamos el cÓdigo que copiamos en la pagina de FLICKR
 8.- En este punto ya podemos publicar nuestra entrada o bien presionando la pestaña de REDACTAR podemos seguir escribiendo.

http://html-color-codes.info/codigos-de-colores-hexadecimales/


Get the flash player here: http://www.adobe.com/flashplayer

Sesion3: edición avanzada de contenidos en blogger

Estás en medio de un enjambre de abejas 
Que pícan de celos tu piel 
Tus pulsaciones se han acelerado 
Sumas uno y uno y dá tres 

Corazón que no se doma 
Y que no escucha mentiras de miel 
Díces que el tuyo puede compartirse 
Anda véte yá y sígue tu camino 

Al pan, pan y al vino, vino 
Que contigo viene y contigo se vá 
Dispara pan y al vino, vino 
Que contigo viene y contigo se vá 

Qué poco duran los sueños dorados 
Qué poco volaron mis pies 
No quiero amarte en un castillo de naipes 
Quitas uno y todo se fué 

No llames plata a la bisutería 
Ni diamante a un trozo de cristal 
Disfruta ahora de tu fantasía 
Que vestida de ovejita te ha cazado el lobo 

Al pan, pan y al vino, vino 
Que contigo viene y contigo se vá 
Dispara pan y al vino, vino 
Que contigo viene y contigo se vá 
Pan, pan, pan, pan, vino, oh, oh 
Pan, pan, pan, pan, vino, oh, oh 

Al pan, pan y al vino, vino 
No cojas la rosa, 
que ésta tiene espinas 
Al pan, pan y al vino, vino 
Que lo que te ha dado, 
luego te lo quita 

Marcado por tu alevosía 
me desenredo yá 
Pan, pan, vino, vino 
Pan, pan, vino, vino 
Al pan, pan y al vino, vino 
Dispara Pan y al vino, vino 

Al pan, pan y al vino, vino 
Que contigo viene y contigo se vá 
Dispara pan y al vino, vino 
Que contigo viene y contigo se vá 

Al pan, pan y al vino, vino 
Que contigo viene y contigo se vá 
Dispara pan y al vino, vino 
Que contigo viene y contigo se vá

 Como descargar y guardar videos de internet:
 1.- Ubicar el video que vamos a descargar ( www.youtube.com,vimeo.com,dailymotion.com,etc).
 2.- Ubicar la dirección o URL donde se encuentra el video (se encuentra en el campo de direccion del navegador).
 3.- Seleccionar y copiar con ctrl + C.
 4.- Entrar a www.keepvid.com y pegar el URL en el recuadro azul, usando ctrl.+ V.
 5.- Dar aceptar cuando nos pide ejecutar el programa.
 6.- Escoger el formato para descarga, escogiendo la resolucion (si es posible) 480 o 720 puntos.
 7.- Descargar el video.

Creación de Hipervinculos (URL, direcciones de internet en link ó enlace).
Podemos crear párrafos de texto en donde ciertas palabras sean hipervinculos que nos conduzcan a otras páginas tales como: definiciones de wikipedia, busquedas de imagenes, resultados de google, páginas de entretenimiento, etc.
Sus aplicaciones pueden facilitarnos el trabajo a la hora de hacer citas de contenidos o referenciar información.
Pasos para generar hipervinculos:
 1.- Redactamos los textos en la ventana de nuestra entrada en blogger.
 2.- En una pestaña aparte metemos la dirección de internet que planeamos visitar.
 3.- Copiamos el URL o la dirección de ese contenido.
 4.- Seleccionamos la palabra que se va convertir en nuestro hipervinculo en nuestra ventana de blogger.
 5.- La subrayamos con el mouse y presionamos el botón de enlace que se encuentra en el menu de editor de texto.
 6.- Se abre el menu de enlaces con tres campos de información:
           1.- La palabra que se va convertir en enlace.
           2.- URL a visitar
           3.- Botón para checar la página, (aceptar).
Texto de ejemplo:
Para visitar mi pág. favorita has clik aqui.

 

Sesion 2: Introduccion al menu de entradas blogger

INTRODUCCION AL MENU DE ENTRADAS BLOGGER.

      1.-Requisitos básicos:
Tener una cuenta previamente activada en gmail.
      2.- Haber dado de alta un blog a nuestro nombre.
      3.- Definir una fecha de publicación.
a) Creando una entrada nueva (insertar una foto del menú de entrada), detallar una lista de componentes del menú de entrada. 1º Titulo de mi entrada, campo para el titulo de mi entrada, 2º Campo para edición de textos: En este campo se realiza la redacción de nuestros contenidos y presenta una barra de herramientas que hace las veces de un editor de texto simplificado que incluye lo siguiente:
1.- Botón para seleccionar tipografías que tiene una selección básica de serif y san serif, como por ej. La Trebuchet, Arial o Times new Román.
2.- Carácter de la letra o estilo: negritas, itálicas,  subrayadas, subtachadas.
3.- Botones multimedia, sirven para incluir fotos, videos, vínculos, etc.
4.- Colores sirve para determinar el color de la letra y su subrayado.
5.- Alineacion de los párrafos que incluyen orientaciones izquierda, derecha, centrado y justificado.
6.- Botón de salto de pagina: sirva para insertar un indicador de que hemos truncado el texto para que no aparezca un texto muy extenso si el usuario no quiere verlo.
b) Programando la publicación de nuestras entradas. Cada escrito que realizamos en el editor de texto, se grava automáticamente dentro de nuestro blog en la forma de un borrador lo que facilita seguir editándolo de cualquier computadora.