En este Post vas a aprender a crear una página web, a escoger un servidor de pago o gratuito, a subirla a internet, a mejorarla y actualizarla a tu gusto e incluso a sacarle un buen provecho económico si lo deseas. No hace falta que tengas conocimientos de nada, simplemente con leer estas lecciones lo vas a lograr, verás. El resultado final será una web igual que esta, con su foro, un top, un directorio de enlaces, optimizada para aparecer en buenas posiciones en los buscadores, con un código html y css válidos, etc, etc.
Qué, la mitad de lo que acabo de decir ni te suena eh? ja ja ja ja, no te preocupes, te lo voy a explicar todo paso a paso, como si fueras idiota, vale? ja ja ja. Hey, que era broma, no te vayas!!!
Además, te lo explicamos todo tan bien que sabrás como personalizar tu página web a tu antojo. Una vez termines el tutorial podrás cambiar los colores, la estructura, los menús, etc, etc para adaptarla a tus gustos. Tras aprender todos los trucos podrás hacer cualquier otro proyecto desde cero con lo que vas a aprender aquí.
Qué, la mitad de lo que acabo de decir ni te suena eh? ja ja ja ja, no te preocupes, te lo voy a explicar todo paso a paso, como si fueras idiota, vale? ja ja ja. Hey, que era broma, no te vayas!!!
Además, te lo explicamos todo tan bien que sabrás como personalizar tu página web a tu antojo. Una vez termines el tutorial podrás cambiar los colores, la estructura, los menús, etc, etc para adaptarla a tus gustos. Tras aprender todos los trucos podrás hacer cualquier otro proyecto desde cero con lo que vas a aprender aquí.
Qué vamos a Necesitar?
En principio solo conexión a internet y seguir estas instrucciones. El resto de recursos necesarios los conseguiremos de la red, como por ejemplo el software (gratuito) que vamos a seguir para las lecciones, el espacio web (gratuito también) para alojar tu proyecto, el software para el foro, para el directorio y para el topsites (de nuevo, gratis), etc, etc. Si tienes acceso a internet tendrás todo lo necesario. Bueno y un poco de tiempo y paciencia, claro.
Y si no Entendemos Algo?
En ese caso puedes enviarme un Mp con tu duda y en cuanto pueda te respondere donde puedes escribir todas tus dudas. Las resolvemos todas, de modo que... si no tienes página web será solo porque no quieres. No hay excusa!
0k Comenzemos
Descarga el Html kit
El Html-Kit es un editor de html y css (entre otros) gratuito. Editor significa que podemos escribir con él y Html y Css son los lenguajes que se usan para hacer páginas web. Es gratuito, esto significa que no has de pagar un duro por él, aunque tienes la opción de pagar para tener acceso a un sin fín de herramientas extra. Por lo pronto, con la versión gratuita nos va a sobrar.
Para conseguirlo, qué mejor que descargarlo desde la página oficial, no? Así estaremos seguros de obtener la versión más moderna. La página es http://www.chami.com/html-kit/download/ Ve haciendo clic y se abrirá una ventana aparte, para que puedas seguir leyendo estas instrucciones.
Al acceder a la web de Html-Kit podrás ver en la parte alta un cartelito similar a este:
Para conseguirlo, qué mejor que descargarlo desde la página oficial, no? Así estaremos seguros de obtener la versión más moderna. La página es http://www.chami.com/html-kit/download/ Ve haciendo clic y se abrirá una ventana aparte, para que puedas seguir leyendo estas instrucciones.
Al acceder a la web de Html-Kit podrás ver en la parte alta un cartelito similar a este:
[/align
En el hueco de arriba te preguntan dónde oiste hablar de Html-Kit. Puedes poner lo que quieras, la dirección de esta web, un buscador, etc, etc. En el hueco de abajo puedes escribir tu email si deseas recibir información de actualizaciones de este software y cosas así. No son obligatorios ninguno, pero ya que es gratuito no está al menos contestarles a la primera pregunta, no?
A continuación, pulsa en la parte de abajo de ese cuadro, donde pone Download HTML-Kit para proceder a la descarga del archivo. Son unas 2.8 megas, por lo que será algo rápido. Al hacer clic se abre una ventana preguntado si lo deseas guardar o ejecutar directamente. Escoge Guardar y así lo tendrás a mano en caso de que te haga falta:
A continuación, pulsa en la parte de abajo de ese cuadro, donde pone Download HTML-Kit para proceder a la descarga del archivo. Son unas 2.8 megas, por lo que será algo rápido. Al hacer clic se abre una ventana preguntado si lo deseas guardar o ejecutar directamente. Escoge Guardar y así lo tendrás a mano en caso de que te haga falta:
Tras terminar de bajarlo aparece otra ventana. Escoge Ejecutar para empezar su instalación:
Quizás te aparezca un mensaje como este:
Puedes aceptar y Ejecutar sin problemas. Este programa es seguro. En seguida, el programa empieza a instalarse en tu PC.
Instalación
Comienza mostrando una ventana de bienvenida y preguntándote si quieres seguir o no... parece que aún no ha entendido que "sí".. je je:
Como va siendo habitual, ahora aceptamos las condiciones, cómo no, verdad? Tienes que marcar la casilla que te he marcado en rojo en la imagen de aquí abajo y después pulsar en Next> :
Siguiente paso? Indicarle en qué carpeta de nuestro disco duro lo queremos instalar. La opción por defecto es perfectamente válida:
Seguidamente nos pregunta qué opciones deseamos instalar. Como no hay quien nos pare, nosotros escogemos todas (que chulos somos, eh?). Seguramente no las usemos, pero tampoco es cuestión de perderse algo, así que... tó pa dentro.
Si aún no te has cansado de aceptar y aceptar, aquí tienes otra ventana que te pregunta cuál quieres que sea el nombre del programa en tu barra de programas... aceptamos de nuevo...
Bueno... ahora nos muestra las opciones que se van a instalar. Que majo... pero un poco pesado..
Pulsamos Install y... allá va eso! Se instala en un segundo y claro, para no perder costumbre nos dice que ya está todo listo. Te recomiendo no dejar marcada la casilla marcada con un circulo rojo por mí. Eso es para descargarte más cosas, pero por el momento vamos sobrados. Quita la marca (mira la foto de abajo) y seguimos, oki?
Configuracion del HTML kit
En la página anterior nos quedamos en esta ventana:
Aceptamos de nuevo presionando "Finish" y vemos, cómo no, una preguntita....
Dice arriba que las preguntas siguientes (vaya, que no es solo una...) son para ayudarte a configurar el programa, pero que siempre puedes cambiar estas cosas más tarde desde Edit > Preferencias. Esta pregunta de arriba es por si quieres que los archivos Html se abran siempre por defecto con este programa. Por el momento le diremos que no y al hacerlo, claro, aparece otra pregunta...
Quieres que Html-Kit detecte los navegadores que tienes para usar la vista previa con ellos? Fíjate, a esta le vamos a decir que sí, para que no se diga...
Ahora como ves en la ventana de aqui abajo, pregunta si quieres descargarte enlaces de ayuda e información actualizada.. A esto le diremos que no, pues ya nos estamos cansando de tanta preguntita y queremos ver el programa de una vez..
Ahora como ves en la ventana de aqui abajo, pregunta si quieres descargarte enlaces de ayuda e información actualizada.. A esto le diremos que no, pues ya nos estamos cansando de tanta preguntita y queremos ver el programa de una vez..
No contento con la contestación, nos pregunta si queremos verificar si hay alguna versión más moderna del programa... arghhh. Adivinas que ponemos?
Y finalmente (espero) nos invita a dar una vuelta por el programa con el tutorial. Lo siento pero no, mi paciencia tiene un límite, je je je.
Bueno. Ahora ya sí que si, aparece una ventana preguntando qué tipo de archivo queremos abrir para empezar. Como opciones tenemos:
Create a new file (Crear un nuevo archivo)
Create a new file based on a template (Crear un archivo basado en una plantilla)
etc, etc, etc. Escogemos Create a new File y antes de pulsar OK desactivamos la casilla de abajo del todo, donde pone "Don´t display this screen again" o "No mostrar esta ventana de nuevo".
Create a new file (Crear un nuevo archivo)
Create a new file based on a template (Crear un archivo basado en una plantilla)
etc, etc, etc. Escogemos Create a new File y antes de pulsar OK desactivamos la casilla de abajo del todo, donde pone "Don´t display this screen again" o "No mostrar esta ventana de nuevo".
TACHAAANNN!! Por fin! El programa se deja ver! je je je.
Primer contacto con el código HTML
Una página web no es más que un puñado de letras y números que son interpretados por los navegadores mostrando lo que ves por internet. Al ser tan solo eso, letras y números, podríamos usar por ejemplo el Block de Notas de Windows para crear una página web completa. Tan solo hay que saber qué letras y qué números escribir y luego guardar el archivo, pero en lugar de hacerlo con extensión .txt se guardaría con extensión .html o .htm (son iguales).
Nosotros vamos a usar en estas lecciones otro programa distinto al Notepad o Block de Notas, el Html-Kit, pues nos va a facilitar algunas cosas que no nos hace el Notepad y que iremos viendo a su debido tiempo.
Nosotros vamos a usar en estas lecciones otro programa distinto al Notepad o Block de Notas, el Html-Kit, pues nos va a facilitar algunas cosas que no nos hace el Notepad y que iremos viendo a su debido tiempo.
El código html de una página web
Todas las páginas web empiezan y terminan con el mismo código y es el siguiente:
<html> (todas empiezan con esto) </html> (todas terminan con esto otro)
En adelante, siempre que escriba código Html lo haré de este modo, de color azul para que lo distingas. Pues bien, si eso lo escribimos en un archivo y lo guardamos con extensión .htm o .html será una página web. Vacia, sí, pero una página web.
La primera palabra <html> indica que ahí empieza el código de la web. La segunda </html> indica que el código de la página web a terminado. Se distinguen por la contrabarra / que siempre indica que algo ha terminado.
La primera palabra <html> indica que ahí empieza el código de la web. La segunda </html> indica que el código de la página web a terminado. Se distinguen por la contrabarra / que siempre indica que algo ha terminado.
La estructura de una página web en HTML
Dentro de cualquier página web hay cosas que se ven (o que se escuchan) y cosas que no. Las cosas que se ven son los textos, las imágenes, sonidos, etc. Por otro lado lo que no se ve son sus características, como el título, su descripción, palabras clave y otra serie de cosas que veremos más adelante. Las cosas que no se ven se colocan dentro del código HTML en una zona llamada cabecera (head en inglés) y lo que se muestra se pone en lo que se llama cuerpo (o hody en inglés). Pues igual que antes hemos escrito en código dónde empieza la página y dónde termina, la cabecera (head) y el cuerpo (body) se colocan y escriben así en Html:
<html>
<head>
</head>
<body>
</body>
</html>
<head>
</head>
<body>
</body>
</html>
En Html se indica que va a empezar la cabecera con la palabra <head> y termina con la misma palabra pero colocándole la contrabarra, </head> tal y como hemos visto que pasaba para cerrar </html>. Lo mismo podemos decir del cuerpo, que comienza con <body> y termina con </body>.
Como puedes ver, tanto la cabecera como el cuerpo no contienen nada dentro, por lo que seguimos teniendo una página web vacia.
Como puedes ver, tanto la cabecera como el cuerpo no contienen nada dentro, por lo que seguimos teniendo una página web vacia.
Definir el título de una página web
Una de las cosas que se pueden definir dentro de la cabecera o head es el título de la página. Antes hemos dicho que en la cabecera se colocaban las cosas que no se mostraban en la web. Este título realmente no se ve en la web, pero si en la barra azul de la parte alta del navegador (Explorer, Mozilla, Firefox, etc son tipos de navegadores) por lo que resulta importante aprender a definirlo. Más adelante veremos por qué es tan importante.
Como ya estarás sospechando, existe una palabra para indicar que va a comenzar el título y otra para indicar cuando termina, verdad? Que lince, que inteligencia la tuya oye, je je. El título se define así (como ves, dentro de la cabecera o head):
Como ya estarás sospechando, existe una palabra para indicar que va a comenzar el título y otra para indicar cuando termina, verdad? Que lince, que inteligencia la tuya oye, je je. El título se define así (como ves, dentro de la cabecera o head):
<html>
<head>
<title>Este es el título de mi web y puedo escribir lo que quiera!</title>
</head>
<body>
</body>
</html>
<head>
<title>Este es el título de mi web y puedo escribir lo que quiera!</title>
</head>
<body>
</body>
</html>
Como siempre, empieza por la palabra <title> y termina con la misma pero con la contrabarra delante, es decir, con </title>. Fácil, no? Si guardaramos esto en un archivo con extensión .html o .htm qué veriamos? Una ventana del navegador completamente en blanco, pero con un título en la parte superior del navegador como el que hemos escrito.
Si tras hacer clic en ese enlace y abrirse la página del ejemplo miras el código de esa página web, verás como coincide exáctamente con el mostrado antes. Si no sabes, te enseño como mirar el código html de una página web en la página siguiente.
Por el momento, ya sabes crear páginas en blanco. Todo un logro, verdad? je je je.
Por el momento, ya sabes crear páginas en blanco. Todo un logro, verdad? je je je.
Una Carpeta para dominarlas a todas...
Cuando tengamos lista nuestra página web tendremos que mandar todos los archivos utilizados a la red (a nuestro servidor) por lo que es necesario que todos ellos estén en una misma carpeta. En caso contrario sería un lio tremendo saber qué tenemos que subir.
El lugar más accesible es nuestro escritorio de Windows, de modo que vamos a crear una carpeta allí llamada "mis-paginas-web". Crear esta carpeta es bien sencillo. Pones el cursor de tu ratón sobre una parte de tu escritorio donde no haya ningún icono. Haces clic allí con el botón derecho del ratón y escoges Nuevo > Carpeta. A continuación le pones el nombre que os he dicho "mis-paginas-web" y pulsamos Intro. Ya tenemos lista la carpeta. Fácil, no?
El lugar más accesible es nuestro escritorio de Windows, de modo que vamos a crear una carpeta allí llamada "mis-paginas-web". Crear esta carpeta es bien sencillo. Pones el cursor de tu ratón sobre una parte de tu escritorio donde no haya ningún icono. Haces clic allí con el botón derecho del ratón y escoges Nuevo > Carpeta. A continuación le pones el nombre que os he dicho "mis-paginas-web" y pulsamos Intro. Ya tenemos lista la carpeta. Fácil, no?
Dentro de esta carpeta como te digo, vamos a guardar todos los archivos que usemos en cada web. Digo "en cada web" porque además de la que vamos a crear ahora, tú mismo puedes seguir creando otras. Asi que dentro de esa carpeta vamos a crear otra llamada "web-ejemplo-cctw", que será donde guardemos los archivos de esta web de ejemplo que iremos creando con estas lecciones.
Así que, si a la vez que sigues estas lecciones quieres ir creando otra a tu bola, puedes crear otra carpeta con el nombre que quieras dentro de "mis-paginas-web", junto a "web-ejemplo-cctw". Así no mezclamos cosas, vale?
Dentro de la carpeta "web-ejemplo-cctw" crea otra carpeta más y llámala "objetos". En ella guardaremos las imágenes, archivos de sonidos, etc. Te repito, es muy importante que sigas mis pasos al pie de la letra, de modo que cuando digo que a esa carpeta la llames "objetos", hazme caso y no la llames "Objetos", ni "OBJETOS". Todo en minúsculas, oki? Ya entenderás por qué.
Dentro de la carpeta "web-ejemplo-cctw" crea otra carpeta más y llámala "objetos". En ella guardaremos las imágenes, archivos de sonidos, etc. Te repito, es muy importante que sigas mis pasos al pie de la letra, de modo que cuando digo que a esa carpeta la llames "objetos", hazme caso y no la llames "Objetos", ni "OBJETOS". Todo en minúsculas, oki? Ya entenderás por qué.
Como ves, por el momento no tenemos nada de nada, solo sabemos crear páginas web vacias y carpetas vacias, pero en un par de páginas verás como cambia esto.. confia en mí.
Ahora que tenemos la carpeta lista, llega el momento de configurar nuestro Sitio en el Html-Kit. Y qué es un Sitio? Se llama sitio a toda la web, incluyendo todos sus páginas, imagenes y demás elementos. Coincide o ha de coincidir con la carpeta que acabamos de crear, pues esa era su función, englobar todos los archivos del sitio para no liarnos ni liar al Html-Kit.
Abriendo la ventana WorkSpace
2.- Haz clic sobre la barra de herramientas, donde pone Herramientas y activa la opción Workspace.
3.- Aparece ahora una ventana donde podemos definir nuestros sitios:
Vemos tres carpetas ya creadas pero en principio no les vamos a hacer ningún caso. Cuando seas mayor si quieres las cotilleas pero ahora vamos a lo nuestro. En el futuro, puedes cerrar esa ventana pulsando sobre la x de su parte superior derecha y puedes volver a verla siguiendo lo explicado en el paso 2. Cuando te moleste la cierras, cuando te haga falta la abres. Fácil, verdad? Y para qué sirve esto? Lo vemos ahora mismo.
Sitio Local y Sitio Virtual
Dentro de esa ventana llamada WorkSpace vamos a definir dos sitios. Uno que se llama Sitio Local que se corresponde con la carpeta que tenemos en el ordenador llamada antes "ejemplo-web-cctw" y otro sitio que podemos llamar Sitio Virtual, que será el espacio en internet. Este segundo lo veremos más adelante. Por ahora vamos a definir el Sitio Local de la siguiente forma:
1.- Hacemos clic en la barra de herramientas, donde pone Workspace y escogemos Añadir Carpeta Local/Red.
1.- Hacemos clic en la barra de herramientas, donde pone Workspace y escogemos Añadir Carpeta Local/Red.
2.- En la ventana que se abre (como ves, la traducción al español no es completa, pero podremos defendernos, ya verás), tienes que poner la carpeta "pagina-ejemplo-cctw" en el primer hueco (pincha en la carpeta amarilla de su derecha para encontrarla y escogerla) y en el segundo hueco pon un título cualquiera, por ejemplo, "web-ejemplo-cctw-local" y pulsa OK:
3.- Tras pulsar OK verás como aparece este nuevo sitio en la ventana de Workspace:
A partir de ahora, cada vez que queramos trabajar sobre archivos de esta página web, en lugar de abrir la carpeta que hemos creado en lecciones anteriores (web-ejemplo-cctw), podemos acceder a ellos directamente desde acá.
Ahora sí que podemos ya empezar a crear nuestra página web. Que emocionante...... no?
Ahora sí que podemos ya empezar a crear nuestra página web. Que emocionante...... no?
Que tal crear otro sitio para tus pruebas?
Como veo que eres un poco impaciente, vamos a crear una segunda carpeta o sitio local, en el que podrás hacer todos los experimentos que quieras. Así podrás dejar el sitio "web-ejemplo-cctw-local" solo para lo explicado aqui y no te harás un lio mezclando lo que explicamos con tus propias pruebas, vale?
Para crear esa otra carpeta local repite los pasos anteriores, y crea otra para tus cosas llamada como quieras, por ejemplo "mis-experimentos". A la hora de crearla te pide una carpeta. Puedes crear una llamada "mis-experimentos" dentro de la carpeta del escritorio llamada "mis-paginas-web" si quieres.
Para crear esa otra carpeta local repite los pasos anteriores, y crea otra para tus cosas llamada como quieras, por ejemplo "mis-experimentos". A la hora de crearla te pide una carpeta. Puedes crear una llamada "mis-experimentos" dentro de la carpeta del escritorio llamada "mis-paginas-web" si quieres.
Cómo crear la primera página de la web
La primera página que vamos a crear es la página principal. La página principal es la que se muestra por defecto al visitante cuando nos visita, la primera que ve. Su archivo ha de llamarse obligatoriamente index.html sea cual sea el servidor donde la alojemos.
Como esta página va a pertenecer al sitio "web-ejemplo-cctw", tendremos que apañarnoslas para crearla dentro de ese sitio y no en los otros que aparecen en la ventana de Workspace. Para crearla ponemos el cursor del ratón dentro de la ventana de Workspace, justo encima del sitio "web-ejemplo-cctw" y pulsamos el botón derecho del ratón.
Se abre entonces una ventana en la que tenemos que escoger, dentro de la sección New, la opción Create File...
Como esta página va a pertenecer al sitio "web-ejemplo-cctw", tendremos que apañarnoslas para crearla dentro de ese sitio y no en los otros que aparecen en la ventana de Workspace. Para crearla ponemos el cursor del ratón dentro de la ventana de Workspace, justo encima del sitio "web-ejemplo-cctw" y pulsamos el botón derecho del ratón.
Se abre entonces una ventana en la que tenemos que escoger, dentro de la sección New, la opción Create File...
Al hacer clic sobre Create File... aparece esta otra ventana:
Haz clic sobre la lengüeta en la que pone "General", escoge el tipo de archivo "Blank HTML Page" (página html en blanco) y pulsa Ok.
En seguida aparece otra ventana preguntando (este programa no para de preguntar.. verdad? que pesao es... je je) preguntándonos el nombre que queremos que tenga ese archivo. Cuál debe ser? Cómo? Que no lo sabes? Ejem.... hay que estar más atento! je je. Se tiene que llamar index.html pues será la página principal, así que lo escribimos en esa ventana, con la extensión y todo y pulsamos en Ok:
En seguida aparece otra ventana preguntando (este programa no para de preguntar.. verdad? que pesao es... je je) preguntándonos el nombre que queremos que tenga ese archivo. Cuál debe ser? Cómo? Que no lo sabes? Ejem.... hay que estar más atento! je je. Se tiene que llamar index.html pues será la página principal, así que lo escribimos en esa ventana, con la extensión y todo y pulsamos en Ok:
Tras pulsar Ok no vemos nada nuevo, pero el archivo index.html a sido creado. Para verlo solo tienes que hacer clic en el signo "+" que hay a la izquierda del sitio "web-ejemplo-cctw"m en la ventana Workspace. Haz clic allí.
Como ves, no solo te muestra el archivo index.html sino también la carpeta "objetos" que hemos creado anteriormente. Si te vas a MiPc y abres la carpeta verás como además de la carpeta "objetos" también aparece allí el archivo index.html
Ya estamos listos para escribir contenidos el la página principal, index.html así que vamos a la siguiente página y comenzamos el juego!
Ya estamos listos para escribir contenidos el la página principal, index.html así que vamos a la siguiente página y comenzamos el juego!
Si has prestado atención a lo dicho hasta ahora, te acordarás de que las cosas que se ven en la web se colocan dentro del cuerpo o Body, es decir, entre las etiquetas <body> y </body> de modo que, si vamos a escribir un párrafo tendremos que hacerlo allí.
Empezaremos abriendo el Html-Kit. Una vez abierto nos vamos a la ventana Workspace, hacemos clic en el signo "+" que hay a la izquierda del sitio "web-ejemplo-cctw" para que se muetre su contenido y después hacemos doble clic en el archivo index.html o página principal. Se abre entonces la ventana de ese archivo mostrando todo su código Html.
Empezaremos abriendo el Html-Kit. Una vez abierto nos vamos a la ventana Workspace, hacemos clic en el signo "+" que hay a la izquierda del sitio "web-ejemplo-cctw" para que se muetre su contenido y después hacemos doble clic en el archivo index.html o página principal. Se abre entonces la ventana de ese archivo mostrando todo su código Html.
Como por ahora solo vamos a trabajar sobre el index.html podemos cerrar la ventana Workspace para tener más sitio visible. De modo que hacemos clic en la x de Workspace para cerrarla y después maximizamos la ventana del index para ocupar toda la ventana del Html-Kit, quedando así:
Esta es la vista llamada "Editor de Html". Como verás, el código de esta página coincide más o menos con el que te expliqué en las primeras lecciones, verdad? Empieza por <html> seguido de la cabecera y después el cuerpo o Body, para cerrarse al final con </html> que como toda etiqueta de cierre lleva su contrabarra "/".
Se ve también esa primera línea de la que no te he hablado aún. Esa línea describe el tipo de página que es, las normas de Html que está siguiento. No tiene mayor importancia, la dejaremos y listo.
Se ve también esa primera línea de la que no te he hablado aún. Esa línea describe el tipo de página que es, las normas de Html que está siguiento. No tiene mayor importancia, la dejaremos y listo.
Cambiando el título
Vamos a cambiarle el título a esta index. Bastará con escribir el título que quedamos en lugar de donde pone "Page title". Vamos a ponerle todos "Pagina Principal del Ejemplo CCTW". Ya sabes, entre <title> y </title>.
Mi primer párrafo
Al igual que un título se escribe entre <title> y </title>, un párrafo hay que escribirlo entre las etiquetas <p> y </p>. Así, para escribir por ejemplo "Bienvenidos a mi página web. Muy pronto estará lista!" basta con escribir esa frase encerrada entre esas etiquetas, dentro del cuerpo de la página es decir, entre <body> y </body>. Quedaría así:
Claro que con la vista "Editor" no vemos lo que estamos consiguiendo. Para ver cuales son los resultados el Html-Kit dispone de otra vista llamada "Preview" o vista previa, que nos muestra cómo quedaría la web vista por internet. A esta vista previa o preview se accede haciendo clic abajo del todo, junto a donde pone "Editor". Haz clic ahí y veamos como queda nuestro ejemplo por el momento, vale?
Bueno, por el momento no es gran cosa pero... sabías hacer esto antes? Pues pronto aprenderás mucho más. No vamos a parar hasta que aprendas a crear páginas como ComoCrearTuWeb, oki? je je, no va a ser dificil, verás.
Haciendo clic sobre "Editor", junto a "Preview" puedes volver a ver la vista de código Html. Ya sabemos algo más.
Haciendo clic sobre "Editor", junto a "Preview" puedes volver a ver la vista de código Html. Ya sabemos algo más.
Crear un segundo párrafo en la página
Para crear un segundo párrafo ya imaginarás lo que hay que hacer, no? Basta con incluir ese segundo párrafo debajo del anterior y encerrarlo entre las etiquetas <p> y </p>. Por ejemplo, vamos a poner este segundo párrafo: "Página creada gracias a CCTW". En la vista "Editor" la página quedaría así:
Cómo guardar los cambios realizados
Para guardar lo que hemos hecho hasta el momento pulsa en la barra de herramientas, donde pone Archivo y escoge Salvar. Ya puedes cerrar el Html-Kit sin miedo a perder nada, e irte a merendar, que llevas ya mucho tiempo delante del ordenador, je je je je.
Bueno taringueros nos veremos a una segunda entrega de Aprende a crear tu pagina web Los espero
