DEVELOPING ONLINE CONTENT

Slides:



Advertisements
Similar presentations
Jeopardy Q 1 Q 2 Q 3 Q 4 Q 5 Q 6Q 16Q 11Q 21 Q 7Q 12Q 17Q 22 Q 8Q 13Q 18 Q 23 Q 9 Q 14Q 19Q 24 Q 10Q 15Q 20Q 25 Final Jeopardy Writing Terms.
Advertisements

Centre for the Enhancement of Learning and Teaching Supporting & Enhancing Online Teaching & Learning by Catherine Ogilvie Centre for the Enhancement of.
Website Design What is Involved?. Web Design ConsiderationsSlide 2Bsc Web Design Stage 1 Website Design Involves Interface Design Site Design –Organising.
Web Design Graphical User Interface Navigation. Website Prototyping Plan your website Take time to plan the goal And outcome for your site Based on target.
Technical Writing II Acknowledgement: –This lecture notes are based on many on-line documents. –I would like to thank these authors who make the documents.
INTERACTIVE BRAND COMMUNICATION Class 7 Creative Issues II: Creating Effective Online Advertising.
1 / 31 CS 425/625 Software Engineering User Interface Design Based on Chapter 15 of the textbook [SE-6] Ian Sommerville, Software Engineering, 6 th Ed.,
Designing Good Web Pages. Form versus Function A good website is a compromise between form and function. While creativity is encouraged, you have to meet.
 Ethos: appeal to credibility  Ethos is the author’s way of establishing trust with his/her reader  How do author’s establish credibility?
Week 1 - Introduction to Academic Writing in English Erica Cirillo-McCarthy Assistant Director of Graduate and ADEP Writing.
Website Design. Designing and creating different elements involved in developing a website for e- commerce can help you identify and describe the components.
Section 7.1 Identify presentation design principles Use a custom template Add pages to a navigation structure Section 7.2 Identify color scheme guidelines.
Writing Reports, Proposals, and Technical Documents By Laurie A. Pinkert.
1999 Asian Women's Network Training Workshop. A short discussion about Information Architecture.
CREATING AND SHAPING Web Page Design Chapter 2. Text Matters  Even though when thinking about building Web pages people think of design first, the heart.
Copyright © 2010 Pearson Education InternationalChapter Writing Reports and Proposals.
Evaluating web pages Stuart Lloyd-Green Celia Korvessis Lindsay Krieger Shane Sullivan.
Heuristic evaluation Functionality: Visual Design: Efficiency:
Good Web Design. The Four A’s of Good Design Accessible Accurate Appropriate Appealing.
Chapter 6: NavigationCopyright © 2004 by Prentice Hall 6. Navigation Design Site-level navigation: making it easy for the user to get around the site Page-level.
, Online Help, and Web Sites For the first time in centuries, the written word has undergone a quantum metamorphosis, leaping from the printed page.
© Prentice Hall, 2008 Excellence in Business Communication, 8eChapter Writing Business Reports and Proposals.
Interface Design.
Graphical User Interface (GUI) Web site Team Matix Proposal GC 215: Web Publishing.
Copyright © 2010 Pearson Education, Inc. publishing as Prentice HallChapter Writing Reports and Proposals.
Lecture 6 Title: Web Planning, Designing, Developing for E-Marketing By: Mr Hashem Alaidaros MKT 445.
Interface Design Web Design Professor Frank. Design Graphic design and visual graphics are equally important Both work together to create look, feel and.
Problemsolving Problem Solving – 4 Stages Analysis Design Development Evaluate (ADDE) Note: In this unit Evaluate is not covered in depth.
Introduction to Visual Rhetoric: The Basics Romberger.
Slide 1-1 The Web Wizard’s Guide to Web Design by James Lengel.
Chapter 20 Web Design. Copyright © Houghton Mifflin Company. All rights reserved.20 | 2 Chapter overview Gives an introduction to Web design Examines.
Introduction to Visual Rhetoric. Visual Rhetoric Definition Is the “how to” of visual literacy Visual rhetoric applies the rhetorical situation to decision.
© 2007 Pearson Education, Inc. publishing as Longman Publishers Chapter 12: Reading and Evaluating Internet Sources Efficient and Flexible Reading, 8/e.
Technical Communication A Practical Approach Chapter 14: Web Pages and Writing for the Web William Sanborn Pfeiffer Kaye Adkins.
1 Technical Communication A Reader-Centred Approach First Canadian Edition Paul V. Anderson Kerry Surman
Copyright © 2016 by Pearson Education, Inc. All rights reserved. Richard Johnson-Sheehan PURDUE UNIVERSITY Charles Paine UNIVERSITY OF NEW MEXICO Chapter.
Users and the Interface When designing an information system you need to have a clear idea of who the target audience is. If the target audience is an.
Information Architecture & Design Week 9 Schedule - Web Research Papers Due Now - Questions about Metaphors and Icons with Labels - Design 2- the Web -
Written Com THE 6 TRAITS OF WRITING.  The heart of the paper – what the writer has to say  Should be a topic that is interesting and important to the.
WHY DO YOU NEED IT? What is a wireframe?. A wireframe is… A wireframe is a simple visual guide to show you what a Web page would look like. Wireframes.
Technical Descriptions Considering Audience & the Rhetorical Situation Copyright 2011 © by Pearson Education, Inc.
AP Course Sequence Honors Written & Oral Communication Honors World Lit & Composition AP Language & Composition AP Literature & Composition.
Web Software Year 11.
The Successful Website
Section 6.1 Section 6.2 Write Web text Use a mission statement
GAT Preparation - the written component
Web Page Elements Writing For the Web
Learning Target.
Section 7.1 Section 7.2 Identify presentation design principles
Web Development A Visual-Spatial Approach
Evaluating Web Sites February 2012.
Writing and Thinking.
FATMA ISMED K1-09 Websites in ELT.
Designing Information Systems Notes
PBA Front-End Programming
Creating a Successful Web Presence
Web Programming– UFCFB Lecture-4
REGARDING CONTENT & PRESENTATION
Unit 14 Website Design HND in Computing and Systems Development
Warm Up 10/21 Just answer this one question today: what is the difference between editing and revising?
PBA Front-End Programming
HCI and Hypermedia/WWW
Multimodal rhetoric January 29, 2018.
Writing: Rhetoric and Relevance
Foundations of Technical Communication Module 2
Informative Essay.
Planning and Storyboarding a Web Site
Web Standards and Accessible Design.
Interface Design Interface Design
E-learning Projects Overview
Presentation transcript:

