New Media Workshop

LECTURE: We will begin class with a discussion of issues related to online privacy, surveillance, censorship, and circumvention. Many resources related to this subject can be found in the Guide to Working from Mainland China.

For more resources about Internet censorship, see the OpenNet Initiative. For more about privacy and security, see Frontline Defenders Guide to Digital Security and Privacy. (These and many more resources are available here.)

LAB: In the second half of class, you will do the following:

• Each Soundslide team will embed their project into the Joomla website.
• The class will create a Google Map showing the primary locations where each Soundslide story was done.
• We will put that map on the front page of the Hong Kong Stories website.

NOTE: Your HKStories project deadlines were put back by a week, due to your instructor’s medical leave. They are listed on the class wiki and on the calendar. Please let me know if you have any questions.

HOW TO EMBED SOUNDSLIDES INTO JOOMLA:

Embed Soundslides into HKStories (Joomla):
We will use an “iFrame” plugin. Click here to see what the final result looks like.
If the URL of the soundslides project is http://web.hku.hk/~rmack/publish_to_web/ , then you need to type the following code into your edit area: {iframe height="550" border="1" frameborder="1"}http://web.hku.hk/~rmack/publish_to_web{/iframe}
So in other words, {iframe height="550" border="1" frameborder="1"}URL{/iframe}

This week in class we will be looking at different ways to visualise and present data.

In particular we will:

• create a 2-D bar graph in Adobe Illustrator
• create a 2-D pie chart in Adobe Illustrator
• export the charts from Illustrator for use in our blogs
• create a Google map (without any programming!)
• embed the Google map in a test blog post

Here is the data for you to use in the chart class work.
The Tutorials section contains a number of helpful links on these topics.

These tutorials are a step-by-step guide to the work you will be doing in class:

Creating pie charts and bar graphs in Adobe Illustrator

Creating a Google map and embedding it in your blog

Here are some other online tutorials:

• Illustrator Charts – another step by step tutorial
• 3D Charts in Adobe Illustrator CS
• liquidicity » Pie Charts in Illustrator
• Bartelme Design: Creating Graphs Part 1
• Bartelme Design: Creating Graphs Part 2

An example of a mashup using Google maps and Craigslist – Housing Maps Click on a city, select property type and you can find property within your price range with a direct link to the www.craiglist.com listing. A good example of the power of Google maps!

Collaborative Map:

Here is the URL for collaborative map which can be embedded into the HKStories site. You all have access to this map and can add markers which link to your articles.

Please check the wiki page listing your project deadlines and a breakdown of your topics according to subject-related sections.

In class today we will familiarize ourselves with Joomla and learn how to do the basic things necessary to complete your HKStories final project. We have some custom tutorials tailored to the exact setup of our website. Be sure to review them if you need to reminding about how to do anything you learned in class today:

• Posting on HKStories
• Page continuations
• Uploading Photos
• Adding and Formatting Photos
• Audio in HKStories
• Smoothgallery

The following are extras which we will discuss more in future classes:

• Slide Shows
• Video in HKStories

(Note: In class when we create “practice” entries we will use lipsum.com to generate dummy text and use the photos and audio at hkstories.net/nmw/)

A more general reference on Joomla is the Joomla! User Manual Chapter 4 (PDF – generic instructions written by the Joomla developer community for posting content from the front-end)

Before you make further plans for your multiple-media online story for your final HKStories project any further be sure to review the following resources from Mindy McAdams at the University of Florida:

• Online Media Types
• Using Online Media Types
• Chunks: Writing for the Web

The Elements of Digital Storytelling breaks down the different kinds of elements used in online journalism. It also includes some very useful examples. This class doesn’t cover all the skills needed to create the advanced multimedia examples, but reviewing these examples helps you think about online storytelling, and how the approach differs from print or TV. Berkeley’s multimedia story planning tutorial focuses on how to plan a story for a stand-alone website, rather than the contributions you’ll be making on a group website, but many of the concepts in terms of mapping out your elements still apply.

This week in class we will do three things:

• Use the Soundslides software program to create an audio-visual slideshow.
• FTP the completed Soundslides project onto hkstories.net, like this sample project.
• Embed the Soundslides project onto our blogs.

