Mapping calendar entries made me think, if this could be used for other stuff than simply putting events on a map, – which is quite useful in it’s own way. I thought it would be cool if you could create an interactive map-timeline, controlled dynamically by a (shared)calendar.

Read the rest of this tutorial in my article on the Online Journalism Blog.

The advanced search features of Friendfeed makes it a pretty good twitter search alternative. It even supports real-time, so you can make your own twitter news monitors.

I wrote this for the Online Journalism Blog, read the rest there.

Here’s a short rundown of the main points in the first draft.

What is Google Maps?

A free mapping service that provide easy tools for creating simple, interactive maps that can be embedded in any web page. – And, crazy useful for journalists.

Why you should use it?

Maps are probably one of the oldest forms of visuals, that has been used in news reporting. Apart from static maps, such as jpg images, interactive maps lets you put additional data such as images and video on top of the map. Interactive markers let the user decide what information they want, and when they want it. The web is not a passive media, it’s active and engaging and users want to be in control.

How you use it

First of all you need a Google account. If you haven’t already got one then it’s about time. Google has their own tutorial, and if Google has done something, they’ve probably done it the best, so I will shamelessly steal directly from theirs (btw. if you don’t like to read, watch the video demo). First of all log in to you Google account and go to Google Maps.

Creating your first map.

1. Click My Maps
2. Click Create new map.
3. Add a title and description for your map.
4. Decide whether the map should be public or unlisted. Public maps are automatically included in Google Maps search.
5. Use the icons in the top left corner of the map. These include:

Selection tool. Use this to drag the map and select placemarks, lines and shapes.
Placemark tool. Use this to add placemarks.
Line tool. Use this to draw lines.
Shape tool. Use this to draw shapes.

Adding Photos/Text

You can add photos to your map, as long as they are hosted online. Please use a service such as Google PicasaWeb to put your photos online.

To add photos:

1. Create or open a map.
2. Click the appropriate placemark, line, shape. The info window appears.
3. Click Edit.
4. Choose Rich Text or Edit HTML.
5. If you chose Rich Text mode, click the photo icon above the description field (the last one in the toolbar). Enter the URL of the photo you would like to add.
6. If you chose Edit HTML mode, use the <img> tag to add photos. For example, <img src=”http://www.google.com/intl/en_us/images/maps_results_logo.gif” width=150 height=55> adds the Google Maps logo to your map with a width of 150 pixels and a height of 55 pixels.
7. Click OK to save your changes.

Adding Videos

You can add Google Video and YouTube videos to your map. To do this:

1. Create or open a map.
2. Click the appropriate placemark, line or shape. The info window appears.
3. Click Edit.
4. Choose Edit HTML.
5. Find the video you want on YouTube or Google Video. Copy the snippet of code that lets you embed the video into a website or blog.
   • On Google Video, the snippet looks like this:
     <embed style=”width:400px; height:326px;” id=”VideoPlayback” type=”application/x-shockwave-flash” src=”http://video.google.com/googleplayer.swf?docId=-274981837129821058&hl=en” flashvars=”"> </embed>
   • On YouTube, the snippet looks like this:
     <object width=”425″ height=”350″><param name=”movie” value=”http://www.youtube.com/v/hKoB0MHVBvM”></param><param name=”wmode” value=”transparent”></param><embed src=”http://www.youtube.com/v/hKoB0MHVBvM” type=”application/x-shockwave-flash” wmode=”transparent” width=”425″ height=”350″></embed></object>
6. Paste the snippet of code into the description field of your placemark, line or shape.
7. Click OK to save your changes.

Here’s an even simpler version of the above for the complete beginner.

This is just a rough draft and intro to why journalists should use Google Maps, I would love to hear if you got any better motivation factors for why journalists should use this brilliant service.

Friendfeed let’s you publish everything, or a few selected services to Twitter. If you have a lot of stuff going into your Friendfeed stream, you might not want to share everything on Twitter.

