Hoy en día es común navegar en internet y encontrarse con paginas web para buscar información de cualquier tipo, pero ¿Sabemos como se construyen una pagina web?. En esta publicación vamos a entender de manera simple el lenguaje que se utiliza para realizar sitios web y descubrir que importancia tiene aprenderla.
Una pagina web se realiza desde el inicio con la tecnología HTML en su versión 5, es decir que anteriormente se utilizaba versiones anteriores como el HTML4 para construir una web. Pero ¿realmente que cambian entre versiones?, de manera simple se actualizan los estándares del lenguaje y mejora su rendimiento para las paginas web.
- Entendiendo como esta construido una pagina web en HTML 5
- ¿Qué es un lenguaje de programación?
- Importancia de aprender HTML5
- Pagina web en HTML5
- Etiquetas básicas de HTML
- Conclusión
¿Qué es un lenguaje de programación?
De manera simple, es la forma de poder escribir determinadas reglas, instrucciones y procesos de tal manera que la maquina, nuestro computador, tableta, dispositivo móvil, reloj inteligente, entre otros, puedan traducir lo escrito en código que pueda ejecutar directamente.
HTML5 es un lenguaje de maquetación o HyperText Markup Language, esto se refiere que no es un lenguaje de programación en su totalidad, ya que al escribir un código HTML nos estamos asegurando que la maquina pueda interpretar los elementos de un diseño web para luego procesar su contenido. Su contenido puede ser imágenes, textos, códigos de estilos, códigos avanzados de funcionalidad de interfaz de usuario, juegos, entre otros.
Importancia de aprender HTML5
Entonces ¿Quieres decir que no soy programador con HTML5?; saber HTML5 no te hace 100% programador web, pero puedes fortalecer diversas habilidades como el diseño web, poder expandir tus habilidades de diseño grafico y plasmarlo en un prototipo funcional, entender mejor el funcionamiento al navegar por la red, entre otros. Sin embargo para aquellos que quieran dedicarse a la programación web, este es un paso obligatorio para aquellas personas.
Pagina web en HTML5
Sin más, veamos como construimos una pagina simple en HTML5
Una pagina web tiene la siguiente forma:
<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<title>Mi titulo de la web</title>
</head>
<body>
<h1>Bienvenido a mi web</h1>
<p>Este es mi primera web en HTML5</p>
</body>
</html>Cada elemento en HTML5 se representa en signos “< >” y además cada elemento se tiene que hacer una apertura y cerrarla con el signo “/”, por ejemplo: apartáramos el elemento de la siguiente forma: <html> y una vez que establecemos su contenido lo cerramos el elemento de la siguiente forma: </html>
existen muchísimos elementos o etiquetas para interactuar con HTML5 y realizar nuestro diseño, sin embargo para este articulo solo repasaremos lo que mostramos en el ejemplo anterior:
Etiquetas básicas de HTML
La etiqueta <!DOCTYPE HTML> sirve para indicar que se trata de una web con HTML5, sin esa etiqueta el navegador web interpretara que se trata de una versión anterior.
Seguidamente con la etiquetas <html></html> dentro de ellas estará dentro nuestra pagina web.
Una pagina web debe contener obligatoriamente las etiquetas <head></head> y <body></body> donde uno sirve como cabecera para definir títulos, descripciones, iconos, estilos personalizados, entre otros. En cambio la etiqueta <body> contendrá todo el contenido de nuestra pagina web, ya sean textos, imágenes, videos, entre otros.
Cabe resaltar que todo lo que esta en <head> se cargara primero antes que <body>, esto es importante tenerlo en cuenta para realizar funcionalidades avanzadas.
La etiquetas <meta> es un elemento de html5 donde puedes definir la codificación del texto en la pagina web, además, puedes definir con la misma etiquetas otras configuraciones para nuestra pagina, como por ejemplo, definir el tipo de vista para diferentes dispositivos, indicar compatibilidades de navegadores, entre otros.
La etiqueta <title></title> sirve para definir el titulo de nuestra pagina web
la etiqueta <h1></h1> funciona para indicar un titulo dentro del contenido en nuestra pagina web.
Por ultimo la etiqueta <p></p> funciona para establecer párrafos en el contenido de nuestra pagina web.
Conclusión
Con el lenguaje de maquetación podemos realizar estructuras para establecer nuestros diseños en nuestra paginas web, si bien existen una gran variedad de etiquetas HTML5 para construir nuestra pagina web, sin olvidar la etiqueta de estilo, que nos permite personalizar completamente una pagina web. HTML5 es una poderosa tecnología que es capas de presentar todo tipo de contenido y aplicaciones, desde portales personales hasta software complejo.
]]>
Todo desarrollador sabe que para trabajar en cualquier proyecto sea profesional o personal, se necesita levantar un servidor local o mejor conocido como localhost en su maquina de trabajo. Por ello vamos a explicar como se realiza y como utilizarlo, especialmente para programar con el lenguaje de programación PHP.
Tabla de contenido:
¿Por que hay que tener un servidor local para programar?
En el desarrollo de software que necesiten conexiones de internet, principalmente las paginas web, necesitan un servidor alojado en la nube (internet) que permita la interconexión entre múltiples usuarios.
El lenguaje de programación PHP, es un lenguaje del lado del servidor, por ende para ejecutar un código de PHP se necesita un servidor. Pero obviamente para empezar a programar no queremos complicarnos la vida y sin gastar mucho dinero para empezar a codificar un proyecto. Es por ello que se necesita un servidor alojado en la propia maquina y ejecutar nuestro código.
Tenga en cuenta que los servidores local no funcionan como un servidor de despliegue a producción, es decir, no es recomendable utilizar nuestra maquina como servidor local para alojar nuestra web, aplicación, entre otros a internet. Solo es para uso local y netamente para desarrollar.
Elegir un software para nuestro servidor local
Lo primero que debemos hacer es elegir un software para preparar todos los servicios necesarios. Existen varios software al día de hoy que te permiten crear tu localhost o servidor local, algunos hasta portable, pero lo importante que debemos enfocarnos es el que más rápido y fácil nos hace el trabajo.
Los que personalmente recomiendo son los siguientes:
- XAMPP (Primera opción)
- UwAmp (Portable)
- WampServer (Alternativa)
Cada una de ellas tienen sus pro y contras, pero todos ellos son para PHP y contienen ya incluido los servicios para poder levantarnos el servidor de base de datos MySQL.
En lo personal trabajo con UwAmp ya que puedo usarlo de manera portable y puedo trabajar en cualquier lugar, sin embargo, no cuenta con todas las versiones PHP disponible y se debe instalar la versión que necesiten de manera manual. Pero otra opción mas confiable es XAMPP, donde si trae todo lo necesario y compatible con cualquier versión.
Instalar XAMPP en nuestra PC
Para poder instalar XAMPP necesitamos ir a su pagina oficial https://www.apachefriends.org/es/
Luego de entrar debemos localizar el botón de nuestro sistema operativo, en este caso Windows y descargar el software.
El siguiente paso es ejecutar el instalador que se descargo y guardo en nuestra maquina.
Nos aparecerá lo siguiente:
Al presionar siguiente (Next en ingles) nos aparecerá los componentes que se van a instalar, por defecto dejen los seleccionados, en caso que no quieran un componente en especifico pueden deseleccionarlo.
En el siguiente paso debemos especificar que ruta queremos que se instale nuestro servidor local, es recomendable dejarlo en la unidad principal para evitar cualquier inconveniente en el desarrollo, sin embargo pueden ubicarlo en cualquier ubicación de su pc.
Procedemos a seleccionar el idioma e indicar que se instale nuestro servidor. Por ahora el asistente de instalación de XAMPP solo te ofrece dos idiomas inglés y alemán, escogemos inglés
En este paso, nos pregunta si queremos saber mas sobre Bitnami, pueden dejarlo seleccionado sin embargo se le mostrara una pagina web en su navegador, si no, deseleccionar la opción y seguir con la instalación.
Si todo esta listo vamos a indicar que instale XAMPP en nuestra máquina.
Una vez finalizado la instalación de XAMPP nos muestra la siguiente ventana con la opción seleccionada de iniciar el panel de control, hacemos clic en finalizar.
Listo al tener el panel de control ejecutado, debemos indicar el “Start” o iniciar en español, los servicios de Apache y MySQL para poder tener listo nuestro servidor local para PHP
Conclusión
Sin duda para poder empezar a programar con el lenguaje de programación PHP debemos considerar levantar nuestro servidor local (localhost) en nuestra pc, para desarrollar cualquier aplicación en PHP es necesario los servicio de apache y una base de datos MySQL para poder emplear cualquier proyecto.
]]>