How to make healthy choices every day

How to make a dynamic logo for your food blog

You have it all set up: a good name for your site, you registered the domain name and hosting, and now you’re looking at the blank canvas where your logo or logotype should be. This step can be even more intimidating than choosing the name because it stares at you and all your visitors every time the site loads. Also, the logo is used in a variety of sizes and places, from a phone’s touch screen to… hopefully huge posters at your future cookbook launch!

In this article I will share some of the experiences and advice from more than 9 years working with the My New Roots logo – including tips on how to make a versatile dynamic logo.

Making a logo
A good way of starting work on your logo (symbol, like Apple’s apple) or logotype (the name written in a recognizable way) is to take inspiration from the actual name and purpose of your site. In the very early days of My New Roots the name was actually written in a green, very minimal font in the top of the page (unfortunately I don’t have a screenshot of it). Green, because vegetables. That was pretty much it. Later, we updated the general design of the blog to use a thin sans serif font for the blog post titles so Sarah gave it a new spin, wanting a friendlier font for the logo and also a more “designed” logo than just the words My New Roots written in green letters. This is how it was developed:

My New Roots logo development

First Sarah found a font that looked somewhat like what she wanted. Remember, you can stop at this step and just adjust color, letter spacing and font weight and you are good to go (it worked for google until very recently!). If you want to go a bit further you can place the words in a certain way as seen in step two. Simply placing two words on top of each other and adjust the size and spacing to get a “block effect” can be a remarkably strong visual element. Finally, using Adobe Illustrator you can tweak the shapes of the letters or create a symbol for your blog. Sarah used the Times font as inspiration to make her slightly quirky letters and add a little leaf on the letter “t”. Finally, she added the circle background to give it a stamp-like character, which turned out visually stronger than just the letters on white background. The circle also makes it work in negative on dark backgrounds (white circle, transparent letters).

My New Roots logo leaf

 

What is a dynamic logo?
The My New Roots logo is fairly simple but still becomes too detailed when it is scaled down to mini-size. So making a logo for online use means making a logo that is not only simple but also one that can transform into something else! A dynamic logo (or identity) doesn’t always look the same but changes the graphic elements depending on the application. The little favicon that the browser displays in the tab is a perfect example. This is probably one of the smallest versions of your logo that you will ever use but also one of the most important, as people are trying to find the tab with your site among the 43 other tabs they have opened. In our case we keep the circle and the M and it doesn’t take much energy from the reader to recognize the tab as the home of My New Roots. If you don’t have a favicon your site could be lost in a sea of beautiful little tab icons, and that would be a shame.

My New Roots dynamic logo

 

 

The very short, step-by-step guide
To sum it all up, if you’re just starting our or simply want to improve how your site looks you can definitely do it without being a master designer:

  • Start with your site name: write in different fonts and play with italic, bold, line spacing, letter spacing and colors. This is best done in Illustrator because it allows you to scale indefinitely but it can be also done in Photoshop if that is your tool of choice. Just remember to make the letters really big in Photoshop and then scale down from there.
  • Next step is to play with lines, circles and other basic shapes to complement the letters. If you are intimidated by all the digital tools, no worries: print out a page with your site name in the font you like and start doodling on it with a pencil. Easy and cheap.
  • If you made your graphic element yourself in Illustrator, great. If you drew it on paper, take a photo of it and send it to a designer – they can convert it into a digital version (vector) at a small cost, since you already drew it.
  • Finally, if you’re happy with how everything looks, begin thinking about the dynamic aspects: how can you make a tiny version that is still recognizable? Can you isolate a part that can live on its own?  Like Nike has a swoosh, My New Roots has an “M” in a circle… what element can you use?
  • Start using your awesome logo!

Feel free to ask questions in the comments – happy logo crafting!

Mikkel / My New Roots

 

 


4 thoughts on “How to make a dynamic logo for your food blog”

  • Hello Kathleen, thanks for sharing this valuable information. Yes a dynamic logo is very important just as a responsive mobile-friendly website. Today we all are smartphone geeks and spen most of our time in buying, ordering etc.
    When it comes to getting food logos or drink logos for your business start-up, it makes sense to ensure that you aim for a design that pictorially depicts your business’ taste, quality and appeal, all at the same time. In fact, your logo must be appetizing enough to make foodies and epicureans make a beeline for your products and services.
    Food logo not only promise a yummy experience to food connoisseurs, but also are a feast to watch.

  • Great tips here.
    Do remember to buy your domain name prior to creating or designing your logo.
    So many people get de-motivated when they are unable to match the logo with their domain names resulting in businesses not reaping desired fruits.

  • Great info, thank you for sharing! I have a work website, but am moving into doing my own blog for my little homestead Apple Creek Farm, so I’m going to test fonts and ideas that you suggested. I work in photoshop however and don’t have illustrator. Still possible to make a logo?

Leave a Reply

Your email address will not be published. Required fields are marked *