14 sesion Personalizar nuestro blog con interface de diseño avanzado

En  con el funcinamiento gral c de nuestro blogs de la misma manrera podemos aumentar de la manera de gadget que aportan
fuera de esto podemos reacomodar el orden en que esta funciones aparecen en el espacio designado a nuestro blogs, pero con todo y todo es una herramienta limitada en cuanto a flexibilidad y capacidad de personalizacion de nuestro blogs.
Es entonces que para hacer ajustes mas didacticos en la aparencia y funcionalidad de nuestro sitio.
recurrimos a la interface del diseñador de plantillas
Este apartado de nuestro panel de control esta dividido en dos partes
1.- (Parte Inferior) La vista previa dinamica:Se llama asi porque refleja inmediatamente (esto es, sin tener que refrescar la pagina) Estos cambios son solo aparentes en esta pagfina y seconvierten en ajustes permanentes si y solo presionamos el boton de APLICAR AL BLOG
2.- (Parte superior) El menu de ajustes:
Este menu afecta la aparencia y dispocicion de los elementos graficos de nuestro blog y abarca varios apartados especificos
a) Plantilla General: este apartado nos permite selecionar de una variedad de plantillas prediseñadas que cuentan con una aparencia o estilo grafico definido. Ala vez cada una cuenta con un submenu que muestra variaciones del mismo concepto, como puede ser alguna variante en tonos de color o algun ajuste en las decoraciones de la pagina.
b) Apartado de fondo: ( En algunas paginas que nio estan traducidas este apartado puede aparecer como Backgruond o clorways) en este menu podemos seleccionar con los de color solido que vienen cobinados con colores adicionales) para el fndo de nuestra pagina, o bien podemos selecionar una imagen ( por lo regular de 1800 x600 pixeles) aqui se cierra el parentesis De las que vienen precargadas en la interfase. tambienpodemosseleccionar desde nuestra computadora una imagen de aproximadamente de la misma medidas y subirlas para ser usada como fondo. El limite de peso/ respolucion de la foto no debe exeder de los 300 kilobites
c) Ajuste de medidas del blog:
En este apartado por lo regular contamos con 2 deslizadores que nos permiten incrementar /decrementar el ancho de una columna principal de nuestro blogs (En donde se publican las entradas principales, la fechas y los titulos del contenido) Adicionalmente contamos con el deslizador del ancho de columnas secundarias que contiene por lo regualar los gadgets que hemos incorporado a la plantilla ademas de los directorios e indices de nuestro blog. Consideraciones el ancho de la pantalla promedio es de aprox. 1034 pixeles lo que nos permite ajustar medida dentro de los rango de los 980 pixeles hasta los 780 aprox. para fines de no truncar la longitud de los encabezados o crear un sitio que nose muestre completo debido a su medida excesiva
d( Apartado de diseó:
Esta seccion nos permite organizar y orientar los eelmentos de la pagina de acuerdo a la relacion entre las paginas principales y las paginas secundarias que cuentan con gadgt e indices etc.
Trabajando de la mano con elm apartado anterior, donde justamos el tamaño poidemos crear un espacio amplio libre de distracciones visuales donde solo se muestre el texto de las entradas,obien un espacio que concentre mucha informacion en una aera reducida como el caso de incluir hasta dos columnasadicionales de contenido extra esto por lo regular conlleva a aumentar el ancho de las columnasPOR LO REGULAR CON LLEVA 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 relatico a las tipografias y colores que se emplean para desplegar los contenidos 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 los textos 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 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 particualr d enuestro diseño, este ha sido substituido por un encabezado diseñado en ACDSEE photo editor, así 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 ubicacion fue determinada en el apartado de DISEÑO.
-Apartado de imagenes: En este punto podemos modificar la manera 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.

e) Edición avanzada:
Este apartado de nuestra pantalla de edición de plantillas nos permite ajustar de manera precisa todo lo relatico a las tipografias y colores que se emplean para desplegar los contenidos 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 los textos 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 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 particualr d enuestro diseño, este ha sido substituido por un encabezado diseñado en ACDSEE photo editor, así 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 ubicacion fue determinada en el apartado de DISEÑO.
-Apartado de imagenes: En este punto podemos modificar la manera 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.

