I spent a lot of time this summer helping with the food photography for Fork Knife Teeth, my sister’s food blog. I’m partial to it because the recipes are good, because of my time holding up large pieces of white paper to reflect sunlight for a better shot, and because I think it looks nice, objectively speaking. It’s what I was thinking about as I read Chapter Two of Writer/Designer—the why of the site’s organization.
What appears first on the page is a menu bar. That’s followed by the title and then a feature box, with the most recent recipe, a bit of the article, and a photo. The background is pale gray, the menu bar white, and the article box in a cool shade of blue. The use of cool colors creates a calm feeling—one of the points of her recipes is the emphasis on the reader’s ability to make what she has made, and the site is clean and calm.
When you scroll down, a list of other recent recipes appear, with photos in bright colors on the left, again standing out as the main focus, with names in lighter letters on the right. As noted in Hopf’s post “2: Her Campus Website Design Analysis”, this means that fewer recipes appear on the page than they would were they organized in rows. This could be due to the limited number of posts so far published—Serious Eats (http://www.seriouseats.com/) and Milk Street (https://www.177milkstreet.com/recipes), both established sites, organize articles in rows of tiles. But Bon Appetit organizes with banners, as does Fork Knife Teeth–this allows for more description of each recipe, and a line or two of description, to appear.
The site looks orderly, with the pictures lined up—the pictures and white boxes are the same size, and make the eye move down the list—I find myself scanning from left to right. This alignment and the proximity of the boxes keeps the site neat—recipes are grouped together, as are the features at the top, where you can click through the most recent posts. Uniform space appears between the older recipes, with a larger gap between the first and the feature box, to visually separate them.
What catches my eye first is the name of the blog, which is the largest and darkest element on the page, contrasting with the gray and white smaller text, and making it memorable. Then, I see the picture on the left, which is the brightest colored element on the page—that contrast in color makes it stand out. The blue box calls attention to itself next. The focus of the site is on food and recipes, and the first page foregrounds those over the paler menu navigation bar and social media links. This organization helps reach an audience who shares the interest in food—food bloggers or lovers who are interested in finding a good recipe.
Word Count: 476