Instructions for embedding Soundslides into Uniblogs:
If (for example) the URL of the soundslides project is http://hkstories.net/YingChan_Vision/ , then create a new post in your Uniblog. Click on the flash or “f” icon. A window will open. Paste in this http://hkstories.net/YingChan_Vision//soundslider.swf (in otherwords URL plus //soundslider.swf) You will then be asked to enter dimensions. Enter 620 for width and 533 for height.

Useful Soundslides tutorials:

• Soundslides Slide Shows from the Knight Center
• Photopop Soundslides Tutorial
• Soundslides Tutorial Part 1 by Multimedia Shooter.
• Chaptered SS Tutorial by Multimedia Shooter.

Some good professional examples of Soundslides work (courtesy of Mindy McAdams):

• Guitar Lessons at the Central Area Senior Center: An 81-year-old Seattle woman loves taking guitar lessons. No narration, nice story, several interviews skillfully edited together.
• Cockfighting in Puerto Rico: Awesome photos, wonderful audio that puts you at the scene.
• Nutcracker: A fresh photojournalism grad tells us the story of a production of the Nutcracker ballet. She produced this while on an internship at The Gainesville (Fla.) Sun. Notice the variety in shots, scenes, lenses, etc. Notice too the excellent editing of the pictures to match the content of the audio. (Update, Jan. 29, 2008: Sorry, but the newspaper has apparently moved or removed this Soundslides. You can see the original photo story on the photographer’s bog here.)
• After the Riots: A Soundslides about the housing projects in Paris, by the British newspaper The Guardian. Exceptional storytelling and great use of sound.

JMSC student examples:

• Interview with candidate Ivy Chan
• Ada Wong discusses pet park

The New York Times multimedia page has great examples of audio slideshows.

You should study these as you prepare to put together your own Soundslides assignments.

This week we will be using Dreamweaver to create a simple web page. We will then learn how to upload the page to your HKU web space using FTP so that it will be visible on the internet. During the session we will look at the following:

Creating a web page with Dreamweaver

• the three layers of a well-constructed web page
• the language of a web browser – HTML tags and a recap of the simple page we created in week 1
• introduction to Dreamweaver – a tour of the interface
• our goal: a simple c.v. with an image
• using Dreamweaver to make our page

Uploading the web page and its assets using FTP

• what is FTP?
• how to use a browser for basic FTP
• FireFTP – a useful Firefox plugin
• uploading our new page and associated files
• viewing the finished page

NOTE:

All HKU students, in addition to having a HKU e-mail address, have a personal homepage. To access it type in http://www.hku.hk//YOUR_USER_NAME. Once you’ve confirmed where your homepage is, you can FTP your soundslides project onto it via Windows Explorer (only while on the HKU network) by following these instructions.

When not on the HKU network you can use the following guides to FTP material to a web page:

FTP using Internet Explorer 6
FTP using FireFTP for Firefox
Installing FireFTP for Firefox

Bonus : the magic of CSS

If time permits we will take a quick look at the power of CSS to give a web page visual appeal. Although it won’t be possible to present more than an overview, you will be able to see how a simple web page can be transformed with a few simple style rules.

• what is CSS and why is it important
• applying CSS to our web page
• comparison of the basic and styled pages
• the ultimate CSS playground – css Zen Garden examples, same HTML, different CSS

Today’s class gives only a very brief overview of Dreamweaver and how to create a simple website. If you’d like to learn more and get fancy with your web pages, you can try tutorials from Berkeley’s Knight Center and the J-Lab.

Note: The due-date for this assignment is March 17

• Interview one of your classmates about the topic of his or her final project.
• Edit this into a 3-minute audio segment.
• Create a blog post that includes three things:
  1. the audio file;
  2. a picture of the classmate;
  3. a picture he or she took related to his/her topic;
  4. Maximum 200 words describing the classmate’s topic and motivations for doing the topic. The text should not be a repeat of what was said in the audio segment; it should help to introduce the person and draw our interest to listen to the audio interview.

Grading criteria:

• Quality of the audio recording, showing that you did your best to record clear sound as possible using available equipment;
• Quality of the audio editing: is the editing smooth and seamless without abrupt beginnings, endings or choppy edits in the middle
• Audio plays correctly after you have uploaded it onto your blog (make sure you replay it to check!)
• Photo is correctly cropped, resized, and formatted in the blog
• Explanatory text is coherent and of professional journalistic quality

Examples of similar assignments from previous semesters are here and here.

