| Windows | Mac |
![]() |
![]() |
Most browsers these days can handle the space issue, but it can lead to problems and confusion...http://www.BillyBobTrains.com/BigChooChoo.html
the browser will add The Characters %20 to the url (%20 = space)
Eg.)
The address path and would look like this
http://uofgts.com/BasicWD/lesson%203.html
instead of
http://uofgts.com/BasicWD/lesson 3.html
| ; + = [ ] ' , \ " * \\ <> / ? : | . # |
3. Never
use a space in any file name
4. The "home" page is normally named index.html
but check with your provider as some name the home
page default.html
5. Make
sure all files have their proper
extensions
All the web pages MUST have
the extension .htm or .html
Photos,
graphics, etc must end
in .jpg, .gif or .png
open
the Finder
6. Keep the
files names short as possible.
The
very first line on
an html page is
always a <!DOCTYPE> description
Syntax:
<!DOCTYPE TopElement Availability "-//Organization//Type
LanguageVersiondefinition//LanguageCountry" "URL to stay in Standard
mode">
Correct syntax requires that the attribute values be specified without
attribute names, as in the following example:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN"> (If there is NO URL as shown
here, the
Browser is switched into Quirk Mode (Old rules mode))
Tag-Specific Attributes:
TopElement
This attribute specifies the markup language used in the document. The
default value is HTML.
Availability
This attribute specifies whether the DTD (Document Type Definition) is
publicly accessible or is
available as a system resource.
Values:
PUBLIC Indicates the DTD is
publicly
accessible; this is the default value
SYSTEM Indicates a local DTD
file or a URL that
points to a DTD file Organization
This attribute specifies the organization responsible for the creation
and maintenance of the DTD being used.
Values:
W3C or IETF
Type
This attribute specifies the type of object used in the page. The
default value is DTD.
Language Version
This attribute specifies the version of the markup language used for
the document. The default value is HTML 4.0.
Definition
This attribute defines the document type. If no value is specified, the
document can make use of any of the types.
Values:
frameset
For frameset
documents
strict
Supports
mainly style sheets
transitional Does not contain
frameset elements
Language Country
This attribute specifies the language used in the document (Spanish,
English, and so on). See the hreflang attribute for possible values.
DOCTYPES THAT WORK
So what DOCTYPEs should we use? Glad you asked. The following complete
DOCTYPEs are the ones we need:
HTML
4.01
STRICT, TRANSITIONAL, FRAMESET
<!DOCTYPE
HTML PUBLIC
"-//W3C//DTD HTML
4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">
XHTML
1.0
STRICT, TRANSITIONAL, FRAMESET
<!DOCTYPE
html PUBLIC
"-//W3C//DTD XHTML
1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
XHTML
1.1
DTD
<!DOCTYPE
html PUBLIC
"-//W3C//DTD XHTML
1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
Every HTML page contains special HTTP header information. This
information is used by the browser in the client computer or by the
server computer to perform a variety of tasks, or to pass additional
information back and forth between servers.
The <meta> element allows you to include additional HTTP
header
information about the document. This element is placed in the
<head> section of the document.
Syntax:
<meta
attributes events>
This attribute is used to include other types of non-header information
(such as the author, a description of the document, copyright
information, keywords, and so on) in the document. Search engines
usually look for the following names: author, copyright, description,
and keywords. Other possible names are generator, progid, robots, and
template.
Syntax:
<meta
name="value"
content=". . .">
author
Identifies the author of the document.
Example:
<meta
name="author"
content="Your Name">
copyright
An unqualified copyright statement.
eg
<meta name="copyright" content="Copyright description">
This describes the
document in the browser
window.
This is used by some
search engines to provide a document description to the users
performing searches.
Example:
<meta name="description" content="photographs of china">
A comma-separated list of
keywords used by search
engines to index the
document.
Example:
<meta name="keywords" content="planetarium, shows,
production">
Stick with
the basic Fonts:
These
fonts or
font-family's are available on any
Windows or Macintosh computer
Serif :
Georgia,
font-family: "Georgia", Serif
Times New
Roman
font-family: "Times New Roman", Serif
Sans-serif:
Arial,
font-family: "Arial", Sans-serif
Arial
Black,
font-family: "Arial Black", Sans-serif
Trebuchet MS, font-family:
"Trebuchet MS", Sans-serif
Verdana,
font-family: Verdana, Arial, Helvetica, Sans-serif
Monospace:
Andale,
font-family: "Andale
Mono", monospace
Courier
New
font-family: "Courier
New" , monospace
Display:
Comic
Sans
font-family:
"Comic Sans MS", cursive
Impact
font-family: "Impact", sans-serif
Use
San-serif for headings
Use Serif for body of text for easy reading
eg
Compare the two styles which do you like the best?
Serif typefacesMain article: SerifSerif, or "Roman", typefaces are named for the features at the ends of their strokes. Times Roman and Garamond are common examples of serif typefaces. Serif fonts are probably the most used class in printed materials, including most books, newspapers and magazines. Serif fonts are often classified into three subcategories: Old Style, Transitional, and Modern. Old Style typefaces are influenced by early Italian lettering design. Though some argument exists as to whether Transitional fonts exist as a discrete category among serif fonts, Transitional fonts lie somewhere between Old Style and Modern style typefaces. Transitional fonts exhibit a marked increase in the variation of stroke weight and a more horizontal serif compared to Old Style, but not as extreme as Modern. Lastly, Modern fonts often exhibit a bracketed serif and a substantial difference in weight within the strokes. Examples of these are Times, New Baskerville, and Bodoni, respectively. Roman, italic, and oblique are also terms used to differentiate between upright and italicized variations of a typeface. The difference between italic and oblique is that the term italic usually applies to serif faces, where the letter forms are redesigned. |
Sans serif typefacesMain article: Sans serifSans serif (lit. without serif) designs appeared relatively recently in the history of type design. The evolution of the sans serif font very likely stemmed from the slab serif font. The earliest slab serif font, "Antique", later renamed "Egyptian", designed in 1815 by the English typefounder Vincent Figgins was succeeded one year later by the first sans serif font, created by William Caslon IV. The evidence of this is clearly shown in the uniform strokes in the letter forms. Sans serif fonts are commonly but not exclusively used for display typography such as signage, headings, and other situations demanding legibility above high readability. The text on electronic media offers an exception to print: most web pages and digitized media are laid out in sans serif typefaces because serifs often detract from readability at the low resolution of displays. A well-known and popular sans serif font is Max Miedinger's Helvetica, popularized for desktop publishing by inclusion with Apple Computer's LaserWriter laserprinter and having been one of the first readily available digital typefaces. Arial, popularized by Microsoft, is a widely used sans serif font that is often compared to and substituted for Helvetica. Other fonts such as Futura, Gill Sans, Univers and Frutiger have also remained popular over many decades. |
This is a paragraph using the Georgia fontface size 4em aaaand it's greeen.
This paragraph has text of three different styles