22nd Feb 2011

Como hacer una pagina web

Hoy todo el mundo tiene una página web, cada persona, empresa y pequeño negocio quiere una.
Mucha gente es nueva y no sabe como obtener la suya y es interesante saber que no hacen falta mayores conocimientos ni inversión para armar algo sencillo pero muy profesional.
A continuación vamos a presentar un tutorial realmente sencillo para tener tu propia pagina con dirección www.tupagina.com, sin publicidades ni nada extraño, para alguien que no tiene ningún conocimiento de informática.
El costo de esta web será de solo 10 dólares que es lo que cuesta el dominio ( dominio es la dirección que pones en la barra del explorador, es decir “www.crealotumismo.com” ) ya que vamos a hacerlo comprando un dominio .com


Un blog es una pagina web, con un sistema particular donde se van publicando noticias o “posts” y se va creando un registro de todo lo publicado.
Sin embargo, si ademas de la pagina principal con noticias, creamos algunas páginas adicionales con mas información, nuestro blog pasa a ser una web común y corriente con varias secciones (cada pagina) y una página principal con nuestras “noticias” o información de portada.
El sitio www.blogger.com nos permite crear un blog de forma gratuita y ademas asignarle un dominio .com para que tu sitio tenga una dirección tipo www.tuempresa.com y no quede ligado a blogger en una dirección www.tuempresa.blogger.com.

Veamos como crear primero nuestra web/blog.

1º Crear nuestro blog en blogger

Lo primero que vamos a hacer es ir a www.blogger.com y pincharemos sobre el boton que pone “Comenzar”:

Crear pagina web en blogger

Necesitaremos tener un email para poder registrarnos, esto no será visible en nuestra web así que puede ser un email personal.

En Mostar nombre pondremos nuestro nick o nombre que se vea cuando publiquemos un post por ejemplo

Una vez rellenados los datos, pulsaremos sobre Continuar:

Crear cuenta en blogger

Puede suceder o no, que google nos pida verificar la cuenta con un número telefónico válido, si este es el caso no tengan miedo en introducir el de ustedes en formato internacional sin ceros guiones ni nada. Ej para mexico DF seria 52 55 12345678

Verificar cuenta de Google

Una vez creada la cuenta podremos proceder a crear nuestro blog que convertiremos en una verdadera página web.

En Blog title pondremos el título de nuestro blog

En Blog Address (URL) pondremos su dirección en internet , que será algo asi comohttp://NOMBREESCOGIDO.blogspot.com

Las opciones de debajo son opcionales (valga la redundancia), por si queremos instalar blogger en un sitio nuestro , pero en este tutorial vamos a explicar cómo crearlo en blogger, ya que es lo más sencillo

En el ejemplo , hemos puesto de título para el blog Tutorial Blogger, y en Blog Address , http://tutorialblogger.blogspot.com

Una vez rellenado, presionaremos sobre Continue:

Aquí escogeremos la apariencia de nuestro Blog , como veréis, hay muchos estilos para escoger , presionando sobre el icono de la lupa, veremos un ejemplo para decidirnos mejor

Presionamos sobre el que queramos escoger, y le daremos a Continue:

Para el ejemplo, he decidido usar el estilo Son of Moto

Este es el mensaje de confirmación de que nuestro blog ha sido creado con éxito , pulsaremos sobreStart posting para comenzar a postear con Blogger

2º Publicar nuestro mensaje

Esta es la primera ventana que veremos, es directamente ,para poner un contenido, podemos no ponerlo ahora, pero si queremos, el proceso es el siguiente

En Title, pondremos el título del post que vayamos a poner

En el resto, podremos el contenido

Para lo demas , podemos ayudarnos de las herramientas estilo Wordpad , o editarlo en html directamente

Para el ejemplo , he puesto de título “Prueba” , y el siguiente texto en su interior

Una vez decidido lo que vayamos a publicar , presionaremos sobre Publish Post para publicarlo

Este es el mensaje de confirmación de que nuestro post ha sido publicado con éxito , presionando sobre View Blog, podremos ver cómo ha quedado:

La imagen está puesta pequeña y cortados los bordes, pero asi veremos de manera fácil como ha quedado el resultado

En About me, aparece información sobre el autor del Blog

Previous post, una recopilación de enlaces a posts anteriores

Archives, es un archivo de posts anteriores, clasificados por meses

Cualquier usuario, si quiere, puede publicar comentarios en el blog , salvo que especifiquemos lo contrario en las opciones

3º Configurar el blog

Este paso es opcional, es solo algunas reseñas para personalizarlo a nuestro gusto, o para eliminar el blog

Iremos a la pestaña Settings

En Title , podemos personalizar el título de nuestro blog

En Description , una descripción del blog para quien nos visite por ejemplo , pueda verlo

Las otras opciones no deberíamos tocarlas preferentemente

Abajo, en Global settings , si presionamos sobre Save Changes, salvaremos los cambios que hayamos hecho, y si presionamos sobre Drop this Blog, eliminaremos nuestro blog completamente

