Learn more about Lisa Firke of Hit Those Keys.
Thank you so much for redesigning my official author site! Could you give folks new to it a brief overview, from a web designer's perspective, of the monstrous beast that it is?
Sure! Well, just in terms of literal size, at last count, your site contained nearly 2000 files, including 377 html pages, 978 images, and nearly 8,400 external links. I have to be very consistent in how I place files within the site, and the conventions I use for naming files and such, just to keep things from becoming too chaotic.
And you, in your instructions to me for updates, have evolved a very clear and careful way of indicating where changes and additions are needed. (I now teach all my new clients to indicate what changes they’d like using the format you do.)
If we didn’t work in this methodical way, we’d both have gone nuts by now.
(And, I think if we’d both known, when we first dived in six years ago, just how big the site would become, we might have opted for a more robust content-management system--and that’s something that we may still have to think about in the future--but curating it by hand has let us keep things totally custom and that’s had its advantages.)
Going in, we talked about the dualities of the site--both as an author home base and a children's-YA literature resource, and even under that author umbrella, in representing someone who offers books for both kids and teens. How did you represent the dual (quad?) goals of the site?
Well, first a tad more background: this is our third iteration of the site, and each iteration has had slightly different goals, even though all along the dualities you mention has been a major concern.For the first iteration that launched in 2005, the major goals of the redesign were to make your large collection of resources easier to discover and navigate, to upgrade the underlying code, and, most of all, to make the site as smart and hip as you are yourself!
In 2008, for the tenth anniversary of the site, we revisited the design again. The graphics were streamlined and we were able to play much more with the site visually because of the way web technologies had advanced. I was able to incorporate more imagery and animation.
Now, in 2010, the site has undergone a more profound visual transformation.
To put the focus more on you, Cynthia, I created a digital portrait (based on a photograph) and combined this with the daisy-sun graphic (now in its most streamlined form to date) that we'd been using all along. Links to key destinations within the site are highlighted in the new masthead.One of the more subtle ways I’ve tried to distinguish between your role as author and your role as curator of the literature resources is the horizon line in the masthead image.
The masthead shows you against a flat landscape with a large sun beginning to dip below the horizon. All the links pertaining your works as an author are above this horizon line, while the links to separate resources and information fall below the line (as does the tagline about the site being the home of the children’s and YA literature resources.) That’s one way of indicating some separation in the different parts of the site.
For a bit of extra fun, when visitors browse to the pages dedicated to your work for teens, we 'turn out the lights' on the graphics for a striking after-dark effect.
As ever, the discovery and navigation of the content—making these as simple and graceful as possible —has driven most of my design decisions.
What were the challenges?
With such a big site, with such varied content, and with a visitor not necessarily beginning their exploration at the front page of the site, letting people know where they are and what exactly “there” is becomes really important. And with so many choices of where to go, how much is too much to show at once?
I approached this challenge by making the question part of the design. When you land on a page, the navigation accordion in the sidebar opens to show what section this page is in.
This is reinforced by a background color in the submenu, by the words “you are here” and by the current page being highlighted in bold.
Also, to keep things more focused, we now show only the links in one particular section at a time (rather than for the entire site), and provide links back to the beginning and to the full site map for when a visitor has finished exploring one area and is ready to see something else.
(The trade-off here is that it is a little harder to skip around, but I think the focus we gain is worth it.)
Another challenge came with trying to make changes to a design we both liked, but which was beginning to date itself. Plus, of late, your books are being published internationally. So, I did look to some European designers for inspiration--not to copy, but to help refresh my vision.
Interestingly, though, the inspiration for this design actually came from something very American--the kitchy tourist postcards of the mid 20th century and the oversimplified use of color in paint-by-numbers kits of the same period.
That was what led me to the style you see now, which I think ends up being very fresh.
What were the rewards?
It’s funny, whenever I dive deep into cynthialeitichsmith.com, I find myself reading, making notes on books I haven’t yet read, and appreciating the community of people who make books. The content of the site is very inspiring.Did you have any ah-ha! moments that stood out?
I need to stop telling people that I can do things quickly. Clearly, I can’t. But I did learn some things about not getting in my own way.
Also, that it’s worth stopping to clear small technical irritations out of the way even when that feels like a halt in forward progress. I did a fair amount of digital housekeeping behind the scenes this time around, and I can already tell that my process is smoother and more pleasant as a result.
Is there anything you'd like to add?
Just that I appreciate the way you let me follow my own lights as I work. You trust me to keep the site’s interests in mind and that frees me up to do some really exciting things with it.
Cynsational Notes
Thanks, again and again, Lisa, for your vision, creativity, and technical magical making!
Learn more about Lisa Firke of Hit Those Keys.
