• Skip to main content
  • Skip to primary sidebar
  • Skip to footer

A Joyfully Mad Kitchen

Easy recipes for building confidence in the kitchen

  • Home
  • About
  • Recipe Index
    • appetizers
    • Desserts
    • Main Course
    • muffins, breads & scones
    • holiday
menu icon
go to homepage
search icon
Homepage link
  • Home
  • About
  • Recipe Index
  • Desserts
  • Dinner
  • Breakfast
  • Meals for Sharing
×
Browse More: lifestyle » blogging » Graphic Design 101

Graphic Design 101

Published: Nov 6, 2014 · Last Updated: Feb 4, 2022

1.8K shares

Top “graphic design 101” tips for bloggers who aspire towards learning about graphic design and applying those tips to their blogs!

One of the biggest reasons I love blogging is that is combines three things I have always loved: photography, writing and graphic design. These are three essential skills to blogging but they’re not always naturally loved by all bloggers.

I get asked questions about graphic design all the time, so I thought it would be a perfect start to a new mini series I wanted to do! I will cover the basics of different thing that I love for the next four weeks: graphic design, photography, cooking and blogging. ?Each post will hopefully answer some lingering questions you may have about each subject!?If you have specific things you’d like me to address, please email me!?

Let’s get started, shall we?

Graphic design 101 for bloggers. Learn about the best fonts for blogging, what a sponsor button is, how to create high quality post graphics, and more!

Graphic design for blogging is an interesting beast. There are so many little things that are a part of doing graphic design for blogs. Unfortunately, you won’t be done with graphic design even if you hire someone to make a logo/header design for your blog or even a full blog design. You need to know basic graphic design in order to make graphics for your posts, design your own ads/buttons and make giveaway graphics as well.

Here are a few of the questions I’ve heard over the last few months:

What programs do you use?

I personally rely on Adobe Photoshop and Adobe Illustrator. Illustrator is my go to program and Photoshop I use for quick graphics for giveaways or for photo editing. Price? For the photography bundle which includes Photoshop and Lightroom it is?$9.99 a month! A single app plan (for example if you wanted to get Illustrator) would be $19.99.

The main reason I use Illustrator over Photoshop is because Illustrator works in?vectors.?That basically means that no matter what size I want to blow up or size down my graphics, they’re going to be the same quality. With Photoshop, the program and your designs are based in pixels, which is why things can get blurry or pixelated. Even though lots of things are web based in blogging, I always like to have vector files that I know can be print quality, too. This is the reason that Photoshop is primarily used for photos and Illustrator is primarily used for graphics and illustrations.

If you are only doing design work for blogging, a fancy program like those may not be necessary. Instead you can use a free program like PicMonkey or Canva. Both have free and paid options within the apps. These are great apps for creating things like blog graphics!

Custom logo design for wedding and event planning company in Charlotte.

Getting started on a custom design

Whether you want to design your own button or even your own header, you have to start with a?concept.?This is sometimes done by coming up with a mood board for the brand itself. Especially when designing a new logo for your blog or business, you should start off by collecting images that inspire you and come together to be a part of your brand. In a recent logo design I did, I did the same thing to pull together all of the elements of the design.

Knowing what you want out of a design is essential to it being successful. Custom designs are not as simple as pulling together some fonts you love and calling it a logo. There’s always a reason for each font chosen within a logo or any sort of custom design work.

All About Those Fonts…

I’ve had a few questions asked regarding fonts. Where do you get them? How do you use them? What is your favorite?

Well… since you asked. My favorite places to buy fonts are MyFonts.com and Creative Market?(affiliate links used). I have always loved combining script and print fonts together in a design (which you can tell from almost all of my design work). You can also download free fonts from dafont.com.

Combining fonts is great, but as a rule of thumb your graphics or even your entire blog design should never have more than 3-5 fonts. It just gets overwhelming. You’ll notice I have two main fonts within most of my graphics in my posts and on my blog design. Simple and clean are always preferred in graphic design.

Commercial vs. Personal Use

When you download a font for free, you have to be very careful to pay attention to how the font is listed. On dafont specifically, you’ll see either “free for personal use” or “100% free” normally. Free for personal use means you can use it for anything that you’re not making money off of. For example, if you design your Christmas cards, you can use a free font. However, if you’re designing a blog for someone, you should probably only use fonts you have a complete license for. I’m not an expert, so I usually just try to use my fonts I’ve purchased,?better safe than sorry.?