If you’re doing your assignment from home, you need to download Audacity and the Lame Encoder. Click here for instructions on downloading Audacity, and click here for instructions on downloading and installing the Lame Encoder.

I do not recommend waiting until the night before the assignment is due to download Audacity. Save yourself a lot of grief and get your software situation set up in advance so that you can get help from Ben during his weekday working hours.

If you don’t remember how to do anything discussed in class, remember that you can refer to several handy how-to guides for audio editing posted in this week’s class notes. You can also refer to the photoshop guides posted in the Week 5 class notes.

With the help of guest instructor Joyce Wong, in class today we will learn to do the following:

• Record clear sound on an MP3 player
• Transfer sound files from the MP3 player to the computer
• Use Audacity to edit your sound file
• Export your edited sound file as an MP3 file
• Upload the file to your blog.

So just to be clear, for your in-class work today, you need to do the following:

• Record a very brief interview with the classmate sitting next to you
• Transfer the sound file of that interview to your computer.
• Use Audacity to edit your file
• Export your file as an MP3 from Audacity onto your desktop
• Upload the file to your blog and publish it.

Important resources for your future assignments using audio:

• Super-Fast Guide to Audio Editing (PDF) and Editing Audio With Audacity (PDF) by Mindy McAdams.
• Audio section of the J-Learning website.
• “Chapter 7: Digital Audio and Podcasting” from Journalism 2.0
• Handy Audacity Tutorials

If there is time at the end of class, Joyce will do a show-and-tell about online storytelling. Here are some examples of projects she h as done in the past, primarily for the Holocaust Museum:

• Life After the Holocaust
• Silent Witness
• Reconciliation + Reconstruction
• Yearbook 2006

Due on Monday, March 10th at 10am.

This assignment has three parts, all of which need to be documented and correctly linked in a blog post on your blog:

1. Create an account for yourself on Wikipedia. While logged in, add some new information to a page on Wikipedia that relates to one of your projects or Hong Kong’s environment in some way. It doesn’t have to be a lot of information: just a couple of new facts are fine, or you can correct or refine existing information. (If you really want to start a whole new Wikipedia entry about a subject that you think ought to be addressed but isn’t, you are welcome to do that too, but that is not required.) Then on your blog, link to the specific changes you made via the history pages. If somebody else makes changes to or deletes your contribution, please make note of this on your blog and link to any discussion that you might have with other Wikipedians about what happened. (If you have any questions or problems while doing this assignment be sure to contact Ben.) Then in a short paragraph please tell us what this experience taught you about Wikipedia. Has the experience of editing Wikipedia changed the way you view the credibility of its information?

2. In class we created a collaboration page for each soundslides team. Work with your teammates to devise a plan, schedule, and division of labor so that your project can be completed on time. On your blog, link to your team’s collaboration page and specifically to the contributions you made on it.

3. In class we created a resource page to collect online information related to your projects. Contribute at least two new links to it. On your blog, link to the history page or pages showing the contributions you made.

(Be sure that you are logged in under your own username when contributing to the class wiki.)

Today the class will be divided into two parts:

Part 1: We will use the class wiki to brainstorm about your Soundslides topics and final HKStories topics. We will also create a page for sharing online resources about the environment in Hong Kong. Your in-class work will be:

• to contribute your ideas to the class wiki
• help set up the collaboration page for your Soundslides project team

Part 2: Introduction to Wikipedia. How it works and how to contribute to it.

We’ll also watch this funny video about Wikipedia from Stephen Colbert.

Be sure to check out these references. These will be useful for your Week 5 assignment:

• Wikipedia Welcoming Committee
• Wikipedia tutorial
• Wikipedia cheatsheet

Some good articles about Wikipedia and debates about its credibility:

• Donna Shaw, Wikipedia in the Newsroom, American Journalism Review, February/March 2008.
• Stacy Schiff, Know it all: Can Wikipedia conquer expertise?, The New Yorker, July 31 2006.
• Noam Cohen, Courts Turn to Wikipedia, but Selectively, The New York Times, January 29, 2007.

This week’s assignment is in preparation for the Week 5 class, when we will use a class wiki to map out story ideas and Soundslides project teams.

By 10am on Monday Feb. 18th your assignment is to write a blog post suggesting at least one idea each for your two main projects this semester:

