Monday, July 14, 2014

Improve Your Blog Layout Right Now

I'm going to give you some helpful tips for blogging that I've implemented on my own page recently. They don't include be yourself and write what you know. These are nuts and bolts tips concerning overall layout and formatting. I use blogger, so some of the specific instructions are geared towards that, but the tips are general.

Custom Social Network Links:

Your audiences is not going to hunt every page for links to follow you. I created the icons above to bring attention to the links. Create a  javascript gadget on the template page.
You will need to modify and add the code below. I sourced the code from here.
<div style="clear:both; text-align: left; float: left; padding-bottom: 10px;">

<a href="" style="text-decoration:none;">
<img src="" alt="Add WardWorks on Google +" style="border:0;width:48px;height:48px; margin-left:5px; margin-right:5px;"/>

<a href="" imageanchor="1">
<img src=""  alt="Like WardWorks on Facebook" style="border:0;width:48px;height:48px; margin-left:5px; margin-right:5px;"/>

<a href="">
<img src="" alt="Subscribe to WardWorks on YouTube" style="border:0;width:48px;height:48px; margin-left:5px; margin-right:5px;" />


About page
Pages now shows up below Posts. Provide some information to your audience about what you do and why. This page puts a face to the voice, so be sure to have a picture. It's tempting to add a cartoon or an object, but your audience will connect better if it's an actual picture of you.

Go to your Template and add a gadget for Configure Pages.

Contact page.
Your audience may want to contact you to thank you or to ask a question, make it easy for them and add a contact page. Go to Pages, click HTML, and post the following code:

<form name="contact-form">
Your Name:<br />
<input class="contact-form-name" id="ContactForm1_contact-form-name" name="name" size="30" type="text" value="" />

Your Email:
<span style="color: red; font-weight: bolder;">*</span><br />
<input class="contact-form-email" id="ContactForm1_contact-form-email" name="email" size="30" type="text" value="" />

Questions?: <span style="color: red; font-weight: bolder;">*</span><br />
<textarea class="contact-form-email-message" cols="25" id="ContactForm1_contact-form-email-message" name="email-message" rows="5"></textarea>

<input class="contact-form-button contact-form-button-submit" id="ContactForm1_contact-form-submit" type="button" value="Send" />

<br />
<div style="max-width: 222px; text-align: center; width: 100%;">
<div class="contact-form-error-message" id="ContactForm1_contact-form-error-message">
<div class="contact-form-success-message" id="ContactForm1_contact-form-success-message">

You should have already added a Configure Pages gadget. Add the contact page to the list.

Change your favicon icon:
The favicon icon shows up in the browser on the web site tab. While a small detail, it looks professional to change the default image. Go to Layout, if you don't already have a favicon gadget, add it now. The image you upload needs to be square and less than 100kb.
Click edit for a prompt to upload your own image.

Cross link:
Link to facebook, google+, and youtube provided you have accounts. You must update these accounts regularly, or else don't bother linking to them. If people click your facebook page and don't see any posts, they will assume your account is inactive.

You can add links in a gadget on your layout or provide links at the end of your posts. It needs to be easy to subscribe. You have to put in the the work, not your audience.

Subscribe call out:
Change your Subscribe call out to anything else. Get Tips or Get Updates, something that is true and conveys benefit to your audience. Most people see Subscribe and know to ignore it.
Change it to anything but Subscribe.

Jump Breaks:
This tool is specific to blogger. It's in the row of the tools at the top when you are making a new post. You want to catch the audiences attention and have them click the link, or scroll down and immediately see another interesting article. A long article could cause the audience to leave before interacting with your site or scrolling down to the next article.
Position the cursor and click the tool to insert a break.

Include images and/or video in every post. Your text will be skimmed, your images won't. Remember, you can't do an image search and add images at will to your blog. These should be images you created or captured.

Labeling your blogs will allow your audience to filter posts based on that label. If your labeling is inconsistent, your audience will miss out on viewing pages. You can create a link to filtered labels to easily bring up a series of blog posts. Add the string of blue text below to your url. This can point your viewers to a topic or a particular series with one link instead of multiple.

Page Not Found/404:
 It's simple, but can help people stay on your site. While you cannot edit the HTML on blogger, you can customize the page text by going to Settings>Search preferences, and then click edit next to Custom Page Not Found. Point the reader to your search, your top posts, or archive pages.

Custom Redirects:
If you remove an old post, use a custom redirect to point the viewer to a new post or your new page. Go to Settings>Search Preferences, then click edit next to custom redirects. You will need to insert the old URL and the new URL.

Google Analytics
 Create a Google Analytics account if you don't have one already. After filling out a form, you will generate an Analytics Web Property ID, go to Settings, Other, Google Analytics and add the ID. If you're just starting out, it is overkill but stats are fun to analyze, right?

Google Webmaster Tools:
Go to the webmaster tools site and insert your site's URL. This tool can help find broken links, directing you to the offending URL.
Visit blogs you like/subscribe to and review their layout. What you like, what you don't, and consider why these things don't work and how can you change your blog.
Blogger Widget