Menu

Oct 2, 2014

Blogging 101: Content Loves Design

Today’s assignment: open the Customizer and try out some new fonts and colors (and backgrounds and/or headers, if you’re still undecided).

Welcome to Blogging U! This course isn't currently active, but you can learn more about what we offer and register for upcoming courses on the BU home page.

You explored themes, played with backgrounds and headers, and test-drove some widgets. Now it’s time to learn more about the ways colors and fonts change the feeling of your content to ensure that your blog’s looks are supporting its tone.

Note: the goal of this task is not to sell you an upgrade, it’s to help you understand the interplay between content and design so you can make decisions about how to display your work to its best advantage. Today is about play and exploration. 

Today’s assignment: open the Customizer and try out some new fonts and colors (and backgrounds and/or headers, if you’re still undecided).

Why do this?

  • Making a theme your own is an ongoing process that benefits from experimentation.
  • Previewing different options will help you understand how your content and your site’s design are connected.
  • A customized site that feels like yours is one where you’re more likely to publish regularly.

Unlike the simple printed page of a book, a blog’s design influences the tone and mood of your words (or images). Colors can be warm or cool, light or heavy, bold or subdued. Fonts can be elegant, playful, or stark. Some combinations are busy, others calming. All these elements can work with you words — or against them. Understanding how design elements interact with your content lets you look at your blog holistically, and use all the elements of a blog to tell your story the way you want it told.

First, find all your customizing options: open the Customizer by hovering over your blog’s name in the black admin bar at the top of your screen, and then clicking  “Customize” in the drop-down menu (to open it from your dashboard, had to Appearance → Customize). You’ll see tabs for colors, fonts, theme options, widgets, and more, depending on your theme. Update anything to see the change in real time on your blog. Click “Cancel,” and everything returns to the way it was.

Wondering what CSS is and why it’s useful? This post will help.

Some themes come with free options, like alternate color schemes and layouts, that you’ll also be able to play with in the Customizer; you can also try creating a static home page. Custom Colors, Custom Fonts, and Custom CSS are part of the paid Custom Design Upgrade, but even if you don’t plan to purchase an upgrade, you can preview changes to get new ideas about your blog’s look.

Then, we’d like you to focus on the visual elements that make the most powerful — and immediate — impact on your site’s look. Try out a new color palette or a sleek font for your blog, and see how it changes the feel and readability of your content. You’d be shocked by how radically different your posts will read in different fonts. With colors, you can change your blog’s vibe by experimenting with different palettes, from hushed grays to in-your-face purples. If you have the Custom Design upgrade, click “Save” to lock your changes in place.

Even if you end up where you started or are only able to preview, you’ll have gained insight into the ways your content is best displayed, and how your posts and your design feed off off each other. You might come away with new ideas about your header or background, a way to use photos in your posts to create an emotion, some image widgets you’d like to change, or a sense of how to better arrange your sidebar.

This is a great day to see feedback in The Commons — getting an outsider’s perspective on the feeling your blog gives off is invaluable.

Show Comments

52 Comments

Close Comments

Join the conversation!

Fill in your details below or click an icon to log in:

Gravatar
WordPress.com Logo

You are commenting using your WordPress.com account. ( Log Out /  Change )

Google photo