Sign up for an account on Friendfeed if you haven’t already got one. Import your Google Reader shared items and go to your Advanced Twitter Setting. Check the box that says ‘Post my FriendFeed entries on Twitter by default’, then select to share ‘The services I’ve selected below’ and put a check mark in Google Reader. Save Changes and your shared items will be republished to Twitter.

Link to the original source or the Friendfeed entry?

You might notice that at the top of the settings page, you have the choice of ‘Link to source site instead of FriendFeed conversation (does not apply to comments)’. If you don’t check this box, the link you send to Twitter will send your visitors to your Friendfeed entry. If you like me, want to encourage people to subscribe to your Friendfeed page you might like this. But for most people using Friendfeed only for this purpose, it makes sense to check it and send your visitors to the source.

Ryan has a great post on a more detailed strategy for sharing links, I encourage you to read it of you frequently share links on different platforms.

And… if you’re not too hung up on the Google Reader interface, consider installing Feedly into Firefox. It allows you to easily share stuff on Twitter, it even shorten the link.

I tried Songbird back when it was still in beta, it was back in 2007. I remember being pretty excited about having an iTunes like media player for Ubuntu Linux, but as it turned out, it was pretty buggy and the iPod add-on wasn’t very good. I have been watching the roadmap closely ever since and as it seems now, It’s only one release away from being perfect for me. So, I decided to give it another go and went ahead and installed it.

I didn’t know this, but Songbird makes it extremely easy to import your existing iTunes library, simply follow these steps and you will have your iTunes library in Songbird in a matter of minutes.

1. Go to Songbirdnest.com and download the latest release.
2. Run the installer and select the add-ons you want to install.
3. When Songbird launches it will detect and import your iTunes library.
4. In Songbird hit Ctrl+T to open a new tab.
5. Go to the iPod Device Support and MediaFlow add-ons and select install.

That’s it, you now have an exact copy of you iTunes library in Songbird. If you had any podcast subscriptions, you will have to re subscribe to those. Podcasting is not as nicely integrated in Songbird as it is in iTunes, so if you are a big podcast fanatic, you might want to keep iTunes for that.

Songbird = iTunes = Songbird

Don’t worry about using iTunes, Songbird will automagically update the library to mimic any changes you might have made in iTunes. So feel free to keep using both players until you are confident that Songbird will do the job for you.

Compared to back in 2007, Songbird is a different beast now, the interface is completely cleaned up, the library is fast and iPod support is grand. The add-ons available makes using the player a delight, I can sync my iPod, and using the folder sync add-on, I can even sync any playlist to my phone, or any other USB device for that matter.

I’m really pleased with the new Songbird and can’t wait to see what the developers have in store for future releases.

And of course, the bird is twittering away…

I really like the potential of Friendfeed, and I want to get a few more subscribers than the 11 I have got now . here are a few of the things I’m going to try to change that.

• Use Friendfeed to post status updates.
  I will start posting status updates to Friendfeed and cc twitter. This will show my subscribers that I’m actually using Friendfeed and not just aggregating. The problem with people that only aggregate, is that they probably won’t see the comments you make on their entries. By posting actively to Friendfeed I can show that Iactually spend time there. The other upside is that all my short URLs on twitter will be ff.im/xxxxxx, people on twitter using Friendfeed can see that I’m on Friendfeed and maybe they’ll subscribe (I know it’s a long shot but anyway).
  Update: I have my twitter settings set to ‘Link to source site instead of FriendFeed conversation’, deselect that, and your twitter links go directly to your Friendfeed entry instead of the link source. It publicises your Friendfeed account more, but it also requires one more click on your users’ part. Scobleizer and Thomas Hawk use this so it can’t be that bad, considering they are some of the biggest Friendfeed users. – Maybe I should try it?
