After reviewing this week’s reading I was very keen to make a few changes to my blog to increase the readability and to encourage visitors to view more content and stay on my site longer.
I’ve narrowed my thinking down to 3 small things I can do that will hopefully make a big impact.
Better use of graphics and GIFs
A look at some of my older posts will present you with walls of text and little supporting graphics or GIFs.
I’ve just started creating some very simple graphics with my iPad, Apple Pencil and Notability. Check out the introductory image for a rough example of what can be done in just a few minutes. I’m keen to learn more and hope to spend some time during this course thing about how I can use these tools to improve the visual appeal of my blog with user-created graphics. If you have a favorite resources, please share them in the comments!
A new logo
My old logo, seen below, was a direct copy of my diving logo (see Matt Broughton Diving). I was a bit lazy and just changed DIVING to COETAIL.
While I’m still like the overall design, I’ve decided to make a few changes:
- Remove the diver silhouette
- Add a educational-themed image on the right
- Make changes to the colors (white on transparent background)
Remove the diver silhouette
This one was easy. Thankfully I kept the Illustrator file so it was only a quick delete from the last revision.
Add a educational-themed image on the right
My first stop when I’m after an icon is The Noun Project. I’m so foud of it that I’ve signed up for the NounPro, which gives me a royalty–free license for any icon I need. It also offers some simple built-in editing features which means I don’t need to open Illustrator to just change a few colors. Educators can sign up for NounPro for half-off the yearly subscription.
I really value the connections that COETAIL offers, so I’ve decided to start off with a connections-inspired icon.
Make changes to the colors
Currently my logo is white on a transparent background. I like using a transparent background as I can just make changes to the header using CSS, however this causes a few issues when COETAIL links to my blog on Facebook.
Facebook automatically pulls the first image on the page for the post preview image. A white logo with a transparent background makes it very hard to see. To fix this I’m going abandon the transparency and just use the background blue on the image.
I wonder if I set a ‘feature image’ if Facebook would pull that image instead of my logo? I’ll try it on this post as a test…
Connections to social media
Flynn and I spoke this week about how to add more dynamic content on our blogs. One idea we came up with was to insert a Twitter widget in the sidebar to allow readers to see a bit more of the day-to-day.
I thought embedding a Twitter widget was going to be easy, but I was very wrong.
I first attempted to use Twitter’s Publish tool that allows you to easily create a script that can be embedded into most websites. This was easy and offered a bit of customization, but unfortunately I can’t embed a script in a ‘Custom HTML’ widget on the WordPress network we are using (which is a bit understandable when try to prevent malicious code off COETAIL sites).
The next idea was to dig into the available plugins on our WordPress install. The Twitter Widget Pro WordPress plugin is available, so I enabled it, found the widget and moved it to my sidebar.
Again, no luck. I headed over to the setting page to add my account when I hit a roadblock – I need access to the Twitter APIs to add my account. To access the APIs, you need a Twitter developer account. So, I’ve signed up (with some interesting answers to some of the questions) and am now waiting for my application to be reviewed and approved.
I need your help
As a reader of my site, I’d be very keen to hear from you about ways I could improve the design of my site. Leave me a comment on what you think would make my site shine!