{"id":80917,"date":"2022-09-06T23:08:12","date_gmt":"2022-09-06T23:08:12","guid":{"rendered":"https:\/\/proyectos.comunicaciondigital.es\/nuevos-soportes-medios-copy\/"},"modified":"2024-08-05T10:37:31","modified_gmt":"2024-08-05T10:37:31","slug":"protocolos-sistemas-web","status":"publish","type":"post","link":"https:\/\/proyectos.comunicaciondigital.es\/en\/protocolos-sistemas-web\/","title":{"rendered":"Protocolos y sistemas web"},"content":{"rendered":"<p>[et_pb_section fb_built=\u00bb1&#8243; _builder_version=\u00bb4.16&#8243; global_colors_info=\u00bb{}\u00bb theme_builder_area=\u00bbpost_content\u00bb][et_pb_row _builder_version=\u00bb4.16&#8243; background_size=\u00bbinitial\u00bb background_position=\u00bbtop_left\u00bb background_repeat=\u00bbrepeat\u00bb global_colors_info=\u00bb{}\u00bb theme_builder_area=\u00bbpost_content\u00bb][et_pb_column type=\u00bb4_4&#8243; _builder_version=\u00bb4.16&#8243; custom_padding=\u00bb|||\u00bb global_colors_info=\u00bb{}\u00bb custom_padding__hover=\u00bb|||\u00bb theme_builder_area=\u00bbpost_content\u00bb][et_pb_text admin_label=\u00bbConociendo etiqueta\u00bb module_id=\u00bb1&#8243; _builder_version=\u00bb4.18.0&#8243; _module_preset=\u00bbdefault\u00bb header_2_text_color=\u00bb#0C71C3&#8243; global_colors_info=\u00bb{}\u00bb theme_builder_area=\u00bbpost_content\u00bb]<\/p>\n<h2>C\u00f3mo funcionan los sistemas<\/h2>\n<p>[\/et_pb_text][et_pb_accordion _builder_version=\u00bb4.27.0&#8243; _module_preset=\u00bbdefault\u00bb hover_enabled=\u00bb0&#8243; global_colors_info=\u00bb{}\u00bb theme_builder_area=\u00bbpost_content\u00bb sticky_enabled=\u00bb0&#8243;][et_pb_accordion_item title=\u00bbProtocolos de internet\u00bb open=\u00bbon\u00bb _builder_version=\u00bb4.27.0&#8243; _module_preset=\u00bbdefault\u00bb hover_enabled=\u00bb0&#8243; global_colors_info=\u00bb{}\u00bb theme_builder_area=\u00bbpost_content\u00bb sticky_enabled=\u00bb0&#8243;]<\/p>\n<div class=\"h5p-column-content h5p-advanced-text\" id=\"h5p-interactive-book-section-1bf2dee3-02b2-44fe-a91c-0cf05eac4c8c\">\n<p>Los protocolos de internet son los conjuntos de reglas que permiten la comunicaci\u00f3n entre m\u00e1quinas (dispositivos) para transmitir la informaci\u00f3n entre estas.<\/p>\n<p>Para que los equipos puedan comunicarse eficazmente es necesario que hablen el \u201cmismo idioma\u201d, es decir, que la forma de establecer la comunicaci\u00f3n se base en un conjunto de reglas que dichos dispositivos comprenden para recibir y generar la informaci\u00f3n. En el v\u00eddeo \u00abProtocolos b\u00e1sicos de internet | | UPV\u00bb podr\u00e1s aprender los principales protocolos de internet.<\/p>\n<p><iframe loading=\"lazy\" title=\"Protocolos b\u00e1sicos de internet |  | UPV\" width=\"1080\" height=\"608\" src=\"https:\/\/www.youtube.com\/embed\/wtOKwmwgofc?feature=oembed\"  allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\" allowfullscreen><\/iframe><\/p>\n<p><span id=\"fuente01\" style=\"color: #999999;\"><em>Fuente: <b>Protocolos b\u00e1sicos de internet | | UPV <\/b> by<br \/>Universitat Polit\u00e8cnica de Val\u00e8ncia &#8211; UPV at <a rel=\"nofollow\" class=\"external free\" href=\"https:\/\/www.youtube.com\/watch?v=wtOKwmwgofc&amp;t=5s\" style=\"color: #999999;\">https:\/\/www.youtube.com\/watch?v=wtOKwmwgofc&amp;t=5s<\/a>. License by owner of copyright.<\/em><\/span><\/p>\n<h3>TCP\/IP<\/h3>\n<p>Los protocolos de red que permiten la comunicaci\u00f3n en internet se conocen como protocolos TCP\/IP, ya que, aunque son m\u00e1s de cien, los m\u00e1s importantes son TCP (Transmission Control Protocol) e IP (Internet Protocol).<br \/><strong>TCP<span>\u00a0<\/span><\/strong>(Transmission Control Protocol) o Protocolo de Control de Transmisi\u00f3n se encarga de establecer la comunicaci\u00f3n entre los ordenadores de una red, garantizando que se lleva a cabo sin errores, p\u00e9rdidas y de forma segura. Realiza tres procesos: establecer la conexi\u00f3n, transferir los datos y finalizar la conexi\u00f3n.<\/p>\n<p><strong>IP<span>\u00a0<\/span><\/strong>(Internet Protocol) es el protocolo encargado de la transmisi\u00f3n de datos a trav\u00e9s de paquetes o datagramas.<\/p>\n<p>Los datos circulan en internet en forma de paquetes o datagramas. Estos son datos encapsulados, es decir, datos a los que se les agrega un encabezado que contiene informaci\u00f3n sobre su transporte (como la direcci\u00f3n IP de destino)<\/p>\n<p>IP sirve, adem\u00e1s, para establecer las direcciones de los equipos de origen y destino, que se conocen como direcciones IP.<\/p>\n<h3>HTTP<\/h3>\n<p>HTTP (Hypertext Transfer Protocol) o Protocolo de transferencia de hipertexto, es, como su nombre indica, el protocolo encargado del intercambio en internet de ficheros que contienen elementos hipertextuales, b\u00e1sicamente, enlaces, lo que facilita la navegaci\u00f3n entre estos. Por ello, http es el protocolo fundamental que utilizan los navegadores para mostrar las p\u00e1ginas web, y utiliza el puerto 80.<\/p>\n<p>Su funcionamiento sigue el esquema de conexi\u00f3n entre un cliente y un servidor: el cliente, a trav\u00e9s de un programa (\u201cuser agent\u201d) como un navegador o un web crawler (a\u00f1ana web, spider) solicita al servidor la ejecuci\u00f3n de un contenido (base de datos, fichero, conjunto de ficheros, etc.) y este devuelve una respuesta que se muestra en el navegador del cliente.<\/p>\n<p>Una de las caracter\u00edsticas de http es que no almacena informaci\u00f3n de las transacciones entre cliente y servidor (se dice que es un protocolo sin estado), por lo que si se quiere almacenar informaci\u00f3n sobre el hist\u00f3rico, es necesario recurrir a otros recursos como las conocidas cookies.<\/p>\n<p>HTTPs es una variante del protocolo http que permite la transferencia segura de datos. Para ello, utiliza un cifrado basado en SSL\/TLS (Secure Socket Layer).<\/p>\n<p>Es habitual su uso en web que realizan transacciones econ\u00f3micas, como bancos, sistemas de pago online, etc. Utiliza el puerto 443.<\/p>\n<h3>Otros protocolos<\/h3>\n<p>El n\u00famero de protocolos es muy amplio, por lo que se mencionan a continuaci\u00f3n solamente los m\u00e1s relevantes para nuestro estudio:<\/p>\n<ul>\n<li>\n<p><strong>FTP (File Transfer Protocol)<\/strong>: Permite transferir ficheros dentro de una arquitectura cliente-servidor, entre distintos ordenadores. Utiliza los puertos 20 (datos) y 21 (control). Los clientes FTP, como Filezilla, son programas espec\u00edficos utilizados para conectarse por FTP.<\/p>\n<\/li>\n<li>\n<p><strong>SSH (Secure Shell)<\/strong>: Protocolo para la conexi\u00f3n a m\u00e1quinas remotas, permitiendo un control absoluto de la m\u00e1quina desde el cliente para realizar operaciones con ficheros y programar cron jobs. SSH es m\u00e1s r\u00e1pido que FTP y permite trabajar de forma segura cifrando y \u00abtunelizando\u00bb las conexiones. Utiliza el puerto 22.<\/p>\n<\/li>\n<li>\n<p><strong>SMTP (Simple Mail Transfer Protocol)<\/strong>: Utilizado para la transferencia de correos electr\u00f3nicos entre servidores.<\/p>\n<\/li>\n<li>\n<p><strong>IMAP (Internet Message Access Protocol) y POP3 (Post Office Protocol 3)<\/strong>: Protocolos utilizados para la gesti\u00f3n del correo electr\u00f3nico en los clientes de correo. IMAP permite acceder a los correos almacenados en un servidor remoto, mientras que POP3 descarga los correos al dispositivo local y los elimina del servidor.<\/p>\n<\/li>\n<\/ul>\n<p><a href=\"https:\/\/proyectos.comunicaciondigital.es\/wp-content\/uploads\/2022\/09\/file-6139fd655c084.jpeg\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/proyectos.comunicaciondigital.es\/wp-content\/uploads\/2022\/09\/file-6139fd655c084.jpeg\" width=\"623\" height=\"388\" alt=\"\" class=\"wp-image-80921 alignnone size-full\" style=\"display: block; margin-left: auto; margin-right: auto;\" srcset=\"https:\/\/proyectos.comunicaciondigital.es\/wp-content\/uploads\/2022\/09\/file-6139fd655c084.jpeg 623w, https:\/\/proyectos.comunicaciondigital.es\/wp-content\/uploads\/2022\/09\/file-6139fd655c084-480x299.jpeg 480w\" sizes=\"(min-width: 0px) and (max-width: 480px) 480px, (min-width: 481px) 623px, 100vw\" \/><\/a><\/p>\n<p><span id=\"fuente01\" style=\"color: #999999;\"><em>Fuente: <b>Esquema protocolo<\/b> by Manuel Gertrudix at <a rel=\"nofollow\" class=\"external free\" href=\"https:\/\/proyectos.comunicaciondigital.es\/wp-content\/uploads\/2022\/09\/file-6139fd655c084.jpeg\" style=\"color: #999999;\">https:\/\/proyectos.comunicaciondigital.es\/wp-content\/uploads\/2022\/09\/file-6139fd655c084.jpeg<\/a>. Licensed under the terms of the cc-by-2.0.<\/em><\/span><\/p>\n<h3>Actualizaciones y nuevas tendencias<\/h3>\n<ul>\n<li>\n<p><strong>IPv6<\/strong>: A medida que el n\u00famero de dispositivos conectados a internet crece, se ha ido implementando IPv6 para resolver la limitaci\u00f3n de direcciones IP disponibles en IPv4.<\/p>\n<\/li>\n<li>\n<p><strong>QUIC (Quick UDP Internet Connections)<\/strong>: Protocolo de transporte desarrollado por Google, que mejora la velocidad y seguridad de las conexiones respecto a TCP, utilizando UDP como base.<\/p>\n<\/li>\n<li>\n<p><strong>HTTP\/3<\/strong>: Evoluci\u00f3n del protocolo HTTP, que utiliza QUIC para mejorar la eficiencia y seguridad de las conexiones.<\/p>\n<\/li>\n<\/ul>\n<h3>Presentaci\u00f3n resumen<\/h3>\n<p>En<span> <\/span><a href=\"https:\/\/www.slideshare.net\/secret\/UZ4dfXQqmGIbN\" target=\"_blank\" rel=\"noopener\">esta presentaci\u00f3n \u00abProtocolos de internet\u00bb<span>\u00a0<\/span><\/a>se resumen las caracter\u00edsticas m\u00e1s relevantes de los diferentes protocolos que hemos tratado en este ep\u00edgrafe:<\/p>\n<p><iframe loading=\"lazy\" src=\"https:\/\/proyectos.comunicaciondigital.es\/files\/clases\/protocolos-internet.pdf\" width=\"100%\" height=\"600\"><\/iframe><\/p>\n<p><span id=\"fuente01\" style=\"color: #999999;\"><em>Fuente: <b>Protocolos de internet<\/b> by Manuel G\u00e9rtrudix at <a rel=\"nofollow\" class=\"external free\" href=\"https:\/\/www.slideshare.net\/secret\/UZ4dfXQqmGIbN\" style=\"color: #999999;\">https:\/\/www.slideshare.net\/secret\/UZ4dfXQqmGIbN<\/a>. Licensed under the terms of the cc-by-2.0.<\/em><\/span><\/p>\n<\/div>\n<p>[\/et_pb_accordion_item][et_pb_accordion_item title=\u00bbSistema de dominios\u00bb _builder_version=\u00bb4.18.0&#8243; _module_preset=\u00bbdefault\u00bb global_colors_info=\u00bb{}\u00bb theme_builder_area=\u00bbpost_content\u00bb open=\u00bboff\u00bb]<\/p>\n<h2>Sistema de dominios<\/h2>\n<p>El sistema de dominios es un sistema creado para la jerarquizaci\u00f3n de nombres que permitan identificar y referirse, de forma sencilla, a los dispositivos conectados a internet o a una red privada.<\/p>\n<p>Su principal objetivo es proveer un sistema de nombres, f\u00e1cilmente memorizables, que convierta las direcciones IP (num\u00e9ricas) de forma autom\u00e1tica, permitiendo acceder al contenido depositado en una m\u00e1quina.<\/p>\n<p>La asignaci\u00f3n de nombres a direcciones IP es ciertamente la funci\u00f3n m\u00e1s conocida de los protocolos DNS. Por ejemplo, si la direcci\u00f3n IP del sitio<span>\u00a0<\/span><a href=\"https:\/\/es.wikipedia.org\/wiki\/File_Transfer_Protocol\" rel=\"noopener\" target=\"_blank\">FTP<\/a><span>\u00a0<\/span>de prox.mx es 200.64.128.4, la mayor\u00eda de la gente llega a este equipo especificando ftp.prox.mx y no la direcci\u00f3n IP. Adem\u00e1s de ser m\u00e1s f\u00e1cil de recordar, el nombre es m\u00e1s fiable. La direcci\u00f3n num\u00e9rica podr\u00eda cambiar por muchas razones, sin que tenga que cambiar el nombre. (<a href=\"https:\/\/es.wikipedia.org\/wiki\/Domain_Name_System\" rel=\"noopener\" target=\"_blank\">Wikipedia)<\/a><\/p>\n<p>Actualmente, conviven dos versiones del Protocolo de Internet:<span>\u00a0<\/span><a href=\"http:\/\/www.dominios.es\/dominios\/sites\/dominios\/files\/1308727877879_0.pdf\" rel=\"noopener\" target=\"_blank\">IPv4 (1975) e IPv6 (1998).<\/a><span>\u00a0<\/span>Este \u00faltimo vino a resolver el problema que supon\u00eda la limitaci\u00f3n de IPs disponibles con IPv4 (unos 294 millones) frente a los 3,4 mil millones de IPv6.<\/p>\n<p>La convivencia entre ambos (hasta que IPv4 quede completamente superado) ha generado algunas dificultades que trata de superar<span>\u00a0<\/span><a href=\"https:\/\/tools.ietf.org\/html\/draft-omar-ipv10-01\" rel=\"noopener\" target=\"_blank\">IPv10<\/a>, una nueva versi\u00f3n del protocolo lanzada a finales de 2016, que permite la comunicaci\u00f3n entre host que resuelven una u otra versi\u00f3n.<\/p>\n<p>En el v\u00eddeo \u00abLas direcciones IP y el sistema de nombres de dominio\u00bb aprender\u00e1s m\u00e1s sobre las direcciones IP.<\/p>\n<p><iframe loading=\"lazy\" title=\"Las direcciones IP y el sistema de nombres de dominio\" width=\"1080\" height=\"608\" src=\"https:\/\/www.youtube.com\/embed\/kCLTBOYxMXg?feature=oembed\"  allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\" allowfullscreen><\/iframe><\/p>\n<p><span id=\"fuente01\" style=\"color: #999999;\"><em>Fuente: <b>Las direcciones IP y el sistema de nombres de dominio<\/b> by iDESWEB UA at <a rel=\"nofollow\" class=\"external free\" href=\"https:\/\/www.youtube.com\/watch?v=kCLTBOYxMXg&#038;t=1s\" style=\"color: #999999;\">https:\/\/www.youtube.com\/watch?v=kCLTBOYxMXg&#038;t=1s<\/a>. License by owner of copyright.<\/em><\/span><\/p>\n<h3>\u00bfC\u00f3mo elegir un buen dominio?<\/h3>\n<ol>\n<li>Analizar la distribuci\u00f3n de dominios TLD actuales:\u00a0<a href=\"http:\/\/research.domaintools.com\/statistics\/tld-counts\/\" rel=\"noopener\" target=\"_blank\">http:\/\/research.domaintools.com\/statistics\/tld-counts\/<\/a>\u00a0 &#8211;\u00a0<a href=\"https:\/\/namestat.org\/\" rel=\"noopener\" target=\"_blank\">https:\/\/namestat.org\/<\/a><\/li>\n<li>Ver la disponibilidad en servicios y redes sociales: \u00a0<a href=\"https:\/\/namechk.com\/\" rel=\"noopener\" target=\"_blank\">https:\/\/namechk.com\/<\/a>\u00a0&#8211;\u00a0<a href=\"http:\/\/knowem.com\/\" rel=\"noopener\" target=\"_blank\">http:\/\/knowem.com\/<\/a><\/li>\n<li>Evaluar el dominio: ICANN Whois<span>\u00a0<\/span><a href=\"https:\/\/whois.icann.org\/es\" rel=\"noopener\" target=\"_blank\">https:\/\/whois.icann.org\/es<span>\u00a0<\/span><\/a>\u00a0&#8212; DomainTools &#8211;\u00a0<a href=\"http:\/\/whois.domaintools.com\/\" rel=\"noopener\" target=\"_blank\">http:\/\/whois.domaintools.com\/<\/a><\/li>\n<li>Evaluar el precio del dominio o de otros de la competencia:\u00a0<a href=\"https:\/\/www.freevaluator.com\/\" rel=\"noopener\" target=\"_blank\">https:\/\/www.freevaluator.com\/<\/a>\u00a0 &#8211; \u00a0<a href=\"http:\/\/www.siteprice.org\/\" rel=\"noopener\" target=\"_blank\">http:\/\/www.siteprice.org\/<\/a><\/li>\n<li>Comprobar la disponibilidad del dominio:\u00a0.es:\u00a0<a href=\"http:\/\/www.dominios.es\/dominios\/\" rel=\"noopener\" target=\"_blank\">http:\/\/www.dominios.es\/dominios\/<\/a>\u00a0gTDL y ccTDL :\u00a0<a href=\"https:\/\/dinahosting.com\/dominios\/resultados#content\" rel=\"noopener\" target=\"_blank\">https:\/\/dinahosting.com\/dominios\/resultados<\/a><\/li>\n<li>Hacer una comparativa en<span>\u00a0<\/span><a href=\"https:\/\/www.google.es\/trends\/\" rel=\"noopener\" target=\"_blank\">Google Trends<\/a>\u00a0para buscar un dominio que \u201cest\u00e9 en la cabeza de la gente\u00bb.<\/li>\n<\/ol>\n<p>En la presentaci\u00f3n \u00abSistema de dominios\u00bb se muestran, de forma resumida, los principales elementos que conforman el sistema de dominios.<br \/>\n<iframe loading=\"lazy\" src=\"https:\/\/proyectos.comunicaciondigital.es\/files\/clases\/sistema-dominios.pdf\" width=\"100%\" height=\"600\"><\/iframe><\/p>\n<p><span id=\"fuente01\" style=\"color: #999999;\"><em>Fuente: <b>Sistema de dominios<\/b> by Manuel Gertrudix at <a rel=\"nofollow\" class=\"external free\" href=\"https:\/\/proyectos.comunicaciondigital.es\/files\/clases\/sistema-dominios.pdf\" style=\"color: #999999;\">https:\/\/proyectos.comunicaciondigital.es\/files\/clases\/sistema-dominios.pdf<\/a>. Licensed under the terms of the cc-by-2.0.<\/em><\/span>[\/et_pb_accordion_item][et_pb_accordion_item title=\u00bbCDN y sistemas de entrega de medios\u00bb _builder_version=\u00bb4.18.0&#8243; _module_preset=\u00bbdefault\u00bb global_colors_info=\u00bb{}\u00bb theme_builder_area=\u00bbpost_content\u00bb open=\u00bboff\u00bb]<\/p>\n<h2>CDN y sistemas de entrega de medios<\/h2>\n<p>Una CDN (Content Delivery Network) es una estructura de red que permite distribuir el contenido de una web a lo largo del mundo de manera que permita descargar los archivos y contenidos de una web o de una aplicaci\u00f3n desde un lugar m\u00e1s pr\u00f3ximo al usuario.<\/p>\n<p>Esto permite acelerar la carga de las p\u00e1ginas, mejorar el tiempo de respuesta desde que el usuario demanda los ficheros y, por lo tanto, garantizar una mejor experiencia de usuario.<\/p>\n<p>En esta infograf\u00eda, elaborada por IONOS, se muestra c\u00f3mo funciona en detalle un sistema de CDN, en este caso de la empresa<span>\u00a0<\/span><a href=\"https:\/\/www.ovh.es\/cdn\/ventajas.xml?xtor=SEC-13-GOO-[ES-OVH-2019-S-Hosting-S-Remarketing()]-[483725178139]-S-[]&amp;xts=563736&amp;gclid=Cj0KCQjw4eaJBhDMARIsANhrQABi0EJGbsMDmdYgeQPIKzKG1Y8zxuDPwu1fnKk5cE0fLVCzLPP3yYwaAnnLEALw_wcB\" target=\"_blank\" rel=\"noopener\">OVHCloud<\/a>.<\/p>\n<div id=\"attachment_80930\" style=\"width: 764px\" class=\"wp-caption alignnone\"><a href=\"https:\/\/proyectos.comunicaciondigital.es\/wp-content\/uploads\/2022\/09\/cdn1.png\"><img loading=\"lazy\" decoding=\"async\" aria-describedby=\"caption-attachment-80930\" src=\"https:\/\/proyectos.comunicaciondigital.es\/wp-content\/uploads\/2022\/09\/cdn1.png\" width=\"754\" height=\"950\" alt=\"CDN esquema\" class=\"wp-image-80930 size-full\" srcset=\"https:\/\/proyectos.comunicaciondigital.es\/wp-content\/uploads\/2022\/09\/cdn1.png 754w, https:\/\/proyectos.comunicaciondigital.es\/wp-content\/uploads\/2022\/09\/cdn1-480x605.png 480w\" sizes=\"(min-width: 0px) and (max-width: 480px) 480px, (min-width: 481px) 754px, 100vw\" \/><\/a><p id=\"caption-attachment-80930\" class=\"wp-caption-text\">CDN<\/p>\n<p>esquema<\/p><\/div>\n<div id=\"attachment_80932\" style=\"width: 764px\" class=\"wp-caption alignnone\"><a href=\"https:\/\/proyectos.comunicaciondigital.es\/wp-content\/uploads\/2022\/09\/cdn2.png\"><img loading=\"lazy\" decoding=\"async\" aria-describedby=\"caption-attachment-80932\" src=\"https:\/\/proyectos.comunicaciondigital.es\/wp-content\/uploads\/2022\/09\/cdn2.png\" width=\"754\" height=\"632\" alt=\"CDN esquema\" class=\"wp-image-80932 size-full\" srcset=\"https:\/\/proyectos.comunicaciondigital.es\/wp-content\/uploads\/2022\/09\/cdn2.png 754w, https:\/\/proyectos.comunicaciondigital.es\/wp-content\/uploads\/2022\/09\/cdn2-480x402.png 480w\" sizes=\"(min-width: 0px) and (max-width: 480px) 480px, (min-width: 481px) 754px, 100vw\" \/><\/a><p id=\"caption-attachment-80932\" class=\"wp-caption-text\">CDN esquema<\/p><\/div>\n<p><span id=\"fuente01\" style=\"color: #999999;\"><em>Fuente: <b>El funcionamiento de la CDN en 4 etapas<\/b> by OVHcloud at <a rel=\"nofollow\" class=\"external free\" href=\"https:\/\/www.ovh.es\/cdn\/ventajas.xml\" style=\"color: #999999;\">https:\/\/www.ovh.es\/cdn\/ventajas.xml<\/a>. License by owner of copyright.<\/em><\/span>[\/et_pb_accordion_item][\/et_pb_accordion][\/et_pb_column][\/et_pb_row][et_pb_row _builder_version=\u00bb4.18.0&#8243; _module_preset=\u00bbdefault\u00bb global_colors_info=\u00bb{}\u00bb theme_builder_area=\u00bbpost_content\u00bb][et_pb_column type=\u00bb4_4&#8243; _builder_version=\u00bb4.18.0&#8243; _module_preset=\u00bbdefault\u00bb global_colors_info=\u00bb{}\u00bb theme_builder_area=\u00bbpost_content\u00bb][et_pb_text _builder_version=\u00bb4.18.0&#8243; _module_preset=\u00bbdefault\u00bb global_colors_info=\u00bb{}\u00bb theme_builder_area=\u00bbpost_content\u00bb]<iframe loading=\"lazy\" src=\"https:\/\/anchor.fm\/comunica-digital\/embed\/episodes\/Protocolos-y-sistemas-web-e1ob8m4\" height=\"160px\" width=\"100%\" frameborder=\"0\" scrolling=\"no\"><\/iframe>[\/et_pb_text][\/et_pb_column][\/et_pb_row][\/et_pb_section]<\/p>\n<div class=\"pdfprnt-buttons pdfprnt-buttons-post pdfprnt-bottom-right\"><a href=\"https:\/\/proyectos.comunicaciondigital.es\/en\/wp-json\/wp\/v2\/posts\/80917?print=pdf\" class=\"pdfprnt-button pdfprnt-button-pdf\" target=\"_blank\" ><img decoding=\"async\" src=\"https:\/\/proyectos.comunicaciondigital.es\/wp-content\/plugins\/pdf-print\/images\/pdf.png\" alt=\"image_pdf\" title=\"View PDF\" \/><span class=\"pdfprnt-button-title pdfprnt-button-pdf-title\">Versi\u00f3n en PDF<\/span><\/a><\/div>","protected":false},"excerpt":{"rendered":"<p>Los protocolos de internet son los conjuntos de reglas que permiten la comunicaci\u00f3n entre m\u00e1quinas (dispositivos) para transmitir la informaci\u00f3n entre estas. <a class=\"continue\" href=\"https:\/\/proyectos.comunicaciondigital.es\/en\/protocolos-sistemas-web\/\">Continua leyendo<span> Protocolos y sistemas web<\/span><\/a><\/p>","protected":false},"author":1,"featured_media":80913,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_et_pb_use_builder":"on","_et_pb_old_content":"<!-- wp:group {\"className\":\"atavist-title-design cover-text-simple\"} -->\n<div class=\"wp-block-group atavist-title-design cover-text-simple\"><!-- wp:heading {\"textAlign\":\"left\",\"align\":\"center\",\"className\":\"aligncenter atavist-title-h2\"} -->\n<h2 class=\"has-text-align-left aligncenter atavist-title-h2\">Gu\u00eda inicial<\/h2>\n<!-- \/wp:heading --><\/div>\n<!-- \/wp:group -->\n\n<!-- wp:paragraph -->\n<p>Javascript es el lenguaje de script nativo de la web. <\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:image {\"align\":\"wide\"} -->\n<figure class=\"wp-block-image alignwide\"><img src=\"https:\/\/cibercambio.files.wordpress.com\/2021\/04\/d3de1-js1-1533890338-46.png\" alt=\"\"\/><\/figure>\n<!-- \/wp:image -->\n\n<!-- wp:image {\"align\":\"center\"} -->\n<div class=\"wp-block-image\"><figure class=\"aligncenter\"><img src=\"https:\/\/cibercambio.files.wordpress.com\/2021\/04\/645b4-js2-1533890439-37.jpg\" alt=\"\"\/><\/figure><\/div>\n<!-- \/wp:image -->\n\n<!-- wp:paragraph -->\n<p>Su aprendizaje supone introducirse en un lenguaje de programaci\u00f3n, y aunque pueda parecer complicado de entrada, luego nos permitir\u00e1 saber c\u00f3mo modificar c\u00f3digo ya escrito o realizar visualizaciones muy atractivas mediante el uso de librer\u00edas y APIs que se basan en Javascript.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:image {\"align\":\"wide\"} -->\n<figure class=\"wp-block-image alignwide\"><img src=\"https:\/\/cibercambio.files.wordpress.com\/2021\/04\/0e98e-js3-1533890711-78.png\" alt=\"\"\/><\/figure>\n<!-- \/wp:image -->\n\n<!-- wp:paragraph -->\n<p><b>\u00bfPara qu\u00e9 nos sirve Javascript en un proyecto period\u00edstico?<\/b><\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:list -->\n<ul><li>Para tener unas nociones generales sobre la programaci\u00f3n con scripts. <\/li><li>Para saber c\u00f3mo funciona, de forma global, la interactividad en la manipulaci\u00f3n de datos y de las visualizaciones.<\/li><li>Para comprender el c\u00f3digo resultante de los sistemas de datos y visualizaci\u00f3n, y saber manipular determinados par\u00e1metros. <\/li><li>Para comenzar a adentrarnos en la creaci\u00f3n de visualizaciones basadas en librer\u00edas JS como jQuery <\/li><li>Para hacer scraping de datos con Javascript (Jquery)&nbsp;&nbsp;\n<\/li><\/ul>\n<!-- \/wp:list -->\n\n<!-- wp:paragraph -->\n<p>Para trabajar con Javascript utilizaremos editores de c\u00f3digo online como <a href=\"https:\/\/jsfiddle.net\/\" target=\"_blank\" class=\"regular-link\" rel=\"noopener\">JsFiddle.net<\/a>. Podr\u00e1s acceder a los ejemplos y ejercicios de dos formas: <\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>A) A trav\u00e9s de los enlaces que encontrar\u00e1s en cada ejercicio y que te dar\u00e1n acceso al entorno online de edici\u00f3n:<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:image {\"align\":\"wide\"} -->\n<figure class=\"wp-block-image alignwide\"><img src=\"https:\/\/cibercambio.files.wordpress.com\/2021\/04\/4c615-js4-1533891129-19.png\" alt=\"\"\/><\/figure>\n<!-- \/wp:image -->\n\n<!-- wp:paragraph -->\n<p> B) Manipular los ejemplos de forma directa a trav\u00e9s de objetos embebidos como este, en el que podr\u00e1s trabajar en las diferentes partes del c\u00f3digo accediendo a las diferentes pesta\u00f1as disponibles. <\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:group {\"className\":\"atavist-embed\"} -->\n<div class=\"wp-block-group atavist-embed\"><!-- wp:html \/--><\/div>\n<!-- \/wp:group -->\n\n<!-- wp:group {\"className\":\"atavist-title-design cover-text-simple\"} -->\n<div class=\"wp-block-group atavist-title-design cover-text-simple\"><!-- wp:heading {\"textAlign\":\"left\",\"align\":\"center\",\"className\":\"aligncenter atavist-title-h2\"} -->\n<h2 class=\"has-text-align-left aligncenter atavist-title-h2\">\u00bfQu\u00e9 es Javascript?<\/h2>\n<!-- \/wp:heading --><\/div>\n<!-- \/wp:group -->\n\n<!-- wp:heading -->\n<h2>\u00bfQu\u00e9 es?<\/h2>\n<!-- \/wp:heading -->\n\n<!-- wp:paragraph -->\n<p>Un <b>lenguaje<\/b> de programaci\u00f3n <b>interpretado<\/b> por los navegadores en tiempo real. <\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:image {\"align\":\"wide\"} -->\n<figure class=\"wp-block-image alignwide\"><img src=\"https:\/\/cibercambio.files.wordpress.com\/2021\/04\/c2ba4-js5-1533893491-16.jpg\" alt=\"Lenguajes compilados vs Lenguajes interpretados\"\/><figcaption>Lenguajes compilados vs Lenguajes interpretados<\/figcaption><\/figure>\n<!-- \/wp:image -->\n\n<!-- wp:paragraph -->\n<p>Es un dialecto del est\u00e1ndar <a href=\"https:\/\/www.w3schools.com\/js\/js_es6.asp\" target=\"_blank\" class=\"regular-link\" rel=\"noopener\">ECMAScript<\/a> (versi\u00f3n 6)<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>Responde al modelo de P<a href=\"https:\/\/www.desarrolloweb.com\/articulos\/499.php\" target=\"_blank\" class=\"regular-link\" rel=\"noopener\">rogramaci\u00f3n orientada a objetos (POO)<\/a>. Aunque sigue el paradigma de programaci\u00f3n basado en objetos, trabaja con prototipos, aunque las versiones actuales permiten el manejo de <a href=\"https:\/\/medium.com\/@jmz12\/usando-clases-en-javascript-e07f0e25c67d\" target=\"_blank\" class=\"regular-link\" rel=\"noopener\">clases (class)<\/a>. Al trabajar bajo el modelo de POO usa t\u00e9cnicas que le dan una importante versatilidad como, por ejemplo:<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:list -->\n<ul><li>\n<b>Modularidad<\/b>. Las aplicaciones se pueden subdividir en partes, conocidas como m\u00f3dulos.<\/li><li>\n<b>Encapsulamiento<\/b>. Los datos se \"encapsulan\" o aislan para evitar que puedan ser manipulados o cambiados de estado.<\/li><li>\n<b>Control del DOM<\/b>. Permite interactuar con la p\u00e1gina web mediante <a href=\"https:\/\/developer.mozilla.org\/es\/docs\/Glossary\/DOM\" target=\"_blank\" class=\"regular-link\" rel=\"noopener\">DOM<\/a>\n<\/li><\/ul>\n<!-- \/wp:list -->\n\n<!-- wp:paragraph -->\n<p>Puede funcionar tanto: <\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:list -->\n<ul><li>En el lado cliente (client-side) como parte del navegador web<\/li><li>En el lado servidor (vg. <a href=\"https:\/\/nodejs.org\/es\/\" target=\"_blank\" class=\"regular-link\" rel=\"noopener\">Node.js<\/a>)<\/li><\/ul>\n<!-- \/wp:list -->\n\n<!-- wp:group {\"align\":\"center\",\"className\":\"aligncenter is-style-border\"} -->\n<div class=\"wp-block-group aligncenter is-style-border\"><!-- wp:paragraph -->\n<p>Aunque el nombre es similar a&nbsp;JAVA, tiene que ver poco con este otro lenguaje de programaci\u00f3n, tanto en las&nbsp;sem\u00e1nticas como en sus&nbsp;prop\u00f3sitos, que son&nbsp;diferentes, as\u00ed que debemos no confundirlos.&nbsp;&nbsp;<\/p>\n<!-- \/wp:paragraph --><\/div>\n<!-- \/wp:group -->\n\n<!-- wp:heading {\"level\":3} -->\n<h3>Ejercicio<\/h3>\n<!-- \/wp:heading -->\n\n<!-- wp:list -->\n<ol>\n<li><i>Abre el editor de c\u00f3digo en <a href=\"https:\/\/jsfiddle.net\/\" target=\"_blank\" class=\"regular-link\" rel=\"noopener\">JSFiddle<\/a> con <a href=\"https:\/\/jsfiddle.net\/gertrudix\/k9mgd2hL\/2\/\" target=\"_blank\" class=\"regular-link\" rel=\"noopener\">el ejercicio<\/a>.<\/i><\/li>\n<li>\n<i>Revisa el c\u00f3digo html. F\u00edjate que el c\u00f3digo JS aparece en el fichero HTML. Prueba el resultado que produce el bot\u00f3n. \u00bfC\u00f3mo crees que funciona revisando el c\u00f3digo?<\/i>\n<\/li>\n<\/ol>\n<!-- \/wp:list -->\n\n<!-- wp:group {\"className\":\"atavist-embed\"} -->\n<div class=\"wp-block-group atavist-embed\"><!-- wp:html \/--><\/div>\n<!-- \/wp:group -->\n\n<!-- wp:group {\"className\":\"atavist-title-design cover-text-simple\"} -->\n<div class=\"wp-block-group atavist-title-design cover-text-simple\"><!-- wp:heading {\"textAlign\":\"left\",\"align\":\"center\",\"className\":\"aligncenter atavist-title-h2\"} -->\n<h2 class=\"has-text-align-left aligncenter atavist-title-h2\">\u00bfD\u00f3nde aparece?<\/h2>\n<!-- \/wp:heading --><\/div>\n<!-- \/wp:group -->\n\n<!-- wp:image {\"align\":\"wide\"} -->\n<figure class=\"wp-block-image alignwide\"><img src=\"https:\/\/cibercambio.files.wordpress.com\/2021\/04\/55de3-js6-1533898857-79.png\" alt=\"\"\/><\/figure>\n<!-- \/wp:image -->\n\n<!-- wp:paragraph -->\n<p>Javascript puede cargarse en la p\u00e1gina web a trav\u00e9s de diferentes opciones.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:heading {\"level\":3} -->\n<h3>Ejercicio<\/h3>\n<!-- \/wp:heading -->\n\n<!-- wp:list -->\n<ol><li>\n<i>Abre el ejercicio en JSFiddle y f\u00edjate en las diferentes cajas para entender d\u00f3nde puede ubicarse el c\u00f3digo JS.<\/i>\n<\/li><\/ol>\n<!-- \/wp:list -->\n\n<!-- wp:group {\"className\":\"atavist-embed\"} -->\n<div class=\"wp-block-group atavist-embed\"><!-- wp:html \/--><\/div>\n<!-- \/wp:group -->\n\n<!-- wp:group {\"className\":\"atavist-title-design cover-text-simple\"} -->\n<div class=\"wp-block-group atavist-title-design cover-text-simple\"><!-- wp:heading {\"textAlign\":\"left\",\"align\":\"center\",\"className\":\"aligncenter atavist-title-h2\"} -->\n<h2 class=\"has-text-align-left aligncenter atavist-title-h2\">Depurando. Consola del navegador.<\/h2>\n<!-- \/wp:heading --><\/div>\n<!-- \/wp:group -->\n\n<!-- wp:paragraph -->\n<p>La consola del navegador nos permite revisar y depurar los errores de c\u00f3digo. <\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>Todos los navegadores actuales disponen de ella. Para abrirla:&nbsp;&nbsp;<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:list -->\n<ul><li>En Chrome: Ctrl+Shift+J (Windows) o Cmd+Alt+I (Mac) <\/li><li>En Firefox: Control + \u21e7 + J (Windows)&nbsp;&nbsp;\n<\/li><\/ul>\n<!-- \/wp:list -->\n\n<!-- wp:image {\"align\":\"wide\"} -->\n<figure class=\"wp-block-image alignwide\"><img src=\"https:\/\/cibercambio.files.wordpress.com\/2021\/04\/210d9-js7-1533899311-62.png\" alt=\"Consola del navegador en Chrome\"\/><figcaption>Consola del navegador en Chrome<\/figcaption><\/figure>\n<!-- \/wp:image -->\n\n<!-- wp:heading {\"level\":3} -->\n<h3>Ejercicio<\/h3>\n<!-- \/wp:heading -->\n\n<!-- wp:paragraph -->\n<p>Vamos a comprobar, a trav\u00e9s de la consola de Chrome, d\u00f3nde aparece Javascript.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:list -->\n<ol>\n<li><i>Carga una p\u00e1gina, por ejemplo de un peri\u00f3dico como El Mundo o El Pa\u00eds. Abre la Consola mediante las funciones r\u00e1pidas que hemos visto anteriormente. Otra opci\u00f3n, es buscar en el men\u00fa del navegador. En el caso de Chrome: M\u00e1s herrramientas &gt; Herramientas para desarrolladores <\/i><\/li>\n<li>\n<i>F\u00edjate en la pesta\u00f1a Elements   -d\u00f3nde aparece las etiquetas de script. Localiza las etiquetas de script, la etiqueta <a href=\"https:\/\/developer.mozilla.org\/es\/docs\/Web\/HTML\/Elemento\/noscript\" target=\"_blank\" class=\"regular-link\" rel=\"noopener\">noscript<\/a>, etc.<\/i>\n<\/li>\n<\/ol>\n<!-- \/wp:list -->\n\n<!-- wp:image {\"align\":\"wide\"} -->\n<figure class=\"wp-block-image alignwide\"><img src=\"https:\/\/cibercambio.files.wordpress.com\/2021\/04\/25b5a-js8-1533899520-76.png\" alt=\"Ejemplo de c\u00f3digo en la consola del navegador\"\/><figcaption>Ejemplo de c\u00f3digo en la consola del navegador<\/figcaption><\/figure>\n<!-- \/wp:image -->\n\n<!-- wp:heading -->\n<h2>Utilidad de la consola. Para qu\u00e9 sirve.<\/h2>\n<!-- \/wp:heading -->\n\n<!-- wp:paragraph -->\n<p>         <!--StartFragment-->La consola nos sirve para probar el funcionamiento de una p\u00e1gina o una aplicaci\u00f3n de forma que: a) podamos detectar errores de c\u00f3digo; y b) hacer pruebas con JS <\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>Permite: <\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:list -->\n<ul><li>Comprobar informaci\u00f3n sobre errores o alertas\n<\/li><li>Utilizar el inspector de c\u00f3digo para depurarlo\n<\/li><li>Ejecutar expresiones o comandos de JS&nbsp;&nbsp;\n<\/li><\/ul>\n<!-- \/wp:list -->\n\n<!-- wp:image {\"align\":\"center\"} -->\n<div class=\"wp-block-image\"><figure class=\"aligncenter\"><img src=\"https:\/\/cibercambio.files.wordpress.com\/2021\/04\/19e41-js9-1533899790-35.png\" alt=\"\"\/><\/figure><\/div>\n<!-- \/wp:image -->\n\n<!-- wp:group {\"className\":\"atavist-title-design cover-text-simple\"} -->\n<div class=\"wp-block-group atavist-title-design cover-text-simple\"><!-- wp:heading {\"textAlign\":\"left\",\"align\":\"center\",\"className\":\"aligncenter atavist-title-h2\"} -->\n<h2 class=\"has-text-align-left aligncenter atavist-title-h2\">\u00bfPara qu\u00e9 sirve Javascript?<\/h2>\n<!-- \/wp:heading --><\/div>\n<!-- \/wp:group -->\n\n<!-- wp:paragraph -->\n<p>Es un lenguaje que permite <b>dotar de interactividad<\/b> a las p\u00e1ginas web. Algunas de las tareas b\u00e1sicas que puede realizar son:<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:list -->\n<ol>\n<li>Escribir en HTML<\/li>\n<li>Reaccionar a eventos<\/li>\n<li>Modificar elementos HTML<\/li>\n<li>Validar entrada de datos<\/li>\n<li>Cambiar o modificar atributos\n<\/li>\n<\/ol>\n<!-- \/wp:list -->\n\n<!-- wp:paragraph -->\n<p>Adem\u00e1s, mediante la <a href=\"http:\/\/html5index.org\/\" target=\"_blank\" class=\"regular-link\" rel=\"noopener\">API JS de HTML5 <\/a>podemos acceder a recursos adicionales: c\u00e1mara, almacenamiento de datos, creaci\u00f3n de gr\u00e1ficos, flujo de datos con servidores\u2026) <\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:image {\"align\":\"full\"} -->\n<figure class=\"wp-block-image alignfull\"><img src=\"https:\/\/cibercambio.files.wordpress.com\/2021\/04\/29104-jsapi-1573491833-95.png\" alt=\"\"\/><\/figure>\n<!-- \/wp:image -->\n\n<!-- wp:paragraph -->\n<p>Permite acceder a informaci\u00f3n en internet: por ejemplo, buscar y obtener las palabras m\u00e1s populares en Twitter de un tema, o para hacer scraping de web utilizando soluciones como <a href=\"https:\/\/scotch.io\/tutorials\/scraping-the-web-with-node-js\" target=\"_blank\" class=\"regular-link\" rel=\"noopener\">Node.js<\/a>, <a href=\"https:\/\/medialab.github.io\/artoo\/\" target=\"_blank\" class=\"regular-link\" rel=\"noopener\">Artoo.js<\/a> &nbsp;o <a href=\"http:\/\/nrabinowitz.github.io\/pjscrape\/\" target=\"_blank\" class=\"regular-link\" rel=\"noopener\">pjscrape<\/a>)<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>Tambi\u00e9n permite organizar y presentar datos como, por ejemplo, automatizar el trabajo de las hojas de c\u00e1lculo; o la visualizaci\u00f3n de datos.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:heading {\"level\":3} -->\n<h3>Ejercicio<\/h3>\n<!-- \/wp:heading -->\n\n<!-- wp:paragraph -->\n<p>Veamos c\u00f3mo JS aporta interactividad a una web, <\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:list -->\n<ol>\n<li>Accede a la web de <a href=\"https:\/\/civio.es\/espana-en-llamas\/mapa-de-incendios-forestales\/\" target=\"_blank\" class=\"regular-link\" rel=\"noopener\">Espa\u00f1a en Llamas<\/a>. Navega por el mapa, usa los filtros, etc. <\/li>\n<li>Ahora deshabilita Javascript desde las <a href=\"https:\/\/es.ccm.net\/faq\/26408-como-desactivar-javascript-en-google-chrome\" target=\"_blank\" class=\"regular-link\" rel=\"noopener\">opciones del navegador<\/a> o usando alguna herramienta como <a href=\"https:\/\/chrome.google.com\/webstore\/detail\/web-developer\/bfbameneiokkgbdmiekhjnmfkcnldhhm?hl=es\" target=\"_blank\" class=\"regular-link\" rel=\"noopener\">WebDevelopper Toolbar<\/a>. Comprueba qu\u00e9 sucede. \u00bfPuedes navegar el mapa? \u00bfCompartir en redes sociales? <\/li>\n<\/ol>\n<!-- \/wp:list -->\n\n<!-- wp:paragraph -->\n<p>Veremos ahora, en detalle, alguna de estas funciones.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:heading -->\n<h2>1. Escribir en HTML<\/h2>\n<!-- \/wp:heading -->\n\n<!-- wp:image {\"align\":\"right\"} -->\n<div class=\"wp-block-image\"><figure class=\"alignright\"><img src=\"https:\/\/cibercambio.files.wordpress.com\/2021\/04\/d95a1-js11-1533900998-81.png\" alt=\"\"\/><\/figure><\/div>\n<!-- \/wp:image -->\n\n<!-- wp:paragraph -->\n<p>Una de las cosas que puede hacer JS es escribir contenido en HTML. Veamos <a href=\"https:\/\/jsfiddle.net\/gertrudix\/qLcgfu95\/\" target=\"_blank\" class=\"regular-link\" rel=\"noopener\">este ejemplo<\/a>.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:group {\"className\":\"atavist-embed\"} -->\n<div class=\"wp-block-group atavist-embed\"><!-- wp:html \/--><\/div>\n<!-- \/wp:group -->\n\n<!-- wp:heading {\"level\":3} -->\n<h3>Ejercicio<\/h3>\n<!-- \/wp:heading -->\n\n<!-- wp:paragraph -->\n<p>1. Sobre el ejemplo anterior, a\u00f1ade un enlace a la home del peri\u00f3dico El Mundo (www.elmundo.es)<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>2. Prueba a incluir otro enlace a otra web distinta.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph {\"align\":\"center\"} -->\n<p class=\"has-text-align-center\"><i><a href=\"https:\/\/jsfiddle.net\/gertrudix\/qLcgfu95\/3\/\" target=\"_blank\" class=\"regular-link\" rel=\"noopener\">Soluci\u00f3n<\/a><\/i><\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:group {\"className\":\"atavist-embed\"} -->\n<div class=\"wp-block-group atavist-embed\"><!-- wp:html \/--><\/div>\n<!-- \/wp:group -->\n\n<!-- wp:heading -->\n<h2>2. Reaccionar a eventos<\/h2>\n<!-- \/wp:heading -->\n\n<!-- wp:image {\"align\":\"right\"} -->\n<div class=\"wp-block-image\"><figure class=\"alignright\"><img src=\"https:\/\/cibercambio.files.wordpress.com\/2021\/04\/1f0aa-js12-1533902831-33.png\" alt=\"\"\/><\/figure><\/div>\n<!-- \/wp:image -->\n\n<!-- wp:paragraph -->\n<p>Otra funci\u00f3n es reaccionar a eventos creados por el usuario (hacer clic, pasar por encima de una zona...), por el propio navegador (cargar la p\u00e1gina), etc. como sucede en este ejemplo. <\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:group {\"className\":\"atavist-embed\"} -->\n<div class=\"wp-block-group atavist-embed\"><!-- wp:html \/--><\/div>\n<!-- \/wp:group -->\n\n<!-- wp:heading {\"level\":3} -->\n<h3>Ejercicio<\/h3>\n<!-- \/wp:heading -->\n\n<!-- wp:paragraph -->\n<p>1. Modifica el ejemplo anterior para que el mensaje de alerta muestre tu nombre.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph {\"align\":\"center\"} -->\n<p class=\"has-text-align-center\"><i><a href=\"https:\/\/jsfiddle.net\/gertrudix\/vpevk15L\/2\/\" target=\"_blank\" class=\"regular-link\" rel=\"noopener\">Soluci\u00f3n<\/a><\/i><\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:group {\"className\":\"atavist-embed\"} -->\n<div class=\"wp-block-group atavist-embed\"><!-- wp:html \/--><\/div>\n<!-- \/wp:group -->\n\n<!-- wp:heading -->\n<h2>3. Modificar contenido en HTML<\/h2>\n<!-- \/wp:heading -->\n\n<!-- wp:paragraph -->\n<p>Otra funci\u00f3n es modificar contenido que ya est\u00e1 cargado en el html. <\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:image {\"align\":\"wide\"} -->\n<figure class=\"wp-block-image alignwide\"><img src=\"https:\/\/cibercambio.files.wordpress.com\/2021\/04\/b228a-js13-1533903052-31.png\" alt=\"\"\/><\/figure>\n<!-- \/wp:image -->\n\n<!-- wp:group {\"className\":\"atavist-embed\"} -->\n<div class=\"wp-block-group atavist-embed\"><!-- wp:html \/--><\/div>\n<!-- \/wp:group -->\n\n<!-- wp:paragraph -->\n<p><b>Ejercicio<\/b><\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>En este ejemplo hay algo que no funciona. Rev\u00edsalo y ajusta lo que est\u00e9 mal para que funcione el cambio de contenido.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph {\"align\":\"center\"} -->\n<p class=\"has-text-align-center\"><i><a href=\"https:\/\/jsfiddle.net\/gertrudix\/3s9k2vtc\/2\/\" target=\"_blank\" class=\"regular-link\" rel=\"noopener\">Soluci\u00f3n<\/a><\/i><\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:group {\"className\":\"atavist-embed\"} -->\n<div class=\"wp-block-group atavist-embed\"><!-- wp:html \/-->\n\n<!-- wp:paragraph {\"fontSize\":\"small\"} -->\n<p class=\"has-small-font-size\">El id no es correcto. Deben de tener el mismo nombre.<\/p>\n<!-- \/wp:paragraph --><\/div>\n<!-- \/wp:group -->\n\n<!-- wp:heading -->\n<h2>4. Validar la entrada de datos<\/h2>\n<!-- \/wp:heading -->\n\n<!-- wp:image {\"align\":\"right\"} -->\n<div class=\"wp-block-image\"><figure class=\"alignright\"><img src=\"https:\/\/cibercambio.files.wordpress.com\/2021\/04\/b3437-js14-1533931261-10.png\" alt=\"isNan (x) Es un objeto global de Javascript que eval\u00faa un argumento para determinar si es un n\u00famero\"\/><figcaption>isNan (x) Es un objeto global de Javascript que eval\u00faa un argumento para determinar si es un n\u00famero<\/figcaption><\/figure><\/div>\n<!-- \/wp:image -->\n\n<!-- wp:paragraph -->\n<p>Javascript es muy \u00fatil para validar si la entrada de datos en los campos de un formulario son los adecuados, aquellos que por formato o tipo se esperan recibir.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>En este ejemplo, podemos comprobar si los datos que se introducen est\u00e1n comprendidos dentro de un rango. En caso contrario, saltar\u00e1 una alerta indicando que no son correctos.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:group {\"className\":\"atavist-embed\"} -->\n<div class=\"wp-block-group atavist-embed\"><!-- wp:html \/--><\/div>\n<!-- \/wp:group -->\n\n<!-- wp:paragraph -->\n<p><b>Ejercicio<\/b><\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>Modifica el ejemplo anterior para que la validaci\u00f3n sea para n\u00fameros comprendidos entre 10 y 20.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph {\"align\":\"center\"} -->\n<p class=\"has-text-align-center\"><i><a href=\"https:\/\/jsfiddle.net\/2k97b5wt\/16\/\" target=\"_blank\" class=\"regular-link\" rel=\"noopener\">Soluci\u00f3n<\/a><\/i><\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:group {\"className\":\"atavist-embed\"} -->\n<div class=\"wp-block-group atavist-embed\"><!-- wp:html \/--><\/div>\n<!-- \/wp:group -->\n\n<!-- wp:heading -->\n<h2>5. Cambiar o modificar atributos<\/h2>\n<!-- \/wp:heading -->\n\n<!-- wp:image {\"align\":\"right\"} -->\n<div class=\"wp-block-image\"><figure class=\"alignright\"><img src=\"https:\/\/cibercambio.files.wordpress.com\/2021\/04\/4236a-js15-1533935333-52.png\" alt=\"\"\/><\/figure><\/div>\n<!-- \/wp:image -->\n\n<!-- wp:paragraph -->\n<p>Otra posibilidad es cambiar determinados atributos de los elementos html. Aqu\u00ed las posibilidades son muy amplias, dado que podemos modificar los valores de cualquier atributo, desde el color de un texto, el tipo de fuente, etc.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>En este ejemplo generamos un efecto de sustituci\u00f3n modificando el atributo src de una imagen.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:group {\"className\":\"atavist-embed\"} -->\n<div class=\"wp-block-group atavist-embed\"><!-- wp:html \/--><\/div>\n<!-- \/wp:group -->\n\n<!-- wp:heading {\"level\":3} -->\n<h3>Ejercicio<\/h3>\n<!-- \/wp:heading -->\n\n<!-- wp:paragraph -->\n<p>Modifica el valor del atributo src con estas im\u00e1genes que realizan un efecto de sustituci\u00f3n similar<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:list -->\n<ul><li><p><a href=\"http:\/\/comunicaciondigital.es\/wp-content\/master\/lightoff.png\" target=\"_blank\" class=\"regular-link\" rel=\"noopener\">http:\/\/comunicaciondigital.es\/wp-content\/master\/lighton.png<\/a><\/p><\/li><li><p><a href=\"http:\/\/comunicaciondigital.es\/wp-content\/master\/lightoff.png\" target=\"_blank\" class=\"regular-link\" rel=\"noopener\">http:\/\/comunicaciondigital.es\/wp-content\/master\/lightoff.png<\/a><\/p><\/li><\/ul>\n<!-- \/wp:list -->\n\n<!-- wp:paragraph {\"align\":\"center\"} -->\n<p class=\"has-text-align-center\"><i><a href=\"https:\/\/jsfiddle.net\/2nwru4pe\/1\/\" target=\"_blank\" class=\"regular-link\" rel=\"noopener\">Soluci\u00f3n<\/a><\/i><\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:group {\"className\":\"atavist-embed\"} -->\n<div class=\"wp-block-group atavist-embed\"><!-- wp:html \/-->\n\n<!-- wp:paragraph {\"fontSize\":\"small\"} -->\n<p class=\"has-small-font-size\">Enciende o apaga la luz (la primera imagen es el primer bot\u00f3n), la segunda es para img y el segundo bot\u00f3n<\/p>\n<!-- \/wp:paragraph --><\/div>\n<!-- \/wp:group -->\n\n<!-- wp:group {\"className\":\"atavist-title-design cover-text-simple\"} -->\n<div class=\"wp-block-group atavist-title-design cover-text-simple\"><!-- wp:heading {\"textAlign\":\"left\",\"align\":\"center\",\"className\":\"aligncenter atavist-title-h2\"} -->\n<h2 class=\"has-text-align-left aligncenter atavist-title-h2\">\u00bfQu\u00e9 resultados produce?<\/h2>\n<!-- \/wp:heading --><\/div>\n<!-- \/wp:group -->\n\n<!-- wp:paragraph -->\n<p>Javascript utiliza varios procedimientos o displays de escritura:<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:list -->\n<ul><li>Caja de alerta - <i>window.alert() <\/i>[<a href=\"https:\/\/jsfiddle.net\/gertrudix\/kzf8grbg\/\" target=\"_blank\" class=\"regular-link\" rel=\"noopener\">Ver ejemplo<\/a>]\n<\/li><li>Salida html - <i>document.write() <\/i>[<a href=\"https:\/\/jsfiddle.net\/gertrudix\/55eL53bx\/\" target=\"_blank\" class=\"regular-link\" rel=\"noopener\">Ver ejemplo<\/a>]\n<\/li><li>Elemento html - <i>inner.html() <\/i>[<a href=\"https:\/\/jsfiddle.net\/gertrudix\/vLn56ddr\/\" target=\"_blank\" class=\"regular-link\" rel=\"noopener\">Ver ejemplo<\/a>]\n<\/li><li>Consola de navegador - <i>console.log() <\/i>[<a href=\"https:\/\/jsfiddle.net\/gertrudix\/ov7vdpzf\/2\/\" target=\"_blank\" class=\"regular-link\" rel=\"noopener\">Ver ejemplo<\/a>]\n<\/li><\/ul>\n<!-- \/wp:list -->\n\n<!-- wp:image {\"align\":\"wide\"} -->\n<figure class=\"wp-block-image alignwide\"><img src=\"https:\/\/cibercambio.files.wordpress.com\/2021\/04\/c98b4-js16-1533936074-39.png\" alt=\"\"\/><\/figure>\n<!-- \/wp:image -->","_et_gb_content_width":"1080","footnotes":""},"categories":[221,225],"tags":[],"class_list":["post-80917","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-banco-conocimiento","category-periodismo-digital"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.6 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Protocolos y sistemas web - Portal de proyectos multimedia<\/title>\n<meta name=\"description\" content=\"Los protocolos de internet son los conjuntos de reglas que permiten la comunicaci\u00f3n entre m\u00e1quinas (dispositivos) para transmitir la informaci\u00f3n entre estas.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/proyectos.comunicaciondigital.es\/en\/protocolos-sistemas-web\/\" \/>\n<meta property=\"og:locale\" content=\"en_GB\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Protocolos y sistemas web - Portal de proyectos multimedia\" \/>\n<meta property=\"og:description\" content=\"Los protocolos de internet son los conjuntos de reglas que permiten la comunicaci\u00f3n entre m\u00e1quinas (dispositivos) para transmitir la informaci\u00f3n entre estas.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/proyectos.comunicaciondigital.es\/en\/protocolos-sistemas-web\/\" \/>\n<meta property=\"og:site_name\" content=\"Portal de proyectos multimedia\" \/>\n<meta property=\"article:published_time\" content=\"2022-09-06T23:08:12+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2024-08-05T10:37:31+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/proyectos.comunicaciondigital.es\/wp-content\/uploads\/2022\/09\/soportes-medios.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1200\" \/>\n\t<meta property=\"og:image:height\" content=\"800\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"juanmiro\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/proyectos.comunicaciondigital.es\\\/protocolos-sistemas-web\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/proyectos.comunicaciondigital.es\\\/protocolos-sistemas-web\\\/\"},\"author\":{\"name\":\"juanmiro\",\"@id\":\"https:\\\/\\\/proyectos.comunicaciondigital.es\\\/#\\\/schema\\\/person\\\/2e8265f6be76de5637b1bd02a53266b3\"},\"headline\":\"Protocolos y sistemas web\",\"datePublished\":\"2022-09-06T23:08:12+00:00\",\"dateModified\":\"2024-08-05T10:37:31+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/proyectos.comunicaciondigital.es\\\/protocolos-sistemas-web\\\/\"},\"wordCount\":1730,\"image\":{\"@id\":\"https:\\\/\\\/proyectos.comunicaciondigital.es\\\/protocolos-sistemas-web\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/proyectos.comunicaciondigital.es\\\/wp-content\\\/uploads\\\/2022\\\/09\\\/soportes-medios.jpg\",\"articleSection\":[\"banco-conocimiento\",\"Periodismo digital\"],\"inLanguage\":\"en-GB\"},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/proyectos.comunicaciondigital.es\\\/protocolos-sistemas-web\\\/\",\"url\":\"https:\\\/\\\/proyectos.comunicaciondigital.es\\\/protocolos-sistemas-web\\\/\",\"name\":\"Protocolos y sistemas web - Portal de proyectos multimedia\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/proyectos.comunicaciondigital.es\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/proyectos.comunicaciondigital.es\\\/protocolos-sistemas-web\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/proyectos.comunicaciondigital.es\\\/protocolos-sistemas-web\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/proyectos.comunicaciondigital.es\\\/wp-content\\\/uploads\\\/2022\\\/09\\\/soportes-medios.jpg\",\"datePublished\":\"2022-09-06T23:08:12+00:00\",\"dateModified\":\"2024-08-05T10:37:31+00:00\",\"author\":{\"@id\":\"https:\\\/\\\/proyectos.comunicaciondigital.es\\\/#\\\/schema\\\/person\\\/2e8265f6be76de5637b1bd02a53266b3\"},\"description\":\"Los protocolos de internet son los conjuntos de reglas que permiten la comunicaci\u00f3n entre m\u00e1quinas (dispositivos) para transmitir la informaci\u00f3n entre estas.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/proyectos.comunicaciondigital.es\\\/protocolos-sistemas-web\\\/#breadcrumb\"},\"inLanguage\":\"en-GB\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/proyectos.comunicaciondigital.es\\\/protocolos-sistemas-web\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-GB\",\"@id\":\"https:\\\/\\\/proyectos.comunicaciondigital.es\\\/protocolos-sistemas-web\\\/#primaryimage\",\"url\":\"https:\\\/\\\/proyectos.comunicaciondigital.es\\\/wp-content\\\/uploads\\\/2022\\\/09\\\/soportes-medios.jpg\",\"contentUrl\":\"https:\\\/\\\/proyectos.comunicaciondigital.es\\\/wp-content\\\/uploads\\\/2022\\\/09\\\/soportes-medios.jpg\",\"width\":1200,\"height\":800,\"caption\":\"Back view of a young white man video editor sitting in front of a big screen working on a video montage indoors\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/proyectos.comunicaciondigital.es\\\/protocolos-sistemas-web\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Portada\",\"item\":\"https:\\\/\\\/proyectos.comunicaciondigital.es\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Protocolos y sistemas web\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/proyectos.comunicaciondigital.es\\\/#website\",\"url\":\"https:\\\/\\\/proyectos.comunicaciondigital.es\\\/\",\"name\":\"Portal de proyectos multimedia\",\"description\":\"Grupo Ciberimaginario\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/proyectos.comunicaciondigital.es\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-GB\"},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/proyectos.comunicaciondigital.es\\\/#\\\/schema\\\/person\\\/2e8265f6be76de5637b1bd02a53266b3\",\"name\":\"juanmiro\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-GB\",\"@id\":\"https:\\\/\\\/proyectos.comunicaciondigital.es\\\/wp-content\\\/litespeed\\\/avatar\\\/ddba0a0edd23b5c5ff08c9345b733ce5.jpg?ver=1779122247\",\"url\":\"https:\\\/\\\/proyectos.comunicaciondigital.es\\\/wp-content\\\/litespeed\\\/avatar\\\/ddba0a0edd23b5c5ff08c9345b733ce5.jpg?ver=1779122247\",\"contentUrl\":\"https:\\\/\\\/proyectos.comunicaciondigital.es\\\/wp-content\\\/litespeed\\\/avatar\\\/ddba0a0edd23b5c5ff08c9345b733ce5.jpg?ver=1779122247\",\"caption\":\"juanmiro\"},\"url\":\"https:\\\/\\\/proyectos.comunicaciondigital.es\\\/en\\\/author\\\/juanmiro\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Protocolos y sistemas web - Portal de proyectos multimedia","description":"Los protocolos de internet son los conjuntos de reglas que permiten la comunicaci\u00f3n entre m\u00e1quinas (dispositivos) para transmitir la informaci\u00f3n entre estas.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/proyectos.comunicaciondigital.es\/en\/protocolos-sistemas-web\/","og_locale":"en_GB","og_type":"article","og_title":"Protocolos y sistemas web - Portal de proyectos multimedia","og_description":"Los protocolos de internet son los conjuntos de reglas que permiten la comunicaci\u00f3n entre m\u00e1quinas (dispositivos) para transmitir la informaci\u00f3n entre estas.","og_url":"https:\/\/proyectos.comunicaciondigital.es\/en\/protocolos-sistemas-web\/","og_site_name":"Portal de proyectos multimedia","article_published_time":"2022-09-06T23:08:12+00:00","article_modified_time":"2024-08-05T10:37:31+00:00","og_image":[{"width":1200,"height":800,"url":"https:\/\/proyectos.comunicaciondigital.es\/wp-content\/uploads\/2022\/09\/soportes-medios.jpg","type":"image\/jpeg"}],"author":"juanmiro","schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/proyectos.comunicaciondigital.es\/protocolos-sistemas-web\/#article","isPartOf":{"@id":"https:\/\/proyectos.comunicaciondigital.es\/protocolos-sistemas-web\/"},"author":{"name":"juanmiro","@id":"https:\/\/proyectos.comunicaciondigital.es\/#\/schema\/person\/2e8265f6be76de5637b1bd02a53266b3"},"headline":"Protocolos y sistemas web","datePublished":"2022-09-06T23:08:12+00:00","dateModified":"2024-08-05T10:37:31+00:00","mainEntityOfPage":{"@id":"https:\/\/proyectos.comunicaciondigital.es\/protocolos-sistemas-web\/"},"wordCount":1730,"image":{"@id":"https:\/\/proyectos.comunicaciondigital.es\/protocolos-sistemas-web\/#primaryimage"},"thumbnailUrl":"https:\/\/proyectos.comunicaciondigital.es\/wp-content\/uploads\/2022\/09\/soportes-medios.jpg","articleSection":["banco-conocimiento","Periodismo digital"],"inLanguage":"en-GB"},{"@type":"WebPage","@id":"https:\/\/proyectos.comunicaciondigital.es\/protocolos-sistemas-web\/","url":"https:\/\/proyectos.comunicaciondigital.es\/protocolos-sistemas-web\/","name":"Protocolos y sistemas web - Portal de proyectos multimedia","isPartOf":{"@id":"https:\/\/proyectos.comunicaciondigital.es\/#website"},"primaryImageOfPage":{"@id":"https:\/\/proyectos.comunicaciondigital.es\/protocolos-sistemas-web\/#primaryimage"},"image":{"@id":"https:\/\/proyectos.comunicaciondigital.es\/protocolos-sistemas-web\/#primaryimage"},"thumbnailUrl":"https:\/\/proyectos.comunicaciondigital.es\/wp-content\/uploads\/2022\/09\/soportes-medios.jpg","datePublished":"2022-09-06T23:08:12+00:00","dateModified":"2024-08-05T10:37:31+00:00","author":{"@id":"https:\/\/proyectos.comunicaciondigital.es\/#\/schema\/person\/2e8265f6be76de5637b1bd02a53266b3"},"description":"Los protocolos de internet son los conjuntos de reglas que permiten la comunicaci\u00f3n entre m\u00e1quinas (dispositivos) para transmitir la informaci\u00f3n entre estas.","breadcrumb":{"@id":"https:\/\/proyectos.comunicaciondigital.es\/protocolos-sistemas-web\/#breadcrumb"},"inLanguage":"en-GB","potentialAction":[{"@type":"ReadAction","target":["https:\/\/proyectos.comunicaciondigital.es\/protocolos-sistemas-web\/"]}]},{"@type":"ImageObject","inLanguage":"en-GB","@id":"https:\/\/proyectos.comunicaciondigital.es\/protocolos-sistemas-web\/#primaryimage","url":"https:\/\/proyectos.comunicaciondigital.es\/wp-content\/uploads\/2022\/09\/soportes-medios.jpg","contentUrl":"https:\/\/proyectos.comunicaciondigital.es\/wp-content\/uploads\/2022\/09\/soportes-medios.jpg","width":1200,"height":800,"caption":"Back view of a young white man video editor sitting in front of a big screen working on a video montage indoors"},{"@type":"BreadcrumbList","@id":"https:\/\/proyectos.comunicaciondigital.es\/protocolos-sistemas-web\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Portada","item":"https:\/\/proyectos.comunicaciondigital.es\/"},{"@type":"ListItem","position":2,"name":"Protocolos y sistemas web"}]},{"@type":"WebSite","@id":"https:\/\/proyectos.comunicaciondigital.es\/#website","url":"https:\/\/proyectos.comunicaciondigital.es\/","name":"Portal de proyectos multimedia","description":"Grupo Ciberimaginario","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/proyectos.comunicaciondigital.es\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-GB"},{"@type":"Person","@id":"https:\/\/proyectos.comunicaciondigital.es\/#\/schema\/person\/2e8265f6be76de5637b1bd02a53266b3","name":"juanmiro","image":{"@type":"ImageObject","inLanguage":"en-GB","@id":"https:\/\/proyectos.comunicaciondigital.es\/wp-content\/litespeed\/avatar\/ddba0a0edd23b5c5ff08c9345b733ce5.jpg?ver=1779122247","url":"https:\/\/proyectos.comunicaciondigital.es\/wp-content\/litespeed\/avatar\/ddba0a0edd23b5c5ff08c9345b733ce5.jpg?ver=1779122247","contentUrl":"https:\/\/proyectos.comunicaciondigital.es\/wp-content\/litespeed\/avatar\/ddba0a0edd23b5c5ff08c9345b733ce5.jpg?ver=1779122247","caption":"juanmiro"},"url":"https:\/\/proyectos.comunicaciondigital.es\/en\/author\/juanmiro\/"}]}},"_links":{"self":[{"href":"https:\/\/proyectos.comunicaciondigital.es\/en\/wp-json\/wp\/v2\/posts\/80917","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/proyectos.comunicaciondigital.es\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/proyectos.comunicaciondigital.es\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/proyectos.comunicaciondigital.es\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/proyectos.comunicaciondigital.es\/en\/wp-json\/wp\/v2\/comments?post=80917"}],"version-history":[{"count":10,"href":"https:\/\/proyectos.comunicaciondigital.es\/en\/wp-json\/wp\/v2\/posts\/80917\/revisions"}],"predecessor-version":[{"id":81898,"href":"https:\/\/proyectos.comunicaciondigital.es\/en\/wp-json\/wp\/v2\/posts\/80917\/revisions\/81898"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/proyectos.comunicaciondigital.es\/en\/wp-json\/wp\/v2\/media\/80913"}],"wp:attachment":[{"href":"https:\/\/proyectos.comunicaciondigital.es\/en\/wp-json\/wp\/v2\/media?parent=80917"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/proyectos.comunicaciondigital.es\/en\/wp-json\/wp\/v2\/categories?post=80917"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/proyectos.comunicaciondigital.es\/en\/wp-json\/wp\/v2\/tags?post=80917"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}