• Join rooms and, most importantly, contribute.
  Contribute to the community! Friendfeed supports ‘groups’ as they call them. Everyone can create their own room and invite others to post to them, this gives a space for a community to have a specialised discussion. A little like you know it from forums and discussion boards. Posting to these rooms should get my name out there to the Friendfeed community and hopefully a few people will notice and follow me.
• Use the Friendfeed bookmarklet
  The Friendfeed browser bookmarklet is actually quite handy. It works almost like the Shareaholic Firefox add-on . You can share anything on Friendfeed by the click of button. It’s an extremely easy way to post interesting links, and if you use the post to twitter option your links will go straight to your twitter stream. No more copy pasting into Tweetdeck or various URL shortening services.
• Discuss on Friendfeed, not twitter.
  I will start engaging more in the discussions that are happening on Friendfeed. It’s super easy to follow discussions on Friendfeed, they are all grouped together around the original post, like a blog post.
• Using saved searches (filters).
  This saved searches are really filters, bu t I guess saved searches make more sense to the average user. These let’s me filter for keywords, like count and comments count. Great feature if you want to cut down on all the noise and discover the most important discussions. Let’s say you are into formula 1, you can filter all entries with 1 or more like which have at least 5 comments, – powerful feature .
• Like more.
  It’s no secret that I have had doubts about what the like feature on Friendfeed and Facebook was good for. But with the saved searches function it really makes sense, it’s like a voting system where you can filter out the best entries. Whenever you like an entry, a little link to you Friendfeed profile is displayedjust underneath the entry saying ‘kasperbs liked this’.

It might sound like I’m all interested in the number of followers or subscribers. And I’m am, to a certain extend. For a service like Friendfeed to be more useful to me, I think you need to build a following just like you do on twitter. These services are great for instant discussion, but it doesn’t make sense if you are only talking to yourself. – That is why I still have the ‘post to twitter’ option turned on so all my updates will go to twitter, where most of the people who care, spend their time.

As Gavin Wray says in the comments on Michael’s post:

“Thanks for making this guide. You make clear sense out of what can seem a daunting task.”

You see it time and time again. Organisations showing terrible timing and understanding, responding to bad feedback by alienating people and ignoring the community.

If you can answer these questions by a yes or no, you have come a long way in your aproach to bad feedback. The golden nugget being: listen first, then react.

A now, completely empty inbox. Pretty scary huh?

A Solid Inbox Strategy

I didn’t want to just clean everything out; I also wanted to get some sort of strategy in place so that I wouldn’t end up in the same mess in a couple of weeks. I adapted/extended Gina’s ‘Trusted Trio’ to better suit my needs. Gina is very tough with her: ‘Just Three Labels’ system, but unlike me, she probably have several hundred emails to get through every day. I like things to be a little bit more organised so I sat up a few more labels to help me out..

Spring Cleaning

First of all I completely molested Gmail’s search box and filters to get rid of everything I didn’t need. I deleted all the crazy Facebook, Flickr and other completely useless notifications from eBay and PayPal. I made sure I didn’t delete my sent message by putting a ‘–in:sent’ in most of the queries, but take a look at the syntax and try for yourself. Filters are pretty handy if you want to quickly get rid of all your junk. The favourite query for me was ‘in:anywhere –in:sent -kasper’ my first name filtered out an insane amount of SPAM. Obviously this wouldn’t have worked if my email address had been kasper@gmail.com.

Labels: Three or Ten?

The perfect Gmail setup

I filtered my ‘All Mail’ folder down to 524 of which a few hundreds of them, were ‘Sent Messages’. I set up 10 static labels and a few dynamic ones which I intend to use for things such as clients and stuff that will be relevant for a while but can eventually go into the archives.

As you can see I have the ‘Trusted Trio’ at the very top, the prefixes for all the categories are just to keep them in order.

1. -1FollowUp is for messages that take more than 2 minutes to respond to, if it takes less, just respond on the spot. The idea is to keep your inbox empty at all times.
2. -2Hold are emails that you want to keep around for a few days or possibly a week or two.
3. -3Archive is for everything that you want to keep but doesn’t need right now. Bee crude and delete 95% of all your emails, – you know you will never need them.