A la derecha, si presionamos sobre Comments, podremos cambiar opciones referentes a los comentarios que puedan hacernos

si presionamos sobre Anyone, cualquiera podrá poner un comentario

Only members , solo los miembros de nuestro blog

Only Registered users, solamente los usuarios registrados en Blogger

Presionando sobre members, podemos invitar a otras personas a hacerse miembros de nuestro blog, para que puedan publicar posts , nos ayuden en nuestro blog etc, basicamente pulsaremos el boton deAdd Team members si queremos añadir a alguien

Ponemos arriba su dirección de email, para poder invitar, hasta a 3 personas a la vez, y en Message , un mensaje explicativo que saldrá en el email. una vez que ellos reciban el email, podrán unirse como miembros a nuestro blog

La opción de Template nos permite configurar , si sabemos algo de html , nuestro blog en si , como si editáramos una página web

Por ultimo, la próxima vez que queramos publicar algo o manejar nuestro blog , iremos a www.blogger.com y en los botones de la imagen, pondremos nuestro nombre de usuario y nuestra contraseña, dejando marcada la casilla de Remember me para no identificarnos cada vez , y presionamos enter.

4º Ahora busquemos y configuremos el dominio .com

En las instrucciones siguientes se explicará como configurar un dominio generico .com o .net que hay que comprar a través de google y cuesta alrededor de 10U$s al año. No abordaremos el tema de configurar otro tipo de dominio porque es un poco mas complejo y el tema da para un post aparte pero quiero que sepan que se puede perfectamente. Cualquier duda comenten o envienme un correo. Voy a armar el post en breve.

Desde nuestro panel de control, vamos a la pestaña “Configuración” y luego a la opción “Publicar”

Una vez allí, localizamos el link “Dominio personalizado”

Dominio personalizado en blogger

Veremos la siguiente pantalla donde podremos chequear la disponibilidad del dominio que deseamos

Una vez encontrado nuestro domino nos llevará a la pagina de google (ya que blogger es de google) donde podremos registrarlo y deberemos pagar los 10 dolares. Para este paso necesitaremos la tarjeta de crédito. Vale la pena aclarar que ingresar tu tarjeta de crédito aqui es totalmente seguro ya que estamos dentro del sistema de Google, pero siempre y cuando lo realices de tu pc personal (nunca un ciber) y por lo menos tengas un antivirus instalado y actualizado.

Registro de dominio

Luego al finalizar el proceso ya tendremos configurado nuestro dominio y podremos acceder directamente con www.tudominioelegido.com!!!

5º Solo resta 1 paso mas para que la nuestra sea una verdadera web y no un blog de blogspot: remover la barra de navegación de blogspot

Actualmente nuestra página se ve así, con la barra de navegación de blogger:

Barra de navegación de blogger

Removerla es muy sencilla, hay que ir a la pestaña “Diseño” y luego a la opción “Edición de HTML”. No importa que plantilla hayamos elegido, la solución es siempre la misma y muy sencilla:

Hay que agregar el siguiente código justo arriba de la etiqueta “</head>” (solo hay 1 en todo el documento, ver imagen donde esta el recuadro rojo)

<style type=’text/css’>
#navbar-iframe {
height:0px;
visibility:hidden;
display:none;
}
</style>

ocultar barra navegacion blogger

Finalmente damos “Guardar Plantilla” y nuestra web quedaría así:

tu propia web finalizada

Vale aclarar que esto tiene una plantilla estandar, tu puedes seleccionar una entre muchas opciones.

Ademas, con algunos conocimientos básicos de HTML podrias editarla y hacer lo que quisieras sin ningún tipo de limitaciones, pero eso ya queda a cuenta tuya 🙂

Publicado por mauro



Comenta en este post y suma puntos en el ranking de comentaristas


6 comentarios para “Como hacer una pagina web”

  1. Mariano Dice:

    Excelente tutorial es justo lo que necesito no sabia que con blogspot se podia hacer una web así!!! MUCHAS GRACIAS!!!!

  2. car hire malaga Dice:

    esta bien para los novatos

  3. DoctorPC Dice:

    Pueden usar WordPress.com tb

  4. votamicuerpo Dice:

    DoctorPc tiene razón… no hay que olvidar WordPress aunque el sistema es bastante similar, con WordPress no tienes tanta libertad en la modificación de código de tu blog. Excelente tutorial

  5. Diego Montero Dice:

    Creer que abrir un blog es lo mismo que crear un sitio web es igual que pensar que un carrito de supermercado es lo mismo que un coche.
    El tutorial está bien, pero el titulo es un poco pretencioso.

  6. Juan Dice:

    Diego, obviamente no es lo mismo. Pero esto está orientado a quienes no tienen idea de programar y quieren tener una web. Un blog SI ES UNA PAGINA WEB. Ademas, el que sabe programar o tiene conocimientos mas avanzados no va a leer un post con este título “como hacer una página web”, obviamente esto es para el que no tiene conocimientos y quiere hacer algo.
    por lo tanto opino MUY BUEN POST!

Deja un comentario