I build initial website design sketches in Illustrator CS. Illustrator, in numerous versions, has been my sketching
tool of choice for web design since 1995, 
though I've been using Venus's favorite son since the late Eighties. Doing print
comps, Illustrator's inability to underline text (without manually drawing a rule) has always been a minor irritant to
me. With Web comps, however, it's a real pain in the ass. I can't count the number of hours I've logged manually
drawing (then repositioning as text reflowed or moved) lines beneath hyperlinks so I wouldn't have to tell
clients: "Yes, the red [or blue, or green, or orange…] text is a hyperlink. Imagine it underlined."
The other day, when I delivered to Brian Alvey a web layout sketch from Illustrator (layered PDF 1.5, 'natch), he asked in what application I'd done the comp. Knowing my history with, and stance on InDesign, he assumed I'd done the sketch in InD. The lack of underlines in my mocked-up hyperlinks made him wonder, though.
Illustrator doesn't underline text. I could explain why it doesn't while InDesign and Photoshop do, how the Illustrator type engine was written versus how InD's and Pshop's were, and blah blah blah, but that's boring. Suffice it to say: From Illustrator 1.0 through Illustrator CS (version 11), without a third-party $25.00 plugin, Illustrator has never underlined text.
Then Brian pointed me over to Doug's Stopdesign, who, by way of Phil Oye, has a solution for underlining text in Illustrator—a genuine, text underline, not a manual rule hack. Here's Doug's short solution:
The short version of it is: create the text in Photoshop, then underline it with the underline feature. The underline button sits in the Character palette in the same line as Faux Bold, Faux Italic, All Caps, Strikethrough, etc.
Once underlined, copy the text with Photoshop's text tool, then paste it into Illustrator. Voilà! Underlined, editable text in Illustrator. I'm not sure how far back (in versions) the underlined text will transfer over to Illustrator, but it certainly works in CS (v.11).
I've verified that this trick works in Photoshop CS & Illustator CS under OS 10.3 and Windows XP. I haven't tried it with earlier versions of Illustrator, but I doubt it work given the text engine differences between Illustrator and Photoshop in prior versions. So now, there's a way to underline text in Illustrator. Thanks, Doug. Thanks, Phil. Thanks, Brian. Thanks, Aunt May.
Download The Underlined Text Style
If you'd rather not jump between Pshop and Illustrator every time you want underlined text, or if you don't have Photoshop CS to get the underline in the first place, I've made an underline character style available for download. It's cross-platform, and the directions are below.
Caveat: First, I created the "Underlined" character style with Courier New 12pt, so that's how it will
appear. I used something generic for compatibility. You'll need to change it every time you use it but don't want
Courier New 12pt. If you use the same settings all the time, change the style. Second, Doug discusses a
peculiar issue with the color of the underline sometimes being dependent on the color of the first character
in the paragraph. Read Doug's article for the full story.
-
Download the cross-platform underline_text.ai style (398 kb).
-
Uncompress "underline_text.ai" to a folder of your choice.
-
In Illustrator CS, on the Character Styles palette, click the palette options flyout (the arrow top-right).
-
Choose "Load Character Styles…"
-
Navigate to "underline_text.ai" and load it.
-
Highlight text you would like underlined, then apply the "Underlined" style from the Character Styles palette.
To change the style permanently—say, to permanently set the font to be Courier New—open "underline_text.ai" and edit the "Underlined" character style.
Illustrator does underline text.
Now, if only I could get Illustrator QE to finally fix that long standing bug wherein Illustrator under Windows categorically refuses to launch maximized…
1. Thanks for the props!
FYI, the character style that you are providing includes styling information that overrides the text properties already applied to the text you are underlining (e.g., font)
To make it more akin to a simple "underline" button that does affect anything else, you should reset the style by opening and clicking the "reset panel" button on each of the panels. This will remove everything but the underline property itself.
The version of the style on my site already has all the properties removed.
Download
Posted at 6:10AM on Dec 19th 2005 by Phil Oye