Laboratorio. Icono de código. Photo by Alex Kondratiev on Unsplash

Qué es un widget. Definición y ejemplos

El término widget se traduce al español como artilugio o artefacto, y es utilizado para referirse a algún elemento que permite desarrollar una actividad u oficio.

En informática, widget hace referencia a los pequeños programas o funciones que se anexan a un sistema superior (sea un sitio web o un sistema operativo) y agregan valor a la experiencia de usuario.

Para tener presente, algunos desarrolladores utilizan el término plugin para referirse a este tipo de programas informáticos.

Ejemplos de widgets

Un ejemplo de widget es la lista de tareas pendientes en la pantalla del teléfono móvil. Esta aplicación no es el gestor de eventos en sí. Tan solo es un programa -más pequeño- que se conecta al gestor (puede ser Google Calendar) y descarga una información específica: las tareas pendientes.

Siguiendo con el celular, el módulo que indica el porcentaje restante de batería también es un artilugio. Este no se encarga de administrar u optimizar el hardware. Su función es simplemente indicar cuánto queda de carga disponible.

Para el caso de un sitio web se puede identificar como widget una casilla de redes sociales, donde se listan y enlazan los perfiles en Facebook, Twitter, Instagram y Flickr del autor (como sucede en la parte superior de este blog).

Un motor de búsqueda interno, las entradas más recientes, una casilla de anuncios publicitarios y una nube de etiquetas también son artefactos que agregan valor y optimizan la experiencia del usuario.

Widgets de redes sociales

Con la masificación de las redes sociales, es común encontrar sitios web que presentan las publicaciones de la marca en Facebook y Twitter desde su página de inicio.

Para lograr esta función, el administrador del sitio anexa un código HTML (acompañado por elementos CSS y JS) a la página web y permite la conexión entre un sitio y otro.

Para el caso de Facebook, los plugins disponibles son:

  • Grupos
  • Botón Guardar
  • Citas textuales
  • Botón «Me gusta»
  • Botón «Compartir»
  • Botón «Enviar»
  • Comentarios insertados
  • Publicaciones insertadas
  • Reproductor de video
  • Páginas

Para hacer más clara la explicación, miremos el widget Facebook «Me gusta».

Los códigos de inserción son:

<div id="fb-root"></div>
<script
async
defer
crossorigin="anonymous"
src="https://connect.facebook.net/es_LA/sdk.js#xfbml=1&version=v8.0"
nonce="mW7qV1PL">
</script>
<div class="fb-like" 
data-href="https://e-lexia.com"
data-width="500"
data-layout="button"
data-action="like"
data-size="large"
data-
share="true">
</div>

El resultado es:

En Facebook para desarrolladores está la documentación para lograr este tipo de aplicaciones.

¿Necesitas asesoría en comunicación digital?

Diseña y optimiza tus proyectos en comunicación digital, entregando una mejor experiencia a tus usuarios y potenciando el valor de tu marca.
Conversemos

Explicación sobre widgets

Aprovecho este recurso que presenté en el curso «Implementación de las TIC en el aula de clase», de la Universidad Cooperativa de Colombia.

Aquí explico el concepto, además de su comparación con los gadgets y un ejemplo de aplicación con los artefactos de WordPress.

En el canal YouTube «juancadotcom» puedes encontrar más videos sobre el tema.

¿Tienes una pregunta sobre el artículo? Cuéntame en los comentarios. Además, si quieres que escriba sobre algún tema, anótalo a continuación para agregarlo a la agenda de contenidos.

Logo NequiTu aporte permite crear contenidos. Envía un aporte Nequi

Logo PayPalHay más posibilidades. Apoya el blog desde PayPal.me

Logo YouTube¡Vamos por los 10.000 suscriptores en YouTube! Suscríbete

Por:
Juan Carlos Morales S.
Comunicador y educador
YouTube | LinkedIn | Instagram | Twitter

Licencia Creative Commons Qué es un widget. Definición y ejemplos por juancadotcom se distribuye bajo una Licencia Creative Commons Atribución-CompartirIgual 4.0 Internacional. Basada en una obra en https://e-lexia.com/blog.

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.