Installation

Installing fonts is super easy and with apps like PicMonkey you can even use the fonts you have installed to your computer! Check out this FAQ section from dafont on how to install them on your computer, either on a PC or Apple.

top-fonts-for-bloggers

Favorite Fonts

Creative Market: Gracyn

DaFont: KG Eyes Wide Open, Clair Hand, Lobster, Caviar Dreams, Champagne & Limousines, Cheddar Jack, NEOU

MyFonts: Miel

Some Definitions:

Pixel- a pixel is the smallest amount of “date” an image can hold. It is one block of color and all of the pixels make up the image we see. So when you see something that requires 400×300 pixels, that’s what it’s talking about.

Resolution-?another catchphrase in the design world is resolution. You may also hear things like “pixels per inch” or “dots per inch.” These things take into effect how many dots or pixels are used per inch. Cheat sheet: Anything on the internet is 72dpi, always. For print, 300dpi is best. With programs like PicMonkey and Canva, you are not able to set your resolution as anything but 72dpi.

Button– a button is basically an ad (whether paid or a swap) that is placed on someone else’s blog to direct people to your blog. This is also referred to as an ad or banner.

Learning

There are lots of different ways to learn the various programs you might need for graphic design. You can look at YouTube tutorials, take a SkillShare?or Lynda class, or even a class in person. There are lots of ways to learn basic graphic design if you’re willing to take the time to do it.

Adding text to images

In PicMonkey, this is super easy to do. Go to picmonkey.com, click “design.” At the top click “open” and then choose a file from your computer or other location. On the right hand side, click the Tt icon to add text. Scroll through the fonts and find something you like! Then click “Add Text” and you’re on your way!

Resizing Images

One of the most frustrating things to see is a stretched or distorted image. It may seem like a difficult thing to resize an image but I promise, it’s pretty easy! Go through the same steps as above to open your image. Then click the first icon which is a crop symbol. Click resize. Notice the check box that says “keep proportions”??Do not uncheck that. That is what makes an image distorted. Resize your image to whatever specifications you need. If your image is horizontal and you need it square, go to the crop tool instead and enter in the size you need.

If you find that your image doesn’t completely fit, then create a new document (clicking design on the homepage), go to resize again and enter in the dimensions you need. Since this is a white background, it won’t distort it, so you can uncheck “keep proportions” to be able to make whatever size canvas you need. Then go to the overlay icon which is the butterfly. Where it says “Your Own” click that and insert a photo from your computer or other location. You can now use the corner tools to make your icon bigger or move it around the fit within the size you need. You may have to play with it to get a design you like, but this will ensure your beautiful graphics won’t become ugly and distorted.

And if you don’t want to do the design work yourself, you can always hire someone, like me! Take 10% off all design orders through the end of February 2015?with the code?WSID.

Make sure you check out the other parts of this series:

Blogging 101
Photography 101 for Bloggers

What other questions do you have about graphic design? Comment below and I may add them to this list for others!

Find more blogging tips on Pinterest!
Follow Madison Wetherill’s board Best Blogging Tips on Pinterest.
1.8K shares

Filed Under: blogging

Looking for more recipes?

Be sure to check out the recipe index where you can browse recipes by meal type and category!

Check Out the Recipe Index

Reader Interactions