DEVELOPING ONLINE CONTENT HAMMERICH & HARRISON 2002

PRINT READING Vs WEB READING

THINKING GLOBAL

COLOURS: RED

TEXT IN THE CONTEXT OF DESIGN AND NAVIGATION

ORGANIZING A WEB SITE TWO PIVOTAL SKILLS: YOU KNOW HOW TO STRUCTURE INFORMATION SO THAT THE FLOW OF CONTENT IS LOGICAL AND COHERENT YOU’VE LEARNED TO WRITE/EDIT WITH THE READER CONSTANTLY IN MIND

ORGANIZING A WEB SITE ORGANIZING INFORMATION IS ABOUT DEMONSTRATING THE RELATIONSHIPS AMONG ITEMS IN SUCH A WAY THAT THEY ARE EASY TO FIND THERE IS NO SINGLE SOLUTION TO ORGANIZING ONFORMATION

ORGANIZING A WEB SITE 5 WAYS TO ORGANIZE INFORMATION: ALPHABET TIME CATEGORY LOCATION HIERARCHY EACH DIFFERENT METHOD OF ORGANIZATION THAT YOU USE WILL CREATE A DIFFERENT MEANING FOR USERS

HOW TO ACCESS CONTENT VIA: INFORMATION ARCHITECTURE (IA) NAVIGATION DESIGN (ND) GRAPHICAL USER INTERFACE (GUI)

INFORMATION ARCHITECTURE IA IS THE ORGANIZING OF INFORMATION INTO LOGICALLY RELATED GROUPINGS SO USERS CAN NAVIGATE EFFECTIVELY THROUGH THE CONTENT AND FIND THE INFORMATION THEY SEEK ARCHITECTURES CAN HAVE SIGNIFICANT EFFECTS ON USABILITY

INFORMATION ARCHITECTURE IA IS THE CREATION OF CONTENT WITHIN DESIGN, USING KNOWLEDGE OF COGNITIVE ISSUES SUCH AS LEARNING STYLES, AND SO FORTH, TO MAKE A SITE MOST EFFECTIVE FOR USERS (>STANDARDIZATION) IT IS THE OVERALL PROCESS OF DEVELOPMENT INCLUDING PLANNING, ORGANIZING, DESIGNING, DRAFTING, TESTING, GATHERING FEEDBACK, AND KEEPING CONTENT UP TO DATE

IA MODELS OF INFORMATION WEB SITES (1)

IA MODELS OF INFORMATION WEB SITES (2)

INFORMATION ARCHITECTURE IA HAS TWO DIFFERENT ASPECTS : CONTENT KNOWLEDGE MANAGER INFORMATION ARCHITECT/DESIGNER CONTENT STRATEGIST TECHNOLOGY DATABASE ARCHITECT NETWORKING ARCHITECT DATA MODELER

