15/3/16

Tutorial de desarrollo web I; prólogo

Introducción


El estado actual de la tecnología hace que sea indispensable, para un futuro desarrollo de nuestros emprendimientos, la inmersión en el mundo de la web; facilitando así nuestra comunicación con el entorno y la promoción de nuestros productos y servicios.


Actualmente se ofrecen una gran variedad de servicios que nos facilitan el desarrollo de sitios web, pero si lo que deseas es aprender desde la base, el funcionamiento y las herramientas indispensables para un desarrollo, estás en el lugar correcto.



La internet



Según Wikipedia, el internet es un conjunto descentralizado de redes de comunicación interconectadas que utilizan la familia de protocolos TCP/IP, lo cual garantiza que las redes físicas heterogéneas que la componen sean como una red lógica única de alcance mundial.


En español; un conjunto de redes de comunicación que se organizan a través de un grupo de reglas que permiten la comunicación entre diferentes ordenadores, estableciendo una forma de identificación para cada uno de estos y la forma de transmisión y procesamiento de datos.


La internet posee una gran variedad de servicios y protocolos de comunicaciones entre los que se encuentran SMTP para el envío de correos electrónicos, FTP y P2P para la transmisión de archivos, IRC para conversaciones en linea, VoIP para la telefonía IPTV para la televisión, NNTP para los boletines electrónicos, SSH y Telnet para acceso remoto a otros dispositivos y la World wide web para la consulta remota de archivos de hipertexto. Siendo este último el mas conocido y utilizado, por lo que se le confunde comúnmente con la internet.


La world wide web (www)

El diccionario define explícitamente la palabra “web” como un conjunto de información que se encuentra en una dirección determinada de internet. En este contexto, “world wide web” (red informática mundial) sería un sistema de distribución de documentos interconectados y accesibles vía internet.


Para acceder a estos documentos hipetextuales se utilizan navegadores web que permiten la visualización de contenido en forma de texto, imágenes, videos, o cualquier otro contenido multimedia y se navega entre ellos a través de hiperenlaces. En wikipedia puedes encontrar mucha información sobre la www.


Sabiendo esto, ya podemos adelantar una definición para página web.


Página web.


Es un documento electrónico capaz de almacenar texto, sonidos, videos, aplicaciones, imágenes, enlaces, etc, que es adaptado para la world wide web y puede ser accesible mediante un navegador web. Pero…


¿Cómo funciona ésto?


Cuando intentamos ingresar a un sitio, se traduce la parte nombre del servidor de la URL en una dirección ip usando la base de datos distribuida de Internet conocida como DNS. Esta dirección IP es necesaria para contactar con el servidor web y poder enviarle paquetes de datos.


El siguiente paso es enviar una petición HTTP al servidor web solicitando el recurso. En el caso de una página web típica, primero se solicita el texto HTML y luego es inmediatamente analizado por el navegador, el cual, después, hace peticiones adicionales para los gráficos y otros ficheros que formen parte de la página.


Al recibir los ficheros solicitados desde el servidor web, el navegador renderiza la página tal y como se describe en el código HTML, el CSS y otros lenguajes web. Al final se incorporan las imágenes y otros recursos para producir la página que ve el usuario en su pantalla.


Sitio web.


Es importante tener presente cual es el uso correcto del término “página web” el cual suele ser confundido con el de “sitio web”. Si una página web es un documento electrónico en el que se almacena información que es interpretada por el navegador, el sitio web sería el conjunto de esas páginas y aplicaciones que conforman un todo.


Sitios web dinámicos y estáticos.


En el caso de las páginas estáticas, al acceder el usuario, el servidor descarga simplemente un fichero con un contenido codificado en HTML que se visualiza a continuación en tu navegador. Un proceso muy similar a la descarga de cualquier fichero, por ejemplo un documento PDF.


Por el contrario, las páginas dinámicas que se generan al momento de la visualización. No son un simple documento HTML, sino que se están creadas en algún lenguaje interpretado. El ejemplo más popular es PHP, el lenguaje en el que están programadas aplicaciones muy populares como WordPress, MediaWiki, Wikipedia o Facebook; y funcionan mediante peticiones al servidor.


Este tipo de sitios permite la interacción con el usuario creándose así aplicaciones de mucha complejidad.


En este tutorial comenzaremos con páginas estáticas y luego nos introduciremos en el complejo mundo del desarrollo dinámico.


Toda esta charla no es más que una mera introducción para tener relativamente claro el funcionamiento de lo que queremos desarrollar, y nos da una pista de lo extenso que es el tema del desarrollo web. El resto de la base teórica la iremos viendo a medida en que vayamos avanzando en los temas del tutorial.


Ya hemos hecho referencia a términos que nos encontraremos a lo largo de esta serie de tutoriales y en ellos nos centraremos ahora.



HTML


Sigla en inglés de HyperText Markup Language (lenguaje de marcas de hipertexto) es un lenguaje de marcado para la estructuración de páginas web.


Se considera el lenguaje web más importante siendo su invención crucial en la aparición, desarrollo y expansión de la World Wide Web (WWW). Es el estándar que se ha impuesto en la visualización de páginas web y es el que todos los navegadores actuales han adoptado.


CSS


Hoja de estilo en cascada o CSS (siglas en inglés de cascading style sheets) es un lenguaje usado para definir y crear la presentación de un documento estructurado escrito en HTML


Todo esto en español

El html es un lenguaje en el que diagramamos y estructuramos la página web y el css el lenguaje que nos sirve para posicionar, dar color y hasta animar los elementos de nuestra página web.


En el próximo artículo de este tutorial comenzaremos a revisar lo que es el HTML más a fondo, de momento espero que este artículo sirva de referencia y para fomentar una investigación más minuciosa de todo lo que abarca el desarrollo web.

Hasta la próxima.

2 comentarios: