Case Study: Little Elegy
About the Client
Little Elegy is a self-published literary zine that focuses on short works. Really short. If you’ve ever wondered how much literature can fit on the back of a business card, this is the place to find out: www.littleelegy.com
The Challenge
Little Elegy was getting ready to change Web hosting providers, and it seemed like as good a time as any to take care of the site’s overdue redesign. Although the zine’s editor was fairly happy with the website’s existing appearance, there were technical problems that needed to be resolved.
The zine’s website was originally built using the inefficient and out-of-date design methods of the late 1990s. This made the site difficult to update, not to mention less flexible and slower to download than it should have been.
The site was also plagued with spam: spam in the online guestbook, spam in the editor’s e-mail inbox, even spam in the site’s search engine. Clearly, something had to be done. Little Elegy editor Colleen Marlow tapped Zenscope Studio for the job.
The Solution
Technical Solutions: Maintenance, Flexibility, and Spam Control
The new Little Elegy, as seen on a cell phone (click to enlarge)
The late 1990s were the “bad old days” of Web design, when the Web browsers from Netscape and Microsoft worked so differently that complex work-arounds had to be used to make websites function in both.
The Little Elegy site was built this way, and it increased the size of the pages and made them take longer to download. These old-fashioned design techniques can also wreak havoc with some of the more current Web browsing technologies, such as mobile browsers (on cell phones or PDAs) and screen readers for the blind.
Fortunately, these hacks and work-arounds aren’t necessary anymore. Redesigning the site with modern standards and practices cut page download times by 30–40%, and the site is now usable with most mobile browsers and screen readers.
The site’s modern redesign also makes maintenance easier. Thanks to a W3C technology called cascading style sheets, changes to the site’s appearance need only be made in one or two files to update every page on the website.
More maintenance headaches were relieved by creating a simple template system in the open-source PHP programming language. Repeating page elements like navigation, headers, and footers now only need to be changed once. No more editing dozens of pages just to update a single navigation link site-wide.
The site’s spam problems required additional changes. Although changes to the Little Elegy guestbook were possible that could’ve protected it from spam entries, Colleen was tired of monitoring and managing this portion of the site. The guestbook feature was removed during the redesign, and old entries now appear in the website’s Archives section.
Colleen’s e-mail address was also being inundated with spam, because it had been posted on the website where “spambots”—programs designed to harvest e-mail addresses from websites—could easily see it. The address was beyond saving, unfortunately, and had to be changed. To protect the new e-mail address, an online contact form was set up that didn’t expose the address directly to the Web.
A screenshot of the new search engine and results (click to enlarge)
Last, and most embarrassingly, even the site’s own search engine was inflicting spam on visitors. Little Elegy had originally used a free site-search service called Atomz to help visitors find content on the zine’s site. This had worked fine at first, but Atomz had slowly been sneaking more and more advertising into the search results. The final straw was when the Atomz advertisements started getting randomly mixed in with the real results, making them almost impossible to tell apart. The obnoxious Atomz product was jettisoned and replaced with an open-source search engine that produces better results with no ads at all.
Aesthetic Solutions: Big Improvements, Without Big Changes
This project was a little unusual for a redesign in that Colleen didn’t want to change the look of the website much. She preferred to stay with the site’s clean, relatively unadorned appearance and let the stories do the talking. I responded by taking the original design and adding small touches that enhanced its readability even further.
The re-designed Little Elegy home page (click to enlarge)
Reading text from a computer screen is harder on the eyes than reading from paper. This is because the resolution of a computer monitor is far lower than that of the printed page. Traditional CRT (“tube”) monitors also flicker dozens of times a second; this is imperceptible to many people, but causes even greater eye strain for others.
The Little Elegy site is, of course, meant to be read at length. To make this as easy for the visitor as possible, I increased the margins and added additional padding around various elements. The added space gives the stories and other creative content room to breathe that it didn’t have before, and makes extended reading of the site much easier for visitors.
Dynamic fonts reinforce the Little Elegy brand (click to enlarge)
Another aesthetic change involved the use of dynamic fonts in page headings. “Dynamic fonts” is a blanket term for several technologies that allow designers to use any font they want on a website without just replacing the text with images (a practice that hurts search engine ranking). Using special fonts can help reinforce a site’s brand in cases where a certain typeface is strongly associated with a product or service.
Dynamic fonts didn’t used to be possible in any reliable way, unfortunately, and the Little Elegy site had originally used a technique that only worked in Microsoft Internet Explorer. At this writing, IE has a market share of about 83%, leaving out approximately 17% of the website’s visitors. By contrast, the dynamic font technique I adopted in the redesign is visible to over 95% of Web users. The remainder (and search engines like Google) get regular browser text in a commonplace font.
Project Summary
- Project Description
- Website redesign for a literary zine
- Completion Date
- July 04, 2005
- Services
- Website design
- Website development (simple template system using XHTML, CSS, and PHP scripting)
- Site-wide search engine
- Oversight of transition to new host
- Photography