Comments

  1. Hayley says

    November 06, 2014 at 10:54 am

    So many great things in this post, girl!! I can’t wait to implement some of these tips!

    Reply
    • Madison says

      November 10, 2014 at 11:21 pm

      Yay! Glad it was helpful for you 🙂

      Reply
  2. Jaelan @ Making Mrs. M says

    November 06, 2014 at 11:11 am

    This is one of the most helpful blogging posts I’ve read in a long time. Thank you!

    Reply
    • Madison says

      November 10, 2014 at 11:21 pm

      Awe, thanks Jaelan! I’m so glad it was helpful for you!

      Reply
  3. Ricci says

    November 06, 2014 at 11:18 am

    I love playing around with blog design!! Thanks for sharing your tips!!!

    Reply
    • Madison says

      November 10, 2014 at 11:21 pm

      Thanks Ricci!

      Reply
  4. Laura Jean Gilleland says

    November 06, 2014 at 11:22 am

    I have so been looking forward to this series! Graphic design is such a beast – especially for those who are self-taught. You are very right that everyone needs to have somewhat of a background. Thank you for laying it out so simply! I look forward to future weeks.

    Reply
    • Madison says

      November 10, 2014 at 11:21 pm

      Thanks Laura! You’re so sweet 🙂

      Reply
  5. Beth @ That One Mom says

    November 06, 2014 at 11:26 am

    I heard someone talking about a vector the other day and added that to my long list I know absolutely nothing about!!! Thanks for making it sound so simple!

    Reply
    • Madison says

      November 25, 2014 at 1:17 pm

      I’m glad you know now!! 🙂

      Reply
  6. SFM says

    November 06, 2014 at 11:50 am

    Love these tips! I’m so glad you are doing this series! It’s going to be a great tool for a newbie like me!

    Reply
    • Madison says

      November 25, 2014 at 1:17 pm

      Thanks Sarah 🙂 I’m glad it was some good information for you!

      Reply
  7. Tiffany MrsTee Haywood says

    November 06, 2014 at 11:55 am

    Wonderful guidelines and details! i am still on the PicMonkey train but I love how you broke down all the elements of a logo design. Great way to see things a bit more clearly. Thanks so much for sharing!

    Reply
    • Madison says

      November 25, 2014 at 1:18 pm

      Thanks Tiffany! PicMonkey is a fantastic resource!

      Reply
  8. Nina B says

    November 06, 2014 at 12:16 pm

    This is such a great post, especially for people who are about to purchase a blog design, or trying to learn. I need to email you about floating images on WordPress 😉

    Reply
    • Madison says

      November 25, 2014 at 1:18 pm

      Floating images?! Email me girl!

      Reply
  9. Leah Kuck says

    November 06, 2014 at 11:23 am

    This is an awesome post (definitely Pinning it!) Also – I spy lifeloveandcoffeestains.com’s font on the “top fonts list”!

    Reply
    • Madison says

      November 25, 2014 at 1:17 pm

      Thanks Leah! It was super fun to write, too 🙂

      Reply
  10. Paris says

    November 06, 2014 at 12:35 pm

    Thank you for all your great tips! I really want to go play around and create a new logo now!

    Reply
    • Madison says

      November 25, 2014 at 1:18 pm

      Thanks Paris 🙂

      Reply
  11. Rachel Walker says

    November 06, 2014 at 12:35 pm

    OH MY GOODNESS so glad you wrote this! I need to pin this so I can keep up with all of these fabulous tips! Thank you for this, Madison! Wish I had you on speed dial so I could bug you with all of my tech questions daily 🙂

    Reply
    • Madison says

      November 06, 2014 at 12:36 pm

      Girl, seriously, text me anytime!!! I would love to help 🙂

      Reply
  12. Gina Alyse says

    November 06, 2014 at 1:37 pm

    LOVE this post! It’s full of pure genius. I love it when bloggers and designers share their tips (especially their favorite fonts!) There are many times I come across designs that are not effective and I think having a good, basic knowledge like this as any professional is super important!

    Reply
    • Madison says

      November 13, 2014 at 2:45 pm

      Thanks Gina!! I’m so glad you liked it 🙂 It was super fun to write. I could talk graphic design or blogging all day 😉

      Reply
  13. Sharlee Hatch says

    November 06, 2014 at 2:00 pm

    Oh my goodness. I was just telling my husband that I would LOVE to learn how to do graphic design–for blogging but also for making up prints for around our house, designing invitations, and cards, and more. I’m way too excited about this. You had classes listed. Are you really going to teach some classes?

    Reply
    • Madison says

      November 13, 2014 at 2:46 pm

      I’m not planning on teaching classes right now but there are some awesome classes online that you can take!

      Reply
  14. Mikki says

    November 06, 2014 at 1:04 pm

    What a great post. I am ALWAYS playing around with my template. One of these days I’m going to actually have someone just do a design for me.

    Reply
    • Madison says

      November 13, 2014 at 2:45 pm

      I was the same way until I switched to WordPress and now I feel like I’m finally happy with my design. But it’s only been a few months, so we will see! For some things I think it’s just better to have someone else do it.

      Reply
  15. Nikol Murphy says

    November 06, 2014 at 2:43 pm

    Perfect timing! I am designing a new site and need to kick my skills up a notch.

    Reply
    • Madison says

      November 13, 2014 at 2:46 pm

      That’s awesome! You are always busy with something 😉

      Reply
  16. Cia | CiaSays.com says

    November 06, 2014 at 1:57 pm

    I love this. You touched on everything 🙂

    Reply
    • Madison says

      November 13, 2014 at 2:45 pm

      Thanks!! 🙂

      Reply
  17. Lisa Pray says

    November 06, 2014 at 3:51 pm

    So much info!! I’ve actually been wondering about fonts, so this is perfect timing!

    Reply
    • Madison says

      November 13, 2014 at 2:46 pm

      Great! I’m so glad it was helpful 🙂

      Reply
  18. neivelouise says

    November 06, 2014 at 8:31 pm

    So many great ideas and tips, thankyou! I am pinning this post 🙂
    I agree with the fact that no blog should have more then 3-4 fonts, totally overwhelming!
    Neive xo
    theaussieosborns.blogspot.com

    Reply
    • Madison says

      November 25, 2014 at 1:18 pm

      Thanks Neive! It definitely gets overwhelming and doesn’t look as professional!

      Reply
  19. Anne says

    November 06, 2014 at 11:06 pm

    Such useful information – thanks!

    Reply
    • Madison says

      November 25, 2014 at 1:19 pm

      Thanks Anne 🙂

      Reply
  20. Lauren | 34 Magnolia Street says

    November 07, 2014 at 8:33 am

    This is GOLDEN. Thanks for sharing, my dear!!! You are such a wealth of knowledge 😉

    Reply
    • Madison says

      November 25, 2014 at 1:19 pm

      Awe shucks! Thanks girl 🙂

      Reply
  21. OklahomaJamie says

    November 07, 2014 at 9:48 am

    Great post! Designing my blog images is my biggest time thief. I’m too much a perfectionist. I need an easy button LOL

    Reply
    • Madison says

      November 25, 2014 at 1:19 pm

      Hahaha, I can understand that for sure!

      Reply
  22. sarahsofiaproductions says

    November 07, 2014 at 10:02 am

    Madison this is very useful and I have already pinned it to use a resource later! I love that you used some of the logo designs that you did for me because they’re absolutely stunning and make a world of a difference! You’re so talented and appreciate you sharing your knowledge of graphic design with us!

    Reply
    • Madison says

      November 25, 2014 at 1:19 pm

      Thanks Sarah 🙂 They are still some of my favorites!

      Reply
  23. Lauren Flowers says

    November 07, 2014 at 10:18 am

    You are absolutely wonderful! I have been wanting to learn all about these topics and hearing them from you makes it so much more helpful. I cant wait to read more!

    Reply
    • Madison says

      November 25, 2014 at 1:19 pm

      Thanks Lauren! You got this! 🙂

      Reply
  24. cathy says

    November 07, 2014 at 11:00 am

    LOVE this, what a great informative post! Great stuff! So excited to have read this from the pretty pintastic party!
    Cathy

    Reply
    • Madison says

      November 25, 2014 at 1:20 pm

      Thank you for stopping by Cathy! I’m glad it was informative for you

      Reply
  25. Dana Haddon says

    November 07, 2014 at 11:44 am

    Awesome tips! Resizing images has always been challenging for me. Thank you!

    Reply
    • Madison says

      November 25, 2014 at 1:20 pm

      You’re not alone in that Dana!

      Reply
  26. Jenna Owens (@aSavoryFeast) says

    November 07, 2014 at 12:02 pm

    This is so helpful! I have learned some basic graphic design to help me with my day to day blogging, but I have a lot I want to learn. I can’t wait to see the rest of the posts in this series!

    Reply
    • Madison says

      November 25, 2014 at 1:20 pm

      It’s definitely a long process to learn but learning some of the basics for blogging is super important!

      Reply
  27. Teresa says

    November 07, 2014 at 12:15 pm

    Love this post! Definitely some great tips. I’m redoing some aspects of my design so I’ll definitely be referencing this.

    Reply
    • Madison says

      November 25, 2014 at 1:20 pm

      Can’t wait to see what you redo! 🙂

      Reply
  28. Michelle Farver Rumpz says

    November 07, 2014 at 1:29 pm

    Great post! Thanks!

    Reply
  29. Lemon Tart says

    November 07, 2014 at 1:56 pm

    What a helpful post. I pinned for further investigation. Thanks so much.

    Madonna
    MakeMineLemon

    Reply
    • Madison says

      November 25, 2014 at 1:20 pm

      Thanks Madonna!

      Reply
  30. Elizabeth T says

    November 07, 2014 at 4:10 pm

    You’re amazing, Madison! I had no idea you could get the Adobe programs like that. So excited for the rest of this series!!

    Reply
    • Madison says

      November 25, 2014 at 1:21 pm

      Yes! It makes it a lot easier on the wallet 🙂

      Reply
  31. Kimberly Bolden says

    November 07, 2014 at 3:46 pm

    This piece on graphic design is extremely helpful! Thanks so much for presenting this in layman terms in ways we can so easily comprehend.

    Reply
    • Madison says

      November 25, 2014 at 1:21 pm

      I’m glad it was easy for you 🙂

      Reply
  32. Stacia says

    November 07, 2014 at 7:54 pm

    Your explanation of the difference between Photoshop and Illustrator was super helpful. I use them both but never fully understood why I use which one for which thing. Thanks!

    Reply
    • Madison says

      November 25, 2014 at 1:21 pm

      Great!! I’m glad it helped 🙂

      Reply
  33. Ashley Ziegler says

    November 08, 2014 at 10:39 am

    This really helped. So many good tips!

    Reply
    • Madison says

      November 25, 2014 at 1:21 pm

      Thanks Ashley!

      Reply
  34. niki meiners says

    November 11, 2014 at 2:10 am

    great tips. I need to redo a few things now. 😉

    Reply
    • Madison says

      November 25, 2014 at 1:21 pm

      Ha! It never ends 😉

      Reply
  35. Liz says

    November 28, 2014 at 2:55 pm

    Thank you for all of these great posts! You put them into terms that even someone like me can understand 🙂 It is appreciated more than you know! Thank you!!

    Reply
  36. Kaaren says

    June 14, 2015 at 12:41 pm

    CAN YOU PLEASE TELL ME HOW TO FIND THE SIZE OF A PIN SOMEONE ELSE HAS CREATED. i HAVE ONE I LIKE THE SIZE OF BUT DON’T KNOW HOW TO DETERMINE THE SIZE THEY USE ON THEIR BLOG. HELP!!

    Reply
    • Madison says

      June 15, 2015 at 2:52 am

      Hi Karen! You simply need to save the photo from the pin on your computer and open it in any image application, like Photoshop or even the one that came on your computer. That should help you find it!

      Reply