NAVIGATION DESIGN ND IS THE CONNECTION BETWEEN IA AND GUI THIS CONNECTION IS REPRESENTED BY LINKS: MAIN NAVIGATION LINKS SHORTCUT LINKS CONVERGING LINKS HYPERTEXT LINKS REDUNDANT LINKS

NAVIGATION DESIGN MAIN NAVIGATION LINKS: provide pathways to and from the main site sections. SHORTCUT LINKS: allow users to access important information without drilling down the site (e.g. Press Releases, Privacy Policy) CONVERGING LINKS: bring users from different locations to the same point HYPERTEXT LINKS: create additional connections REDUNDANT LINKS: are duplicated in the web page

PRIORITY OF NAVIGATION ELEMENTS

GRAPHICAL USER INTERFACE GUI IS WHAT THE USER SEES ON HIS/HER SCREEN FROM THE ‘HOME’ PAGE AND THROUGHOUT THE SITE. IT REPRESENTS THE ARCHITECTURE AND THE NAVIGATION OF THE SITE AND PROVIDE ACCESS TO THE TO THE SITE’S INFORMATION WITHOUT REVEALING THE ORGANIZATION BEHIND IT

GRAPHICAL USER INTERFACE GUI HAS 3 MAJOR FUNCTIONS: HELP USER TO DEVELOP A MENTAL MAP OF THE STRUCTURE OF THE SITE PROVIDE A GOOD OVERALL LOOK-AND-FEEL TO THE SITE ASSIST USERS IN REACHING THE INFORMATION THEY WANT

GRAPHICAL USER INTERFACE ELEMENTS OF A WELL-DESIGNED GUI INCLUDE: VISUAL METAPHORS (immediate comprehension) INTERNAL CONSISTENCY IN THE LOOK-AND-FEEL of different site sections, as appropriate for users CONSISTENCY IN THE USE OF ICONS (e.g. ‘Help’ button: text or icon) LACK OF CLUTTER (users can find easly what they need)

MIND MAPPING: IA REVEALED

A WEB MODEL

TRADITIONAL NAVIGATION PATTERNS THE TOP NAVIGATION BAR FOR LINKS TO CORPORATE INFORMATION, SEARCH ENGINES, AND SITE MAPS THE LEFT-HAND NAVIGATION BAR FOR MAIN CONTENT SITE SECTIONS BOTTOM-OF-THE-PAGE LINKS FOR UTILITY ITEMS SUCH AS POLICY LINKS, PRIVACY LINKS, COPYRIGHT STATEMENTS THE RIGHT-HAND NAVIGATION BAR FOR ADD-ONs SUCH AS ADVERTISING, SPONSORS, SURVEYS, OPINION POLLS etc

canlearn interactive website today http://www.canlearn.ca/eng/index.shtml

WEB WRITING STRATEGIES

E-RHETORIC. A NEW FORM OF PERSUASION THE WEB IS TRULY A NEW AND DIFFERENT MEDIUM, REQUIRING JUST AS MUCH CREATIVITY ON WEB WRITER’S PART AS ANY INFORMATIONAL PRODUCT BASED ON PRINT HOWEVER, WEB WRITER/EDITOR HAS TO ADJUST HIS/HER THINKING ABOUT MANY ASPECTS OF TEXT, FROM ITS DEVELOPMENT TO ITS PRESENTATION.

RHETORIC ARISTOTELE DESCRIBED RHETORIC AS “THE FACULTY OF OBSERVING IN ANY GIVEN CASE THE AVAILABLE MEANS OF PERSUASION LANHAM (1976:4) STATES:” RHETORICAL MAN IS TRAINED NOT TO DISCOVER REALITY BUT TO MANIPULATE IT” “LANGUAGE THAT IS ELABORATE, PRETENTIOUS, INSINCERE, OR INTELLECTUALLY VACUOUS” (American Heritage Dictionary)

RHETORIC IN THE INFORMATION AGE RHETORIC IS THE ECONOMICS OF HUMAN ATTENTION-STRUCTURES THE CONCEPT OF WRITING FOR THE WEB IS BASED ON THE RHETORICAL TRADITION, WITH ITS FOCUS ON PERSUASION THROUGH THE CHOICE OF WORDS, EMPHASIS ON THE AUDIENCE, AND AN UNDERSTANDING OF THE SITUATION IN WHICH THE WORDS WOULD BE PRESENTED

RHETORIC RHETORICAL STRATEGIES ARE: ORAL SITUATION: MODULATION AND PITCH OF VOICE, CREATION OF PAUSES, PHYSICAL STANCE, HAND GESTURE, EYE CONTACT etc. WRITTEN SITUATION: GRAPHICS (FONT TYPES, SIZE, COLOUR) AND VISUALS

