Week 4: February 6 – 15
Topic: Typography on the Web
Assignments Due: February 15
This week we will develop the first of a series of instructional products that you can use in your classrooms, work places, or organizations. The netiquette page that you will create this week is designed to provide a group of learners with information and tips for polite communication on the Internet. This can include e-mail, discussion forums, or any other type of electronic communication. You never know how long an e-mail will circulate or who will read it. Things that are posted online can also be archived, printed, saved, or reproduced. It’s better to be polite than to be sorry. The netiquette page you develop might help to save someone from making a public and long-lasting mistake.
This week we will also learn some new CSS code for floating elements to position them on a Web page. This approach makes a page that is far more accessible to users who rely on screen readers to read the content to them. With CSS we can do away with the old table formatting that used to be the norm. We also separate formatting from structure. I think you will find the CSS float technique interesting. It is a common technique used by many Web designers and well worth mastering.
In this project you will create a page of netiquette rules for your students. If you do not have students then write a set of rules for students you have taught or might teach. Alternatively, you can make a netiquette page for other teachers, peers, or members of your organization. Netiquette rules specify acceptable behavior for Web-based communication. These rules can vary a bit depending on the audience.
Many people of all ages use the Internet and post information there. Some of this is positive, but some is not. A new form of aggressive behavior called cyber bullying has emerged. Sometimes kids post negative things about other kids and cause considerable emotional pain. Even teachers are the victims of cyber bullying. If the problem is due in part to simple ignorance of appropriate online behavior, then education could help the situation. After all, how do people learn what it means to be a good netizen who uses proper netiquette unless they are taught? Of course, people who know better can also misbehave online, but that is a different story.
If you search the Web for “netiquette” you will find many examples of rules of behavior. Some of these are geared toward the general user and some are for specific audiences. Use them as a guide and inspiration. Then, write your own set of netiquette rules or tips for your selected group of learners. For the project you will need a narrative and a set of tips or major points to serve as the content of the page. Use the instructor example as a guide when determining minimum amount of text to write. Please write your own original text for the netiquette page as described by the course policy for academic honesty. While you create the netiquette page you will format it using CSS. Use the instructor example as a guide, but create your own code.
The example has a callout box of text that is floated to the right side of the page. We use a callout as a visual element in text to draw attention to things like quotes, main points, related information, or anything else that you want to spotlight.
- Start by searching the Internet for the term “netiquette.” [http://www.google.com/] This will lead you to ideas and inspiration. This step is meant only to generate ideas. Please do not copy and paste from someone else’s page onto your own Web page. That is a form of plagiarism and violates the Academic Honesty policies at Boise State University.
- In Dreamweaver, create a new Web page called netiquette.html. Save this page in the 502 folder for your website. Please create your page and CSS style sheet from scratch. You can use the example for ideas, but please do not copy and paste from my example to your own project.
- Type your own set of netiquette tips or rules on your Web page. Prepare this for your own students or students you might teach. Alternatively, you can make a netiquette page for other teachers, peers, or members of your organization.
- Add a title to your netiquette page.
- Write a learner description and add it to your netiquette page so that we know something about the audience and context for the netiquette rules.
- Write a list of main points or tips for a callout box.
- There should be enough information to fill a page using middle of the road font sizes similar to the example. Use the instructor example as a guide to determine the minimum amount of text to use.
- XHTML requirements: In addition to the necessary tags required to create any Web page (e.g., html, head, body, etc.) The XHTML in your netiquette.html page should include a minimum of the following:
- title text between the <title></title> tags
- container div
- div for the main narrative section (main text is floated left in the example)
- div for the callout (callout box is floated right in the example)
- footer div
- Headings: h1 and h2 (add more levels if needed)
- span tags (at least one set)
- Create a new external style sheet and save it in the styles folder as netiquette.css. Link it to the head of your netiquette.html page using the same process applied to the 502.html page project from last week.
- CSS requirements: The CSS in your external style sheet should include a minimum of the following
- body and heading styles
- two or more font families applied in different places. In the example, I used one font family for the body and different font families for the callout and span tags.
- padding, margin, and border styles
- font size, font weight, and color
- text indent on two or more paragraphs
- float and clear properties (Use on the callout box, footer, main text, or anything else that is floated on the page.)
- Callout box: The callout box should highlight netiquette tips or main ideas that go with your page. The callout box is formatted with CSS and should include:
- float and clear properties
- optional text formatting such as background color and additional text formatting.
- Save and upload both the netiquette.html and the netiquette.css pages to the EDTECH2 server. The netiquette.html page should be in the 502 folder and the netiquette.css page should be in the styles folder outside of the 502 folder. Try typing the address to your page to open it from the server. Your page should have an address similar to the instructor example. However, the snelsonc part of the URL will be changed to your own user name (typically last name and first initial).
- Validate your XHTML. http://validator.w3.org/
- Validate your CSS code with the W3C CSS Validation Service at: http://jigsaw.w3.org/css-validator/
- Correct any problems with the code.
- I would suggest spell checking your page. Click the Commands menu then Check Spelling.
- If you make any additional changes, please be sure to save your pages and upload them to the EDTECH2 server.
- Open your 502.html page and create a link to the netiquette.html page.
- Post 502.html URL on the Assignment 4 Showcase discussion board to share with the class.
This entry was posted in EdTech 502
and tagged 502
, EdTech 502
. Bookmark the permalink