Leave a Reply Cancel reply

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

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Primary Sidebar

Hey there!

I’m Madison. I’m passionate about helping you find confidence and joy in the kitchen through easy, delicious recipes!

Looking for something?

recently

Orange Cupcakes with Orange Buttercream

All-American Sugar Cookie Bars, the perfect patriotic dessert! Light cookie bars topped with homemade icing and fresh strawberries and blueberries. Celebrate American with this festive dessert! sugar cookie | cookie recipe | sugar cookie bar | cookie bars | july 4th dessert | july 4th recipe | independence day dessert | red white blue dessert | patriotic dessert | fruit dessert | strawberry dessert | blueberry dessert

Berry Sugar Cookie Bars

two chocolate banana smoothies on a wood board

Chocolate Banana Smoothie

Veggie packed pasta salad is a perfect side dish for any occasion. It's great for the warmer weather for potlucks outside and perfect for brightening the colder months, too! The pasta salad is made with a mayo-free dressing and packed with vegetables like cucumbers, bell peppers, tomatoes, corn and topped with feta cheese.?

Easy Pasta Salad without Mayo

LET'S GET CONFIDENT

Subscribe for tips to help you grow more confident in the kitchen!

Footer

follow along

  • Facebook
  • Instagram
  • Pinterest

Privacy Policy

 

top categories

  • holiday recipes
  • desserts
  • Main Course
  • appetizers
  • meals for others
  • breakfast
Copyright © 2022 A Joyfully Mad Kitchen · Designed by Grace + Vine Studios