Posts Tagged ‘web’

Two (plus one) Typesetting Characters I Wish I Knew About Sooner

I’d often wondered why AjaxChat sometimes inserts an apparently invisible character that breaks links if one attempted to copy and paste them. Today I was able to select one while using Opera for debugging, thanks to the font it used not covering it. I wasn’t really sure what to do with it at first, I don’t have any character map-like tools installed and Google search didn’t recognize it as a query. Eventually I noticed it was producing search suggestions and among them was ​.

As Wikipedia explains, the character is a

Zero-Width Space
The zero-width space (ZWSP) is a non-printing character used in computerized typesetting to indicate word boundaries to text processing systems when using scripts that do not use explicit spacing, or after characters (such as the slash) that are not followed by a visible space but after which there may nevertheless be a line break. Normally, it is not a visible separation, but it may expand in passages that are fully justified.

It continues with a great demonstration:


“On browsers supporting zero-width spaces, resizing the window will re-break the above text only at word boundaries.”

Another neat character is the

Soft Hyphen
In computing and typesetting, a soft hyphen (U+00AD soft hyphen, HTML: ­ ­), also called a discretionary hyphen or optional hyphen, is a kind of hyphen used to specify a place in text where a hyphenated break is allowed without forcing a line break in an inconvenient place if the text is re-flowed. The soft hyphen’s semantics and HTML implementation are in many ways similar to the zero-width space.


Bonus round: check out the Zero-Width Non-Joiner.

Disable Form Autocomplete

Disabling a visitor’s browser’s built-in form autocomplete feature sounds like it should be a simple enough task, but like many seemingly mundane things in web design it’s a bit asinine. I have personally never had to do this until yesterday when I made an AJAX-based autocompleting search field and realized it didn’t do much good hiding behind the browser’s. It could also be useful to avert the visitor’s autocomplete where the data shouldn’t be remembered by the browser (like credit card numbers) or re-entered for verification (like e-mail addresses).

The easiest method (and the one with which I went) is to add the


attribute to your <form> or individual <input> tags. According to Mozilla Developer Network’s How to Turn Off Form Autocompletion:

This form attribute was first introduced in Microsoft’s Internet Explorer 5. Netscape introduced it in version 6.2 — in prior versions, this attribute is ignored. The autocomplete attribute was added at the insistance of banks and card issuers, but prior to HTML5 was never part of an official standard.

In practical terms this means the autocomplete attribute is perfectly valid and there is no good reason you shouldn’t use it. In ideological terms, unless you are using it in an HTML5 document, the attribute is not valid HTML and will fail a validation test.

Sometimes it’s OK to be a rebel. Sometimes there’s a cheat code, though. It’s possible to set this attribute in JavaScript and produce flawless HTML. There is only one drawback: those with JavaScript disabled (no one) will not be affected:

var q = document.getElementById('query');
q.autocomplete = 'off';

An alternative I thought of but rejected on the grounds that it would make untidy URLs is the use of hidden <input>s and the onchange event handler. It could work well for POSTed forms, however:

<input type="hidden" name="query" id="query">
<input type="text" name="<?php echo md5(time()); ?>" onchange="document.getElementById('query').value = this.value;">

Why your UserAgent is a Fat Liar

I just ran across this entertaining article by Aaron Anderson and thought I’d share it:

History of the browser user-agent string

It reads like a trip down memory lane; rife with the jaded nostalgia we whom have suffered every browser since Mosaic share.

And then Google built Chrome, and Chrome used Webkit, and it was like Safari, and wanted pages built for Safari, and so pretended to be Safari. And thus Chrome used WebKit, and pretended to be Safari, and WebKit pretended to be KHTML, and KHTML pretended to be Gecko, and all browsers pretended to be Mozilla, and Chrome called itself Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US) AppleWebKit/525.13 (KHTML, like Gecko) Chrome/ Safari/525.13, and the user agent string was a complete mess, and near useless, and everyone pretended to be everyone else, and confusion abounded.

Return top
Online Marketing Toplist
Technology Blogs - Blog Rankings

Internet Blogs - BlogCatalog Blog Directory

Bad Karma Networks

Please Donate!

Made in Canada  •  There's a fox in the Gibson!  •  2010-12