sesion 13como cambiar el titulo

programa ACDS seleccionamos  en file nuevo (new)
aparece un background se pone trasnparente
landcape
cambiar
width 960
height 250
resotution96 ok.
en objet palet selecciono y me voy a
object y buscodrop shadow para dar sombra
me voy a adjustment a distrort luegobevel
luego guardo como en mis documentos como PNG PNG(PNG)
paso a mi blogs paso a diseño selecciono EDITAR en cabecera
tomar imagen de internet guardar como en tus documentos abres programa ACDSseleccionas addimages y tomas en mis doc la  de internet seleccionar en el recuadro select (varita magica o magicwandtool) pasamos a editar y seleccionamos invertir selection

sesion 13 la buenaUtilizando editores defoto para rediseñar mi blog

para crear un proyecto con la siguiente medida 960 pixeles de ancho por 250 pixels de alto que es la medida aproximada del ecabezado de mi blog.
el proyecto debe reunir los siguientes requisitos
a) debe estar resolucion web (96pixeles por pul. cuadrada)
b) fondo transparent) la version final de este archivo que debe guardar como PNG
2.- utilizamos la herramienta de texto para  redactar el titulo de nuestro blog con la cual podemos seleccionarla tipografia el tamaño y el color
uan vez que redactamos el titulolo convertimos en objeto haciendo doble lick esto nos permite poner efecto como sombra y bisel creando de este modo texto artistico o decorativo.
3.- importamos el logotipo de la UEEPy selecionamos el fondo para eliminarlo uzando la varita magica y la invertimos en editar, copiamos y pegamaos en nuestro documento original
4.- en este punto el logotipo es un objeto al cual se le pueden aplicar texto ajustamo tamaño y pocicion , y lo exportamos todo aPNG

sesio12 Introduccion al diseño grafico La aparecia de nuestro blogs

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

1..- ?Que es un pixel?
El pixeles la unidad de color con una luz minima que puede representar un medio electronico.
su forma fisica mas tangible es un punto de color de 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 serROJO, VERDE,AZUL, o cualquier combinacion de los tres colores, generando luz blanca cuando se combin todas 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 hasta antes de los monitores de alta definicion y pantalla plana..
2.- ?Que es un megapixel?
Se le llama megapixel a unamatriz de aproximadamente un millon de pixeles, dispuestos en columnas e hileras para conformar una imagen en un medio electronico. Mientras mas megapixles 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, por ejemplo en el caso de fotos que fueron tomadas para verse en pantallas de celular,cuando son amplificadas en un monitor de mayor tamaño, se pixelean.
4.- Artefactos: son las deformaciones regularmente de formas cuadrdas o rectangulares que aparecen en pantalla cuando forzamos la amplificacion 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 imagenes mas populares y sus usos:

JPG: es el mas usado en la WEB. cuando una imagen esta en este formato indica que ya fue comprimida ( no esta en su maxima resolucion) 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 pixelea y se amplificade 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 exedan el tamaño permitoen un correoelectronico) pero tiene 2 carateristicas que la diferencian de otros nformatos: 1.- permite varios cuadro de imagenes en un solo archivo. por ejemplo, fotos animadas,2.- para poder almacenar este tipo de informacion de animacion,sacrifica colores, ya que cuenta con un numero limitado de colores para mostrar.

sesion 11confirmacion dela conectividad

