Publishing Student Projects on the Web

1,027 views

Published on

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.

Published in: Technology, Design
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
1,027
On SlideShare
0
From Embeds
0
Number of Embeds
249
Actions
Shares
0
Downloads
9
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide
  • We’ll see more examples when we go over web publishing options.
  • What do the sideways arrows suggest?What do you expect from the first link? Last?
  • Take another look
  • Publishing Student Projects on the Web

    1. 1. PUBLISHING ON THE WEBRhetorical Principles & Web Publishing OptionsNotes for WRTG 3020 StudentsAmy Goodloe ~ Spring 2012
    2. 2. A FEW RHETORICAL PRINCIPLESFOR WEB DESIGNTips on Reader-Friendly Design
    3. 3. Core Design PrincipleDesign your web site so that it fulfills the expectations ofyour target audience regarding content, design, andusability. • 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
    4. 4. 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
    5. 5. 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)
    6. 6. Research with thermographic imaging shows that readerstend to read web pages in a more or less “F” shaped pattern,like this:
    7. 7. Common web page layout
    8. 8. Or
    9. 9. For example:
    10. 10. How do you “read” the placement ofthe items on the menu?
    11. 11. Many web readers have been“trained” to expect a homebutton on the far left and acontact button on the far right.(A “home” button returns readers to thesite’s opening page.)
    12. 12. Many web readers also expect on-site links along the left, and off-site links (if any) along the right.
    13. 13. These are just a few of the manyrhetorical decisions you’ll need tomake when you design a web site.
    14. 14. What message does the image convey?
    15. 15. 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
    16. 16. Didn’t “get” that message yourself?
    17. 17. No problem.The image also has pretty colors thatblend nicely with the rest of the site.
    18. 18. Don’t underestimate therhetorical power of pretty colors.
    19. 19. How much time do you want to spend reading this web site?
    20. 20. 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
    21. 21. WEB PUBLISHING OPTIONSTips on Choosing a Web Platform
    22. 22. 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?
    23. 23. Web Site Builders Overview ExamplesHosts: Weebly, Wix • http://aisldenver2012.weebly.c om/Best for: static web sites • http://gaygene.weebly.com/Pros: easy to use • http://perpetualrevision.weeblyCons: limited layout .com/ • http://siteshowcase.weebly.cooptions m/ • http://www.wix.com/onebead/p roject
    24. 24. Wikis Overview ExamplesHosts: Wikispaces, Wikidot • perpetualrevision.wikispaces.com • digitalstudents.wikidot.comBest for: growing web sites • genderbinary.wikidot.comwith collaborative editing • 56wrtg1150.wikidot.comPros: easy to use • 66wrtg1150.wikidot.com • techcommdesign.net/digital-Cons: limited layout literacy-reportoptions and themes
    25. 25. Blog Sites Overview Examples • perpetualrevision.wordpress.comHosts: Wordpress, Tumblr • slasheducationalresourceproject.tumblrBest for: frequently added .comcontentPros: more layout optionsand prettier themesCons: slightly steeperlearning curve
    26. 26. Zooming Presentations Overview ExamplesHosts: Prezi • prezi.com/a_tm7kcmlesp/top-10- lesbian-young-adult-booksBest for: non-linear • prezi.com/1zjqb7raya8h/lbgtq-content mythology-throughout-time • prezi.com/8t0rrju0b5g0/10-Pros: fancy zooming effect common-myths-misconceptions-in-Cons: not intuitive (until the-lgbt-communityyou watch tutorials)
    27. 27. Presentation Videos Overview ExamplesHosts: YouTube, Vimeo, • gendersex.net/blog/archives/enSlideShare d-violence-against-the-Best for: Multimedia content transgenderedPros: Appealing way to present • www.youtube.com/watch?v=kRvideo, audio, images, and 0CKynJbjkvoiceover • gendersex.net/blog/archives/reCons: Video editing comes with view-of-the-pinkerspelke-steeper learning curve debate
    28. 28. 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

    ×