Tag: html

10 things I’ve learned in a year of blogging

Number One

I started this blog one year ago today. When I published the first post I was very unsure about whether I would be able to commit to blogging on a regular basis but now can’t imagine not doing it. It has become an extension of my brain – a place where I can explore ideas; share experiences and reflect on my learning. As an educator the learning never stops and a blog (IMO) is the best way to document and focus the learning experience. Along the way I have learned a lot about blogging and so I’ve decided to share some of what I’ve learned, today, on my blog’s birthday. Here goes:

1. It’s what you write that matters

The most important feature of your blog is what you write. I know that this sounds obvious but I can attest to the fact that it is easy to get bogged down in worrying more about the look and feel of your blog than the content you are putting out. My advice? Find a blog theme that is clean and offers your readers a clear reading experience. Stick to sans-serif fonts and a high level of contrast between the text and your blog background. Don’t obsess about images, buttons and other features. Focus on the writing and the rest will follow. After all, the people who will become regular readers of your blog will not care about the way your blog looks. In fact the people who become return visitors will probably subscribe by RSS and therefore not even read your blog via your actual site. Pick interesting topics to write about. Find your own writing style. And don’t be afraid to borrow from others while you are finding your own voice.

2. It’s okay to post at your own pace

Starting a blog can be intimidating. Particularly when you see that some bloggers post at least once a day, sometimes more. I originally set out thinking that I would blog at least five times a week but I quickly realised that for me this was unrealistic. I have settled into a far more organic rhythm publishing an average of six posts a month. How often I post is affected by a number of factors but mainly by my workload.

I write when I feel compelled. I shelve posts occasionally to let them simmer, returning to them with a clearer sense of what I wish to convey. Sometimes an idea for a post will go from first draft to published post in less than a couple of hours. Other times they will go through multiple drafts until I am happy. Remember that quality is far more important than quantity. If you would like to know more about my writing process and how I find focus check out the following two posts:

3. It’s important to post material that is provocative (from time to time)

I’m not suggesting here that you set your stall out to… but it will come as no surprise that many of my most read posts are the ones that were a little contentious, that focused on challenging issues where others will certainly have an opinion. And it is also good to pick up on topics that are being readily discussed. Here are some examples of posts that caught fire:

4. Make sure your about page is up to scratch

The about page on your blog is arguably one of the most important pages as many new readers who come across your blog will want to know more about it and the person behind it. Who are you? Why do you write this blog? How often can they expect to see new posts? These are just some of the questions a new reader may have. I am working on improving my about page at the moment, using this guide.

5. Minimal design helps your readers to focus on the content

I am at heart a minimalist. If this was nothing more than a personal journal it would probably look more like this. However, this level of minimalism is a step to far (less?) for my blog which is as much an online portfolio as it is a reflective journal. Therefore, I have found a compromise, balancing minimalism with important features that help my readers navigate my blog and hopefully keep them there. These include static pages listed in a menu under the header, a range of methods for readers to find interesting posts including: categories, tags, recent posts and a blog archive. I currently use the WordPress theme: Plainscape, which I have tweaked to my liking adding a few unique features, but these are minor and took very little time to put in place.

6. Harness social networks to spread the word

If you wish to grow the number of visitors to your blog you must harness the power of social networks. Twitter has been one of the most powerful tools in driving people towards my blog content and had helped connect me with many other bloggers who share similar ideas and write about similar topics. This has helped me to develop my blogging practice while also giving me a network who read and retweet my blog posts. I use Feedburner to manage my blog feed and Twitterfeed to autopost it to Twitter. After more than a year of sharing my disdain for Facebook, I have reneged on my principles, reactivated my account and established a Facebook page for my blog, here’s why.

7. Remember it’s not all about you

Let your readers know what blogs you like to read, this is very easy to do as most blogging platforms include a blog roll feature. I also use a range of tools including Google Reader, Delicious and Amplify to share things that I have been reading and I feel will be of interest to the people that read my blog. To make it easy for them to find this information I have installed the Lifestream plugin and generated a page on my blog to display this information.

8. It is about discussion

Most bloggers are looking to generate discussion around their posts. This is what the blogging thing is all about and it’s really important that you respond to comments from people. I would advise that you install the Disqus commenting system to your blog. It offers a wide range of management features for comments on your blog allowing anyone to log in and comment on your blog while being an effective tool in blocking spam. I try to reply to comments within 24 hours although occasionally life gets in the way.

