|
Añade un botón del sitio -->
Tutorial de Blogger en Firefox: marzo 2011
Práctica con Picasa
Picasa Permite el inventariado de todos los archivos gráficos del ordenador, su clasificación y ordenación, e incluye además herramientas de edición y retoque fotográfico. El programa interactúa con picasaweb permitiendo colocar las fotos directamente en los álbumes dentro de Internet. Vais a realizar 3 ejercicios dentro de Picasa, primero vais a crear un álbum con una serie de fotos que enlazareis en vuestro blog, después vamos a crear con estas fotos una película que va a llevar música incorporada y por último realizareis un retoque fotográfico a una imagen. Debéis crear un álbum con las 11 fotos del alud en Sierra Nevada, para esto tienes que pulsar en Descargar y Descargar en Picasa. Una vez abierto Picasa, pulsas en Archivo---Álbum nuevo y le pones por título, “Alud en Sierra Nevada”. Te tendrás que dar de alta en álbumes de Picasa con el mismo nombre y contraseña que en Google. Una vez tengas el nuevo álbum publicado, inserta la dirección en una entrada de tu blog. Para crear una película con esas imágenes, las seleccionas en Picasa y pulsas en Crear---Película---de la selección, le añades ésta pista de audio, que previamente debes descargarte a tu equipo y en estilo de transición, eliges “Panorámica y acercar o alejar”. Una vez lo tengas hecho, lo guardas en tu carpeta con el nombre “Alud en la sierra” debe tener aproximadamente 19 Mb. Vamos a utilizar Picasa para realizar retoque fotográfico, vas a descargarte esta foto, la guardas con extensión bmp, y tienes que conseguir convertirla en la de más abajo. Las operaciones que tienes que realizar son, Ojos rojos, Voy a tener suerte y Retocar, donde tienes que cambiar el color de la pupila blanca de la izquierda, el resultado debe ser algo así:
Una vez terminado el retoque guardas la imagen con el nombre ojos.jpg
Ejercicio con la plantilla actualizada de Blogger
En Plantilla---Personalizar diseño---Actualizar la plantilla, entramos en la plantilla actualizada de Blogger, donde podemos incluir diversos elementos a través de gadgets. Pues bien vais a publicar los siguientes 5 elementos, parte de ellos también requieren alguna investigación a través de Internet, los 5 elementos los puedes ver publicados en esta página: Script, es un pequeño programa escrito en Javascript que se ejecuta en el navegador al entrar en una página web, ver ejemplos aquí , este que aparece al pulsar en el enlace: (Vas a entrar en curso-08), sería uno, o bien el que averigua la letra del DNI. Pues bien debes incluir al menos dos script, para lo que tendrás que averiguar en Internet los códigos de los script correspondientes. La forma de incluirlo en tu blog es muy sencilla, en Diseño---Añadir un gadget---y dentro de lo básico, eliges el elemento HTML/Javascript. Ahí es donde tienes que pegar el código html encontrado en tus investigaciones en Internet. RSS, debes incluir el botón de suscripción RSS, que ya incluiste en la plantilla clásica. Encuesta, debes crear una encuesta, con las preguntas que tú quieras. Galería, debes crear una galería de imágenes. Barra de vídeo, también debes crear la barra de vídeo
Recuerda que todos estos elementos son gadget que se añaden en Diseño, y el resultado de lo que tienes que realizar lo puedes ver en este blog. Una vez hayas conseguido estos 5 elementos me vuelves a enviar un correo a infor@albalonga.es con asunto blog-2 y en el texto la dirección de tu página como hipervínculo para que al pinchar en el enlace pueda comprobar lo que has hecho.
Ejercicio con la plantilla clásica de Blogger
Barra de búsqueda de Google: pulsamos en la pestaña Plantilla y en edición HTML y nos aparece el código de nuestra plantilla, tienes que conseguir que aparezca la barra de búsqueda de Google, encima del título de tu blog, para lo cual debes insertar el siguiente código HTML entre la etiqueta <head> y <title> en edición Html. <center><!-- esta etiqueta sirve para centrar la barra de búsqueda de Google -->; <br><!-- esta etiqueta corresponde a un salto de línea -->
<br> <!-- Búsqueda Google --> <table bgcolor="#FFFFFF" cellspacing="0" cellpadding="0" border="0"><!-- esta etiqueta crea una tabla --> <tr><!-- esta etiqueta crea la fila de la tabla --> <td><!-- esta etiqueta crea una celda de la tabla --> </a> </td> <td> <input type="text" name="q" size="25" maxlength="255" value=""><!-- define un objeto de ingreso en el formulario -- > </td> <td> <input type="submit" name="btnG" value="Buscar en Google"> </td> </tr> </table> </form> <!--Búsqueda Google--> </center>
En HTML casi todas las etiquetas abren con <etiqueta> y cierran con </etiqueta>, por ejemplo <table> inicia la creación de una tabla y </table> la finaliza. Al final el resultado tiene que ser como la imagen de abajo que puedes observar pulsando en Vista Previa y que tienes que guardar con el nombre barra-1.png. Pero para que puedas conseguir el resultado de la barra de búsqueda de Google, antes tienes que enviar una primera entrada que va a tener como título tu nombre y como contenido tu dirección de correo. Solo tienes que pulsar en Creación de entradas --- nueva entrada --- poner el título --- el contenido--- y publicar entrada, si quieres ver el resultado, pulsa en “Ver blog”. Intenta observar tu blog desde el navegador Internet Explorer y verás que la presentación no es exactamente igual, esto se debe a que por desgracia no todos los navegadores interpretan el código Html con los mismos estándares. Generar un icono de tu dirección de Gmail y situarlo en la barra de Google, encima del título del blog: Primero vas a generar el icono de tu dirección de correo de Gmail, el resultado tiene que ser parecido al siguiente icono
 solo que con tu nombre de usuario. No solo obtenemos la imagen en formato png sino que además esta página nos proporciona un enlace URL donde se guarda este icono en Internet: Ahora tienes que introducir el icono de tu dirección de correo de Gmail, en la barra de búsqueda de Google, tienes que tener en cuenta cual es la etiqueta HTML que carga una imagen ( ver el código de la barra de Google anterior) y tienes que introducir la etiqueta con la dirección de tu icono en Internet en el código html de la barra de Google, esta entrada te puede servir de ayuda. El resultado final debe ser el siguiente: Esta imagen debes guardarla con el nombre icono-2.png
