User:Vtaylor/CIS 89A HTML and CSS/CIS89A - Text

A few words - Text
 * Most web pages include a lot of text, it is important to know how to format text for readability and searching. Most visitors skim to find the information they are looking for. So it is important that pages of text are attractive and well organized.

Learning outcomes
 * consider onscreen readability of text
 * provide printer-friendly version of page
 * organize content with natural divisions and headings
 * arrange information in columns
 * understand accessibility issues for people with disabilities

Keywords
 * readability, text style, .PDF, paragraph, line break, quotation block, box, alignment, page layout, column, fluid, layer

Study notes
 * What contributes to the readability of a web page?
 * Why should you avoid underlineing text on a web page?
 * What are three key things to remember when designing a printable version of a web page?

== ==
 * Wendy Willard - Chapters 4. Working with Text, 5. Page Structure, 6. Positioning Page Elements
 * HTML Dog HTML Beginner Tutorial
 * Visual Quickstart - 4. Text

Writing for the web
 * Writing for the Web - great collection of articles about writing for the web
 * Website Reading: It (Sometimes) Does Happen - When web content helps users focus on sections of interest, users switch from scanning to actually reading the copy. Users go to websites for information. Users scarcely read anything during an average website visit.
 * Plain Language/Writing for the Web - at HoTo,gov - yes, that government.
 * Say What You Mean (video 2:00) - not specific to the web
 * Readability Calculator - useful tool for checking the readability of your content. You have to know what the indices represent and what is appropriate for your target audience.

Accessibility, adaptive technology
 * How does Technology affect Education (video 7:00) - facts, observations.


 * Dyslexic and visually impaired..


 * Least Restrictive Environment - how using technology can make learning more accessible to learners with disabilities

Privacy
 * You're Being Watched - even if someone isn't trying to steal your identity, they still want to know everything about you so they can place advertising where you are likely to see it.
 * Here's How Easily Someone Could Hack Into Your Life (INFOGRAPHIC) - If you're reading this, there's 69 percent chance you will become a victim of hacking at some point in your lifetime. And if you think protecting yourself is as easy as changing a couple passwords and installing some anti-virus software, you're 100 percent wrong.
 * Identity Theft: How To Avoid It


 * Identity Theft: What To Do If It Happens

== Assignments== Assignment file name and required elements
 * cis89text1 - strong, font-family, small, larger, italic, h1, h3, div, nav, aside, p, br, pre, box, align, margin, z-index


 * 1) Review the Keywords and Study questions at the top of this page. These will help you look for important ideas in the rest of assignments for this module.


 * 1) Read  Chapters 4. Working with Text, 5. Page Structure, 6. Positioning Page Elements  in the textbook.


 * 1) Writing for the web - Pick one of the articles listed in Writing for the Web. Write a short review of the article you selected and post it along with a link to the article in the Writing for the Web discussion. Review articles in the posts of 1 other student and provide feedback.

.. AbilityHub - http://www.abilityhub.com .. Abledata - http://www.abledata.com/ .. Indiana University also has a site with a lot of information on AT - http://www.indiana.edu/~iuadapts/sitemap.html There is a great site from Fresno State that explains (with quicktime videos!) a number of strategies to design "access-friendly" websites. http://www.calstate.edu/accessibility/resources/
 * 1) Adaptive technology - It is important for web developers to understand both the limitations and the powerful tools provided by technology so people with disabilities can use the web. The result may be different but accessibility can be much greater if the web developer understands Adaptive Technology. Here are some websites with good information on Adaptive Technology.

Try one of the simulations. Does it work on your computer? Does the simulation give you a better understanding of the problems faced by computer users with vision disabilities? Then post a link to the simulation you tried and describe your experience in 2-3 sentences in the Accessibility Simulations discussion. Review the simulations and comments of 2 other student and provide your feedback.
 * 1) Accessibility - WebAIM has created several simulations in Shockwave that demonstrate web content accessibility problems for people who have vision disabilities. http://www.webaim.org/simulations


 * 1) Learning Literacies - Make it - Creativity and Innovation. Is it possible to learn to be creative or innovative. Many authors think so and provide some suggestions for getting those creative juices flowing. Review 2-3 articles in the Make it  - media selections. Post a link and a brief summary of 1 to the Learning Literacies - Make it discussion. Review 2 others.

How did you do? Were you surprised by the result? Post a short note to the Connect Quiz discussion.
 * 1) Privacy, online identity, digital footprint - Digital Footprint - the record or trail left by the things you do online. Your social media activity, the info on your personal website, your browsing history, your online subscriptions, any photo galleries and videos you’ve uploaded — essentially, anything on the Internet with your name on it. Just like a tattoo, your digital reputation is an expression of yourself. It's highly visible, and hard to remove. Explore how your online identity affects you, your friends, your school and your job - for better and for worse - and how to make informed choices. Take the self-assessment at Connect Quiz: What Do You Think? http://digitaltattoo.ubc.ca/connect-quiz/


 * 1) Web Literacy - In the Exploring description, review the skills associated with   Security - Keeping systems, identities, and content safe.  How are you doing? Do you have these skills? How do you get them? Why are these particular skills important? In the WebLiteracy - Exploring discussion, post ONE senetence about your understanding and skills in the Security area.

Visit the boards selected by 2 other students and comment.
 * 1) Test drive - Pinterest is a popular social bookmarking site. Contributors "pin" their favorite sites to their "boards". Usually each board has a theme so all the pins will be related to that topic of theme. What makes Pinterest appealing is the attractive display of links arranged with an image from the linked site. Pick 2-3 Pinterest boards and post links and brief descriptions of the theme to the Pinterest discussion

Using the original web page layout as a guide, add text formatting so the text is readable. Save the file as cis89text1. Please include the assignment file name and the requirements information as a comment in your web page. Copy the line above and include it as a comment.
 * 1) Working with text - Find a web page that provides some useful information associated with your interest and your Personal Learning Network (PLN). You need some text to format, so you can copy some existing text, or you can write your own. Select 4-5 paragraphs of text and copy the text to a new Thimble page AND include the web address of the page you are copying from. Or you can write your own text if you prefer. The text will look like a big jumble of words.


 * 1) Page structure, Positioning elements - In the same file, use the assignment elements and tags to reformat and organize the text. You can add more text if you need to. For this assignment, the text isn't as important figuring out ways to use all the elements and tags within your page. Save (publish) the final version.
 * 2) Submit the full web address of your assignment file to the Text and Page Format assignment.
 * 3) Post a link to your assignment file and any comments or questions about the assignment to the Text and Page Format discussion.

== Learn more...== CSS - There are three ways to apply CSS to HTML: In-line, internal, and external.
 * Applying CSS

div - used to group together a chunk of HTML and hook some information onto that chunk, most commonly with the attributes class and id to associate the element with a class or id
 * Span and Div
 * Sectioning
 * Class and Id Selectors

aside - used to represent content that is related the content surrounding it. Think of pull-quotes or snippets of related information in an article:
 * Sectioning

nav

box

z-index