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 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!
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.
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!
Follow Madison Wetherill’s board Best Blogging Tips on Pinterest.
Hayley says
So many great things in this post, girl!! I can’t wait to implement some of these tips!
Madison says
Yay! Glad it was helpful for you 🙂
Jaelan @ Making Mrs. M says
This is one of the most helpful blogging posts I’ve read in a long time. Thank you!
Madison says
Awe, thanks Jaelan! I’m so glad it was helpful for you!
Ricci says
I love playing around with blog design!! Thanks for sharing your tips!!!
Madison says
Thanks Ricci!
Laura Jean Gilleland says
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.
Madison says
Thanks Laura! You’re so sweet 🙂
Beth @ That One Mom says
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!
Madison says
I’m glad you know now!! 🙂
SFM says
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!
Madison says
Thanks Sarah 🙂 I’m glad it was some good information for you!
Tiffany MrsTee Haywood says
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!
Madison says
Thanks Tiffany! PicMonkey is a fantastic resource!
Nina B says
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 😉
Madison says
Floating images?! Email me girl!
Leah Kuck says
This is an awesome post (definitely Pinning it!) Also – I spy lifeloveandcoffeestains.com’s font on the “top fonts list”!
Madison says
Thanks Leah! It was super fun to write, too 🙂
Paris says
Thank you for all your great tips! I really want to go play around and create a new logo now!
Madison says
Thanks Paris 🙂
Rachel Walker says
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 🙂
Madison says
Girl, seriously, text me anytime!!! I would love to help 🙂
Gina Alyse says
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!
Madison says
Thanks Gina!! I’m so glad you liked it 🙂 It was super fun to write. I could talk graphic design or blogging all day 😉
Sharlee Hatch says
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?
Madison says
I’m not planning on teaching classes right now but there are some awesome classes online that you can take!
Mikki says
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.
Madison says
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.
Nikol Murphy says
Perfect timing! I am designing a new site and need to kick my skills up a notch.
Madison says
That’s awesome! You are always busy with something 😉
Cia | CiaSays.com says
I love this. You touched on everything 🙂
Madison says
Thanks!! 🙂
Lisa Pray says
So much info!! I’ve actually been wondering about fonts, so this is perfect timing!
Madison says
Great! I’m so glad it was helpful 🙂
neivelouise says
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
Madison says
Thanks Neive! It definitely gets overwhelming and doesn’t look as professional!
Anne says
Such useful information – thanks!
Madison says
Thanks Anne 🙂
Lauren | 34 Magnolia Street says
This is GOLDEN. Thanks for sharing, my dear!!! You are such a wealth of knowledge 😉
Madison says
Awe shucks! Thanks girl 🙂
OklahomaJamie says
Great post! Designing my blog images is my biggest time thief. I’m too much a perfectionist. I need an easy button LOL
Madison says
Hahaha, I can understand that for sure!
sarahsofiaproductions says
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!
Madison says
Thanks Sarah 🙂 They are still some of my favorites!
Lauren Flowers says
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!
Madison says
Thanks Lauren! You got this! 🙂
cathy says
LOVE this, what a great informative post! Great stuff! So excited to have read this from the pretty pintastic party!
Cathy
Madison says
Thank you for stopping by Cathy! I’m glad it was informative for you
Dana Haddon says
Awesome tips! Resizing images has always been challenging for me. Thank you!
Madison says
You’re not alone in that Dana!
Jenna Owens (@aSavoryFeast) says
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!
Madison says
It’s definitely a long process to learn but learning some of the basics for blogging is super important!
Teresa says
Love this post! Definitely some great tips. I’m redoing some aspects of my design so I’ll definitely be referencing this.
Madison says
Can’t wait to see what you redo! 🙂
Michelle Farver Rumpz says
Great post! Thanks!
Lemon Tart says
What a helpful post. I pinned for further investigation. Thanks so much.
Madonna
MakeMineLemon
Madison says
Thanks Madonna!
Elizabeth T says
You’re amazing, Madison! I had no idea you could get the Adobe programs like that. So excited for the rest of this series!!
Madison says
Yes! It makes it a lot easier on the wallet 🙂
Kimberly Bolden says
This piece on graphic design is extremely helpful! Thanks so much for presenting this in layman terms in ways we can so easily comprehend.
Madison says
I’m glad it was easy for you 🙂
Stacia says
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!
Madison says
Great!! I’m glad it helped 🙂
Ashley Ziegler says
This really helped. So many good tips!
Madison says
Thanks Ashley!
niki meiners says
great tips. I need to redo a few things now. 😉
Madison says
Ha! It never ends 😉
Liz says
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!!
Kaaren says
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!!
Madison says
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!