In order to more accurately compare iOS 8 Safari’s text-decoration underline implementation to SmartUnderline, I created a test page. [1] It contains five links

In order to more accurately compare iOS 8 Safari’s text-decoration underline implementation to SmartUnderline, I created a test page. [1] It contains five links to the words gesture, quitting, discovery, piggy, and eager, set in Helvetica. To produce the iOS 8 version, I opened the page in Safari on iOS 8.1 pinched zoomed to the maximum amount while keeping all five links within the frame, and took a screenshot. To produce the SmartUnderline version, I visited the SmartUnderline install page [2] in Google Chrome on Mac OS X, entered the test page URL, and clicked “Preview in a separate window”. With the screenshot from my iPhone opened next to the browser, I used Command+[+/-] to zoom the browser until the font sizes were the same size, then took a screenshot. Here are the results: [3]. To summarize, I believe iOS 8 has some advantages and some disadvantages, but to me there is no clear winner. Some specific points in no particular order: - iOS underline breaks are always vertical cuts. Since SmartUnderline uses text-shadow to “white-out” the underline, the cut-outs are in the shape of the glyph. To me, this looks better in the “g” in “eager”, but worse in the “q” in “quitting”. - iOS 8 shows a line between a “g” and ”y” (as in ”piggy”) and SmartUnderline does not. - SmartUnderline’s underline extends less far to the left of the first letter and right of the last letter. This looks better in “quitting” and potentially worse in ”discovery”. - In general, SmartUnderline sets a little more space around each descender. - Both implementations show no underline before or after a leading or trailing “g”. - Both implementations show the underline very close to the left side of the “y” descender. I think improvements could be made here with both implementations. [1]: http://jsfiddle.net/adamschwartz/hyyerbq4/show/light/ http://jsfiddle.net/adamschwartz/hyyerbq4/show/light/ [2]: https://eager.io/app/eA9ULux0UOJP/install https://eager.io/app/eA9ULux0UOJP/install [3]: http://postimg.org/image/nf9b2ahd1/ http://postimg.org/image/nf9b2ahd1/ (@2x http://postimg.org/image/688ricy2v/ http://postimg.org/image/688ricy2v/)