Design Elements and Effects

Process Post 6

It’s kind of fitting that one of the independent websites that I frequent most often also happens to be a cooking blog. I found Cleobuttera’s site years ago, back in 2015 I think, when my sister showed me the most delicious chocolate chip cookie recipe I’d ever had in my life. Truly, eating those cookies was a core memory of mine, and I would be happy to trade plenty to go back in time and relive that moment again. They’re perfectly chewy, soft, with a little bit of nuttiness from the browned butter. Just pure perfection in a cookie. After that I was hooked, and to this day I still go back to her website and browse through whenever I feel like giving something new a shot. It was also inspiring for me, seeing how easily the author of the site pulls from her culture in order to create accessible recipes. If she can do that with her Egyptian heritage, why can’t I do it with my Indian heritage?

From a design standpoint, I feel like the site is well put together. It is evident even upon first glance that a lot of thought went into the structure and organization of the site. The “Recipes” page in particular I feel is quite striking.

The recipes page of a cooking blog. There is a logo on top, featured recipe categories with pictures of desserts on the left, and an about section and contact page on the right.

Tasbih, the author of the site, has a cohesive theme that runs through the entire website in terms of colour and style choices. Even the icons of her different headers align with the site’s ties to her Egyptian heritage, using hieroglyphics to illustrate the categories. The asymmetrical design of the site aids the readers to be drawn first to the delicious looking images of food, and then to the brief introduction of the author herself to better understand where the recipes come from. Finally, following to the natural rhythm of the page, the eyes are finally attracted to the email subscription box. Logically, this layout makes sense. It directs the readers to the most important sections first, which in this case are the recipes, and then the additional information is given a smaller section. Additionally, Tasbih makes good use of white space throughout the website so that individual elements are clear and easy to read. Following Mauve PagĂ©’s best practices on web design, she is off to a good start!

There are only a few things that I personally would adjust about the design of the site. First of all, I feel as though the zigzag pattern behind the heading is a little distracting. I would take that out and let the beautiful icons she picked for each category do the talking. I don’t think there’s anything wrong with simplicity! The second main thing is the alignment of the featured posts on the home page. While all the tops of the images are aligned, the descriptions for each are not equal length and that means that they look slightly out of alignment with the post next to them.

Homepage of a cooking blog with two featured recipes on the left. The descriptions have pink buttons beneath them, with one a little lower down than the other.

This issue is only exacerbated when looking at the site on mobile. For this I would standardize description length to a certain number of characters or lines to make things look a little more even. Other than that, I have few complaints, and even those minor flaws won’t come between me and my chocolate chip cookies!

css.php Skip to content