web2practicalprojectsjune09

37
Practical projects using Web 2.0 Resources Phil Bradley http://www.philb.com 1

Upload: phil-bradley

Post on 17-May-2015

1.505 views

Category:

Technology


0 download

TRANSCRIPT

Page 1: Web2practicalprojectsjune09

Practical projects using

Web 2.0

Resources

Phil Bradley

http://www.philb.com

1

Page 2: Web2practicalprojectsjune09

Using Netvibes as a home or start page

Visit the Netvibes website at http://www.netvibes.comThis module is also available at http://www.screencast-o-matic.com/watch/cQnh1PnPj as a screencast.

Start by personalising your page by choosing some interests (if you wish, it’s not necessary) and choose some of the suggested widgets (if you wish). (Don’t worry about making a mistake, you can change all of these things later.) Then click ‘Show me my page’ and Netvibes will create a page for you. It’ll look something like the following illustration, but may be slightly different depending on your choices and current news.

At this point you can sign up to use Netvibes, or continue to play with it, until you feel confident enough to do so. Remember that you can’t do any damage, and you can always change any of the content in the future, so you’re not locking yourself into anything, either at this stage or indeed at any point.

You may decide that you don’t like the position of the various modules on the page. Simple place your mouse cursor into the title element of a module, and it should then change to a 4 way pointing arrow. Simply click and drag the module elsewhere.

2

Page 3: Web2practicalprojectsjune09

The remaining modules will all move around appropriately. You can of course move the module back if you wish. If you would like to further personalise the page you can do so quite easily. Simply click on the General Tab and choose the small downfacing arrow, which will provide you with an option like this:

You can then change the name, the layout, delete the entire tab or share it with other people on social networks. At this stage, just try changing the name and perhaps the layout until you find something that you like. When you’re happy with what you have, simply click on the red cross, top right hand corner.

You can add new modules or widgets by clicking on the green ‘Add content’ tab in the top left hand corner. This will expand as you can see below:

Feel free to explore the various widgets until you find something you like. When you find a widget that you like (such as the BBC news) you can click on it, which brings the widget to the fore, then click ‘Add to my page’ and position the widget wherever you want it.

3

Page 4: Web2practicalprojectsjune09

You can also edit this and every other widget, though exactly what you can do depends on the widget itself. However, if you click on Edit in the top right hand of the widget title bar you’ll see various options – this is the BBC news example:

Once again, feel free to play around – you can always change things back again.

One important widget to add is the ‘Bookmarks’ option, which is available under the ‘Essential’ tab. Add that to your collection on the page and open the edit option:

You can import bookmarks, but at this point just add one or two. Type in the title of the bookmark (Phil Bradley’s website for example) and the URL. Then add a tag which describes the link, but which is common enough for you to want to use again – something like ‘Librarian’ should work well enough. Click on add. That assigns my site to the

4

Page 5: Web2practicalprojectsjune09

Librarian tag. Do the same with another site, such as the BBC site and tag that as News, then click Add. Your bookmark widget will look something like this:

If you click on the ‘News’ tag, my site will disappear, and the BBC site will appear. This way you can have many sites listed under different tabs, making it easy to move through them as appropriate.New pages

The Netvibes page that you have been working on is the ‘General’ page (unless you renamed it), but you’ll see other tabs:

Each of these tabs can be regarded as individual, and you can place whatever material on them that you wish (although if you add another bookmarks tab it comes with the same content, hence the use of tags)

Adding an RSS or newsfeed is very straightforward. Visit a weblog and take a note of its URL, open up the ‘Add a feed’ option and choose RSS.