esta entrada debe aparecer en varias plataformamas de comunicacion para comprobar que realizamos
1. que nuestras entradas de blog se cominican atraves de twitterfeed  creando un duplicado de nuestra informaciony reproduciendolo en la forma de un nuevo twitt
2.que nuestros twitt puedenser a su vez re-publicados por otros usuarios de twitter en la forma de un re.tweet
3. qque aparte, twitter esta debidamente sincronizado con fabook y que fabook reproduce dichos tweet en mi muro de facebook
4. que cualquier usario de facebook utilica el boton de  suscribirse a esta informacion

Sesión 10: Interconectividad en redes sociales y nuestro Blog 2: Microblogging

Microblogging:
Esta variante de la publicación de bitácoras en línea se distingue por ser la mas concisa y estar implementada para su rápida asimilació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 bitácora electrónica, como lo son las respuestas, la re-publicaciones, los hipervínculos, las etiquetas y la búsqueda por tópico, periodicidad, autor o región geográfica.

El servicio de microblogging mas popular es el twitter.

Twitter es creado como una plataforma de comunicación cuya particularidad es la extensión de sus mensajes: solo 140 caracteres incluyendo letras, números y espacios.

Estos mensajes o Tweets (comparándolos con el trinar de un ave o tweeting) pueden estar conformados por frases o una combinación de enunciados con hipervínculos (url) o una srie 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 TWITER a nuestra red social:
a) Crear una cuenta en http:// twiter.com
b)acceder anuestro cliente de informacion de TWITERFEED
c) Activar la cuenta de TWITER integrandola al servicio que alimenta aFACEBOOK
d)

sesion 9 Interconectividad en redes sociales y nuestro blogs

Una de las herramientas mas útiles para la comunicación entre un grupo de personas que revisan consuetudinariamente sus correos electrónicos son los boletines y las notificaciones de redes sociales.

En este aspecto, la comunidad virtual de Facebook ofrece una gama de servicios que facilitan la creación de páginas dedicadas a organizaciones/grupos/negocios/clubes/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 comunicacion que opera en varios niveles.

En este ejercicio vamos a integrar las publicaciones en Blogger, logrando que se notifiquen de manera personalizada  a los miembros de un guupo de usuarios de Face book que accedan  a formar parte de nuestra red social.
pasos para integrar facebook y blogspot:

1.-Crear un usuario en FaceBook, mediante una cuentade correoexistente y un password nuevo.LLenamos los formularios y presionamos siguiente 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, institucional de negocios, grupos musicales,hoobies,deportes,etc.Estole facilita aFace book ayudarnos a promover los contenidos que se publiquen ahi
3.- Una vez que definimos el sesgo de nuestra pagina, procedemos a llenar los formularios.si por ejemplo la hacemos en base a una escuela. llenamos campos como nombre,direccion,contacto,etc.Acompañadotodo de una descripcionbreve para cuando seamos localizados por el motor de busqueda de Face book
5.- Accesamos awww.twitterfeed.com, que es la pagina que va a ligar el funcionamiento de nuestro blog con FB, mediante un sistema de alimentacion de informacion que es conocido con las siglas RSS. que significan en ingles REAL SIMPLE SYNDICATION, distribucion realmente simple., para nuestra conveniencia, Twiterfeed no requiere programacion,solo crear un uasuario con una cuenta de coorreo existente y un password o clave que no debe ser necesariamente la del otro correo mencionado.
6.- Para activar TwitterFeed hay que copiar la direccion de nuestro blog (http://nombre de mi blogspot.com) y probar si funciona la alimentacion RSS usando el boton de PROBAR.
7.- Le damos SIGUIENTE y seleccionamos el servicio FACEBOOK del menu. Este formulario nos pide que permitamos que TWITTERFEEDaccesar nuestro usuario de FB y luego nos permite seleccionar paginas que hayamos creado ahi.
Aqui es donde seleccionamos especificamente la pagina que creamos en los pasos 2 y 3. Ahora nuestras entradas se publican automaticamente en blogger y facebook y se les notifica con un mensaje a cualquier usuario que este inscrito en dichas paginas.