SOUNDSLIDES PROJECT: You will divide up in groups of three people to complete one audio-visual slideshow, telling a story through pictures and sound. (Examples of professional and student soundslides projects below.) You can use narration or interviews, or a combination – it’s up to your team to decide what works best for the subject. Think about what environmental stories in Hong Kong would best be told as a slideshow instead of as an article or some other way, and suggest one or two ideas on your blog, linking to the online sources for your ideas when appropriate. Your group will be decided on Feb.18th in part based on common or overlapping story interests expressed in your blog post.

FINAL “HONG KONG STORIES” REPORT: At the end of the semester you will complete an individual online report using multiple media about an environmental issue or phenomenon in Hong Kong. It will combine text, links, pictures and/or graphics and audio, as appropriate. The written text is not supposed to be too long, the point is to show that you know how to tell a story in an innovative way by combining visuals, text, and audio. Suggest one or two ideas that you would like to explore in this format, for further discussion on Feb. 18.

NOTE: This is not a final commitment and your ideas can change upon further discussion with classmates, and as collaboration and research continues. You are just being asked to propose ideas which we will work with in the Feb. 18th in-class brainstorming session.

We will kick off class this week with guest photographer Ting-li Wang, who will evaluate and discuss your photography assignments.

Steve will then lead the class in learning the basics of Photoshop:

• which features you need to know for basic photo work;
• importance of appropriate file size, resolution, and quality.

Today’s in-class work, using at least one of the photos you took for this week’s assignment:

• Crop the photo
• Make necessary adjustments (levels, contrast, and color)
• Resize (maximum 300pixels wide for horizontal photos, 200 pixels wide for vertical photos)
• Save your photograph for the web, using appropriate resolution and quality.
• Upload your photograph(s) to your blog
• Format your photo so that it is justified left or right on the blog post, with descriptive text about the people and events in the photo wrapped around it.

RESOURCES:
The Knight Digital Media Center has a very handy Photoshop tutorial.

Other important Photoshop how-to’s from the J-lab:
Preparing Images and Photos for the Web
Checking and Changing Resolution
Getting Familiar with Photoshop I
Getting Familiar with Photoshop II
Editing Photographs

This assignment is due Jan. 4th at 10am. NOTE: It’s important that you add your photos to the NMW Flickr group as stipulated below, otherwise I won’t know whether you did the assignment!

• Photograph an event, situation, activity, activist(s) or phenomenon related to environmental issues in Hong Kong.
• Upload 3-5 of your best shots, which best tell the story of what’s happening, onto your Flickr account.
• Include notes with each photo describing who is in the photo and what is happening.
• Add the photos to the NMW Flickr group, and ALSO give them the following tags: environment, hongkong, jmschku, (plus any other tags you think are appropriate like “pollution,” “recycling,” etc.).

NOTE: You need to make sure that whatever it is you photograph involves people in some manner. A shot taken out the window of a polluted skyline will not be acceptable for the purposes of this assignment. Posed mug shots of environmental activists in their office are similarly unacceptable.

RESOURCES TO HELP YOU DO YOUR BEST JOB:
(You will not be tested or asked to write up these readings, but those who read them are likely to do the best work on this week’s assignment.)

• Journalism 2.0, Chapter 8: Shooting and Managing Digital Photos
• Hints from picture.com
• Digital Still Cameras from Berkeley’s Knight Digital Media Center.
• How to take pictures for online use from the Knight J-Learning website.
• Ten most common photographic mistakes by Andre Gunther.
• How to use Flickr by Mahalo
• How to use Flickr groups by Matt Nichols at Expert Village – part of a video tutorial series, How to Use Flickr to Share Photos Online.

LECTURE:

UPDATE: Guest lecturer photographer Siuki Yip has cancelled at the last minute. As substitute, we will go over two units from News U on photojournalism: “Best of Photojournalism” and “Language of the Image.” (Please set up accounts for yourselves at NewsU as soon as you get to class.)

We will also look at examples from here and here. Some other sites SK suggests that we look at are:

• SK’s blog
• Bobby Yip’s blog
• viiphoto
• eyepress
• HKPPA
• Chinafotopress
• amivitale
• alexiafoundation
• Getty Images
• Magnum Photos
• TIME photo essays

Brave volunteers:
Leanne took the photo at right in Hanoi four years ago. (click to enlarge)
Miao Nan
Sandra
Tessa Arcilla – in particular HK protest, Vietnam, and Hong Kong 2007.

LAB:
The second half of class we will learn the following:

