HTML Primer for Technical Communicators TECM 5191 Dr. Lam

Poll Text ChrisLam138 to 22333

Agenda We’ll answer the following questions today: Why are we learning HTML? What is HTML? How do you write HTML?

Why HTML? “Sure writing, punctuation, grammar, and rhetoric are important, but every college graduate is expected to have mastered these basics. To be successful -- and to differentiate yourself in this ultra-competitive global market -- you have to step outside the traditional 'writing' role and master the concepts that are important in all types of communication.” – Scott Abel, content strategist/technical writer

Why HTML? “Stay current with new technologies and methods. Choose a secondary subject in which to develop expertise, such as social media or usability. As far as skills go, I would say to absolutely learn HTML/CSS and XML. I’d also suggest basic database design. Staying current is, to me, the most important consideration.” –Julie Norris, Technical Writer,

Why HTML? “Remember that the technical part of technical writer is just as important as the writer part. Sometimes, it can be even more important. Writing isn't always enough. You need other skills to succeed in this profession. Like what? Obviously, knowledge of the tools of the trade. Don't forget knowledge of technologies -- ranging from operating systems to the languages and processes what you're documenting. Don't discount interviewing, either. You need to know how to draw information out of sometimes tight-lipped subject matter experts (SMEs). Having a knowledge of technologies helps; you can speak the language of the SMEs, and by doing that they'll take you a little more seriously.” - Scott Nesbitt, Technical Communicator

OK, but really, why? Experts say so…but why else? Rhetorical argument: Writing on the web is for humans. When a computer generates the content, it doesn’t understand human needs the way you do. Functional argument: If you or your organization is publishing on the web, then it is being published in HTML. No exceptions.

What’s this?

WYSIWYG Pitfall Example

Better HTML

Both look the same(ish) So, what’s the problem?

So, what is HTML? Hypertext Markup Language It’s a way to mark up existing written language. It’s not really a language, but is more a system of tags. HTML is the language of the web (all websites use HTML to some degree) ALL. Of. Them. Tags serve to describe content stands for paragraph, used to describe a paragraph HTML is the structure of the content, NOT the visual layout or design of the content

Some HTML examples Web developer examples…

What makes a valid HTML document? 1. Doctype declaration Tells the parser (translator) what type of document it should be parsing 2. tag 3. tag 4. tag 5. tag

XHTML Rules Doctype is mandatory All tags that open must close Tags close in the opposite order that they open Elements must be lowercase Attributes must be lower case and quoted

Anatomy of HTML HTML is constructed of elements and attributes Elements have start tags and end tags. You put content in between them. This is content that goes in between a paragraph start tag and a paragraph end tag. All HTML elements can have attributes (but attributes are optional). Attributes provide additional information about the element. Attributes are lowercase and placed in between quotations E.g.,

Most-Used Tags? Poll

Common Tags Headings through Main content Paragraphs Bulleted lists to open the list for each list item Numbered lists to open the list for each list item Images but must have source of image file

Tools for HTML Text editor or HTML editor Notepad++ Sublime Text (mac) The difference between a proprietary file format and a non-proprietary one is that the tool itself has nothing to do with the production of the file. i.e., you need word to create a.docx file

Mark it up Mark up the first page of this document in valid HTML mples/instruxx2b.pdf mples/instruxx2b.pdf