Tutorial hacer pagina web desde cero ¡gratis!

* Antes que nada quiero aclarar que esta obra ("Tutorial hacer Pagina Web desde cero" esta realizada completamente por mi, no robe imágenes o ideas de otros autores.


Hola, para empezar necesitaremos tener una idea de lo que queremos lograr con nuestra pagina web, vender algo, informar, divertir, nada.




Después de la idea vienen los requisitos:
Está por demás decir que debes tener imaginación para poder realizar tus logos, banners etc. a parte de saber manejar por lo menos un programa de los mencionados.


*Programa de edición o diseño gráfico (Paint, Photoshop, Corel Draw, etc.).
*Programa para editar texto plano o editor html (Dreamweaver)
*Hosting (000webhost)
*Dominio de paga o gratis (dot.tk )

Si no sabes mucho de diseño y/o programacion web te recomiendo usar paginas como http://cooltext.com/ para hacer tus logos y usar dreamweaver como editor web.



Paso 1.-
Necesitas saber como sera "maquetada" tu web.


Ejemplos:





En fin hay muchas formas de "maquetar" elige una

Paso 2.-
Ahora viene la parte creativa, con cualquier programa de edición de imágenes haz tu logo, o usa cooltext.

puedes hacer como imagen tambien tus enlaces, aunque de esta forma tardará unos segundos mas en cargar tu pagina web.






(Para efectos de este ejemplo se hará con imagenes, los enlaces pueden ser de texto con "css" que es para darle colores y efectos a los enlaces.)




Una vez con tus imagenes preparadas ve a dreamweaver y elije nuevo documento HTML.
NOTA: IMPORTANTE GUARDAR TODAS LAS IMAGENES QUE OCUPES EN UNA SOLA CARPETA DEDICADA SOLO PARA LA WEB...






Trabajando en Restaurar las imágenes.

(bajando dreamweaver)







Lo primero a modificar es el titulo de tu web lo que va en la "barra de titulo" de tu navegador.









Podemos ocultar el codigo por si no sabemos mucho de codigo htm, dando click en el tercer boton (Design / Diseño) de izq a der. en la misma fila donde esta title o titulo.






Ahora a hacer la maquetacion... si no sabes mucho lo mas facil es hacerlo con tablas si como las que alguna vez haz hecho en la escuela en microsoft word...


-Ve al menú insert / insertar >> Table / Tabla o presiona CTRL + ALT + T
en este caso maquetare como el primer ejemplo Titulo arriba, Menu a la izq y contenido a la derecha.


Asi que en total son dos columnas y dos filas podemos hacerlo a un standar de 800 px de ancho, ponemos el borde y el espacio entre celdas a 0









Nos da como resultado una tabla con cuatro celdas, dos arriba y dos abajo, pero lo que queremos es solo una arriba y dos abajo, para eso solo selecionamos las dos celdas de arriba y le damos clic derecho >> Tabla >> Combinar celdas.







Bien ahora es el paso de agregar las imagenes del titulo y del menu.
con el cursor en la celda de titulo, puedes solo arrastrar la imagen o darle al menu insertar >> Imagen









con un poco de paciencia y tiempo habrás terminado de insertar las imagenes.
pero... se ve raro no?

Bueno pues falta darle un color de fondo, alinear bien las tablas y agregar el contenido.
para modificar el fondo solo ve al menu >> modificar >> Propiedades de pagina o presiona CTRL + J











Con estas opciones ya se ve bonita, pero aun no funciona como pagina web. habra que poner enlaces.
Esta pagina tendrá el inicio, una galeria en el enlace 2, una pagina de informacion en el enlace 3, en el 4 un contacto y el ultimo un enlace a taringa.

Bien para lograr esto da click en una imagen escribe el enlace en la panel de opciones de DW







es importante que esta pagina que estamos creando la guardemos con el nombre de index.html por que asi el servidor reconoce esta como la pagina principal al entrar al dominio.
Ah y tambien por estetica, hay que poner a 0 el borde.

A los siguientes enlaces les ponemos como se van a llamar las siguientes paginas:








A los enlaces externos habrá que ponerlos completos, es decir, anteponiendo http:// seguido del dominio, en este caso taringa.net






Listo!
Tienes una web bonita y funcional.

pero... solo la puedo ver en mi computadora... como hago para recomendarla y que toda la comunidad taringuera la vea y diga que es spam ? xD


Para esto abrimos una cuenta en 000webhost.com (es facil, si tienen dudas pregunten.) y creamos nuestro subdominio.
una vez en el panel de control de tu nuevo dominio abre el FILE MANAGER y sube los archivos de tu web.









Ahora si, con los archivos ya en el hosting temos una pagina web completa, pero en un subdominio del tipo miweb.site88.com o algo asi....




http://tutorial.st54.tk/index.html


si quieres un dominio .tk gratis y sin publicidad aqui una breve explicación.






En el panel de control de tu nuevo dominio hay un boton que se llama Parked domain.





ahi agrega en dominio que haz de registrar posteriormente en dot.tk, o mejor primero registralo en dot.tk para asegurarse de que alguien mas no lo ha tomado.





ahora en el registro de tu dominio .tk
escribe en nombre de tu dominio nuevo >siguiente> luego dale en GRATIS >siguiente> luego da clic en el botón usar DSN para este dominio y en usar mis propios DNS






Ahora si puedes ver tu pagina web en linea desde tu propio dominio .TK






Bueno, fue muy sintetizado, pero la idea es que aprendan experimentando y jugando con las diversas opciones que les da un programa de edición web o gráfico.


espero le entiendan, si no entienden muy bien un paso o detectan horrores :S .... háganme lo saber, no bardear.