• How to transfer photographs from digital camera to computer.
• Uploading photos from computer to your Flickr account
• Fundamentals of Flickr – how to use tags, how to join a group. Make sure you know about different privacy levels and settings.

IN-CLASS WORK:
In order to get full credit today for in-class work you need to do the following:

• Take a photo
• Transfer it from camera to computer
• Upload it successfully onto your Flickr account
• Add it successfully to the NMW Flickr group
• Add appropriate tags to the photo

IMPORTANT RESOURCES:

• Journalism 2.0, Chapter 8: Shooting and Managing Digital Photos
• Hints from picture.com
• Digital Still Cameras from Berkeley’s Knight Digital Media Center.
• How to take pictures for online use from the Knight J-Learning website.
• Ten most common photographic mistakes by Andre Gunther.
• How to use Flickr by Mahalo
• How to use Flickr groups by Matt Nichols at Expert Village – part of a video tutorial series, How to Use Flickr to Share Photos Online.

A lot of the assignments in this course build on top of each other. Everything is interconnected… kind of like the web…

Assignment 2 helps you to prepare for next week’s Assignment 3, and also to lay the groundwork for Assignment 4. All of these in turn help you to build up towards the soundslides project and final reporting project.

Assignment 2 has three parts:

1. Identify at least one event, situation, activity, activist(s) or phenomenon related to environmental issues in Hong Kong, which will be possible for you to photograph between Jan. 29 and Feb. 3 (for Assignment 3, due Feb. 4). Use the searching and web research skills that you learned from Steve in class today, though you may need to follow up with phone calls or e-mails to pin down your information and confirm that you have permission to photograph the event, people, place, or activity, if it appears that permission would be necessary in order to gain access.
NOTE: you need to make sure that whatever it is you photograph involves people in some manner. A shot taken out the window of a polluted skyline will not be acceptable for the purposes of this assignment. Posed mug shots of environmental activists in their office are similarly unacceptable.

2. Subscribe to feeds from websites and blogs, in addition to e-mail alerts when feeds aren’t available, that will enable you to keep on top of environmental news in Hong Kong, and which will help you in determining a possible story idea which you will be asked to propose in Assignment 4.

3. Write a blog post describing the event you have identified and how you managed to find out about it. How useful were your web research skills in finding out about this event, and to what extent did you need to resort to old-fashioned reporting techniques like picking up the phone and calling people? Which websites and/or blog feeds did you choose to subscribe to in your Google Reader and why?

IN PREPARATION FOR NEXT WEEK’S CLASS:
Sign up for an account on Flickr if you don’t already have one.

DON’T FORGET to bring your digital camera to next week’s class if you have one.
Also bring a USB “thumb” drive if you have one. (I suggest you buy one if you don’t have one – they are essential and inexpensive tools for digital journalists.)

Web 1.0 and Web 2.0

PART 1: (RM)

We will kick off the class with a discussion of our assignments and readings from last week. We will talk a bit more about the course schedule for the semester, and make sure everybody is clear about expectations and requirments for the course.

Note that all of your blogs have now been gathered by Ben into a special RSS feed which he has published to the web, and which you will subscribe to in your Google Reader during class today.

We will also go over Assignment 2 early on in today’s class, since everything you’re learning for the rest of the class will help you complete that assignment. That way, you can be thinking about how you will apply the things you’re learning right away – and make sure that you ask the questions you need to ask.

NOTE TODAY’S IN-CLASS WORK:
During class today we need to be sure you have done the following:

• Set up your own Google Reader account
• Subscribed to the class blog
• Subscribed to all your classmates blogs
• Subscribed to several news and/or blog feeds related to Hong Kong and the environment – the subject of our class project this semester
• Conducted some google searches along with Steve
• Track links to a blog post or article using Technorati

PART 2: (SF)

The rest of the class will be led by Steve. He will also guide you in doing the in-class work.

We start with a video, Web 2.0 … The Machine is Us/ing Us by Prof. Michael Wesch of Kansas State University’s Digital Ethnography project.

What is meant by these terms? And what is not! This video may be enlightening.

RSS and Atom

What is a web feed. What are they? http://en.wikipedia.org/wiki/Image:Feed-icon.svg

Google Reader

Google Reader - what is it and why use it? More information on how to use it here.

Subscribing to feeds. Organising your feeds into folders and using tags. Using Recommendations
Offline reading with Google Gears.

Google