The commenting does not end there though. As I have already made clear, it is not all about you. If you want to drive people towards your blog and encourage them to comment on your own posts then you must comment on other people’s blog posts. It raises your profile amongst the blogging community and will encourage people to look up your blog when they have seen you comment on their own posts. Be careful though and avoid committing any commenting faux pas, use this post as a guide about what not to do when commenting on posts.

9. Understand SEO and analytics

Without going into too much detail, if you are serious about blogging and see it as more than an opportunity to collect your thoughts then it is worth taking a bit of time to understand ‘Search Engine Optimisation’. In very basic terms this is making your blog more visible to search engines like Google. I could end up writing an entire post on this and only scratch the surface in many ways. Instead I will simply say that this post is a good place to start and if you are using WordPress then you can make a decent start by installing the following two plugins: All in One SEO Pack | Google XML Sitemaps

To really get a handle on how your blog is doing it is also worth signing up to Google analytics. Again there is a very handy WordPress plugin to help with this.

10. Learn a little HTML

This one is going to be a bit geeky but for that I make no apologies. When it comes to my blog I decided from the outset that I was not going to compromise when it came to way that my blogged worked and looked. I knew that if I was going to really have control of my blog I needed to learn some of the basics of HyperText Markup Language (HTML). Having started this blog initially on Blogger there were not as many features in the editing window as WordPress and one thing that niggled me about my posts was that links would open in the same window. This resulted in me learning my first bit of HTML. To get the links I was including in posts to open in a new window I learned to add the following HTML tag: target=”_blank”. From there I gradually learned more HTML so that I could effectively tweak my blog’s theme and code my own buttons in both my blog’s sidebar and under each post. I have blogged and shared the HTML/Javascript for two buttons that I addapted the code for:

This site is an excellent place to start learning HTML and it allows you to test out your code before you go and try it on your blog.

And with that I will bring this post to an end. I’ve thoroughly enjoyed the last twelve months of blogging and I’m very excited about the next twelve. I’ve got some fantastic projects underway at the moment and I’m also right in the middle of my MA, so expect lots more posts over the next few months!

—

Image: inf3ktion on Flickr

Share with Delivr

I’m taking a break from writing a post about QR-Codes to share a little HTML and offer my first impressions of Delivr – a new tool that has been making the rounds on Twitter this past week. In a nut shell, Delivr combines the URL shortening/tracking services of a bitly.Pro account with a QR-Code generator such as qrcode.kaywa.com and then adds a couple of extra functions for good measure.

For those of you who have not heard of Delivr or have not tried it yet, here is a brief look at what it offers.

Signing up to Delivr gives you a variety of features including a profile page. However, unlike many other URL shorteners, rather than a simple text based list of the links you have shared, you get a series of thumbnails. I like this a lot as I am a big fan of the visual web. What’s more, it potentially offers a unique opportunity to share a series of links in a quick and visual way. For example you could create an account for a presentation and have all of your links on one page. This could then be shared with everybody in one go by displaying or tweeting a single URL. Others can easily share the links and when you load each one up their is a QR-Code that people can scan. I think this could be a very interesting way to present and with some events coming up early on next year I may give this a go.

Each link that you share also gets a unique page as part of your Delivr account (indicated by an asterisk at the end of the URL). This page is mobile friendly and contains a variety of useful material. In the top left of the page you there is a good sized preview of the link you have shared. In the top right you can see the URL of the link. The link is made up of two parts – your profile name and a Delivr short URL. You can choose to share the whole thing or simply remove your profile name and just share the short URL. For example, both of these URLs work and will take you to the same page: http://jamesmichie.delivr.com/11vfs or http://delivr.com/11vfs.

In the bottom left of the page there is a pannel that allows you to share to multiple places including Twitter and Facebook at the click of a button, meaning you do not need to open a new tab. In the bottom right of the page their is the QR-Code that has been generated. Below it there are a few options as to what you can do with the QR-Code. It is here that Delivr goes a bit further than qrcode.kaywa.com in that the QR-Code features are more extensive. Firstly, you are not as limited in how much text you can embed inside the QR-Code and Delivr also does some funky things with Flickr images, YouTube videos and Google maps.

Here is an example of a YouTube video I have shared with Delivr. Not only can I share the short URL and get a JPG of the QR-Code but I can see a preview of how it will display on mobile devices:

You can also embed the mobile view on a blog or website as a widget and you can print out this handy flyer with the QR-Code featured on it:

Included on the flyer is a still shot from the YouTube video and a description of what the video is. This is great for sharing info at school as the flyer exports as a PDF which can then be embedded on a blog/website, uploaded to a VLE or printed to be displayed in classrooms. I will be definitely making use of this feature in the coming months in both English and Media Studies.

