HTML Basics

HTML works in a very simple, very logical, format. It reads like you do, from top to bottom, and left to right. HTML is written with normal English text. What you use to set certain sections apart as headings, subtitles, bold text, underlined text, etc is a series of what we call “tags”.

Think of tags as making your structure.

Tag Format

All tag formats are the same. They begin with a less-than sign: < and end with a greater-than sign. What goes inside the < and > is the tag.

for example, to make a font appear bolder, I can use the tag “strong”.

HTML:

I like my words <strong>bold</strong>

APPEARS AS:

I like my words bold

other tags often used:

<p> (paragraph)
<br> (line break)/
<em> (emphasis / italics)
<strike> (strikethrough)

HYPERLINKS:

<a href=”URL”>text</a<

The core “skeleton” of an HTML page:

<html>
<head>
<title>Your Page Title</title>
</head>
<body>

This area will contain everything that will be visible through a web browser, such as text and graphics. All of the information will be HTML coded.
</body>

</html>

IMAGE TAGS:

Basic Image tag – <img src=”url”> (where url = the url of the image you want to show)
Image with sizing <img src=”url” width=”200″ height=”150″>
Align image left – <img src=”name” align=left> (substitute ‘left’ with ‘right’ to align it right)
Alt Tags – <img src=”url” alt=”short description of image”> (an alt tag tells the reader what they are missing if the image doesn’t load in their browser.
Image as a link – <a href=”link url”><img src=”url”></a> (where ‘link url’ is the url of the page you want the image to link to and ‘url’ is the image location).
Image with border – <img border=”1″ src=”url”> (the larger the number in the border “” the thicker the border)
Space Around Image <img src=”url” hspace=10 vspace=10> (hspace is the horizontal space and vspace is the verticle space. The numbers are the amount of pixels sounding the image)

Unordered Lists (usually bullet point type lists)

<ul>
<li>the first list item</li>
<li>the second list item</li>
<li>the third list item</li>
</ul>

Ordered Lists (usually numbered lists)

<ol>
<li>the first list item</li>
<li>the second list item</li>
<li>the third list item</li>
</ol>

for more see HTML for journalists

Advertisements

Class 2: Online writing and mobile reporting

courtesy of Corbis


Today in class, we’ll be discussing the principles and practices of news production online. More specifically, we’ll look at writing for the web.

You’ll be learning:

Some basic HTML tags (links, images, videos and light text formatting)
How to embed multimedia pieces into the body of a post
Effective headline writing for web audiences
How to effectively tag posts
Why linking within posts and trackbacks are important (and what the heck a trackback is)

You’ll be creating:

Your blog bio / choose a theme
A blog post (formulated from content you’ve already writtem) that features links, embedded photos and an embedded video.
You’ll also be Tweeting out your post

If time permits, you’ll publish a Twitpic

Homework:

PS: If you’ve got some time, feel free to preview the Online News writing article we’ll be going over in class – and if you haven’t shot me over a link to your blog and Twitter handle, please do so ASAP so that I can add you to the blogroll.

-Lauren

Class One: Twitter, WordPress and MoJo for Noobs.

    Agenda:

Introductions
Class Email List
Syllabus
What is Online Journalism?
Setting up our “sandbox”

journalists can now file stories from debit machines #blatantlie

Online journalism is defined as the reporting of facts produced and distributed via the Internet. It’s interactive, participatory, spans geographical boundaries, inexpensive and fast – often, in real time: New School Journamalism.

    Getting Started with Twitter: Tips To Get You Started Right

“Success in the social web is all about listening, engaging, curating and sharing” – Sree Sreenivasan

Why Twitter?

It’s not a waste of time – You control who you follow, who you list, how you tweet, what you tweet.

Getting More Out Of Twitter.

– Mobile Apps
– Desktop Clients
– Shrink Your URLs (save room for your message)
– Use Hashtags
– Understand the difference between RTs and DMs
– Use Lists
– Tweet Photos
– Searching (Twiangulate,

Set up your own Twitter Account and find people to follow (Listorious and MuckRack are great places to start. For more tips, see Mashable’s guide to Twitter.

    Wordpress Blog Setup

We’ll go over the steps of setting up our own blogs in class. These guides to getting started and wordpress basics are excellent resources.

    For Class 2:

– Read Chapters 1 and 2 of the course textbook.

– Please email your Twitter handle and blog URL to instructor by Monday: laurenoneil@gmail.com

– Bring in a soft copy of a news story you’ve written, either in the past or as part of this program

A dozen online writing tips

Originally published By Jonathan Dube at CyberJournalist.net – notes from Lauren are in {curly brackets}

1. KNOW YOUR AUDIENCE

Write and edit with online readers needs and habits in mind. Web usability studies show that readers tend to skim over sites rather than read them intently. They also tend to be more proactive than print readers or TV viewers, hunting for information rather than passively taking in what you present to them.

Think about your target audience. Because your readers are getting their news online, chances are they are more interested in Internet-related stories than TV viewers or newspaper readers, so it may make sense to put greater emphasis on such stories. Also, your site potentially has a global reach, so consider whether you want to make it understandable to a local, national or international audience, and write and edit with that in mind.

2. THINK FIRST  AND THINK DIFFERENT

Before you start reporting and writing, ask yourself: What is the essence of the story I am trying to tell? Then think about what the best way is to convey that story, whether through audio, video, clickable graphics, text, links, etc.  or some combination. Collaborate with audio, video and interactive producers. Develop a plan and let that guide you throughout the news gathering and production process, rather than just reporting a story and then adding various elements later as an afterthought.

Look for stories that lend themselves to the Web  stories that you can tell or differently from or better than in any other medium.

3. TAILOR YOUR NEWS GATHERING

Just as print and TV reporters interview differently because they are looking for different things, so must online journalists tailor their interviewing and information gathering specifically to their needs.

Print reporters tend to look for information. TV reporters look for emotion on camera, sound bites and pictures to go with words. Online journalists must constantly think in terms of different elements and how they complement and supplement each other: Look for words to go with images, audio and video to go with words, data that will lend itself to interactives, etc. . . {connect the dots! clickability, interactivity!}

Remember that photos look better online when shot or cropped narrowly, and streaming video is easier to watch when backgrounds are plain and zooming minimal. Tape interviews whenever possible in case someone says something that would make a powerful clip. Look for personalities who could be interesting chat guests. And always keep an eye out for information that can be conveyed more effectively using interactive tools.

4. WRITE LIVELY AND TIGHT

Writing for the Web should be a cross between broadcast and print  tighter and punchier than print, but more literate and detailed than broadcast writing. Write actively, not passively.

Good broadcast writing uses primarily tight, simple declarative sentences and sticks to one idea per sentence. It avoids the long clauses and passive writing of print. Every expressed idea flows logically into the next. Using these concepts in online writing makes the writing easier to understand and better holds readers attention.

Strive for lively prose, leaning on strong verbs and sharp nouns. Inject your writing with a distinctive voice to help differentiate it from the multitude of content on the Web. Use humor. Try writing in a breezy style or with attitude. Conversational styles work particularly well on the Web. Online audiences are more accepting of unconventional writing styles.

{note: Proper grammar and spelling are just as important online as they are in print. Substituting “ur” for “you’re” doesn’t work in any medium – not even Twitter!}

At the same time, don’t forget that the traditional rules of writing apply online. Unfortunately, writing quality is inconsistent throughout most online news sites. Stories suffer from passive verbs, run-on sentences, mixed metaphors and cliches. This is a result of fast-paced news gathering, short staffing and inexperienced journalists. This is also a big mistake. Readers notice sloppy writing and they don’t forgive. They�’ll stop reading a story and they won’t come back for more. Unlike local newspaper readers, online readers have options.

5. EXPLAIN

Don’t let yourself get caught up in the 24/7 wire-service mentality and think all that matters is that you have the latest news as fast as possible. Speed is important online. But people want to know not just what happened, but why it matters. And with all the information sources out there now, in the end it will be the sites that explain the news the best that succeed. Write and edit all your stories with this in mind.

6. NEVER BURY THE LEAD

You can’t afford to bury the lead online because if you do, few readers will get to it. When writing online, it’s essential to tell the reader quickly what the story is about and why they should keep reading  or else they won’t.

One solution is to use a “Model T” story structure. In this model, a story’s lead – the horizontal line of the T – summarizes the story and, ideally, tells why it matters. The lead doesn’t need to give away the ending, just give someone a reason to read on. Then, the rest of the story  – the vertical line of the T – can take the form of just about any structure: the writer can tell the story narratively; provide an anecdote and then follow with the rest of the story; jump from one idea to another, in a ‘stack of blocks’ form; or simply continue into an inverted pyramid.

This enables the writer to quickly telegraph the most important information ‘ and a reason to keep reading ‘ and yet still retain the freedom to write the story in the way he or she wants to.

7. DON’T PILE ON

Another story structure that has evolved online, mostly by accident, is what I call The Pile-On.

A common problem with online writing occurs in breaking news stories. In an effort to seem as current as possible, sites will often put the latest development in a story at the top – no matter how incremental the development. Then, they’ll pile the next development on the top, and then the next – creating an ugly mish-mash of a story that makes sense only to someone who has been following the story closely all day. Unfortunately, the only people who are usually doing so are the journalists. Few readers visit a site more than once a day. Remember this when updating stories, and always keep the most important news in the lead.

8. SHORT BUT SWEET

Most stories online are too long for a Web audience, and few readers finish them. Roy Peter Clark has written a wonderful essay arguing that any story can be told in 800 words – a good guideline for online writing.

But let that be a guideline, not a rule.  Readers will stick with longer stories online if there is a compelling reason for a story to be that long – and if it continues to captivate their attention.

Making readers scroll to get to the rest of a story is generally preferable to making them click. Online news users do scroll. If someone has clicked to get to a page, it’s generally because they want to read the story, and thus chances are high that they will. The Poynter eyetrack study showed that about 75 percent of article text was read online – far more than in print, where 20 to 25 percent of an article’s text gets read, on average. Print readers have less vested in any given story, because they haven’t done anything proactive to get the article.

9. BREAK IT UP

Larger blocks of text make reading on screens difficult, and you’re more likely to lose readers. Using more subheads and bullets to separate text and ideas helps. Writing should be snappy and fast to read. Keep paragraphs and sentences short. Like this.

Try reading sentences aloud to see if they’re too long. You should be able to read an entire sentence without pausing for a breath.

It also helps to extract information into charts, tables, bulleted lists and interactive graphics. Even a simple box with a definition or summary can help break up text and convey information in an easy-to-read format.

10. ELIMINATE THE GUESSWORK

People often don’t know what they’re going to get when they click on stuff. And people are not going to click on something unless they know what they’re getting.  When they click on something that’s not worth it, they lose trust in you as a source and are less likely to come back and click on things in the future. So make sure you tell people what they’re going to get.

Studies show online news users preferred straightforward headlines to funny or cute ones. Cute headlines didn’t do as good a job of quickly explaining what a story is about and thus discouraged online users from clicking through.

11. DO NOT FEAR THE LINK

Don’t be afraid to link. Many sites have a paranoid fear that if they include links to other sites, readers will surf away and never return. Not true! People prefer to go to sites that do a good job of compiling click-worthy links – witness Yahoo!’s success. If people know they can trust your site, they will come back for more.

At the same time, journalists have a responsibility to apply news judgment and editorial standards to the links they choose. Avoid linking to sites with blatantly false information or offensive content. Select links that enhance the value of the story by helping readers get additional information from the people behind the news.

And of course, link to related stories on your site, past and present. This is truly one of the advantages of the Web. By linking to other stories to provide context and background, writers have more freedom to focus on the news of the day without bogging stories down with old information.

12. TAKE RISKS . . . BUT REMEMBER THE BASICS

Online journalism is a new and evolving industry and we are writing the rules as we go along. Challenge yourself and your colleagues to question the way things are being done and to stretch the boundaries of what can be done. There are no rules, only ideas. Take risks. Try something different.

But don’t forget the fundamentals of journalism. Facts still have to be double- and triple-checked; writing still needs to be sharp, lively and to the point; stories should include context; and ethical practices must be followed. Don’t let the 24/7 speed trap and the new tools distract you from these basics.

With so many alternative news sources now at everyone’s fingertips thanks to the Web,  it is now more important than ever that we stick to the fundamentals of journalism to produce news people can trust, because in the end that’s what will keep people coming back for more.

Welcome!

Hi There,

I’m Lauren. Pleased to e-meet you if we haven’t yet been acquainted in meatspace.

This website will serve as a resource for members Centennial College’s JO-222 Introduction to Online Journalism class.

Here, you’ll find links to articles, tutorials, tips, tricks and additional resources intended to help you succeed in Online Journalism.

Please feel free to email me with questions, comments or concerns: (laurenoneil -at- gmail.com)