Course 3, Week 1: Visual Hierarchy

One of the ways that I learn best is through visuals. As a teacher, I always try to make important details stand out in the anchor charts that I make for my students, by using color, shapes, and sizes of text. I tried to incorporate this into all of my previous blog posts, even before I learned about visual hierarchy from this week’s articles. I already subconsciously knew how I wanted to organize the text and images in my posts. However, it has been a bit frustrating because there are a few parts of my vision that I have not been able to implement on my blogs.

According to the 6 principles of visual hierarchy for designers, typeface is an important factor to consider when designing digital media. I wholeheartedly agree. I have been frustrated with not being able to choose which font style my blog posts are in, except to choose the size and whether I want words to be in bold or italics.

How would I change my blog if I had no limitations?

I wish writing the blog posts in WordPress was more user friendly. I would want to be able to move things around more easily within my blog posts, and be able to have more choices when it comes to the font. What I mean is that I would want WordPress to be more like a Google Doc, because Google Docs are easier to manipulate and customize.

What change(s) did you make to your blog?

As I mentioned above, I have been frustrated with the limitations on what we can change in the way our WordPress blog looks. Because of this, I kept putting off this assignment. This past week, I read Andrea’s and Holly’s blog post, out of curiosity, and then I decided that it was time to try working on how my blog looks.

These photos show how my blog looked before I made any changes.

My blog’s background was white, and the text was black, except for a few key words which I had figured out how to change to a different color.

The header photo for my blog was the one that came with the blog theme. It did not have anything to do with me.

My blog theme was called Twenty Seventeen, which is the theme that it was set to when I started my COETAIL courses.


The first thing I changed was the blog theme – I changed it to Twenty Sixteen, because I liked the thick border around the entire page. After changing the blog theme, I changed the color scheme for my blog.

I chose a dark green for the border color (or background color as WordPress calls it) and a light yellow for the page background color because these are two of my favorite colors and also because I like contrasting colors, putting a dark color with a light color. For the color of the links, I chose purple to make it pop against the yellow background. I stuck with black for the main text color and chose a cornflower blue for the secondary text color.

With the new blog theme that I chose, the generic header image is gone. I used Google Slides to make a new header image. I first made the slide size match the pixel size requirement for the header image (1200 x 280 pixels) in order to know how much space I had to work with. I then did a Google image search for “COETAIL” and “Google for Education certification” to find the images I wanted to have in my header. I then downloaded the Google Slide as a JPEG and uploaded it to my blog dashboard.

The top of my blog looks like this now:

One more thing that I wanted to change with my blog was to make separate pages for each COETAIL course. I watched this YouTube video, How to Add a New Page on Your WordPress Menu or Navigation Bar, and then I added a new page for each COETAIL course on my blog dashboard for Course 1. On each course page, I listed the titles of each blog post I wrote for that course and linked them to the actual blog post. These pages can be found at the very top of my blog page, to the right of my blog header.