Menu

Blogging 101, Day Fifteen: 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).

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?

  • Because making a theme your own is an ongoing process that benefits from experimentation.
  • Because previewing customization options will help you understand how your content and your site’s design are connected.
  • Because 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 ColorsCustom 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

164 Comments

Comments are closed.

Close Comments

Comments

  1. I agree with today’s tips. Although it’s really hard to physically implement your changes without the design upgrade, messing around with your options can really give you a better idea on how your blog is best displayed.

    Sometimes, when I upload a featured image for my post, it won’t look right because the design of my theme doesn’t really complement and go well with the featured image. What I’ll do will be the try out different pictures with varying degrees of ‘warmth’ (like ice cold blue, warm fuzzy orange, vintage feel, or black and white etc.)

    Maybe after you’re done with today’s task, you can ‘forsee’ how best to display your blog by opening up a Word/Pages document and inserting photos into a background that is the color of your blog. this way, you wouldn’t need to waste time testing out everytime you write a post, and you’ll be able to make judgements/decisions more efficiently in the future.

    Another thing you can try will be to play around with the weights and color of the default font you’re given. You can see how best to incorporate an italic version with a bold version, or how a bold version complements a body copy of regular text. To give it more dynamism, why not play around with the styles of your font? (Heading 1, Paragraph, Heading 2, Heading 3 etc.) Colors are nice as well. You can always go online to search for color palettes. for me personally though, since my background is white, I’ll opt for a grey palette, with the basic white, black, and different shades of grey.

    About 50 of them if I’m not wrong.

    This way, you might get another dimension with the design of a plain chunk of text. Sometimes things get boring without variety, and you’ll be really tempted to purchase an upgrade to have more options for your font choices, but more often than not if you fully play around with your font and utilise all the selections given to you by WordPress, it should already be more than enough.

    Haha sorry for the long post once again. Just some suggestions of what ya’ll can do to further today’s learning because it seems like the task don’t really require that much time relatively today, and that not everybody will end up purchasing the design upgrade, so this set of activities that I do frequently will make today’s task more relevant should you decide not to purchase the upgrade.

    Take care guys! Link me to your blogs after you’re done :)

    (My blog is http://LhuWenKai.com)

    Like

    1. I like your content. Is there any way to make the paragraphs more narrow? At least on my screen, the sentences go from one side of my screen to the other, making it harder to read. Just a thought.

      Like

      1. Your page looks great! I love the bright colors and the layout of nutritional information. The whole blog is just really attractive – good work! Thanks for stopping by my page. :)

        Like

      1. Oh yeah, I’m definitely learning as I go along and the challenges come. It’s been an interesting experience so far. Your blog looks nice too. The set up is really unique. Thanks for your feedback! :)

        Like

  2. I’ve done a lot of the customization, but not able to change the fonts. I’m using the fictive theme and I guess changing font is a paid feature. Any inputs will be appreciated. I basically want to change the font size of my titles. I think they look too big. Thanks!

    Like

    1. I’m using fictive too…it’s a great theme, but I’m discovering it’s a little restrictive. I love your header. I’m looking at your site on my iPad, so I know it shows up differently, but I don’t have an issue with the size of your titles.

      Like

    2. Yes, changing the fonts is a paid feature. But you can preview the font changes for free. I just did that and decided it was worth the $30 investment.

      Like

      1. Good to know that. Not sure that I want to pay for fonts right now. I’ve started blogging recently and want to be sure that this is something I’ll continue for a while :)

        Like

    1. YOUR THEME IS GOOD BUT THE MAIN HEADER IMAGE LOOKS WAY TOO BIG.. OVERALL A GOOD BLOG. WHY DONT YOU CHANGE THE NAME TO YOUR CATEGORIES AND ARCHIVES..HAVING A DIFFERENT NAME FOR CATEGORIES AND ARCHIVES, CAN DEFINITELY ADD SOMETHING NEW TO YOUR BLOG.. :)

      Like

  3. Ok… Great challenge. I am going to try this on all of my blogs. I did it for a blog that I do out of sheer enjoyment, that is not linked to my others http://moviesinmyview.wordpress.com. I used picmonkey (finally) and loved it. I will have to play with my other blogs now!

    Thanks for the ideas, Michelle. I’ve learned so much already.

    Like

    1. i LIKE YOUR BLOG, THE HEADER AND BACKGROUND IS JUST GREAT. I THINK YOUR BOTTOM BAR BEING IN BLACK COLOR IS JUST KINDA OUT OF PLACE.. BUT OVERALL I AM QUITE IMPRESSED :)

      Like

  4. Hi, I just finished participating in Blogging 201, but I’ve been following 101 everyday and this seems to be more my speed! Now that 201 is over, would it be possible for me to try to catch up and join 101, too?

    Like

  5. I am still catching up – some health challenges brought some friends to play which has slowed me down for now.

    I have tried different themes.
    I have tried widgets / customising / fonts.
    I have a header image that needs some work before posting.

    But I will leave it in it’s stark simplicity for now. But I will leave things to cook and hopefully, like Goldilocks and the Three Bears, I will get it “Just Right”. :-)

    Mac – http://adventureswithhorace.wordpress.com

    Like

    1. I look forward to seeing the various changes you’ve been working on! To me it is like magic to watch things develop day by day. It will be even more like magic to have it in its simplicity one day and in its glory another! And both are good.

      Like

  6. I was supposed to use the Piano Black Theme and I loved it except the small font size for my content and the black menus which don’t fit my header… Instead of upgrading, I just searched for other themes ’til I found what suits me. :P Although, in the future, I would really like to try the other custom options…

    Like

      1. Yeah! :) I actually made a little change with my header… Can you say your opinion about it? It was originally my plan but I just figured out how to do it… I added an effect on it but I dunno if people who like it before will still like it.. hehehe

        Like

    1. I love your blog. It looks great! I especially liked the header.

      I also read the article and thoroughly enjoyed your story. I’m so glad you made the effort to get the discounted bill. What a difference it made. A friend of mine was recently able to get most of his hospital bill waived. He is so happy.

      I loved your pictures of the food too. I would like some now! :)

      Like

      1. Hey, thanks! :) I actually made a little change with my header now but I dunno if people who have seen it before will like it… I need opinions. :)

        Like

    2. Did you make the change in your blog header before or after I saw it. I haven’t only seen it once so if it was afterwards I’m not sure what the difference is. I still LOVE it!

      Like

  7. I truly fell in love with my theme on the day we were assigned to try different themes, and I customized all of the options I was given at that time. The one thing I’m unsure of is whether I should keep it the way it is, with no sidebar for widgets unless the reader clicks the link that says “view more” and comes to more blog posts, or if I should choose a static front page that allows for a sidebar with unlimited widgets. The problem with using a static page instead is that I then lose my quote and the four widgets that you see prior to the blog posts, which is one of the aspects I love about the theme. Would love feedback. Thank you.

    Like

    1. I don’t remember seeing that theme before but I like it. I love how you flow into the rose background. Your blog is beautiful as it is!

      Like

  8. Looking on the theme I have at the moment, I feel like there’s nothing to change on it ever. I love its combination of white and gray and to be honest, it bears a resemblance to the overall look (including my contents) of my blog. So I think, I am all good for now and skip this task.

    Like

  9. This is so important. In this fast-paced life, it’s the visuals that really grab you and stop you in your tracks. I think I’m much more drawn to visually-appealing blog than a wordy one.

    Like

  10. I agree that content plays a very important role in blog appeal. Half the reason I started blogging, is because I enjoying designing a theme that represents me. I also believe perfection of design comes from experimentation. I cannot tell you how many times I designed a webpage and the next week, completely redid it because I felt something was off. Visual elements attract people in to want to read the copy, intertwining their success. As always, even playing around with the content will teach a user new simple ways to improve their blog.

    Like

  11. I really wanted to use the Spun theme for my blog but I figured it might not be too user-friendly especially for non-bloggers? So though I really liked the concept of the theme, I decided to use Adelle and actually, the overall look of the theme is already fine with me. But will probably try to customize some other stuff later within the day, for this assignment. :).

    Like

  12. hi there! i changed the fonts of my blog today and i’m quite happy with them for now, especially i wasn’t so sure about them before. updated my widgets in the sidebar, too :)
    what do you think?

    Like

    1. Loving those hand-drawn illustrations, Julzalicious! Repeating one as your avatar is a great way to help new readers recognize and return to your blog.

      Like

      1. thanks, Easter Ellen! I took a look at your blog and I loved your message. Its a calm place to stay and read for a while, especially because of with the gentle colors and the clear font.

        Like

    1. Hi,
      Maizymilo,

      I like the orange in the background..Also all the colors seem to go together very well..
      Overall great choice of color and your graphic header is quite good..It all feels very welcoming.. :)

      Like

  13. I’ve choosen a theme with a background colour. As I have a photo/photo inspiration blog I’m not sure if the colour might “mismatch” the pics? I’ve had nice comments that it’s ok, but I appreciate more feedback. :)
    Thanks in advace.

    Like

    1. This is one of the best backgrounds and pages I have seen in a while. I would not even ask you to work on this assignment ..hahaha.. Just could not have been better :)

      Like

  14. I love customizing my blog. I used to do it frequently because I was trying to find what I liked the most as far as how my bog looked. about four days ago I customized it again…I think it was during the day we wee told to add or customize our blog widgets. i have decided that with todays assignment I am going to stay with my most recent changed to theme and such. I lo forward to browsing through and checking out some of my fellow bloggers changes.
    feel free to visit. http://jennjenn388.wordpress.com/

    Like

    1. Hi,

      I like your background and how it sotta fades away into and merges into another color, is just great. I think I would prefer a header image just to add a great vibe to the blog, but again its your personal preference. Otherwise like the color combination you have chosen :)

      Like