What exactly is Google? How Google works – the three key areas involved (GoogleBot, Indexer and Query Processor).

Ranking of results – the PageRank algorithm, how to get a good ranking. What are cached results and Similar Pages?

Refining searches with operators, stop words and wildcards.

Searching for blogs

http://blogsearch.google.com

Again we can use filters and use operators. we can even subscribe to the queries themselves.

Technorati

Technorati has indexed over 112 million weblogs (December 2007).

“The basic idea is that Technorati is a tag based index of the blogosphere that allows you to do tag based searches of topics you are looking for.”

“Technorati is a tracking engine for the blogsphere. It lets you looks for trends, patterns and entries by different people on similar topics or issues. It does this by encouraging people to “tag” their entries. Tags are words or phrases that describe your individual posts (something like the categories on blogs but more focussed and narrow).

What is it? Video

Examples of basic usage.

Introductions, Overview (MacKinnon, Fleischer, Cheng. 30 mins)

• Meet your instruction team.
• Go over class schedule, requirements. Answer questions.

Why all journalists need web skills (MacKinnon, 30 mins)

Digital future for everybody: The big news at the World Editors’ Forum this year was that newpapers aren’t dying, but their future depends on having a strong website with innovative multimedia coverage. The New York Times, Financial Times, The Guardian, and the Times of London are all examples of newspapers with “integrated newsrooms” where reporters now work as much for online as for the newspaper. See the Digital Edge Awards winners for examples of some of the best online multimedia storytelling by newspapers.

Broadcasters are expanding into the internet : CNN, the BBC and AlJazeera all recognize the need for strong online presence… Some are finding that the internet helps them reach audiences they’re not reaching at all through the TV.

Many more new web-only operations are competing strongly with long-established news organizations. Yahoo! News and the Huffington Post are two very different examples.

Lecture to conversation: Professional journalists are increasingly asked by their editors to mix it up in the “blogosphere,” or as an independent journalist you might use a blog to market your talent, ideas, and work. As a professional you aren’t just competing with amateur bloggers. You can also work with them and find ways to contribute to the public discourse in complementary ways. Global Voices, a bloggers’ network I founded, is one example of how bloggers are cooperating with journalists. But it’s important that as a professional you are at least as comfortable on the web as the average amateur media creator. Which means you need to have a basic understanding of what we call “Web 2.0″ technologies.

Basic web literacy (Fleischer, 30 mins)

Internet

