People don't read web pages, they scan them. And people love scanning lists.
In this module you will learn how to:
All of these things help make your pages more readable which means more
communication between your client and their customers. More communication
usually translates into more sales which sounds like: ka-ching!
Demonstrate the different LIST elements.
Do a web search for: XHTML list tutorial
Complete the tutorial that appeals to you. If you find it very helpful you
may want to post a link out on the Discussion Area along with a brief paragraph explaining
why you found it a worthwhile tutorial.
Do a web search for: XHTML img tutorial
Complete the tutorial that appeals to you.
If it is a helpful web site you may want to post a link out on the Discussion Area
Take the self-quiz:List. You can take this quiz as many times as you
like to help you learn.
Keep in mind that it closes Thursday night.
This self quiz uses the same questions as the graded quiz so your efforts will
pay off with a great quiz score.
Watch this video Information R/evolution
Install IrfanView if you haven't already.
I have
several short tutorials
on this help page. Look for the
IrfanView section.
This is a very small (translate: FAST) image editor that allows you to convert to any
image format, resize, crop, change resolution, and remove red-eye. You can even create an automated
slide show that will run on any Windows computer and do batch editing to a group of photos.
It is also free!
Work through Tutorial:List - This tutorial covers displaying lists of objects, using horizontal rules to make a web page more organized, displaying images, and several tips and traps from the profession.
Complete
these self-quizzes based on the tutorial
(These are no-point quizzes to help you focus on the
important points of the tutorial.)
Quiz 01
- Displaying Lists and Horizontal Rules
Quiz 02
- Using Special Characters
Quiz 03
- Including Images on a Web Page
Quiz 04
- Tips and Traps for Web Programmers
Complete
Practice Lab:List
- Learn by doing.
Click on the graphic below to see what the finished practice
lab will look like:
How does Peter use a small image as a link so that
it goes to a full-size image? Use View/Source to find the answer.
Do a search (CTRL f) in the HTML code for: financialPage.gif
Note: This is NOT the project. Learning labs are designed to help
you learn. You will not be submitting this for grading. But, what you
learn doing this will be very helpful in successfully completing
the project in the Assessment Activities below.
If you have any questions or become frustrated doing this lab, please get in touch with me so I can help you work through
it.
OPTIONAL: Read the article What
is Web 2.0 by Tim O'Reilly , President and CEO of
O'Reilly Press and a major figure in the development of today's web and e-commerce. Think:
How will these ideas affect my future work job as web developer?)
Notice the use of the mind or meme map in the article.
OPTIONAL Get started with DreamWeaver.
Complete
the work in Introduction and Chapter 1 - Creating a DreamWeaver Web Page and
Local Site in
the DreamWeaver CS3 textbook.
Do each of the numbered steps. This will give you a good feel of the
working environment of DreamWeaver.
Use these activities to support what you have learned, not replace it.
DreamWeaver does a lot of work for you, but if you don't understand
the basic elements and tag attributes you won't be learning HTML.
DreamWeaver may change, but HTML will be the common skills whenever
you work with web pages.
Create your earlier Project:HTML using DreamWeaver.
I strongly recommend using the Code View of DreamWeaver as your main
editing mode, especially while you are learning XHTML in this class.
You can toggle back and forth between the Design View and Code View
using CTRL
~
| Activity | Due Date |
|---|---|
Take
the Quiz: Lists |
Before 11:55 pm Sunday, Feb 8th |
Complete
project:List
Submit as an assignment using D2L. |
Before 11:55 pm Sunday, Feb 8th |
All done? Good going! You are now making web pages. Go ahead and do something that's not as fun (like writing that Composition paper you've been putting off) and then come back and start working with the next module: SEO and GIMP |
--- |
TuxType - The faster you type the more valuable you are as a developer.TuxType is a free software program that will allow you to improve your typing skills and have fun at the same time. You can download the file here: http://tuxtype.sourceforge.net/download/
For just a minute imagine you are an employer deciding who to hire. Both candidates seem to be excellent programmers.
They both interviewed well, making good eye contact and each had a nice strong handshake. The first candidate types 30
word per minute and the other types 90 words per minute. Let’s say the position pays $30/hour… One employee
has the potential to produce over 3 times more than the other. Which would you hire?
So, how do you become that 90 wpm person?
I strongly recommend using TuxType, an open-source typing tutor, that is available on SourceForge. You’ll not only improve your typing speed but you’ll have a grand time doing it.
Here’s some tips on increasing your typing speed in 10 minutes:
Cognitive scientists have found out that not all our memory is in our brains. Virtually every cell in our body “remembers” things. Athletes have demonstrated this for years and call it "muscle memory".
You can use this to your advantage by practicing twice each day.
First, practice mindfully for 10 minutes every night
before you go to sleep. 10 minutes. No more. No less. Your brain and muscles will continue processing the information as
you sleep.
Then, when you wake up do the same practice for another 10 minutes. Mindfully means no distractions. No
iTunes, no TV, nothing. Just focus on the typing.
Your morning practice will reinforce what you learned the night before, telling your brain (and each muscle cell) that, “Hey, This is important!”.
Keep doing that every day of the week without fail and you’ll be typing a steady 90 wpm in no time.
Want to speed up your web work? Here's a file of common
HTML tags (tuxTypeHtml.txt) that
you can practice using TuxType. These words will help your fingers learn <, /, >, the three characters that slow
down almost every web programmer.
Installation: After you have installed TuxType, download this HTML text file e file by right-mouse clicking
on the link and selecting "save
file as" from the selection menu. Save the file in c:\Program Files\Tux4kids\Tuxtype2\data\words\
Questions? Send me an email: peter.johnson@southcentral.edu
Read my blog at:
http:webexplorations.com/blog
Strong Start, Successful Finish