Think back to that time in high school, when you would be sitting in class with a textbook open in front of you, pouring over the words, words, words. Read a chapter of history, a chapter of science, a chapter of this or that, and with all that information comes a whole lot of text. For this edition of website winners and bloopers, we will look at how text can be used as a graphic element, ...and when it should not. Looking at two history websites, we will see how organizing a lot of text can be an interesting design puzzle.
WINNER: Our first website brings us back to good old 1776. PBS has a section on their website devoted to the American Revolution called Liberty. The website is organized into four sections with a black background and “Liberty” written in a scrawly hand. Silhouettes of soldiers and a tattered flag are against a blue bar at the top. What’s really interesting about this website, though, is how the information is displayed.
In the first section, the website displays important events as if they were in an early newspaper. The paper is torn and yellowing, and the headlines look as if they were just freshly printed by Gutenberg himself. The article, however, is written in a modern typeface that is easy to read, set up very similarly to a modern newspaper. The key to being able to use interesting and unusual fonts is to not overuse them. Having the body copy in a simple font allows the headline to stand out, making it more than just information and actually a design element on the page. The article couldn’t be easily read if it were in a similar font to the other, and the impact of the headline would be diminished if it were mixed with something else with a lot of character. In this way, pick one thing you want to stand out on the page.
In the first section, the website displays important events as if they were in an early newspaper. The paper is torn and yellowing, and the headlines look as if they were just freshly printed by Gutenberg himself. The article, however, is written in a modern typeface that is easy to read, set up very similarly to a modern newspaper. The key to being able to use interesting and unusual fonts is to not overuse them. Having the body copy in a simple font allows the headline to stand out, making it more than just information and actually a design element on the page. The article couldn’t be easily read if it were in a similar font to the other, and the impact of the headline would be diminished if it were mixed with something else with a lot of character. In this way, pick one thing you want to stand out on the page.
BLOOPER: For our website blooper, we’ll visit The Victorian Web. Now here is a website with a LOT of text. With countless sections and articles and lists of dates, The Victorian Web offers a plethora of info. But it doesn’t offer a lot in the way of design. Does a website devoted to presenting knowledge need to look pretty? Well, perhaps not, but it does have to be organized and easy to read.
The visual organization and presentation of your text will reflect on how your reader thinks about and reads the text itself. The writing may be very good, but if it is presented poorly, the reader may question the website’s credentials. The wall of text that sometimes occurs on The Victorian Web could be intimidating and difficult to find information.
Be kind to your readers, and use a smaller box to present your information, instead of having it stretch across their browser regardless of resolution. Also, their opening page has little blue blocks set up in a diamond shape, with links to each different section. The text within the blue is sometimes too small or hyphenated, which makes it harder to read. This is a case when an unusual font hinders the overall message of the website, because it is squished into too small a space and against a garish color, so you can’t really derive the right mood from it.
When dealing with a lot of text it can be difficult to juggle design elements and the information you need to get out. Have fun with it, though. Just because you have a lot of text, doesn’t mean you can’t have a visually appealing website. Keeping in mind that less is more with fonts, you can showcase the perfect type to create the right feel for your website.
Until next time,
The Ruby Porter Team
The visual organization and presentation of your text will reflect on how your reader thinks about and reads the text itself. The writing may be very good, but if it is presented poorly, the reader may question the website’s credentials. The wall of text that sometimes occurs on The Victorian Web could be intimidating and difficult to find information.
Be kind to your readers, and use a smaller box to present your information, instead of having it stretch across their browser regardless of resolution. Also, their opening page has little blue blocks set up in a diamond shape, with links to each different section. The text within the blue is sometimes too small or hyphenated, which makes it harder to read. This is a case when an unusual font hinders the overall message of the website, because it is squished into too small a space and against a garish color, so you can’t really derive the right mood from it.
When dealing with a lot of text it can be difficult to juggle design elements and the information you need to get out. Have fun with it, though. Just because you have a lot of text, doesn’t mean you can’t have a visually appealing website. Keeping in mind that less is more with fonts, you can showcase the perfect type to create the right feel for your website.
Until next time,
The Ruby Porter Team