How does the magic work?

SVG is a pretty cool format. You can specify shapes in a file and reference that shapes in another file. You can embed SVG inside of SVG and other cool things. Another great thing about SVG is that it is a plain XML format. Due to that fact, it’s also possible to embed SVG directly into HTML. To manipulate the SVG, inside the Document Object Model (DOM), JavaScript can be used. For the EAN-13 generator I’ve used Pablo, a JavaScript toolkit for SVG manipulation.

The barcode generator uses a template that contains the different used encodings. This single templates get then put together according to the EAN-13 encoding standard. And the resulting SVG can be saved for later use or import it to your Desktop Publishing Suite.

Conclusion

Having an easy way to create barcodes is great and allows you to create your own barcode labels. Bringing your EAN-13 code to your product is easy with a label but you can also integrate it in your product design. The only important thing to consider is the size of the barcode that. For EAN-13 there are multiple allowed sizes so make sure your printed code works as required.

For more information take a look at the Portfolio entry. And make sure to let me know what you think about the little tool.

This post is also available in: German

Pages: 1 2