• 0
      1. Tu carrito está vacío.
    • artículo(s)0,00
abril 8, 2020 conecta

HTML, o lenguaje de marcado de hipertexto, es el código que ejecuta Internet. Es un lenguaje de marcado. Esto significa que usa etiquetas para definir elementos, como marcar texto en negrita o mostrar imágenes con código.

¿Qué es HTML5? Es la quinta versión del lenguaje de marcado HTML (HyperText Markup Language, versión 5).

 

Sir Tim Berners-Lee y HTML

HTML es el lenguaje unificador de la World Wide Web. Al igual que la web en sí, el HyperText Markup Language fue una creación de Sir Tim Berners-Lee. En 1991 escribió un documento llamado “Etiquetas HTML” en el que propuso menos de dos docenas de elementos que podrían usarse para escribir páginas web.

 

Para que algo como la Web exista y se expanda, tiene que basarse en estándares públicos y gratuitos. La red no debe tener dueño.

Sir Tim Berners-Lee

La W3C y la WHATWG

W3C, el Consorcio de la World Wide Web, publicó las iteraciones posteriores del estándar HTML en http://www.w3.org, hasta llegar a la versión 4.0 (nunca hubo una versión 1.0).

La siguiente evolución fue a XHTML, donde la X significa extensible. Esto requería que los autores siguieran las reglas de XML, un lenguaje de marcado más estricto en el que el W3C basaba la mayoría de sus tecnologías.

La publicación de XHTML 1.0 coincidió con el aumento del soporte del navegador para CSS.

Después se formó el grupo “Web Hypertext Application Technology Working Group”, o WHATWG.

Principios de diseño

El WHATWG redactó una serie de principios de diseño para guiar el desarrollo de HTML5.

Uno de los principios clave es “apoyar el contenido existente”.

Eso significa que no hay año cero para HTML5. Las webs que se crean actualmente en cualquier versión de HTML, ya están utilizando HTML5.

Otros principios de diseño son

  • No reinventes la rueda
  • Degradado elegante
  • Pavimenta los senderos (Si no está roto, no lo arregles)
  • Evolución y no revolución
  • Resolver problemas reales
  • Prioridad de circunscripciones (En caso de conflicto, considere usuarios sobre autores sobre implementadores sobre especificadores sobre pureza teórica.)
  • La seguridad será tenida en cuenta
  • Separación de contenido y presentación
  • Consistencia del DOM (Document Object Model)
  • Funcionamiento bien definido
  • Evitar la complejidad innecesaria
  • Control de errores
  • Soporte a los lenguajes mundiales
  • Independencia del medio
  • Accesibilidad

 

Los estándares web han avanzado tanto que ahora es posible construir casi cualquier cosa usando HTML, CSS y JavaScript. Mientras que para publicar texto o imágenes, HTML y CSS son suficientes, para audio o video, antes se requeria un plugin tipo Flash o Silverlight. Con HTML5, estos plugin ya no son necesarios. Los elementos multimedia enriquecidos en HTML5 son nativos del navegador.

Acceso a las webs principales de la W3C, la WHATWG y del equipo de Chromium:

https://html.spec.whatwg.org/multipage/

https://w3c.github.io/

https://developers.google.com/web

 

Editores HTML y WYSIWYG

Podemos escribir HTML en un simple Bloc de notas, guardarlo como un archivo .html y soltar el archivo en un navegador para ver cómo se ve.

Los editores HTML tienen características que facilitan este trabajo, como por ejemplo resaltado de sintaxis, autocompletado y detección de errores. Estos editores también suelen funcionar JavaScript, PHP y CSS.

WordPress cuenta con una interfaz visual y editor de texto enriquecido llamado TinyMCE WYSIWYG (acrónimo de What You See Is What You Get).

Hay varios editores HTML con funcionalidades avanzadas, como

Notepad++

Visual Studio Code

Brackets

 

 

HTML y SEO

SEO es la optimización del sitio web para mejorar su posicionamiento en los resultados de búsqueda de Google.

Para ello se pueden optimizar por un lado, ciertas etiquetas del código HTML de la página. Estos son los títulos, encabezados, imágenes y enlaces.

Por otro, esta la propia redacción de un contenido de valor basado en palabras clave previamente definidas.

Elementos de código HTML destacados para SEO:

  • Metadatos (meta description y meta keywords)
  • Título (<title></title) de la página
  • Encabezados h1 y h2 (podemos establecer encabecados según su importancia, desde H1 hasta H6)
  • Imágenes (tanto en el nombre del fichero como en el texto alternativo)
  • Título de los enlaces
  • El cuerpo del texto

Conviene contar con herramientas y plugins para SEO. En WordPress por ejemplo, Yoast es un plugin que permite optimizar la pagina teniendo en cuenta los factores principales de SEO. Pero no es suficiente con tener herramientas o conocer HTML. Lo primero es una estrategia solida de marketing digital.

El límite de las máquinas no es su potencia, sino nuestra imaginación.

Sir Tim Berners-Lee

 

Lecturas relacionadas:

Adaptación a dispositivos móviles – Los diseños responsive

25 años de diseño web. Tendencias y soluciones

SEO en Prestashop

Get in Touch
newsletter

Suscríbete al newsletter sobre ecommerce y transformación digital

Tendencias, consejos
y lo último en tecnologías
para vender online.

Además, te regalamos el primer capítulo del libro
“Conecta tu negocio. La transformación digital de los canales de venta”

newsletter
Get in Touch
Contact
conecta-logo-blanco-retina

Producto

Info

Soporte

Conecta tu Negocio.

Branding

En HUB 360 encontrarás toda la tecnología y servicios para tu estrategia de comercio electrónico.

Ecommerce

Integra tu ecommerce con tu ERP sistema de gestión y todos tus canales para vender online.

Analytics

Los cuadros de mando de BI Studio son tu herramienta de Business Intelligence de última generación.

922-014-341

Proyecto Cofinanciado por el Fondo Europeo de Desarrollo Regional. Beneficiario: Conecta Software Soluciones SLU. Nº expediente: PI2019010001. Inversión Aprobada: 6.444,80 €. Comienzo: 17/10/2018. Finalización: 16/10/2019. El presente proyecto tiene como objetivo el desarrollo de un software conector que automatiza la generación de catálogos virtuales para que la empresa pueda ofrecer en su Tienda online productos con una amplia descripción y con imágenes que hagan la experiencia del usuario más rica y completa.

© 2020 TODOS LOS DERECHOS RESERVADOS. CONECTA SOFTWARE

Contact