Home > Features > Dev Depot: Typeplate.com — Next Level Typography • Bookmark   • Newsletters   • Register Search Options


Dev Depot: Typeplate.com — Next Level Typography

Dev Depot: Typeplate.com — Next Level Typography

June 15, 2013
Text size: 
View in Digital Mag
Get XBIZ News
XBIZ Research
Will virtual reality boost the paysite market?
Yes, it will soon
Yes, but in a few years
Out of 170 votes. Results based on votes submitted by members of XBIZ.net social network.

" Searchable text is the foundation of the Internet, with reams of visually bland literature of all genres, which even on a porn site could use a little sprucing up. "

The art and science of online typography is often overlooked by hurried designers and basic tools that simply rely on the most standard fonts and settings at the cost of creativity — an especially widespread issue for adult sites relying on stock templates rather than the individual flair of a hand-crafted print fan’s paradise.

Sometimes the problem is skill, time, or knowledge-based; and all are easy to solve.

Calling itself a “typographic starter kit” designed to encourage the use of great online type, Typeplate (www.typeplate.com) is a toolkit available for raw CSS, Sass, Stylus and LESS, which begins by establishing base font settings for the HTML element in order to standardize the typographic scale in a consistent manner — without any united values for line-heights or other problematic foundations.

“Frameworks make decisions for you about how to organize, structure, and design a site. Pattern libraries don’t separate styling and markup, making them tough to use in a truly modular fashion. We weren’t satisfied, so we made a thing that doesn’t do that,” the publishers of Typeplate stated. “We don’t make aesthetic design choices, but define proper markup with extensible styling for common typographic patterns. A stripped-down Sass library concerned with the appropriate technical implementation of design patterns — not how they look.”

The company quotes typography expert Tim Brown, who advocates the use of a modular scale, or a sequence of numbers relating to each other in a meaningful way.

“Using the golden ratio [a proportion of 1:1.618 that is said to be found in everything from the design of ancient Greek architecture to the growth patterns of plants],” Brown explains, “we can produce values for a modular scale by multiplying by 1.618 to arrive at the next highest number, or dividing by 1.618 to arrive at the next number down.”

According to its publisher, Typeplate allows users to establish clearly distinguishable heading levels using esthetically pleasing, technically correct font-sizes.

“Don’t randomly pick font sizes, choose a type hierarchy that is harmonious and consistent,” a Typeplate spokesperson explains, recommending the calculator available at ModularScale.com for font planning. “Always use a modular scale that calculates those sizes from a ratio ensuring your design and typography can relate in a meaningful way.”

The company offers a wide range of advice and coding examples that detail how Typeplate handles block and pull quotes, code blocks, definition lists, drop and small capitals and print, figures, footnotes, hyphenation, indenting, Unicode ampersands, word-wrap and more. For example, on the subject of color, users are advised to follow the print world by not using the darkest black available for your body text (#000), recommending instead something softer, such as #444 with a slightly darker color for titles such as #222.

It’s advice that will help designers stand apart from the crowd, while providing food for thought and an education in the fundamentals of online typography. Check it and see!


Adult Industry Keeps Fighting On

On Nov. 8, we had one of the most momentous — and to political observers, improbable — victories in the history of our industry. We defeated, by popular vote, a purportedly progressive measure... More »

Finding the Right Payment Business Model

One consistency among nearly all paysite owners is that they are creatures of habit. After all, how else could someone tirelessly produce or procure similar content steadily in order to update their commercial... More »

What Payment Plan Suits Your Bottom Line

The most disappointing aspect of merchant processing is having to tell a merchant that all domestic options have been exhausted and that there isn’t a bank in the U.S. willing to open a merchant... More »
Stay informed of the latest industry developments. Get XBIZ newsletters delivered to your inbox. Subscribe today!
Enter email address:

* To manage existing subscriptions click here.

Submit your press release to
multiple news outlets with 1 click.
Subscribe to RSS news feeds or
add free content to your website.
Access XBIZ news and articles
with your mobile device.
Subscribe to XBIZ Premiere magazine, the industry's leading adult retail trade publications, delivering the most timely and comprehensive business news and information to producers and retailers of adult products.


XBIZ 2017

Jan 09 - Jan 13
Hollywood, CA

XBIZ Awards 2017

Jan 12 - Jan 12
Los Angeles, CA

ANME Founders Show

Jan 14 - Jan 15
Los Angeles Marriott Burbank Airport

Everything To Do With Sex Show

Jan 20 - Jan 22
Montréal, Québec
Everyday thousands of business professionals browse XBIZ's industry directory for quality products and services. Not listed yet? Your company could be losing potential new business. Submit your company today!
Use XBIZ RSS feeds to stay informed of the latest industry developments or as a content syndication tool for your website!