Cómo diseñar etiquetas de códigos de barras con un editor basado en web

2026-09-22 pdf labels barcodes label merge browser based graphical layout editor google sheets addin microsoft excel addon electronic shelf labels esl barcode3 labels label editor

Cómo diseñar etiquetas de código de barras con un editor basado en web

Necesitas una etiqueta que se escanee correctamente, contenga los datos de producto adecuados y aun así tenga un aspecto lo bastante limpio para los estantes de una tienda o una línea de envío. Esta guía explica cómo diseñar exactamente esa etiqueta en el Sistema de impresión de etiquetas de nueva generación, utilizando su Label Studio basado en navegador. Al finalizar, tendrás un diseño de etiqueta con un código de barras, campos de texto y un logotipo o gráfico, listo para imprimir o exportar como PDF/PNG.

No se requiere instalación local. El editor se ejecuta en tu navegador y el sistema de etiquetas admite formatos comunes de códigos de barras 1D y 2D para casos de uso de venta minorista, logística y fabricación.

Requisitos previos

Antes de empezar, asegúrate de tener:

Acceso a LPSNG: ya sea la edición en la nube en https://lpsng.rsj.de o una edición integrada que se ejecute en un dispositivo local.
Un navegador web moderno: Chrome, Firefox, Edge o Safari con JavaScript habilitado.
Conocimientos básicos sobre elementos de etiquetas: sabes qué son un código de barras, un campo de texto, una imagen y una forma en una etiqueta.
Datos de muestra opcionales: un nombre de producto, SKU o precio para probar cómo se rellenan los campos.

No necesitas una impresora local para diseñar la etiqueta. Puedes exportar un PDF o PNG e imprimirlo más tarde.

Paso a paso: creación de una etiqueta de código de barras en LPSNG

Paso 1: Abrir el Label Studio

Inicia sesión en LPSNG. Desde el panel de control, abre el Label Studio. Este es el editor visual donde creas y gestionas los diseños de etiquetas.

Paso 2: Crear un nuevo diseño de etiqueta

Comienza un nuevo diseño. Puedes elegir una plantilla existente o empezar con un lienzo en blanco.

Establece las dimensiones de la etiqueta antes de añadir elementos. Define:

Ancho y alto de la etiqueta
Márgenes
Orientación

Hacer coincidir estos valores con el material de etiquetas evita problemas de redimensionamiento más adelante.

Paso 3: Añadir un campo de código de barras

Añade un campo de código de barras al lienzo.

Selecciona el tipo de código de barras que coincida con tu entorno de escaneo. Las opciones comunes incluyen:

Code 128 para etiquetas de logística y almacén
EAN-13 para códigos de barras de productos minoristas
Código QR para escaneo móvil o etiquetas de marketing
Data Matrix para componentes pequeños o marcajes industriales

Configura las propiedades del código de barras:

Tamaño físico
Rotación
Si se muestra texto legible por humanos debajo del código

Mantén intacta la zona de silencio alrededor del código de barras. El editor te permite controlar la ubicación, pero la impresión final debe conservar suficiente espacio en blanco para que los escáneres puedan leer el código.

Paso 4: Añadir campos de texto para los datos del producto

Añade campos de texto para el nombre del producto, precio, SKU u otros datos de la etiqueta.

Puedes introducir los valores manualmente o vincular los campos a una fuente de datos como un archivo CSV, un archivo de Excel o una hoja de Google. Para una etiqueta sencilla basada en CSV, tus datos podrían tener este aspecto:

sku,product_name,price
4001234567890,Example Coffee 250g,12.49
4001234567891,Example Coffee 500g,19.99

Asigna cada campo de la etiqueta a la columna correspondiente. Cuando imprimas un lote, las sustituciones de LPSNG reemplazan los marcadores de posición con los valores de la fuente de datos.

Paso 5: Añadir imágenes o logotipos

Si la etiqueta necesita un logotipo de empresa, una imagen de producto o una marca de conformidad, añade un elemento de imagen.

Sube la imagen directamente o haz referencia a ella desde una URL. Mantén la resolución de la imagen adecuada para el tamaño de impresión final. Un logotipo de baja resolución se verá aceptable en pantalla, pero puede imprimirse borroso.

Paso 6: Organizar y previsualizar la etiqueta

Utiliza las herramientas de alineación, la cuadrícula y las opciones de ajuste del editor para posicionar los elementos de código de barras, texto e imagen de forma coherente.

Revisa la vista previa con regularidad. Busca:

Elementos superpuestos
Texto demasiado cerca del borde de la etiqueta
Códigos de barras que puedan ser demasiado pequeños para el escáner de destino

Paso 7: Guardar, probar e imprimir o exportar

Guarda el diseño.

Antes de imprimir, pruébalo con registros de datos de muestra para confirmar que los campos se rellenan correctamente y que el código de barras cambia de valor en cada registro.

Cuando el diseño esté listo, imprime directamente desde el navegador a una impresora térmica o estándar conectada, o exporta la etiqueta como archivo PDF o PNG para usarla más adelante.

Verificación del diseño de la etiqueta

Una etiqueta que se ve bien en pantalla no siempre está lista para escanearse. Verifica el diseño antes de comprometerte con una tirada completa.