If you are happy with this ‘three labels and out’ then, you practically don’t need any more. Gmail’s search feature is so exceptionally powerful that no labels can make up for it.

I also created the ‘Grumpy Quartet’ and the ‘Dynamic Trio’. The ‘Grumpy Quartet’ is for emails that will definitely come back and bite you at some point in time. This is where I save all my family and friends messages, just to prove them wrong whenever they try to convince me that they emailed me the correct date and time when they did not. It’s for all my Uni work that I need to get around to at some point, and for the receipts you can never find when you need them. I also occasionally like to save a few fly fishing notes in there.

The Dynamic trio are taken care of by filters; they don’t go into my inbox but are still marked as unread. Just set up a filter like ‘From: @ebay’ and filter those into your eBay Label. The ‘Social’ label takes care of all my Facebook, Flickr and Twitter activity.

My inbox is now completely empty, it’s a pretty lonely sight at first but I’m sure I will get used to it.

All the web projects I work on need custom written CSS stylesheets. While some elements like classes and id’s might be the same most of them aren’t. I always design everything from scratch, I know some work of off templates but I feel it limits the creative process and encourage cutting corners. You want every design/client to be as unique as possible, but some things can be automated.

I use WordPress for most of my web design work, and I’m about to give you a reason for doing that as well ;) if you don’t already.

I use two pre written stylesheets in almost all projects. I use the reset-styles.css written by Eric Meyer, and my own content stylesheet.

Resetting Browser Styles

Most if not every imaginable browser on the market apply its own set default styles to every web page they feed to the user. This means that if you don’t define certain styles like margins and line-height, then the browser will define them for you. As every browser defines these styles differently, you will not get any consistency unless you define them yourself. By using Mr. Meyers stylesheet you ensure that you reset all browser styles to zero. This does two things for you:

1. It gives you consistency across browsers.
2. It ensures that you don’t forget to define the styles that will screw up your precious design.

Reset your stylesheets to improve browser compatibility

Just download the stylesheet and put it in the same folder as your main stylesheet and use the @import command to apply them to your design.

Custom WordPress Post Styles

Now that you have reset all your styles you will want to define them. I like to think of this as applying my own default stylesheet to all browsers. If you don’t define any styles all you headers (h1, h2, h3 etc.) will all look the same, your list (ul, ol) will look like plain text.

The Solution

There are certain content styles that won’t deviate much from one design to the design. For the web, you mostly use a line-height of 1½ or 2 times the font size. You list items will have slightly more ‘air’ between them and they will be slightly indented. Your headers will decrease in size from <h1> through to <h6>. I have created a stylesheet that assigns a default value to all these elements so you don’t have to do it every time.

WordPress generate a lot of styles on the fly that makes it easy to make this consistent over many designs. One of the things that I have found useful is to style all my images according the align property assigned by WordPress. When you insert an image in your post, you choose how you want to align it, and WordPress will automatically give the <img> an appropriate class. You also have the ability to use captions from within the image editor, this will also trigger WordPress to assign a certain class to the image. These styles are consistent across all WP sites, so why not apply you own values to these as well. Remember, we are only concerned with content styles that will be the same on the majority of designs.

Some of the styles in the css file include consistent styling for images aligned left, right or centred. It ensures that the image captions will show up nicely no matter how your layout varies. Blockquotes will be slightly indented with a background image and a background colour. All the list and paragraphs will have defined line-heights, margins and padding.

Right, Show me the Meat!

This save a tremendous amount of time and the values are consistent across most designs. You can easily go in and edit the content stylesheet to suit your needs. The colours used in the document are all listed at the top, so it’s just a matter of using the find/replace command if you want to change all of them at once.

Download

Go grab the zip file or have a look at the demo page.

The zip file includes all the files and images you need. Just leave the folder hierachy intact and you are good to go.