What's the best way to truncate a URL so that it fits within a layout

Question

What is the best way to truncate a URL when displaying it within a web page? I don't mean a link but literally displaying the URL as a value to the user, assuming that the text might be in a container of fixed width and you don't want to wrap or run outside of the container?

Is it better to truncate from the end, favouring the early part of the url:

eg. http/really.long/urlthaticantf...ere.html

Or place the '...' in the middle to favour the start and end of the link as the most value in terms of giving context:

eg. http/really.long/ur...aticantfithere.html

Also what is a good rule of thumb when choosing how long to make the truncated url? Should you be pessimistic and pick a likely wide character such as capital 'M' and see how many of these fit in the layout? This tends to give really short URLs in general as most characters are much narrower than 'M'.

Or should you be optimistic and use a truncation that generally gives a good length but risk overrunning when the URL contains many large characters?

Answer 1

Truncate the middle, for the reasons you gave.

Answer 2

I always want to see the server. There've been waves of keyloggers from suspect servers in some forums I visit, and that's given me server paranoia.

Ideally, I can scroll around and see the entire url in the container. :-)

Answer 3

I'd expect to see at least the server. And as long I can hover over the link and see the rest of it in my status bar, I'm happy.

Think of the links in Slashdot's comment system.

Answer 4

My preference is to display the most critical components of the URL. This is the file being requested and the domain of the request are what I consider critical, the intermediate path and the query string are things I consider non-critical.

So if you had http://www.Example.com/archives/2005/08/09/something.html, I would truncate it as www.Example.com/.../something.html

Of course, there are scenarios where this wont work. Take the URL of this page:

http://stackoverflow.com/questions/206899/whats-the-best-way-to-truncate-a-url-so-that-it-fits-within-a-layout

In this case, I would truncate the last portion of the URL to a reasonable number of characters (preferably breaking on a non-alpha), such as:

stackoverflow.com/.../whats-the-best...

Answer 5

I would agree by saying start from the middle.

Answer 6

Get rid of the middle, no one needs to know the directory structure of a link. The domain is important and the actual file is important.

Example:

http://www.domainname.com/folder/.../file.php