E-RHETORIC WEB RHETORIC IS A COMBINATION OF ORAL AND WRITTEN TRADITIONS AND INCLUDES AS WELL MULTIMEDIALITY AND INTERACTIVITY IT ALSO INVOLVES QUALITY WEB CONTENT WHICH IS BASED ON THE FOUR Cs: CREDIBILITY CLARITY CONCISENESS COHERENCE

CREDIBILITY 5 CRITERIA FOR EVALUATING CREDIBILITY: AUTHORITY ACCURACY OBJECTIVITY CURRENCY COVERAGE AND INTENDED AUDIENCE

TIPS TO DEVELOPING ONLINE CREDIBILITY

CLARITY WRITING WITH CLARITY IS OFTEN REFERRED TO AS USING PLAIN LANGUAGE (INTERNATIONAL LANGUAGE) - A TERM WHICH MEANS MAKING TEXT UNDERSTANDABLE, PARTICULARLY GOVERNMENT DOCUMENTS THAT ARE USED BY THE PUBLIC

TIPS TO CLARITY IN ONLINE WRITING

CONCISENESS BEING CONCISE MEANS HAVING THE SKILL TO PRESENT A TOPIC IN THE MOST ECONOMICAL MANNER POSSIBLE, THAT IS, USING AS FEW WORDS AS YOU CAN BUT STILL MEETING THE USER’S NEED FOR INFORMATION THE AMOUNT OF ECONOMY REQUIRED OF WEB TEXT DEPENDS ON WHERE THE TEXT IS ON THE SITE AND HOW THE READER WILL USE IT

TIPS TO CONCISENESS IN ONLINE WRITING DETERMINE PRECISELY WHAT THE DOCUMENT WANTS TO TELL YOU, THAT IS THE THEME SELECT KEY WORDS OR THOUGHTS THAT WOULD BE THE BASIS OF MAJOR HEADINGS IN YOUR REVISED DOCUMENT BUILD SENTENCESAPPLICABLE TO THE THEME AROUND THE KEY WORDS ONLY USE ONE OR TWO KEY THOUGHTS PER SENTENCE. PUT THOSE SENTENCES IN A LOGICAL SEQUENCE TO CONVEY THE NARRATIVE OF THE DOCUMENT ADD SOME TRANSITIONAL WORDS TO MAKE THE ABBREVIATED TEXT FLOW SMOOTHLY (CONJUNCTIONS)

TIPS TO CONCISENESS IN ONLINE WRITING (CONT.) CONTINUE TO RE-WRITE UNTIL YOUR TEXT ACHIEVES THESE FOUR GOALS: YOU’VE REDUCED PRINCIPAL CONCERNS TO THE FEWEST WORDS POSSIBLE YOU’VE PROVIDED A COMPREHENSIVE VIEW OF THE SITUATION YOU’VE ENSURED THAT THE CONCEPTS OF CAUSE-AND-EFFECT ARE CLEARLY DIFFERENTIATED WHEREVER THEY OCCUR IN THE TEXT YOU’VE RETAINED A CLEAR SENSE OF SUBSTANCE AND QUALITY IN YOUR DOCUMENT

COHERENCE ALL PARTS OF THE TEXT CONNECT TOGETHER IN CLEAR AND LOGICAL WAYS, ENHANCING ITS ABILITY TO PERSUADE READERS. TEXTUAL COHERENCE OCCURS THROUGH 3 INTER-RELATED ELEMENTS: THE STRUCTURE OF INFORMATION THE TIES THAT HOLD TEXT TOGETHER USE OF THE USER’S BACKGROUND KNOWLEDGE

COHERENCE: THE STRUCTURE OF INFORMATION COHERENCE IN THE STRUCTURE OF CONTENT ON A SITE DEPENDS ON THREE IMPORTANT ELEMENTS: WELL-BUILT INFORMATION ARCHITECTURE INTERNAL LINKS THAT MAKE LOGICAL SENSE WEB PAGES THAT CAN STAND ALONE AS RHETORICAL UNITS OF INFORMATION

COHERENCE: THE TIES THAT HOLD TEXT TOGETHER

COHERENCE: THE TIES THAT HOLD TEXT TOGETHER (CONT.)

COHERENCE: USE OF THE USER’S BACKGROUND KNOWLEDGE TO CREATE COHERENCE, USERS CAN COMBINE THE TEXT AND THEIR PRIOR KNOWLWDGE IN FOUR WAYS: GENRE RECOGNITION UNDERSTANDING OF CONVENTIONS LANGUAGE KNOWLEDGE BACKGROUND KNOWLEDGE

TIPS TO BUILDING ONLINE COHERENCE

USEFUL RHETORICAL CONJUNCTIONS