The internet – or INTERnational NETwork – is a worldwide interconnection of computer networks which has its origins in the early 1960’s. As with many technological advances (such as the tin can (Appert/Durand) its initial development was driven by the needs of the military. The launch of Sputnik by the Russians (1957) led to the setting up of ARPA (Advanced Research Projects Agency) and funding from them led to ARPANET – the first computer network in 1969.

Lengthy (but dry) early history is here

BBS (Bulletin Board System), USENET (threaded discussions), Email, FTP (File Transfer Protocol) all available in the 1960’s but only small, private networks. Gradually more and more small networks emerged but some experienced problems transmitting data using radio signals (eg AlohaNet in Hawaii). A solution was found which led to a cable standard that became Ethernet and this in turn spawned the rapid growth of Local Area Networks (LANs). LANs then connected to internet servers (first in academia then business) and the infrastructure then existed for something revolutionary.

Excellent overview of internet history is here

Superb 7-minute guide to internet history by Ethan Zuckerman

World Wide Web

Important to remember that the internet is NOT the World Wide Web (WWW). The Web is a huge collection of linked items (documents, images, multimedia etc) which are stored on web servers which are connected via the internet. The pioneer of the Web was (Sir) Tim Berners-Lee. In 1980 he worked at CERN in Geneva – then the largest internet node in Europe – and wanted to create a way for scientists to share technical data, results and documents. CERN weren’t interested. Berners-Lee went away and invented a way to transmit the documents from computer to computer (HTTP or Hypertext Transfer Protocol), a way to identify a computer (the URI/URL) and even a way to view the data (a browser called ‘WorldWideWeb‘). And after all that…CERN still wasn’t interested! So, in 1990, Berners-Lee distributed his code and ideas using the internet where it was greeted with great enthusiasm.

Now we have dozens of browsers (Internet Explorer, Firefox, Safari, Opera, Camino, Konqueror etc etc). Users connect there individual computers to a gateway server (either via a LAN, or broadband or dial-up). Each computer has a unique IP address (eg 207.46.197.32) and the current standard IP4 allows for 4.3 billion individual addresses. It is an amazing thought that there are only 1 billion addresses left unused – not enough to cater for all the new uses the internet is being used for (VoIP, Coke machines! etc). The new protocol is IP6 which allows for 340 billion billion billion address (which should keep everyone happy for a while!)

The web would be unusable if we had to remember IP addresses and the DNS (Domain Name System) was created to overcome this problem. DNS servers contain lookup tables of domain names and their corresponding IP address. So when you type http://207.46.197.32 into your browser a DNS nameserver will locate the correct IP address and direct the browser to the correct server.

Your contribution to the Web?

If you want to put your own information on the Web you need to create a document in HTML (Hypertext Markup Language). We will cover this later in the course but for now here is the most basic page you can make:

Example using notepad.

To publish your page to your own website you would need to buy a domain name (eg mygreatsite.com) and a hosting account (some space on a web server where your web pages reside. The all you do is use FTP (file transfer protocol) to upload the files to your server space. We will cover many of these things in the weeks to come.

== 15 min. BREAK ==

Lab: (75 mins)

• Using the Firefox browser.
• Setting up student blogs.
• Discuss this week’s readings & assignment

Useful resources:
Here are some useful tutorial videos on how to use the “Edublogs” system where your blog is hosted.
Click here for some pointers on controlling “comment spam” on your blog.

In-class work:

• Set up your own blog on Uniblogs.org.
• Email your new blog’s address to: jmsc.newmedia@gmail.com
• Publish a brief blog post introducing yourself, including at least one functioning hyperlink.

We will spend the first part of class going over your chosen topics for the final blog post. Each person will be asked to talk briefly about why you chose that subject and what you’ve found out about it so far.

After the break we will talk about censorship circumvention, privacy and anonymity. These are important issues for journalists to understand in any country – but in China they are especially important because many of you may work in China or travel to China for reporting at some point.

We will discuss the concepts, documents, and links outlined in my document: Working from Mainland China, which is linked from the left-hand side of this blog.

If you are interested in learning more about how to license your work under Creative Commons, or how to find and use other people’s CC-licensed works, please join us this coming Saturday morning for a Practical Workshop on Use of Creative Commons Materials organized by our very own Ben Cheng.

Here is the text of the announcement:

Creative Commons licenses are copyright licenses that let you share your work easily with other people all over the world – by making it “Some Rights Reserved” instead of “All Rights Reserved”. You can also remix and reuse creative works under Creative Commons licenses legally, without the fear of infringing others copyright.

In this workshop, you will learn about:

1) What is Creative Commons, how it works, and what is the value of Creative Commons for Hong Kong, and its policy implications.

2) Tips, tools and practical skills of using Creative Commons licenses – how to use Creative Commons licensed work, and how to publish your work under Creative Commons license.

3) The variety of creative works available in the Creative Commons including music, photos, educational materials, and others.

Organizer: Centre for Development and Resources for Students of The University of Hong Kong

Date: 24 November 2007 (Sat)

Time: 9:30 – 12:30am

Venue: Rm 305, HKU SPACE Admiralty Learning Centre

Speakers: Chong Chan Yau – Director of Student Development, Centre of Development and Resources for Students, University of Hong Kong

Rebecca Mackinnon – Assistant Professor of Journalism and Media Studies Centre, University of Hong Kong

Edmon Chung – Vice-Chairman of Internet Society, Hong Kong

Jack Qiu – Assistant Professor, School of Journalism and Communication, The Chinese University of Hong Kong

Ben Cheng – Convenor of Intellectual Property Issues Watch

Admission Fee: Free Admission

Registration: Please send your name and contact details to email: mklwong@hkucc.hku.hk, or phone: (852) 2857-8383 (Ms Melissa Wong) *Seats are Limited

Congratulations for all your hard work on Hong Kong Stories over the past week. This week we will have a “postmortem” discussion about how things went and discuss the final blog post assignment.

The BJ class will have a guest speaker from the South China Morning Post’s multimedia section.

Everybody should be proud of the fabulous job you’ve been doing covering the District Council Elections for our Hong Kong Stories website. Covering an election for the first time isn’t easy – and doing it for the web is even harder. We’ve all been learning a lot. For the historical record, here’s a screenshot of our site as it looked in the early hours of Monday (click to enlarge to full size):