publishing student projects on the web
DESCRIPTION
These notes are for a workshop I'm giving to a group of students who will be preparing web sites for their final course projects.TRANSCRIPT
PUBLISHING ON THE WEBRhetorical Principles & Web Publishing Options
Notes for WRTG 3020 Students
Amy Goodloe ~ Spring 2012
A FEW RHETORICAL PRINCIPLES FOR WEB DESIGNTips on Reader-Friendly Design
Core Design Principle
Design your web site so that it fulfills the expectations of your target audience regarding content, design, and usability.
• Content: Site should deliver on the promise of its title
• Design: Theme and images should complement message
• Usability: Layout should be based on how most users navigate web sites
Overall Design Principles• Choose a search-engine friendly URL and web site title
• Effective: bouldervegan.weebly.com• Ineffective: wrtgproject.weebly.com
• Organize content into logical parts• Use pages and sub-pages • On blogs, use categories and tags appropriately
• Provide clear and logical navigation menus • Along top OR on sidebar, not multiple places• Follow customary placement of navigation items• Give menu items short but helpful titles
• Follow CRAP/BS principles:• Contrast, repetition, alignment, proximity, balance, symmetry
Page Design Principles• Limit how much users need to scroll
• Use 13” laptop w/ maximized web browser window as basis• Home page: no more than 2 scrolls; other pages: no more than 3
• Design user-friendly paragraphs• Open with topic sentence • Stay focused on developing topic• Keep concise and SHORT!
• Design text to be skimmable• Use headings and sub-headings• Use bulleted or numbered lists• Use bold for maximum emphasis and italics for some emphasis
• Do NOT use underlining (on the web, that means: hyperlink)
Research with thermographic imaging shows that readers tend to read web pages in a more or less “F” shaped pattern, like this:
Common web page layout
Or
For example:
How do you “read” the placement of the items on the menu?
Many web readers have been “trained” to expect a home button on the far left and a contact button on the far right.
(A “home” button returns readers to the site’s opening page.)
Many web readers also expect on-site links along the left, and off-site links (if any) along the right.
These are just a few of the many rhetorical decisions you’ll need to make when you design a web site.
What message does the image convey?
Here’s what I was going for:
- iconic image of Marilyn Monroe is typically associated with cultural ideal of female heterosexuality
- rainbow gradient hints at a possible queer reading - repetition of image underscores performative nature of gender norms
Didn’t “get” that message yourself?
No problem.
The image also has pretty colors that blend nicely with the rest of the site.
Don’t underestimate the rhetorical power of pretty colors.
How much time do you want to spend reading this web site?
Principles Recap• Core:
• Design your web site so that it fulfills the expectations of your target audience regarding content, design, and usability.
• Overall:• Choose a search-engine friendly URL and web site title• Organize content into logical parts• Provide clear and logical navigation menus • Follow CRAP/BS principles
• Pages:• Limit how much users need to scroll• Design user-friendly paragraphs• Design text to be skimmable
WEB PUBLISHING OPTIONSTips on Choosing a Web Platform
A Few Considerations• What is the purpose of the site?
• Inform, persuade, encourage interaction, etc.
• Who is your audience?• How easily will they find the site?
• What format is your content in?• Text, images, videos, PDFs, etc.
• What role will team members play?• Does everyone need access to all aspects of site?• Will the site be used by teams in future classes?
• How much time do you have to learn a web publishing platform?
Web Site Builders
Overview
Hosts: Weebly, Wix
Best for: static web sites
Pros: easy to use
Cons: limited layout options
Examples
• http://aisldenver2012.weebly.com/
• http://gaygene.weebly.com/• http://perpetualrevision.weebly
.com/• http://siteshowcase.weebly.co
m/• http://www.wix.com/onebead/p
roject
Wikis
Overview
Hosts: Wikispaces, Wikidot
Best for: growing web sites with collaborative editing
Pros: easy to use
Cons: limited layout options and themes
Examples
• perpetualrevision.wikispaces.com• digitalstudents.wikidot.com• genderbinary.wikidot.com• 56wrtg1150.wikidot.com• 66wrtg1150.wikidot.com• techcommdesign.net
/digital-literacy-report
Blog Sites
Overview
Hosts: Wordpress, Tumblr
Best for: frequently added content
Pros: more layout options and prettier themes
Cons: slightly steeper learning curve
Examples
• perpetualrevision.wordpress.com• slasheducationalresourceproject.tumblr
.com
Zooming Presentations
Overview
Hosts: Prezi
Best for: non-linear content
Pros: fancy zooming effect
Cons: not intuitive (until you watch tutorials)
Examples
• prezi.com/a_tm7kcmlesp/top-10-lesbian-young-adult-books
• prezi.com/1zjqb7raya8h/lbgtq-mythology-throughout-time
• prezi.com/8t0rrju0b5g0/10-common-myths-misconceptions-in-the-lgbt-community
Presentation Videos
Overview
Hosts: YouTube, Vimeo, SlideShare
Best for: Multimedia content
Pros: Appealing way to present video, audio, images, and voiceover
Cons: Video editing comes with steeper learning curve
Examples
• gendersex.net/blog/archives/end-violence-against-the-transgendered
• www.youtube.com/watch?v=kR0CKynJbjk
• gendersex.net/blog/archives/review-of-the-pinkerspelke-debate
WORKSHOP• What tool do you want to try for your project?• What steps will you need to follow to use that tool?• How can I help you?
HELP RESOURCES• See the handouts on: http://digitalwriting101.net• Also search Google!• Questions? http://amygoodloe.com/contact