Ryan Scherf’s website (http://ryanscherf.net), tweeted by @CassieWrites_, is a perfect example of Ellen Lupton’s ideas about “Letters” and “Grids” from her book Thinking With Type (2010). Lupton addresses fundamental ideas of typography in her book and describes the ways in which we use typography in many areas of our lives.
Ryan Scherf’s website uses some of Lupton’s ideas about “Letters” in his headers. He uses multiple typefaces, which Lupton suggests must be done with care and attention to detail. Lupton writes, “Combining typefaces is like making a salad. Start with a small number of elements representing different colors, tastes, and textures. Strive for contrast rather than harmony,” meaning designers can’t just sneak different typefaces into areas and hope we no one notices (54). Scherf does exactly what Lupton suggests, choosing contrasting typefaces and colors which stand out and make viewers pay close attention to his words. Scherf chooses a more sophisticated, architecture-like font in white on a dark background to describe what type of work he does, and what he will be showcasing on his website.
He then sandwiches a more playful and colorful mixture of typefaces with different weights and leading to show what type of designing he does, or for what “platforms.” The use of these colors draws the eye down and around, while the different weights make each platform stand out to the eye.
The final piece of the sandwich is his location, which brings viewers back to the sophisticate, clean typeface.
As readers of Lupton will know, choosing a typeface is a big decision. The typeface you pick to represent your business says a lot about who you are. There are things to consider, like the history of the typeface, but there are also connotations that go along with certain typefaces. The two used by Scherf show a clean, almost minimalist classic feeling that seems professional; and a fun, chunky, and colorful feeling that shows a more unique and creative side. For a web designer, I think those combinations seem like a good choice. The typefaces Scherf uses show that he is professional, but also creative. That is the kind of person I would trust to work on my website.
Scherf also uses grids, which Lupton addresses in her book as well. His website runs on a linear grid, where examples of his work are in two columns, running vertically down the page. According to Lupton, linear grids in web design are a good choice for multiple reasons. Most importantly, linear design that uses tables and cells that flow in a line which is the easiest thing for devices for the visually impaired to translate into sound. These devices read webpages in a row by row fashion, so linear design translates most easily and clearly. Also, linear design is best for translation onto mobile devices. While funky, new-age web design may look neat on a desktop or laptop computer, the layout often gets skewed when it translates onto a mobile device. Linear grids in web design work best when there is little room, like on your phone (171)!
Within his own web design it appears that Scherf follows these same principles. Although not all of his work is completely linear, many of the spaces containing content are styled in a paragraph-like way that reads like a book. He also incorporates different typefaces in a purposeful manner.
Overall, Ryan Scherf’s website follows many design principles that Ellen Lupton stands behind in her book. He demonstrates his ability as a designer on his webpage. He chooses clean, functional typeface and a sensible grid system to make the most of his spaces.
Seeing Lupton’s ideas in practice helped me get a better grasp on many of her concepts. Now that I am more aware of how to put these ideas to work, I think I will pay more attention to these design principles when browsing the internet. How have the readings for class changed the way you look at things, such as websites, in your daily lives?
Lupton, Ellen. Thinking with Type: A Critical Guide for Designers, Writers, Editors, & Students. 2nd ed. New York: Princeton Architectural, 2010. Print.