10 Essential Blog Design Tips for Beginner Bloggers
Last month, I was invited over to St. Paul Manila to be one of their guest speakers for the very first every Blog’O Speak Manila. A convention where selected bloggers and media practitioners impart their knowledge on their craft. I talked about how to jump start your blog. This week I received an e-mail from one of the guests asking for design advice since she’s a beginner blogger.
Trivia: I’m not sure if a lot of you know but before I was blogging “mainstream”; I started out as a freelance web designer back in 2001 and owned a blog/web design shop. called “kikaypixels.com” It’s a place where I create a different layout every week because that was the rage back in the day and keep screenshots of it. I’m sad the screenshots got lost in a burned CD but it’s okay their memories remain in my heart.
Hi, Ms. Kaycee! I’m Sophia Dadula. I attended the Blog Convention (and appeared briefly on one of your Snapchats, if you remember *hello*) and I was impressed with your presentation because you’re the only speaker who mentioned the intimidating part of blogging, at least for me: web design. I have been wanting to start my own blog since I was in highschool, and I’ve attempted to make an advice blog on Multiply because they have templates you can use but it didn’t catch on since nobody seemed to come seeking an advice or something. I moved on to WordPress but I got intimidated with other users who seem to know exactly what they’re doing. I visited your blog a day after the convention and can I just say you had 100% of my attention and I just kept clicking on links (the filters are my fave *wink wink*). So anyway, I’ve decided to put my foot down and start a blog – again. I love writing, and I don’t care much about having readers right away. I have a private blog on Evernote – more like a diary, tbh – so I didn’t think I’d need to design it but then when I decided that I wanted to bring my writing to the public, I was essentially dumbfounded ’cause I didn’t have any idea where to start, especially since there’s layout, fonts, and what not. I just want to be able to present my work creatively, web design-wise. Since you’re practically a prinCSS (see what I did there? hehe), I was wondering if you could help me out with choosing a web design that’s dummy friendly or a site that’s easy to navigate. I’m all for being minimalistic, but being able to understand what’s out there for me to use would be a great way to start. I do hope you have the time to answer to my sad, sad search for help. I’m in my fourth year at St. Paul Manila taking Mass Communication, btw.
Thank you so much! More power to your blog! (that I now cannot stop reading, honestly!)
Hi Sophia! Here are 10 tips I came up with based on my 10 years experience in blogging and a bit of research. I hope this helps and others like you who are starting up their own blog. Good luck and always remember “Never forget your roots” 🙂
#1 Decide Your Design According to Your Goal
The purpose of design is to get your website to convert towards your goals. That’s it. Everything else comes secondary.
How do you do that?
You need to have a visual hierarchy that leads to a call to action. In simpler terms, feature a headline or a series of headlines that end in a call to action. Then put this headline/call to action duo in the places that people see the most (i.e. top of homepage, top of sidebar, bottom of posts, etc.).
#2 Use 2-3 Fonts at Maximum
At most, use one font for your logo, one for your headlines, and one for your body content.
Any more and your blog’ll look messy.
#3 Pick Perfectly Matching Color Scheme
and match it to your #1 (Goal, Personality). Along with limiting your color scheme, your primary and call to action colors should complement one another.
To find scientifically matching color schemes, start with your primary color and find supplementary colors with ColorSchemeGenerator.com.
#4 White Space
Aside from effectively using padding and margines, the best way to embrace white space is to simply get rid of everything that doesn’t contribute towards accomplishing your goals.
Do you really need that tag cloud? No, you don’t. Nobody uses those.
#5 Use 1-Pixel Borders
Borders help to clean up your design and to visually separate different sections. Use 1-pixel borders because they’re clean and crisp.
#6 Choose the Right Typography
Typography plays a big role in creating visual hierarchy and contrast. One quick tip is to use multiples sizes. Pick your lowest font size first and go from there. If your smallest is 12px, which is the body copy, then use 24px for the heading and 48px or 72px for the title. This is the sort of methodology I recommend.
You should also minimize your use of font weights to two or less. For example, use bold for headlines and light or regular for copy. The more font weights you use, the more chaotic it gets for the reader to interpret.
#7 Keep it Simple
I’m sure you’ve heard this from many people, but just to reinforce – simplicity never fails. When in doubt – subtract. That’s the best design advice I’ve ever gotten. Make it easy on your audience. Don’t let it get too cluttered.
#8 Use High Quality Photos
These days every website has a style of photography they use. To match that on social or other marketing collateral, you need to pick the right photos. Make sure you keep resolution high but not so high that your site loads slow. I recommend a 720px width on PNG format
Can’t decide which editor? Use VSCO! I use it for my blog photos too. The perfect filter? I made a cheat-sheet for VSCO filters just for you!
#9 Avoid Over Usage of Widgets
Sure, that “share button” looks tempting to put in but using too much will annoy your visitors instead of impress. Use these tools sparingly.
Ex. Shareaholic, AddThis, Adsense, Facebook, Twitter, Instagram
#10 Keep it Consistent
Finally, it’s important to keep your design elements consistent. For example, if you’re using one style of button on one part of the page, make sure you use the same style on the rest of the page or document. If you’re using photography in the header of the page, make sure you keep it consistent with the rest of the art assets.
Links to Design Essentials
http://www.designsrazzi.com/2015/free-blogger-templates/Â – For all the BEST layouts you can choose from
http://www.w3schools.com/Â – Learn the CSS and HTML essentials
htp://www.canva.com – For the most awesome graphics for your blog!
🙂
You May Also Like
How Parents Can Help Their Teen Study For Their Driver’s Permit Test
REAL REVIEW: Shiro Waki Hime Underarm Whitening Cream (2024)
