Christian Heilmann

Constraining link length with JavaScript and DOM

Monday, May 9th, 2005 at 5:46 pm

From time to time, we need to display links as plain URLs in a text.

The problem with URLs is that per definition they don’t contain spaces (yes, sloppy developers or maintainers use spaces in filenames and risk broken links, but nobody should).
No spaces in long words in HTML means that the text does not break into several lines when there is not enough space. This can seriously wreck a layout.
Furthermore, long URLs don’t look nice and stop the flow when reading a text.

A lot of blogging tools and CMS offer backend scripts to constrain the length of submitted URLs, for example in comments.
A friend asked me if that could also be done on the client side, and I wrote shortlinks to do that.

It is a small script that checks each of the links in the document for a http: start and if it is longer than a defined length. If that is the case, the script takes out some letters either at the end of the URL or in the middle and displays the shorter version. You can define a title with the full URL to be added.

Share on Mastodon (needs instance)

Share on BlueSky

Newsletter

Check out the Dev Digest Newsletter I write every week for WeAreDevelopers. Latest issues:

Don't stop thinking, AI Slop vs. OSS Security, rolling your own S3 Despite AI you still need to think, Bitter lessons from building AI products,  AI Slop vs. OSS security and pointer pointer…
200: Building for the web, what's left after rm -rf & 🌊🐴 vs AI What remains after you do a rm -rf? Why do LLMs know about a seahorse emoji? What image formats should you use? How private is your car?
Word is Doomed, Flawed LLM benchmarks, hard sorting and CSS mistakes Spot LLM benchmark flaws, learn why sorting is hard, how to run Doom in Word and how to say "no" like a manager.
30 years of JS, Browser AI, how attackers use GenAI, whistling code Learn how to use AI in your browser and not on the cloud, why AI makes different mistakes than humans and go and whistle up some code!
197: Dunning-Kruger steroids, state of cloud security, puppies>beer

My other work: