Icono del sitio Blog de Programación y Desarrollo – Nube Colectiva

Como Programar una Página Web – Parte 3

Vamos poco a poco, recuerda que una ves que termines de seguir todo el tutorial, debes practicar mucho, la mejor manera de aprender es esa. Como se dice, la práctica hace al maestro. En la parte anterior llamada Como Programar una Página Web – Parte 2, comenzamos los primeros pasos del proceso de creación de nuestra página web con puro código. Creamos la estructura esencial de la web, pero quedo pendiente mejorar el aspecto de ella y eso lo veremos en este tercera parte. Continuemos con el tutorial Como Programar una Página Web, vamos con ello.

Partes

Antes de continuar con este Post, te invito a leer los siguientes artículos:

Asimismo, te invito a escuchar el Podcast: “Con Que Lenguaje De Programación Comenzar Para El Desarrollo Web” “¿ Porqué Es Importante Saber Programar en la Ciberseguridad ?” (Anchor Podcast): 

Spotify: Sound Cloud: Apple Podcasts Anchor Podcasts

Bien ahora continuemos con el Post: Como Programar una Página Web – Parte 3.

Parte importante de una página web es su aspecto, probablemente has visto sitios web muy vistosos y agradables que te han gustado mucho. En el diseño web se suele usar código CSS y otras herramientas para mejorar el aspecto de una página web.

Pero vayamos primero con CSS que es la base de la mejora del aspecto de una página web. Recuerda que en la Parte 1 de este tutorial hablamos sobre CSS.

Mejorando el Aspecto de la Página Web

Abre tu editor de código y crea un directorio con el nombre css y dentro de el crea un archivo con el nombre estilos.css, la extensión .css significa que es un archivo CSS y agrega el siguiente código:


El archivo estilos.css en el editor de código se veria asi:

Asimismo en tu editor de código abre el archivo index.html que creamos en la Parte 2 de este tutorial, llamamos al archivo estilos.css entre las etiquetas <head></head>:


En el código anterior fijate que estoy llamando al archivo estilos.css debajo de <title>Mi Proyecto – Home</title> (este es el título de la página). En nuestro editor de código se debería de ver asi (he seleccionado el código para que lo puedas apreciar):

Entonces si abrimos nuestro archivo index.html en el navegador podemos ver que el aspecto de la página web ha cambiado:

Hemos cambiado el aspecto con CSS y podemos darle un aspecto más increible, eso ya es entrar en un CSS más avanzado, asi que primero te recomiendo llevar un curso de CSS a fondo, ya que hay mucho por aprender de CSS y en un solo artículo no podriamos hablar a detalle de esta tecnología para mejorar el aspecto de una web.

Por suerte en el canal de Youtube de Nube Colectiva tenemos el Curso CSS 3 desde 0 completamente Gratis, en donde aprenderás en detalle a usar las propiedades, módulos, etc. de CSS 3 que te permitirán darle un mejor diseño y diferentes características visuales a una Página Web:

Si de verdad quieres aprender a usar CSS para mejorar el aspecto de una web y lograr crear diseños increibles, lleva el Curso Gratis de CSS de Nube Colectiva, recuerda que todo sacrificio en la vida y que mejor aún en tu aprendizaje, te traerá recompensas.

Bien hasta aqui creamos el código CSS para mejorar el aspecto de la página web, vamos poco a poco, no te inpacientes, sigue aprendiendo.

Ten Paciencia, lo que quiero es que conozcas bien como se crea este proyecto y no llenarte el capitulo de mucho contenido porque te puedes marear y no tendrás un óptimo aprendizaje. 

Nota (s)

 

Síguenos en nuestras Redes Sociales para que no te pierdas nuestros próximos contenidos.

Salir de la versión móvil