Utiliza la vista previa integrada a tamaño real para comprobar el diseño y el espaciado.
Imprime una etiqueta de prueba o exporta un PDF/PNG y luego escanea el código de barras con una aplicación de smartphone o tu escáner de producción.
Prueba con varios registros de datos si utilizas enlace de datos. Confirma que los nombres de producto largos, los campos vacíos y los caracteres especiales no rompan el diseño.
Comprueba la simbología del código de barras según tus requisitos. Para etiquetas minoristas, asegúrate de que el formato y la estructura de datos cumplan las convenciones GS1 si corresponde.

Un paso de verificación rápido evita reimprimir un lote completo.

Solución de problemas comunes

El código de barras no se escanea

Confirma que seleccionaste la simbología correcta para el escáner.
Comprueba que las zonas de silencio alrededor del código de barras no estén cortadas.
Aumenta el contraste: utiliza barras negras sobre un fondo blanco o muy claro.
Prueba a aumentar el ancho del módulo o el tamaño general del código de barras.

El texto o los elementos están desalineados

Utiliza las herramientas de alineación y ajuste para posicionar los elementos con precisión.
Verifica que las dimensiones de la etiqueta coincidan con el material físico de etiquetas.
Compara el tamaño de papel configurado en la impresora con las dimensiones del diseño.

Los datos no se rellenan correctamente

Verifica la conexión con la fuente de datos, como CSV, Excel u hojas de Google.
Comprueba la asignación de campos entre los elementos de la etiqueta y las columnas de datos.
Busca caracteres especiales que puedan necesitar codificación o escape.

La calidad de impresión es deficiente

Ajusta la configuración de DPI de la impresora si la impresión es granulada o borrosa.
Utiliza el material de etiquetas correcto para el tipo de impresora.
Limpia el cabezal de impresión si los códigos de barras se manchan o se desvanecen.

El editor se comporta de forma inesperada

Prueba con otro navegador.
Borra la caché del navegador y recarga el Label Studio.

Consejos avanzados e integraciones

Una vez que tengas una etiqueta funcional, puedes ampliar el flujo de trabajo sin reconstruir el diseño.

Scripts de campo en Python: LPSNG admite bloques de script en Python adjuntos a los campos de la etiqueta. Estos pueden modificar los valores de los campos antes de la impresión, como formatear fechas o elegir valores de forma condicional. El patrón general es adjuntar un bloque de script a un campo y transformar su valor:

# Ejemplo de script de campo adjunto a un campo de etiqueta.
# Consulta la documentación de la API de Python para conocer el punto de entrada exacto.
def format_label_date(raw_date):
    return raw_date.replace("-", ".")

API de servicio web: para flujos de trabajo de gran volumen o integrados, la API de servicio web de LPSNG puede enviar trabajos de impresión, renderizar etiquetas individuales como PDF o PNG y gestionar la autenticación mediante OAuth2. Si eres nuevo en esto, consulta ¿Qué es una API de impresión de etiquetas? Guía para principiantes.
Google Sheets y Excel: utiliza el complemento de Google Sheets o archivos de Excel como fuentes de datos para la impresión por lotes. Esto resulta útil cuando los datos del producto ya viven en una hoja de cálculo.
Etiquetas electrónicas de estantería: si los mismos datos de producto deben aparecer en etiquetas físicas y en pantallas digitales de estantería, LPSNG ofrece una solución ESL multicanal. Consulta Tutorial de la API de vinculación ESL: conectar etiquetas a artículos para conocer una vía de integración.

Para una visión más detallada de la lógica dinámica de campos, consulta Uso de scripts de Python para manipular campos de etiquetas en LPSNG.

Preguntas frecuentes

¿Qué formatos de código de barras admite LPSNG?

LPSNG admite una amplia gama de formatos de códigos de barras 1D y 2D, incluidos Code 128, EAN-13, código QR, Data Matrix y más. La lista completa está disponible en la documentación de formatos de código de barras.

¿Puedo diseñar etiquetas sin programar?

Sí. El Label Studio basado en web ofrece una interfaz visual de arrastrar y soltar para diseñar etiquetas con códigos de barras, texto, imágenes y formas. No se requiere programación para el diseño básico de etiquetas.

¿Cómo imprimo etiquetas directamente desde el editor web?

Después de diseñar tu etiqueta, puedes imprimir directamente desde el navegador a una impresora térmica o estándar conectada. LPSNG también admite la generación de archivos PDF o PNG para imprimirlos o compartirlos más tarde.

¿Es posible utilizar mi propia fuente de datos, como Excel o Google Sheets, con el editor?

Sí. LPSNG se integra con archivos de Excel y Google Sheets. Puedes vincular los campos de la etiqueta a columnas de tu hoja de cálculo, lo que permite la impresión por lotes con datos dinámicos.

Conclusión

Diseñar una etiqueta de código de barras en el navegador no requiere una herramienta de diseño de escritorio ni una compleja cadena de renderizado. Con el Label Studio del Sistema de impresión de etiquetas de nueva generación, creas un diseño, añades un código de barras y campos de texto, vinculas datos, previsualizas el resultado y lo exportas o imprimes.

Empieza con la edición en la nube en https://lpsng.rsj.de, o explora la edición integrada si prefieres un despliegue local. Para equipos multiusuario o entornos multidispositivo, LPSNG también ofrece funciones empresariales.

Documentación adicional:

Publicaciones relacionadas

Cómo diseñar etiquetas de códigos de barras con un editor basado en web