Other features that you get from signing up to Delivr are very similar to those offered by bitly.Pro.

You have access to a dashboard which lists all of the links that you have shared. From here you can manage your shared links with the ability to delete, edit, read comments and access analytical data. Also, there is an RSS feed of your shared links and you can export all of your data stored on Delivr as an excel file.

The analytivcal information is useful giving you a clear picture of how the links have been accessed, shared and if the QR-Code has been scanned. As I begin to explore the use of QR-Codes more readily this information will be very helpful.

Another potentially useful facet of Delivr is that people can follow your account in a very similar way to following someone’s Delicious account, where by you can see an updated list of links that have been shared. Further features include the ability to host your Delivr account under your own domain and to personalise your profile page with extra information and a background image – making the Delivr experience even more personal.

What’s more the web based interface has been extremely well thought through formatting itself perfectly on my HTC Wildfire. I could browse mine and others shared URL’s with ease, follow back friends who had begun following me and re-share links straight to Twitter, via Email or bookmark to Delicious. Once again, as with many apps, it is ease of use that will keep me coming back, particularly as I am using my phone more and more to access the World Wide Web.

Delivr works well via the web based interface but even better via its handy bookmarklet which you can drag to your bookmarks bar in your browser. This allows you to share links directly from the page that you are on while surfing the web.

Having been instantly impressed, I wondered if I could add a button to my blog so that people could use Delivr to share my posts without leaving the post page. I took a look at the code and saw that it was very similar to the code used in the Instapaper Bookmarklet. As I did with Instapaper, I adapted the bookmarklet code and then found an image to act as a button. In this case I used Delivr’s Twitter Logo as the image source reducing it to 32 x 32 pixels. You can see and use the button at the top right of this post. If you would like to add the button to your own blog then grab the following code:

<a href="javascript:%20var%20newscr%20=%20document.createElement('script');%20newscr.setAttribute('language','javascript');newscr.setAttribute('src','http://cdn.delivr.com/js/bookmarklet.js');document.body.appendChild(newscr);%20var%20newcss%20=%20document.createElement('link');%20newcss.setAttribute('type','text/css');newcss.setAttribute('rel','stylesheet');newcss.setAttribute('href','http://cdn.delivr.com/css/bookmarklet.css');document.body.appendChild(newcss);void(0);"><img src="http://jamesmichie.com/blog/wp-content/uploads/2010/10/Delivr.png" alt="Share with Delivr" title="Share with Delivr" /></a>

Instapaper “Read Later” Button For Your Blog!

Those of you who have been reading my blog for a while now or have followed me closely on Twitter, will probably know that I am a huge fan of Instapaper. For the uninitiated, it is a service that allows you to save articles to be read later that you can access from your iPhone, Android, eReader or on the web. It has had a massive impact on my productivity, helping me to organise and keep up with longer articles that I find online. I am such a massive fan that I even created a standalone application using Fluid which you can read about here.

Prompted by a tweet from Doug Belshaw (who had added an Evernote Site Memory button to his blog), I began looking into adding a similar sort of button for Instapaper, so that visitors to my blog could quickly save the article they were reading. After trawling many blogs and websites it became clear that there wasn’t a button of this kind available on the web. No java script plugin or html code snippet to allow this functionality could be found. Therefore, I decided to create one myself.

To create the button, I used a slightly modified version of the Instapaper bookmarklet code – editing it to include an “img src” html tag. This allowed me to link the code to a button which I edited to size (60×60) in Photoshop. I also added a “title” attribute to display “Read Later” when the cursor hovers over the button. You can see the button below this post. Sign in to your Instapaper account and try it out.

If you would like to add this button to your own blog, you can do so by using the code below:

<a href="javascript:function iprl5(){var d=document,z=d.createElement('scr'+'ipt'),b=d.body,l=d.location;try{if(!b)throw(0);d.title='(Saving...) '+d.title;z.setAttribute('src',l.protocol+'//www.instapaper.com/j/WKrH3R7ORD5p?u='+encodeURIComponent(l.href)+'&t='+(new Date().getTime()));b.appendChild(z);}catch(e){alert('Please wait until the page has loaded.');}}iprl5();void(0)" class="bookmarklet" onclick="return explain_bookmarklet();"><img src="http://jamesmichie.com/blog/wp-content/uploads/2010/10/Instapaper.png" alt="Read Later" title="Read Later" /></a>

I chose to insert the code in the “single.php” file of my WordPress blog so that it appears on the top right of the post pages but not on the home page.

I hope that you find this useful. If you make use of the code and/or edit it to suit your needs, please let me know by leaving a comment below.