Muchas personas quieren tener su espacio en Internet para publicar sus opiniones, sus experiencias , etc , y la forma más sencilla y fácil es con un Blog , o también llamado Weblog. Este tutorial va a mostrar cómo crear un weblog (blog) con Blogger.
1º Crear nuestro blog en blogger
Lo primero que vamos a hacer es ir a www.blogger.com donde veremos la siguiente pantalla:
Pulsaremos sobre: Comenzar:
Se carga una pantalla donde vemos el primero de los 3 pasos necesarios para crear un blog:
Crear una cuenta de Google
Asignar un nombre al blog
Elegir una plantilla
1º Crear una cuenta de Google
Lo primero que nos pide Google es una dirección de correo electronico existente que se usará para recuperar contraseñas en el caso que la perdamos o verificar derterminadas acciones. Rellenamos todos los campos siendo los más importantes los de
Contraseña:clave que necesitaremos para acceder al blog para publicar o condifurarlo
Nombre visible: es el nombre con el que se firmaran nuestras entradas en el blog
Una vez rellenos todos los campos, y marcada la casilla "Acepto las Condiciones del servicio", pulsamos en "Continuar" para ir al paso 2. Si ya tenemos una cuenta de G-mail o estamos dados de alta en Google nos podemos saltar este primer paso
2º Asignar un nombre al blog
En este paso estableceremos el Título del blog y la direccón del mismo. El Título puede ser cualquier frase o palabra que describ el contenido del blog algo asi como "La cocina de Carlos" o "Aventuras de un internauta novato". La dirección del blog (URL) es lo que los usuarios utilizaran para acceder al blog, es la dirección que daras la gente para que accedan a tu blog. Puedes ulilizar una palabra o frase, pero teniendo en cuenta que los espacios y algunos signos de puntuación no están permitidos. En este punto se puede comprobar si la dirección esta disponible. Cuanto más sencilla sea la dirección mejor ya que así será más fácil de recordar. Una vez todo relleno pasaremos al paso 3 pulsando sobre "Continuar"
3º Escoger una plantilla de inicio
En este último paso escogemos una plantilla de inicio, la que más nos guste, da igual ya que luego podremos cambiarla y configurarla a nuestro gusto.
Si os habeis fijado hay un error en la pagina de Blogger ya que sale un 2 cuando el paso es el 3, una tonteria sin importancia.
Una vez seleccionada pulsamos "Continuar" y "FELICIDADES" ya tenemos nuestro blog creado.
2º Publicar nuestro mensaje
Si todo ha funcionado correctamente ya estaremos en disposición de publicar nuestro primer "Post". En pantalla tenemos que tener una imagen como esta.
Como podéis ver arriba esta el título del blog "Las aventuras de un internauta novato" y una serie de pestañas que nos van a permitir configurar y personalizar nuestro blog.
Creación de entradas
Comentarios
Configuración
Diseño
Monetizar
Estadísticas
Para publicar nuestra primera entrada únicamente tenemos que rellenar el título de la misma y el contenido. Con el editor podemos darle formato al texto, incluir imágenes, videos, etc. También tenemos un apartado donde colocar etiquetas, las etiquetas son palabras clave que se identifican con el contenido de la entrada.
Una vez este todo a nuestro gusto, usando el botón de vista previa para ver como queda, publicamos la entrada "Publicar Entrada" y esta ya será visible para todos los internautas.
Con estos sencillos pasos ya tenemos nuestro blog funcionando, a partir de aquí se pueden configurar muchas cosas, desde el diseño hasta el como y cuando se publican las entradas. No es objetivo de este manual profundizar en todos estos temas, os aconsejo que os toméis vuestro tiempo para explorar todos y cada una de las opciones de Blogger que son muchas y nos permitirán dejar el blog altamente personalizado.
También les aviso que Blogger dispone de una nueva interfaz más intuitiva que podeis utilizar para trabajar con vuestro blog.
Con esto acabamos este tutorial de usar y configurar Blogger , espero que haya sido de utilidad para que podais crear vuestro propio weblog en internet
Hagámonos una pregunta : ¿queremos publicar contenidos al instante, donde nos interesa más el contenido que la apariencia? Por ejemplo:
Podemos querer tener un cuaderno de bitácora donde publicar nuestras reflexiones, contar nuestro último viaje... Para ello un weblog (o blog) es adecuado. Son gratis y sólo tenemos que escribir el texto, el aspecto final lo proporciona el propio blog.
Podemos querer publicar fotos con posibilidad de poner comentarios (y votar fotos y mucho más). Nada mejor que servicios como los de Flickr o Panoramio
Intercambiar preguntas, dudas, opiniones, aficiones, etc. Para ello los foros son la mejor opción.
Si lo anterior no cubre nuestras necesidades o si queremos desarrollar todo un sitio web de manera más artesanal, tenemos las siguientes opciones:
Programar nuestra página web con una apariencia y un contenido estático, y publicarla. Por ejemplo, la página de nuestro pueblo, de nuestra pequeña empresa... Este tutorial trata de ello.
Utilizar herramientas llamadas gestores de contenidos, que automatizan muchas de las tareas pero requieren conocimientos medios de programación.
Programar una página web con lenguajes como PHP, JSP o ASP. Requieren conocimientos medios/altos de programación.
Tras este breve repaso, ¡entremos en materia!
Los fundamentos de una página web: HTML
Una pagina web se compone de texto: el contenido literal (lo que queremos decir) y las llamadas etiquetas para dar la forma. Algunas de ellas son:
Etiqueta
Descripción
<h1></h1>
Escribir un título. Los subtítulos se consiguen con <h2></h2>... hasta <h5></h5>
<p></p>
Esctribir un párrafo
<b></b>
Texto en negrita
<i></i>
Texto en cursiva
<center></center>
Centrar cualquier elemento (texto, imagen, etc)
<br />
Salto de línea
<a href=""></a>
Introducir un enlace (hipervínculo), para pulsar sobre él y navegar a otro sitio
Se escribe en un bloc de notas la estructura básica de un bloc de notas.
A continuación guardamos este texto en un fichero llamado pagina1.html, por ejemplo en el escritorio de Windows. Para hacerlo correctamente, una manera es ir al menú del Bloc de notas: Archivo | Guardar Como | y en el nombre de archivo a guardar poner entre comillas dobles el nombre del archivo: "pagina1.html". Esto es para que el Bloc de notas de Windows no guarde el fichero con el nombre pagina1.html.txt, un error común al principio:
Guardamos nuestra página con extensión.htmlen el escritorio de Windows
Hacemos doble click sobre el icono de nuestra nueva página web que estará en el escritorio, y debemos verlo de esta manera:
Pagina web de Aldearriba del Pisuerga
Bienvenida
Bienvenido a la pagina web de Aldearriba del Pisuerga, esperamos que sea de su agrado.
Historia
Los primeros pobladores datan de la epoca celtibera, pues se han localizado asentamientos junto al rio Pisuerga.
Festividades y tradiciones
Como en muchos pueblos, se celebra San Isidro Labrador cada 15 de mayo, asi como la Fiesta de las Animas 15 dias antes el Miercoles de Ceniza
Esperamos verle pronto!!
Pulse aqui para ir a otra pagina
Visite Google
Analizando con cuidado el ejemplo, observamos algunas cosas importantes:
Todo documento HTML tiene una estructura base que hay que respetar
Para dar formato al texto, hay que utilizar etiquetas HTML, que pueden anidarse
Toda etiqueta tiene una parte de apertura <etiqueta> y otra de cierre, con una barra al principio </etiqueta>(salvo alguna excepción, como <br/>)
La extensión del archivo que contiene el código HTML debe ser: .html
El navegador web interpreta el lenguaje HTML, aplica el formato y lo muestra por pantalla
Si ponemos un enlace a una pagina web, hay que comenzar con http:// Si ponemos una página web situada junto con la actual, sólo es necesario escribir el nombre del fichero.
En el ejemplo anterior, si pulsamos sobre Google, nos llevará al buscador. Si pulsamos sobre "Pulse aquí" para ir a la otra página, no la encontrará porque aún no la hemos creado. Vamos a hacerlo. Abrimos otro Bloc de notas y creamos una página web sencilla.
La guardamos con el nombre pagina2.html también en el escritorio, de la misma manera que hemos hecho conpagina1.html. Ahora, al pulsar en la palabra "aqui" de la frase "Pulse aqui para ir a otra pagina", se mostrará segunda página:
Esta es la pagina numero 2
Nuestra primera página utilizando un editor de páginas web
En la sección anterior se han introducido los fundamentos de una página web. Pero hay mucho más, y no tiene sentido memorizar el lenguaje de etiquetas; es más práctico saber qué son para saber comprenderlas en el momento en que las tengamos a la vista.
Vamos, pues, a utilizar herramientas para hacer nuestra página web de manera más rápida y, sobre todo, de manera visual (WISIWYG), evitando tener que escribir código fuente (como mucho, retocando). Estos editores de página web utlizarán lenguaje HTML y otras tecnologías adicionales, como las hojas de estilos en cascada (CSS), HTML dinámico oJavaScript.
Un programa que recomiendo para empezar es Kompozer (una versión mejorada de NVU) por ser de libre uso y muy completo. Hay otros editores más habituales en nuestro entorno, como Microsoft Office Word que permiten que lo que hayamos escrito lo guardemos en formato HTML (menú Archivo | Guardar Como | Página Web), si bien el código HTML que genera no es muy limpio en algunos casos.
Podemos descargar Kompozer desde http://kompozer.net/download.php, en la sección Latest stable version, versión Win32 binary, el fichero con nombre kompozer-X.X.X-win32.zip. Descomprimimos este fichero descargado en un directorio, entramos en él y ejecutamos el archivo kompozer.exe. El programa tiene el siguiente aspecto:
Interfaz de Kompozer, editor visual de páginas web de libre uso
De manera visual podemos escribir texto, ponerlo en negrita, centrado, convertirlo en un enlace, un título, insertar una imagen, una tabla, dividir en marcos, etc. Asimismo abajo podemos ver las pestañas "Normal", "HTML Tags" y "Preview". Nosotros trabajaremos sobre el modo "Normal", pero podemos comprobar en todo momento el código HTML que se está escribiendo automáticamente por debajo, pulsando en la pestaña "HTML Tags". Para ver el aspecto final de lo que llevamos hecho, podemos pulsar sobre "Preview".
Pasos para hacer una página web
Aunque al principio dediquemos tiempo a hacer pruebas con el editor, escribiendo texto y poniendo imágenes y moviéndolo todo de sitio varias veces, cambiando colores para buscar una combinación que nos guste, la experiencia y la metodología propia de los desarrollos informáticos (bien aplicada es de gran utilidad), recomienda seguir los siguientes pasos:
Reunir el material con el que vayamos a hacer la página web: textos, imágenes, etc.
Diseñar sobre papel el aspecto de nuestro sitio web: dónde va el menú, el encabezado, el pie de página, el cuerpo... es decir, la plantilla (podemos inventarla o elegir una de los recursos gratuitos [1] [2] que hay en internet, pero esto requiere ya cierta de experiencia). Asimismo concretamos cuántas páginas tendrá nuestro sitio web y qué información contendrá.
Una vez claro lo anterior, se traslada el diseño al ordenador, utilizando una herramienta como Kompozer.
Vamos a hacer una página más completa siguiendo estos tres pasos.
1.- Reunir el material
En nuestro ejemplo, usaremos el siguiente:
Un texto de bienvenida: bienvenida.txt
Un texto con historia del pueblo: historia.txt
Un texto con turismo: turismo.txt
Fotografías de algunos monumentos, tomadas con una cámara digital y reducidas en dimensiones y tamaño (que no ocupen más de 200 Kb), usando programas como Paint, GIMP o Image Resizer (tutorial) ...
Una imagen de fondo: fondo.jpg
Puedes descargar el material aquí: material_pagina_web.zip
2.- Diseñar la plantilla y la estructura del sitio web
Una posible plantilla para la distribución del contenido es la siguiente:
Plantilla de la página web
El sitio web estará compuesto por tres páginas individuales:
bienvenida.html, con el texto de bienvenida e imagen de fondo
historia.html, con el texto de la historia e imagen de fondo
turismo.html, con el texto y las imágenes de turismo, y la imagen de fondo
Una vez tenemos ya en mente nuestra web, vamos a utilizar las herramientas descritas anteriormente para implementarla.
3.- Implementar la página en el ordenador
Creamos una carpeta por ejemplo en el Escritorio de Windows, que se llame paginaweb. Dentro, una subcarpeta denominada imagen, donde copiaremos las imagenes de los monumentos y el fondo. Este material lo hemos descargado antes desde material_pagina_web.zip.
Ininiciamos Kompozer y vamos al menú File | New | dejamos seleccionado A blank document y pulsamos en Create. Guardamos esta pagina desde el menú File | Save As... Aparecerá un diálogo pidiendo el título de la página. Escribimos por ejemplo Página web de Aldearriba de Pisuerga, pulsamos Ok y guardamos la página en una carpeta en el Escritorio de Windows, paginaweb, con el nombre bienvenida (la extensión .html la pone automáticamente el editor).
Comenzamos poniendo el fondo de la página accediendo al menú Format | Page Colors and Background... En la casilla Background Image navegamos hasta la imagen de fondo que estará en: imagen/fondo.jpg. Aseguremonos que la opción URL is relative to page location... queda marcada:
Insertar el fondo de la pagina web
A continuación escribimos el encabezado de la página. Por ejemplo, "Bienvenido a la pagina web de Aldearriba de Pisuerga", lo damos forma de encabezado de nivel 1 (desplegable izquierdo) y finalmente lo centramos.
Insertar la cabecera de la página web
A continuación, debajo del título, insertamos una tabla, desde el menú Insert | Table... pulsamos sobre la pestañaPrecisely y ponemos los siguientes datos, y pulsamos OK.
Insertar una tabla de 1x2 sin borde
En la celda izquierda escribimos: Menú: y debajo tres líneas, una cada una con "Bienvenida", "Historia" y "Turismo", dando el tamaño y tipo de letra que queramos, por ejemplo Helvetica, Arial (desplegable izquierdo, expandiendo "Variable Width"). La tabla seguramente se descoloque; podemos ajustar su forma poniedo el cursor sobre los límites de la misma en la barra superior e izquierda, y arrastrando:
Con el ratón deslizamos a la izquierda el límite de la celda
Bajo la tabla escribimos el pie de página, con información de la última actualización: "Última actualización: 06 de agosto de 2009". Para finalizar con la plantilla base de la página, vamos a convertir las palabras bajo el menú izquierdo en enlaces reales. Por ejemplo, seleccionamos la palabra "Bienvenida" y vamos al menú Insert | Link... e introducimos en el área de texto: bienvenida.html y pulsamos OK:
Propiedades del enlace: insertando una página web
Repetimos el proceso con "Historia", siendo la página historia.html y "Turismo" siendo la página turismo.html. Conviene indicar que estras tres páginas estarán juntas en la misma carpeta del Escritorio paginaweb y por eso no hace falta escribir la ruta de directorios de las páginas a las que enlazamos. Si estuviesen en otro directorio habría que poner la ruta. Si lo que queremos en enlazar con una página de internet, habrá que poner la dirección con formato http://......
En este punto tenemos completada la plantilla:
Plantilla diseñada al principio, implementada en HTML
Hasta aquí, el procedimiento es común para las tres páginas, y lo repetiremos para cada una de ellas, o bien haremos dos copias del fichero bienvenida.html en el mismo directorio paginaweb y lo renombraremos como historia.html yturismo.html.
Como estamos editanto la página de bienvenida, en el cuerpo de la página vamos a pegar el texto del ficherobienvenida.txt, y lo damos formato al gusto:
Página web de bienvenida visualizada en el navegador
El proceso para la página de historia es similar: sobre la plantilla, rellenamos el cuerpo con texto. Si hicimos copia del fichero bienvenida.html y cambiamos el nombre por historia.html, podemos abrir esta página desde Kompozer en el menú File | Open File y seleccionando historia.html. Un ejemplo del resultado final puede ser:
Página web de bienvenida visualizada en el navegador
De manera similar, abrimos la página de turismo y en el cuerpo insertaremos el texto e imágenes. Para insertar una imagen, ponemos el cursor antes de la primera palabra del primer párrafo "Transitando por..." y pulsamos en el menú Insert | Image para acceder a las propiedades de inserción. En la pestaña Location seleccionamos la imagen con el explorador y se inserta la ruta relativa a la página. Escribimos un texto alternativo, como se muestra en la imagen:
Propiedades de inserción de imagen, pestaña Location
En la pestaña Appearance podemos seleccionar la situación de la imagen respecto al texto: alineado medio, superior o inferior, a la izquierda, derecha, espacio alrededor de la imagen... La imagen del puente la dispondremos a la izquierda del párrafo y a su misma altura, separando unos píxeles el texto de la imagen. Estableceremos las siguientes propiedades:
Propiedades de la imagen respecto al texto
Pulsamos OK y vemos el resultado:
Página web con imagen a nivel de texto
Debajo del segundo párafo, y en el medio, insertaremos la imagen del rollo de justicia. Guardamos la página, y el aspecto final de la página de turismo será:
Página web de turismo con las dos imágenes
En este punto podemos probar los enlaces del menú izquierdo. Si hemos seguido bien todos los pasos, es decir, hemos escrito bien los nombres de las páginas .html en el editor web y los ficheros .html en disco están al mismo nivel y con los nombres correctos, podremos pasar de una página a otra de nuestro pequeño sitio web.
Para seguir aprendiendo
De esta manera, aquí terminan los pasos para crear una página Web Html.
Los diagramas de flujo son una manera de representar visualmente el flujo de datos a travéz de sistemas de tratamiento de información. Los diagramas de flujo describen que operaciónes y en que secuencia se requieren para solucionar un problema dado.
Un diagrama de flujo u organigrama es una representación diagramática que ilustra la secuencia de las operaciones que se realizarán para conseguir la solución de un problema. Los diagramas de flujo se dibujan generalmente antes de comenzar a programar el código frente a la computadora. Los diagramas de flujo facilitan la comunicación entre los programadores y la gente del negocio. Estos diagramas de flujo desempeñan un papel vital en la programación de un problema y facilitan la comprensión de problemas complicados y sobre todo muy largos. Una vez que se dibuja el diagrama de flujo, llega a ser fácil escribír el programa en cualquier idióma de alto nivel. Vemos a menudo cómo los diagramas de flujo nos dan ventaja al momento de explicar el programa a otros. Por lo tanto, está correcto decir que un diagrama de flujo es una necesidad para la documentación mejor de un programa complejo.
Reglas para dibujar un diagramas de flujo.
Los Diagramas de flujo se dibujan generalmente usando algunos símbolos estándares; sin embargo, algunos símbolos especiales pueden también ser desarrollados cuando séan requeridos. Algunos símbolos estándares, que se requieren con frecuencia para diagramar programas de computadora se muestran a continuación:
Inicio o fin del programa
Pasos, procesos o líneas de instruccion de programa de computo
Operaciones de entrada y salida
Toma de desiciónes y Ramificación
Conector para unir el flujo a otra parte del diagrama
Cinta magnética
Disco magnético
Conector de pagina
Líneas de flujo
Anotación
Display, para mostrar datos
Envía datos a la impresora
Observación: Para obtener la correcta elaboración de los símbolos, existen plantillas. Las puedes conseguir en Papelerías.
Simbolos gráficos
Dentro de los simbolos fundamentales para la creaación de diagramas de flujo, los símbolos gráficos son utilizádos especificamente para para operaciónes aritméticas y relaciónes condicionales. La siguiente es una lista de los símbolos más comunmente utilizados:
+
Sumar
-
Menos
*
Multiplicación
/
División
±
Mas o menos
=
Equivalente a
>
Mayor que
<
Menor que
³
Mayor o igual que
£
Menor o igual que
¹ o <>
Diferente de
Si
No
True
False
Reglas para la creacion de Diagramas
Los Diagramas de flujo deben escribirse de arriba hacia abajo, y/o de izquierda a derecha.
Los símbolos se unen con líneas, las cuales tienen en la punta una flecha que indica la dirección que fluye la información procesos, se deben de utilizar solamente líneas de flujo horizontal o verticales (nunca diagonales).
Se debe evitar el cruce de líneas, para lo cual se quisiera separar el flujo del diagrama a un sitio distinto, se pudiera realizar utilizando los conectores. Se debe tener en cuenta que solo se vana utilizar conectores cuando sea estrictamente necesario.
No deben quedar líneas de flujo sin conectar
Todo texto escrito dentro de un símbolo debe ser legible, preciso, evitando el uso de muchas palabras.
Todos los símbolos pueden tener más de una línea de entrada, a excepción del símbolo final.
Solo los símbolos de decisión pueden y deben tener mas de una línea de flujo de salida.
Ejemplos de diagramas de flujo
Diagrama de flujo que encuentra la suma de los primeros 50 numeros naturales
Bueno, y ahora la descripción del diagrama anterior
Suma, es la variable a la que se le va agregando la valor de cada número natural. N, es el contador. Éste recorrerá lo números hasta llegar al 50.
El primer bloque indica el inicio del Diagrama de flujo
El segundo bloque, es un Símbolo de procesos En este bloque se asume que las variables suma y N han sido declaradas previamente y las inicializa en 0 para comenzar a el conteo y la suma de valores (Para declararlas existe el bloque Tarjeta perforada).
El tercer bloque, es también un Símbolo de procesosEn éste paso se incrementa en 1 la variable N (N = N + 1). Por lo que, en la primera pasada esta N valdrá 1, ya que estaba inicializada en 0.
El cuarto bloque es exactamente lo mismo que el anterior Pero en éste, ya se le agrega el valor de N a la variable que contendrá la suma (En el primer caso contendrá 1, ya que N = 1).
El quinto bloque es uno Símbolo de Toma de decisiones y Ramificación Lo que hay dentro del bloque es una pregunta que se le hace a los valores que actualmente influyen en el proceso (Por decir algo, no se como decirlo, soy muy sope :D) ¿Es N=50?, Obviamente la respuesta es no, ya que N todavía es 1. por lo que el flujo de nuestro programa se dirigirá hacía la parte en donde se observa la palabra no: Tercer Bloque, éste le sumará 1 (N=N+1) y vuelve a llegar a éste bloque, donde preguntará ¿Es N=50?... ¡No!, todavía es 2. Ha pues, regresa al Tercer bloque y vuelve hacer lo mismo. Y así hasta llegar a 50, obteniendo así la suma de los primeros 50 primeros números naturales.
Por último indicamos que el resultado será mostrado en la impresora (Este lo puedes cambiarlo por el display para mostrar datos).
Fin del programa (o diagrama)
Para Saber Más..
VIDEO..
De esta manera se termina el procedimiento para realizar un Algoritmo.
.jpg)
Win32 binary, el fichero con nombre kompozer-X.X.X-win32.zip. Descomprimimos este fichero descargado en un directorio, entramos en él y ejecutamos el archivo kompozer.exe. El programa tiene el siguiente aspecto:
.png)
En este bloque se asume que las variables 
En éste paso se incrementa en 1 la variable 
Pero en éste, ya se le agrega el valor de N a la variable que contendrá la suma (