Hipervínculos: inserta las 5 direcciones de Internet que más utilices, con sus hipervínculos correspondiente en la misma entrada, de manera que aparezcan los nombres de los sitios y no sus direcciones, algo parecido a esta entrada, pero con tus direcciones preferidas. Imagen con hipervínculo Primero tienes que subir la imagen en una entrada y una vez que la has subido tienes que incluir en el código HTML de la imagen, la dirección a la que quieras que se dirija la imagen al pulsar encima de ella, puedes ver este ejemplo de lo que tienes que conseguir. Es decir tienes que subir la imagen del Ies Alba Longa a tu blog y después en “Edición de HTML”, ver cual es la etiqueta que define un hipervínculo ( ver el código de la barra de Google) y sustituir el que tiene la imagen por el de la dirección de la página del instituto.
Feed del sitio: un canal web es un medio para suministrar información actualizada y frecuente a los suscriptores de la página web, es decir a través de este canal, los internautas se pueden suscribir a una página web para estar informados de sus novedades. Se utiliza mucho en los blogs y en prensa electrónica. Vamos a ver los pasos que hay que dar para conseguir instalar este botón que va a permitir a cualquiera que lea tu blog, suscribirse a sus contenidos En la pestaña “Configuración” de tu blog hay un elemento que se llama “Feed del sitio”, cuando tengas la dirección que te proporciona el servicio “FeedBurner”, tendrás que escribirla en la sección “Publicar URL redireccionada del feed”. Vas a entrar en FeedBurner que es quien te va a proporcionar el servicio de suscripción a tu blog. Se entra con los datos de tu cuenta de Google y, como en todos los servicios, te van a solicitar la información necesaria para que te registres. Puedes ayudarte de la traducción de palabras de la barra de Google, aunque no es aconsejable realizar la traducción completa de la página al español. Te dan la bienvenida y te piden que introduzcas la dirección de tu blog, pulsa en siguiente (Next in english). En la identificación de la fuente hay 2 opciones aunque las 2 nos llevan al mismo destino. Vas a marcar la opción RSS y pulsa en siguiente. Aparece ahora el título y la dirección del Feed, pulsa en siguiente. Ahora te felicitan por haber terminado el proceso y te dan la dirección del feed de tu sitio que tendrás que poner en la pestaña “Publicar URL redireccionada del feed” del apartado a. Pulsa en siguiente 2 veces puesto que la siguiente pantalla habla sobre estadísticas del servicio. Al final aparece una pantalla donde te dicen que has logrado realizar el feed de tu blog y aparecen 5 pestañas: analyze, optimize, publicize, monetize y troubleshootize, que vienen a ser, estadísticas, optimizarlo en audiencia, darle publicidad, hacer negocio con el blog y aclaración de dudas. En la pestaña Publicize, en hacer más fácil la suscripción, (make it easy to subscribe), pulsa en friendly graphic , para localizar un icono a partir del cuál se realice la suscripción. Elige el que está marcado por defecto y fíjate en el código HTML al final de la página, necesario para que salga ese botón en tu blog. Debes copiar ese botón y pegarlo en el código HTML de la plantilla de tu blog en el sitio indicado para que salga como éste. Tendrá que ir por lo tanto debajo del código de la barra de Google y debe aparecer también la palabra “Suscríbete”. Para comprobar que todo es correcto, al pulsar en el botón, deben aparecer los contenidos de tu blog. A partir de este momento cualquiera que entre en tu página y pulse en ese botón quedará suscrito a las entradas de tu blog.
Contador de páginas con SiteMeter: No hay un blog que se precie que no tenga un contador para saber el número de internautas que lo visitan. Vamos a utilizar la aplicación SiteMeter para este fin, aquí puedes encontrar indicaciones de cómo hacerlo. El resultado final debe aparecerse al contador que aparece en esta página. Elegimos Site Meter Basic Free, pulsa en Sign Up, introduce la dirección del blog y su nombre, escribe el código, comprueba si la hora es correcta, acepta las condiciones y pulsa siguiente. Introduce la dirección de tu correo y los demás datos, al final te salen los datos introducidos, pulsa en siguiente y ya has acabado. Aparece un menú con 3 elementos, estadísticas, administración y salir de la cuenta. Entra en Administración, elige el tipo de icono para indicar el número de visitantes en “meter style”, donde debes elegir uno en el que aparezcan valores numéricos, una vez elegido lo guardas y en la opción código Html, copias el segundo código HTML que aparece en la página. Este código debes pegarlo en el sitio adecuado de tu blog para que aparezca como aquí, justo al lado del icono del feed del sitio. Ya has logrado tu objetivo que es tener un contador de páginas visitadas encima del título de tu blog. Ahora viene un reto para investigadores que es el siguiente, si observas en esta figura el número de visitas está ligeramente por encima y muy pegado a la palabra “Suscríbete”, pues bien tienes que conseguir que el número baje un poco hacia abajo y que quede de esta forma es decir perfectamente alineado y algo más separado de “Suscríbete” y donde se ha añadido la palabra Visitas. Este último detalle no es obligatorio pero si lo logras, tendrás un punto más en la nota final de esta evaluación.
Vídeo en Blogger. Blogger admite 2 formas de enlazar vídeos, una es subiendo directamente un vídeo desde tu ordenador como una nueva entrada, y la otra es enlazar un vídeo existente desde Youtube. En tu caso vas a utilizar un vídeo que previamente he subido a YouTube y lo vas a enlazar en tu blog para obtener un resultado parecido a éste. El vídeo lo puedes encontrar en YouTube con el nombre cuco-albalonga.
Google Maps en el Ies Alba Longa, Tienes que ser capaz de crear una entrada tal como la que aparece aquí donde como puedes comprobar se puede visualizar nuestro Centro desde cualquier ángulo y desplazarte por su entorno. Como siempre tienes que utilizar en la entrada del blog el código HTML que te proporciona la aplicación Google Maps, una vez localizado el Instituto.
Crea una entrada en tu blog desde Outlook Express. Aparte de crear entradas en tu blog desde un navegador de Internet, también se pueden crear dentro de “Configuración” utilizando el elemento Correo electrónico y móvil utilizando la dirección de correo que aparece en “Dirección para la creación de entradas por correo electrónico” donde el asunto del correo aparece como título de la entrada y el contenido del correo como contenido de la entrada del blog. Vas a crear una entrada cuyo título va a ser Resolución del puzzle desde Outlook Express, y el contenido, va a ser tu nombre y la solución que bajo tu punto de vista tiene esta cuestión, es decir algo parecido a ésto. El primero que lo resuelva tiene ½ punto más en la nota final de la evaluación.
Traductor de Microsoft. Uno de los elementos más interesantes para tu blog, es que se pueda traducir a otro idioma en tiempo real, esto te lo permite la aplicación Microsoft Translator. Imagina la comodidad que le vas a proporcionar a los internautas de los distintos países que van a visitar tu blog, cuando solo pulsando un botón, pueden tener traducido a su idioma el contenido de tu página web. Para utilizar este recurso basta con que entres en la página de Microsoft Translator, pulses en “widget de la página web”, indiques la dirección de tu blog, eligas el color, aceptes las condiciones de uso y pulses en generar el código HTML. Como siempre tendrás que copiar ese código en tu plantilla para que obtengas un resultado parecido a éste. No te preocupes por la posición del widget, lo importante es que aparezca debajo de la barra de búsqueda de Google. Si además eres capaz de situar el widget en la parte superior derecha como en la página anterior, serás acreedor a 1 punto más en la nota final de la evaluación.
Texto con voz sintetizada. Hay veces en que el texto escrito se lee pero no se entiende, esa es una de las principales razones de que los alumnos no puedan realizar una tarea con éxito. En esos casos puede venir bien que una voz sintetizada lea el texto por nosotros. Este servicio lo presta vozMe, basta con que entres en la página, pulses en “webmasters” y elijas el código HTML correspondiente para pegarlo en una entrada de tu blog. El texto a incluir para que se lea de manera automática lo puedes elegir libremente.
Para finalizar esta práctica debes subir por el procedimiento habitual, una imagen similar a ésta, pero con tus datos:
|