Type the URL into the address bar and click ‘Add Feed’ (If you simply want to try this out, try adding http://www.philbradley.typepad.com to add mine). Click on the widget that is created and choose to add it to your page. (If you are given multiple options just choose one, it doesn’t really matter which.)

5

Page 6: Web2practicalprojectsjune09

Alternatively you may see Subscribe options that include Netvibes, such as this one from Techmeme:

This is also a common way to add a feed:

Finally, you can make pages public, so that anyone else can see them. In order to do this you need to click on the ‘Go to my public page’ option in the top left hand corner:

(You may need to reconfirm your account with Netvibes before you can create any content.) More details on using public pages is available at http://faq.netvibes.com/public_page#public_page

Using Bloglines as a newsreader – getting started.

1. Opening screen

Fig 1

6

Page 7: Web2practicalprojectsjune09

2. Create an account.

Fig 2

You will need to provide Bloglines with an email address that you can access during the course – until you have validated the address Bloglines will not let you continue, so I would suggest giving it something such as a Hotmail or Gmail account.

3. Using Bloglines Once you have clicked on the validate account from your email you will get the screen you see in Fig 3. Scroll down the list of Quick picks and Most popular subscriptions and add some that take your fancy – you can always get rid of them later if you change your mind. Then click on ‘Subscribe to my Selections’ (bottom right of the screen above).

Fig 3

You will then see a screen that looks something like the one below, depending on your selection of feeds:

7

Page 8: Web2practicalprojectsjune09

Fig 4

If you click on any of the feeds that you have selected in the left pane, the content will appear in the right hand (larger) pane as you can see in Fig 5.

Fig 5You can scroll down through the list of entries, and if there is something that takes your interest, you can simply click on the link in the right hand pane and you will get taken by the browser directly to that specific story or weblog entry.

4. Adding contentYou will want to add more content as time goes by, when you find interesting RSS feeds to look at. Let’s use the BBC site as an example. Point your browser at www.bbc.co.uk and choose the NEWS section, and click on the RSS feed link. This will then take you to the page http://news.bbc.co.uk/1/hi/help/rss/default.stm and if you scroll down and look at the right hand side menu, you will see a list of different feeds that you can take as in Fig 6

Fig 6.

8

Page 9: Web2practicalprojectsjune09

Choose one that interests you, and you will be taken to another page – I chose UK and was redirected to http://newsrss.bbc.co.uk/rss/newsonline_uk_edition/uk/rss.xml Scroll down the page again, and you will see on the right hand side a button ‘One click subscriptions’ with a Bloglines icon, and click on that. This will then open Bloglines up for you (or you may have to log back in), and you can then decide on various aspects, such as adding to a folder, or creating one. Click on Folder and then New Folder and type in News into the dialogue box. That creates the folder for you. Ignore the rest of the options and just click Subscribe. In your Feeds section in Bloglines you will now have a News section.

By clicking on Edit in the left hand pane in the feeds section you can create new folders, move subscriptions to feeds from one place to another and so on, as in Fig 7. You may wish to add a feed to Bloglines that doesn’t have an obvious option available to it. Simply click on the ‘Add’ option (also shown in Figure 7). This brings up a dialogue box for you, and simply cut and paste the URL of the site that has a feed you’re interested in, or the URL of a weblog – almost anything. Bloglines will then try and work out for itself if there is a feed available. Try this with my weblog – simply type in the URL http://www.philbradley.typepad.com/ and hit subscribe. Bloglines will then try and find a feed, and in that case, it will find several. It doesn’t matter which one you choose to add, Bloglines will take care of it for you. Choose the options that you want, and the feed will be added to your list. Alternatively you can install the easy subscribe bookmarklet to your browser, which is a much easier and faster way to work.

9

Page 10: Web2practicalprojectsjune09

Using Google Reader as an RSS Reader.

Create an account with Google if you don’t already have one, then sign in. Top left menu contains a pull down ‘more’ option and you can click on the Reader option. Alternatively, visit http://www.google.co.uk/reader/

Adding subscriptions.In the top left corner is the ‘Add a subscription’ option. Click on this and then enter a search term or paste in the address of a weblog that you already know. A good choice here is to simply search for librarian.

Scroll through the list, clicking on any feeds that interest you. Once you have found one or more that you like, click on the ‘subscribe’ option. This will add that feed to your subscriptions (A) and will also allow you to Add to a folder (B)

10

Page 11: Web2practicalprojectsjune09

You can create a new folder to put subscriptions into, in order to keep things neat and tidy.

You will see that the subscription has been added to the appropriate folder. I’ve added a few more subscriptions and folders for you to see.

Clicking on a folder will display all the new posts in a list or expanded format (option top right) and you can view a post in more detail by clicking on the title.

Alternatively, click on an individual subscription to just view that. The number in brackets tells you how many unread posts you have. If you wish to keep posts, click on the star to the left of the title in the main window and it will be retained for you.

You can also subscribe to feeds directly from sites. Most feeds will have some RSS option available (look for the orange icon) and click on it.

Simply click on the ‘Google’ option and follow the onscreen prompts. Alternatively, if you see a page of what appears to be gibberish text you’ve reached the actual feed itself. Simply copy the URL, go back to Google Reader, open the Add Subscription option as detailed above and paste in the URL, then add the page as normal

11

Page 12: Web2practicalprojectsjune09

Creating your own search engine

1. OptionsThere are various different options available to you –

Rollyo at http://www.rollyo.com Yahoo Search Builder at http://builder.search.yahoo.com/m/promo Eurekster Swicki at http://www.eurekster.com/ Google Custom Search Builder at http://google.com/coop/cse/

They all do a similar job in a similar way. Rollyo is perhaps the quickest, so we’ll use that.

2. Creating the search engineVisit http://www.rollyo.com

Register with the resource

Either add in your own email address (which means that you’ll be able to get back to your search engine if you forget the password) or if you prefer to use a temporary one, you can get one from http://10minutemail.com/10MinuteMail/index.html

Next you want to create your search engine, so…

Click on ‘Create Searchroll’

12

Page 13: Web2practicalprojectsjune09

Give your searchroll a name

Add in URL addresses of sites that are appropriate – if you can’t think of any check out their examples, which will pre-populate the box for you. NOTE: You don’t need to add http://www. – just start from there, so it would be bbc.co.uk or philb.com for example.

Choose a category if you wish, and tags if you wish.

Rollyo will then create your searchroll for you.

Click on your Dashboard to see what searchrolls you have created.

3. Adding the searchroll to your site

Obviously we won’t be doing this step today, but in order to add the searchroll to your site, click on Tools

13

Page 14: Web2practicalprojectsjune09

Follow the on-screen prompts, copy and paste the code onto your site and you’re done.

4. Using the Google search engine

First of all, visit http://www.google.com/coop/cse/ and choose to create a search engine. In order to do this you do need to have a Google account, so use yours to log in if you have one, or follow the on screen prompts to get one (it’s free, other than giving your soul to Google forever of course).

Simply fill in the boxes as provided by Google – search engine name, description, keywords, resources to use, and some sites to use.

When you’re happy with what you’ve got, continue to the next stage, try it out in preview mode and then save it. You can return to it via a URL Google offers you, or you can take the HTML code – cut and paste it and put it onto your own site.

Setting up a weblog using Blogger

1. The basicsFirst, visit Blogger at http://www.blogger.com

We’re going to be creating our first ever blog, so we need to click on the ‘Create your blog now’ arrow.This then takes you to the basic registration screen.

14

Page 15: Web2practicalprojectsjune09

Put in an email address – don’t worry about this, since you never get any spam from Blogger – in fact I don’t ever recall getting anything from them, so your email address is safe.

Enter a password – a combination of letters and numbers is a good idea. Then retype it.

The display name is the name that will identify you as the person who wrote a particular post, so you might choose your first name, or your job title or a nickname. You’ll be able to change it in the future, so don’t worry about it too much.

Copy the characters for the word verification process – this is to prove that you’re human, then click on the Acceptance of Terms (having read them!) and continue.

Next, you have to give your blog a little bit of character.

Give it a name to start with. This can be anything you choose, though it may take you a while to find a name that hasn’t already been taken.

The blog address takes the form of http://myblogname.blogspot.com and is the one that you’ll use to link to from your website for example, or give to your contacts so that they can subscribe. So choose something memorable if possible, but don’t be surprised if most

15

Page 16: Web2practicalprojectsjune09

of the options that you try are taken. Blogger will be hosting the blog for you, although you can always host it on your own site if you prefer, but that’s a slightly more technical option than we’ll be looking at in this tutorial.

Click continue, and you’ll then be taken to the template screen.

This gives you the opportunity to decide what your weblog is going to look like. There are a fair number of options – just scroll down until you find one that you’re happy with. Click in the little circular radio box and then continue.

Woohoo! Major excitement now – you’ve actually got your weblog. Just click on the ‘Start Posting’ option to continue.

2. Writing a weblog entryYou can now start to write an entry into your weblog.

16

Page 17: Web2practicalprojectsjune09

If your screen doesn’t look quite the same, make sure that the ‘Compose’ tab is on top – the ‘Edit Html’ is less friendly.

The title is obviously the title of that particular entry.The link option is the URL of the story/website/whatever that you’re writing about. If you’re just sharing your thoughts, ignore this field.The options are fairly straightforward, and if you’ve used a word processor you won’t have any problems with them.

1. You can choose your font and2. The font size3. Text can be bold or italic4. With a choice of colours5. If you’re linking to a URL, highlight your text, click here, type in the URL.6. Paragraph justified left, right etc7. Bullet points, numbered or block8. Quoted work9. Spell checker10. Adding in an image11. Upload a file12. Remove formatting13. Preview what you’ve done.

When you’ve written what you want to say, you can either just scroll down and publish it there and then, save it as a draft (useful for when you’re annoyed about something – never, ever blog when you’re cross!) or preview it.

When you’re happy, save the post. You may get a status message telling you that the post is being published. It’ll look something like the image below, but don’t worry if you don’t see it.

3. Setting the rest of your weblog up correctly.

17

Page 18: Web2practicalprojectsjune09

There are a number of other options available to you. In the ‘Posting’ section you can obviously create a post, or you can edit/delete weblog posts as necessary. You can choose to moderate the comments that people make on your weblog, or disallow people from making comments at all. Clicking on that link will take you to a dialogue page where you can choose those options that you think are appropriate. You can always change your mind later of course and change this as often as you like.

The settings option provides you with a number of other things that you may want to consider doing with your weblog.

Settings Basic includes:Title and description of the weblogAdding your blog to the Blogger listings (unless you want to keep it private, go with yes)Show quick editing (your call)Show email posting links – if you want people to be able to email your entry to friendsGlobal settings – allow the use of the WYSIWYG editorDelete the blog – probably not!

PublishingThese options refer to the situation if you’re publishing the weblog on your own site, not having it hosted by Blogger.

FormattingShow – the number of posts on the weblog pageDate format – UK/US etcArchive format – UK/US etcTimestamp and zone – obviousLanguage – obviousEncoding – ignore this one and just leave it as it isConvert line breaks – your choiceShow title/link field – your choice but I’d suggest that you show bothFloat alignment – ignoreTemplate option – ignore

CommentsIf you allow comments on your weblog I would strongly suggest that you ensure that they are moderated, so that you don’t end up getting a lot of spam.

ArchivingBlogger can automatically archive all your postings for you. Since they’re hosting the space it’s a sensible option.

Site FeedThis will create an RSS feed for your weblog which means that the data can be manipulated and made available in other formats.

18

Page 19: Web2practicalprojectsjune09

EmailYou can email blog entries to Blogger via the secret email address you set up. You can also be informed via email when entries are added, which may be useful if you are not the only author.

PermissionsThis is an option that allows you to add new members to the blog who can also post.

The template option allows you to change the look and feel of the weblog, and to add a search box. Unless you’re confident at editing code you should leave this alone, or only use if you are sure of the instructions that you’re following.

AdSenseThis allows you to add Google AdSense adverts to the blog to make you a bit of cash.

Pick newAllows you to change the general template that you’re using.

Edit archiveThis allows you to edit the archive, but again, unless you know exactly what you’re doing, it’s best to leave this alone.

4. The dashboard

The dashboard option is up in the top right hand corner of the screen. This allows you to add/change/edit your personal profile. You can also use this section if you have more weblogs to manage.

Using Zimbio to create websites

1. Visit Zimbio at http://www.zimbio.com/ and either login or register. Zimbio is a site that you can use to create content on the web that is shared with other people. This can either be public or private. Nothing is stored on your own system, so if you’re being blocked at work from producing content, this is a good way around that situation.

19

Page 20: Web2practicalprojectsjune09

2. You’ll end up with something a little like the following – although since I have already created a lot of ‘wikizines’ I’ve got a fair list! Simply click on ‘Create a Wikizine’

3. Follow the on-screen instructions. It does help to have some sort of idea of what type of Wikizine you’d like to create before you start however. So – got a favorite hobby? How about a fan site for your favourite football team (extra points given if it’s Everton, don’t expect help if you create one for Man Utd), or perhaps something that’s work related? Or a fan site for an author, singer, band, book, film, or even a family site that you can share with loved ones!

4. Once you have added in everything that you need, you can then create the Wikizine. Next comes the fun part of adding content. You can choose to add links to other sites, news feeds, video links, blog searching – all automatically – just choose the terms you want to search on. Click on the menu top right:

20

Page 21: Web2practicalprojectsjune09

5. This then brings up the following menu, with the rest of the screen blanked out. Choose the option that you want and click on it.

Here’s one for adding a link:

6. When you’ve added what you want, don’t be surprised if it doesn’t automatically appear on the page. Simply go back to the menu and this time click on ‘Edit layout’. This will then bring up a list of all the sections that you have added, and you simply click and drag them to where you want them to go, as you can see here:

21

Page 22: Web2practicalprojectsjune09

7. Explore and play around! If you want to see an example there are plenty you can search for. The one that is the companion site for the book is at: http://www.zimbio.com/How+to+use+Web+2.0+in+your+library

Using del.icio.us as a bookmarking service

1. You can use del.icio.us (hereafter called Delicious to save my full stop key excess use) to store URLs and to tag and comment them. This is different to Furl, in that Delicious works much more along the line of a traditional bookmarking system, though once again, the details of what you bookmark are stored on their system, rather than your own. You can visit Delicious via http://www.delicious.com or http://del.icio.us/

2. You need to register to use the service and once again I would recommend adding the Delicious browser icons to your browser bar – they’ll look like this:

(The two on the right – the first takes you to your collection of bookmarks, and the second will add a bookmark to your collection.) If you’re using Internet Explorer they will look like this:

The installation is easy, as you’ll be prompted to do so while you’re setting your account up. (Please note that you shouldn’t add these to a training machine if you’re doing this on a course, since the buttons are associated with your own account!)

3. When you’re ready to add a bookmark to Delicious, simply click on the ‘tag’ icon, which will then pull up a dialogue box for you similar to this one:

22

Page 23: Web2practicalprojectsjune09

As you’ll see, the URL and a title are already included for you. You can add any notes that you want, perhaps a clipping from the page for example. Then you add any tags – these are simply keywords that help you describe and recall the bookmarked page in the future. Delicious will suggest tags for you based on the content of the page, previous tags you have used, and any tags that others have used to tag this page before you.

4. You can then search for bookmarked pages in the future using the search option:

Delicious will then return matches for the search that you’ve run.

5. Delicious provides a lot of functionality and you can of course share your bookmarks with other people either in the form of an RSS feed for example, or you can put a feed onto a webpage.

Creating a wiki using PB Works

1. Visit the website at http://www.pbworks.com/ and click on the ‘get started’ option in the right hand pane.

This will give you a chance to view the different types of wiki that you can produce – educational, law, general, personal and so on. When you’ve explored, click on one of the ‘Try it now’ options. This leads to another screen with pricing plans – you’ll obviously want the basic/free version to start with.

23

Page 24: Web2practicalprojectsjune09

Choose an address for your wiki. If the address is taken it will tell you. Decide if the wiki is for individuals, education or business. (It doesn’t really matter that much at this stage since you’re just exploring.) Next choose company type and workspace purpose as you feel appropriate. Finally create an account if you haven’t got one already. Finally, check your email account for a validation/confirmation email.

You’ll next get to choose security settings – who can view it, who can edit it. Choose your options as appropriate, and then click to go to your workspace.

Clicking on ‘Edit Page’ brings up a copy of the text of the page with editing buttons, just like a word processor.

As you’ll see, you can bold, underline, italic, bullet point and so on. You can also add in links, images and so on. Feel free to edit the home page if you wish to. You can add new pages by either choosing a default template from the ‘Insert links’ option, or simply type some text, highlight it and choose the link option from the menu.

24

Page 25: Web2practicalprojectsjune09

Remember to save your work as you continue! (Save option bottom left).

You can add in more information in the form of plugins. You can also embed video files, either ones that you have uploaded or that you’ve got via YouTube. It’s also possible to add files that you’ve uploaded, although you’ll need to download them before you can actively use them – you can’t edit online.

Using Twitter as a microblogging tool

What is Twitter?It’s a tool at http://www.twitter.com that allows you to microblog – broadcast content of 140 characters or less. You can subscribe to other people’s tweets, publish your own onto your weblog, search Twitter to see what people are talking about, keep up to date and so on.

Sign upGo to https://twitter.com/signup and you’ll need to choose a signup name, which will then also become your personalized URL at http://www.twitter.com/username Providing Twitter with your email details allows it to check to see if any of your contacts are already signed up. You don’t have to do this however, if you prefer not to.

You’ll then go to the Twitter screen:

And you can simply type in what you’re doing. This doesn’t do much as this stage because you’re basically just talking to yourself. So really what you need to do is find some friends that you can follow, and who can follow you.

At the top of the screen you’ll see:

25

Page 26: Web2practicalprojectsjune09

In the search box, type Phil Bradley and this should bring up my profile, with a picture of me, just to be certain. To the right there’s a ‘follow’ option, and you can click on that to follow anything that I twitter about. (You can always drop me later if you want to!) Under the search results box there’s also an option to email friends to see if they want to join.

If you want to follow a few more people, search for BBC and follow a newsfeed; they have lots. Or @DowningStreet to follow the Prime Minister.

When you want to send a message to a specific person start with d username and then your message. It will be sent directly to their email box. If you’re happy to chat rather more publicly, just include @username in the body of your message, and it’ll be brought more to their attention.

You can also search for content on Twitter (without registering for the service) at http://search.twitter.com/ to see what people are talking about, and this may give you more people to follow.

If you want some ideas for how librarians can use Twitter try http://tinyurl.com/2ljtmrIf you want some applications you can use, try http://twitterapps.co.uk/

Using Wallwisher to share contentVisit Wallwisher at http://www.wallwisher.com/

Create an account or login.Choose to create a new wall.

26

Page 27: Web2practicalprojectsjune09

Choose the various elements as preferred to create your wall and make it look how you want it. When you have created your wall, double click anywhere on it to add content:

Please try this out using my Wall, and add some content to it http://www.wallwisher.com/wall/philbradley

Creating an online surveyVisit SurveyMonkey at http://www.surveymonkey.com and register. (No online validation is required – just go in and use it!) Follow the onscreen instructions:Enter a title, then create the survey.

Choose your first question, and then question type.

Add in your question and possible answers, depending on the question type that you have chosen. Feel free to explore the different types of question before deciding on your type.

Ask some questions, prepare some answers. When satisfied, click the Preview survey (top right) and make sure that it’s what you’re expecting. Next, click on the ‘collect responses’ tab to choose the way in which people can access the questions.

You can then choose if you wish to email the survey to people, or to link to the survey. As a quick tip, click on the link, go to the question page and cut and paste the URL. Then visit http://www.tinyurl.com and create a short link to make things more manageable.

27

Page 28: Web2practicalprojectsjune09

The link for my Web 2.0 questionnaire is at http://tinyurl.com/ko4t6f Please do feel free to visit it and add your own responses – it’s entirely anonymous, so do be honest!

Creating a Google Maps mashupGo to Google maps at http://maps.google.co.uk/ and login if you have a Google account. If not, you’ll need to create one. Click on ‘My Maps’ (top left)

Then click on ‘Create new map’ and give it a title and description.Next, move around the map and use the tools to add places, draw lines, shapes etc.

Add a place with the pin option and then add in details about it using the dialogue box:

You can add in an image by clicking on Rich Text. Find an image in Flickr that you can use (Advanced Search using Creative Commons), click on all sizes, copy the URL. Click on the Add image option and paste it in.

28

Page 29: Web2practicalprojectsjune09

When you’ve finished editing, click on Done (left hand menu off the map) and you’ll have your map saved.

You can then invite others to Collaborate and/or click on the menu option Link to embed the map on another webpage, site or blog.

Other interesting applicationsCl1pThis is a resource that allows you to quickly share web space with other people, or just to store content for yourself. It’s great when you’re looking to cut and paste content between machines or people. Simply go to http://cl1p.net/ and follow the instructions, or just jump right in at http://cl1p.net/textyouaddhere to immediately create your own. You can just use the page, or you can register and own the page.

ChatmakerCreate your own chatroom in seconds with http://www.chatmaker.net/ Go to the site, fill in the section where you decide on the name and you’ve created a chat room. It’s very basic, but it does the job.

29