You are commenting using your Google account. ( Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. ( Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. ( Log Out /  Change )

Cancel

Connecting to %s

Comments

  2. Thank you! I was wondering how to get different fonts! I will have to be a bit late in exploring this because I have guests this weekend but… I have honestly been wanting to learn where to change that font! the default one bores me t tears! Thank you!

    Liked by 2 people

    Reply

  5. So changing font color and style is not available on the Free themes? Thanks for the great ideas although I tend to get caught up in the “decorating” of my blog (window treatments, painting and carpeting) and forget to furnish it with actual people….like me and my writing voice! 😉

    Liked by 1 person

    Reply

  7. I’m constantly changing things. I have been considering the CSS upgrade in addition, however. I’ll learn more and toy around with it and hope to not break anything lol.

    Like

    Reply

    1. I don’t believe so — you work with/choose from the fonts within the Customizer. More on Typekit: http://en.support.wordpress.com/custom-design/custom-fonts/#changing-fonts

      There are ways to use other fonts (ie, creating your own header image and/or image widgets that use these fonts) although that requires a bit more know-how and use of image editing tools.

      More resources:
      – Creating your own image widgets: https://dailypost.wordpress.com/2013/03/20/widgets-201/
      – Looking for/using free fonts: https://dailypost.wordpress.com/2014/09/18/five-quick-ideas/

      Like

      Reply

    1. You changed the design? It’s really really impressive now. But (I already understood that you took advice without getting offended:):)) the header image – your blog is about fashion and fashion is about images – so I would put something so strong, that a reader would be hooked from the first sight. Maybe a pic with a little bit of red? But again, I do not know what this picture means to you, maybe it is something very valuable or brings some memories – just stay with it then 🙂

      Liked by 1 person

      Reply

      1. Oh Thanks for the feedback again! Nah I did not get offended at all..!! Infact I love hearing feedback and things I can improve on! Yes I’ll definitely change the picture! Doesn’t mean much to me anyways! Thanks again for your feedback- Much appreciated!

        Liked by 1 person

      2. I think I’ll follow you, you are so nice and I don’t know anything about Melbourne (but luckily something about fashion) 🙂 I was thinking about making a fashion blog for ordinary people, because all this fashion blogs are great but I can’t buy myself Dior… but never had time to realize the idea 🙂

        Like

  11. Hi @MichelleWebber and @CheriLucasRowlands, does the Greyzed theme not support this customization? I have tried to do it before, tried it now, but the only option that seems to be available to be is the paid for customization…

    Like

    Reply

  16. Ack! this has been my least favourite task so far! I did the customise thingie and OMG! the options made my blog look super amazing!…but its only if i can upgrade and now i have to deal with my inner voices debating the merits of buying an upgrade for a hobby blog that will never generate income versus artistic visions…..which bodes the question; is an upgrade worth it for a hobby blog?

    Liked by 1 person

    Reply

    1. I would suggest so: it is worth is you have a certain number of followers. You can set up a threshold for example 300-400 follower or what you’d like. When you have so many people reading you it becomes more than just a hobby 🙂

      Liked by 1 person

      Reply

  18. My themes don’t let me change the font, just the color in one of them. This is what I choosed: nadaenlamaleta.wordpress.com and comocreartussuenos.wordpress.com 🙂

    Like

    Reply

  19. What’s the consensus on fonts? I believe they should go with the feel of ones blog, but could too “cutesie” fonts can discredit the writing or be too annoying to read? I haven’t explored all the fonts yet. Just looking for feedback on fonts. Thanks community! 🙂

    Like

    Reply

    1. I think even the simpler fonts have subtle differences that make a big impact on the aesthetic of your blog – ie. san serif or serif fonts, the width of each letter, whether it’s more modern or gothic. I think you can choose a simple font that’s not so jarring but still show off you style and taste.

      Liked by 1 person

      Reply

    2. Font definitely affects the reading experience, and I agree that some fonts are distracting, or might be “playful” but end up looking odd on a site you’re trying to use for professional reasons, for example.

      Like

      Reply

  20. I tried a few different themes but i the end I just wanted one that was nice and simple. I would like some feedback if anyone can take a look corrosiveteapot.wordpress.com

    Like

    Reply

  23. I love my theme, fontfolio, but I am so keen on customised text and image widgets now that I want to introduce a sidebar to my front page. Problem is, fontfolio doesn’t support that. I love everything else about it, but I want this added extra. Any idea out there? Take a look http://wraptweaving.com/ – the gallery front page is great, but adding some social media sharing buttons would be greater!

    Like

    Reply