Brush Script: Utility Typeface or Design Evil?

Section 8

This page is a lesson in bad typeface usage—specifically, the infamous Brush Script. While the font has its supporters, this gallery is intended to show how a typeface suffers from overuse, and overuse by poor designers.

Note how it is often used in combination with (too many) other fonts, and how it is endemic to small businesses (restaurants, menus, shops) that obviously did their own design. At least I hope they didn't pay for this stuff.

Brush Script should be banished by web designers as should Comic Sans, Times New Roman and Helvetica, although the latter two for different reasons.

The use of Brush Script is seen across ads, product labels and signs. It can be the main title of any of these, a secondary title/hed, or smaller type mixed in with other type. Here is my wide-ranging collection—you be the judge.

Primary titles or headings

These businesses sometimes use a different typeface for the title/name in other places.

Secondary names/titles

Other display type, mixed in with other fonts

This script from Dynamic Drive, Lightbox JS v2.1, will work. It has responsive images on small devices (not on screen resize). Or go to the creator, Lokesh Dhakar, where you will get a good set of instructions and a slightly newer version 2-2.11.1.

Important Note—you will also need jQuery, and you need to load that library from Dhakar's site (3.5 is a recent version) or the 3.x snippet (from Google API) and link to it before his scripts, in particular lightbox.js. Dhakar suggests putting lightbox.js before the closing </body> tag, to be sure that the DOM has been crawled. See the code for this demo page.

To use, click on any photo to get started. Then mouse over the photo on the right to see the Next button, and on the left for the Previous (you might need to tell users that). Click the X or anywhere outside the lightbox to close it.

The 2.2 versions of Lightbox allow for grouped photos that give you the Next and Previous arrows when moused over.

This newest version of Lightbox has an image rotation bug that doesn't occur with Google Chrome, but does with Firefox and Microsoft Edge, at least. Images that have been rotated will work in Chrome, and will have correctly rotated thumbnails, but they may be unrotated in the lightbox in other browsers.

You need to be sure that the EXIF (Exchangeable Image File) metadata is turned on (some forums said to remove it, or set the rotation to 1, but I just had to be sure it was on). Open the image in Photoshop, go to Export->Save for Web (legacy) and turn on All in Metadata on the middle right side of the dialog. Then do another Save, and rename.