“Hola mundo” de las páginas Web.

Publicado por asktutorial.

“Hola mundo” de las páginas WebPara todos y para todo hay una primera vez y si coincide que buscas tu iniciación en el mundo de la creación de las páginas Web encontrarás aquí un bautizo de conocimientos básicos para tomarlos como punto de partida. En primer lugar tenemos que decir que la Web ha evolucionado en los últimos años respecto al modo en que se maneja la arquitectura de cada página, sin entrar en la teoría del HTML como principal lenguaje empleado, podemos definir una página Web como un aparador o estructura donde podemos poner cosas de diversas índoles.  Estas cosas son, para nuestros intereses, el texto, el video y el audio, todos en su más amplia expresión y diversidad. Ahora para poder crear las estructuras que almacenarán nuestras “cosas” tenemos que, necesariamente, aprender un lenguaje para comunicarnos con el navegador de internet y decirle como tiene que mostrarlas.

Podemos definir la página Web moderna básica como un par compuesto por una página HTML, que contendrá el código para las estructuras contenedoras de la información, y una hoja de estilos CSS que , como su nombre lo indica, provee el estilo visual de estas estructuras. Para comenzar empezaremos por nutrirnos de las herramientas más básicas, en este caso usaremos solo el “Bloc de notas”, lo abrimos y empezamos a programar.

Vamos a crear la estructura principal de nuestra página y para ello abrimos el bloc de notas y escribimos las siguientes etiquetas.

 

Con las etiqueta “<head>” y “</head>” estamos definiendo la estructura de la cabecera de nuestra página y las etiquetas “<body>” y “</body>” definen lo que será el cuerpo. Ahora vamos a empezar a rellenar el cuerpo, escribimos las nuevas etiquetas.

 

Ahora le estamos diciendo al navegador con la etiqueta “<div>” y “</div>” que hay una caja o bloque dentro del cuerpo de la página donde podemos poner “cosas” y para ponerlas vamos a colocar un texto dentro.

 

Ahora procedemos a guardar el documento y lo haremos con el nombre “Mi pagina.html”, es importante la extensión “.html” pues es la que identifica el documento como una página Web. Hacemos doble clic en la nueva página que creamos y se abrirá nuestro explorador por defecto mostrándonos el contenido.

Esto es todo lo que veremos, un texto sin ningún formato en una esquina del navegador. Ahora le vamos a dar forma, para ello primero tenemos que identificar los elementos que necesitamos.

 

Con la etiqueta  (id = “caja”)  le estamos poniendo un nombre a nuestra caja, salvamos los cambios y creamos un nuevo documento donde pondremos los datos de estilo  con las siguientes etiquetas.

 

Con estas etiquetas le estamos dando un aspecto visual a nuestra caja y a su contenido, salvamos con el nombre “mi estilo.css” en la misma carpeta de nuestra página Web. Solo queda ahora asociar la hoja de estilos a la página, esto lo hacemos con la siguiente etiqueta.

 

Guardamos los cambios y ejecutamos nuestra página web que tendrá ahora un aspecto diverso.

Dejar un comentario

Tenga en cuenta: la moderación de comentarios está habilitada y puede retrasar su comentario. No hay necesidad de volver a enviar su comentario.

¡SUSCRÍBETE GRATIS!

Nosotros

AskTutorial nace en Junio del 2010 en la ciudad de Chicago, IL con el fin de crear Tutoriales Educativos en Español dirigidos a la comunidad de habla hispana en Estados Unidos y alrededor del mundo. Gracias a la excelente respuesta del publico que diariamente ve nuestros videos nos hemos extendido a no solo crear video tutoriales, si no tambien ofrecemos información relevante de acuerdo a sus preguntas.

Archivos / Mes

¡Suscribete GRATIS!

Sigueme en cualquiera de mis Redes Sociales para acceder al contenido de este sitio!