Ed said:
It's happened, just as I feared. I asked for some help/advice in my
original posting, hoping for a clear way forward, but the result seems
to have generated a debate amongst yourselves about the pros/cons of
various protocols etc.
I really do want help from you guys. You know so much. But for me,
tarting from the beginning with no legacy systems to worry about, would
XHTML and CSS and a bit of javascript be a good basis on which to launch
a website?
So far, I am confused by all your replies to each other.
I really don't know how to proceed now?
Plain html will certainly be supported for a long time to come. Ignore
that debate unless you can figure out what XML is actually used for, I
still don't understand it.
Skip the java, some people don't have it & it's just another complicated
thing to learn/screw up. If you use any make it optional, not critical
to viewing the page.
Here's the authorative reference material:
HTML specifications:
http://www.w3.org/TR/html401/
HTML validator:
http://validator.w3.org/
CSS:
http://www.w3.org/Style/CSS/#specs
CSS validator:
http://jigsaw.w3.org/css-validator/
Get an editor with color coding & automatic indenting as recommended by
others & keep things real simple, validating often to learn it right the
first time. Use indenting & tidy coding to keep things very clear and neat:
<html>
<head>
<meta name="Author" content="Ed">
<meta http-equiv="Content-Type"
content="text/html;
charset=iso-8859-1"<title>Ed's Page</title>
</head>
<body>
<h1> Ed's Family Page </h1>
<ul>
<li>
<a href="page1.htm" title="index page">Home</a>
</li>
<li>
<a href="page2.htm" title="second page">Page2</a>
</li>
</ul>
<h2> Intro </h1>
<p>
introductory paragraph
</p>
<p>
second introductory paragraph
</p>
<h2> More info </h1>
<p>
another paragraph
</p>
</body>
</html>
Don't worry about presentation & layout, use CSS for that later. Don't
use lone <p> or <br> tags for line breaks, you can format it later. The
<h1> is the main header for the page, don't worry that it makes line
breaks bigger than you want or is too bold or whether it's centered or
not. I showed a page menu as a list which is what it should be
logically, later you can make it line up horizonatally across the page &
take the bullets off. Think of this as a technical outline using html
tags for the logical structure.
Now reference an external CSS file in the head & start setting the
presentation. in CSS you can make all the <h1> text your favorite color
of green (or all text for that matter) and take out the annoying extra
spaces, make it a bit smaller, center it, etc.
<head>
<link rel="stylesheet" type="text/css" href="ed.css">
</head>
If your uncle views your page on his palm pilot or cell phone he won't
see any of this but the logical structure in the raw html will read
sensibly and be easy for him to follow.
ed.css:
body {
color: white;
font-family: Times New Roman, serif;
margin-left: auto;
margin-right: auto;
}
h1, h2, h3, h4 {
margin: 0 0 0.2em 0; /*top right bottom left*/
padding: 0;
color: green;
}
h1 {
font-size: 2em;
}
h2 {
font-size: 1.5em;
}
p {
margin: 0 0 0.2em 0; /*top right bottom left*/
padding: 0;
}
Use "em" or % as your scaling unit (not pixels or points or inches), an
"em" is equal to the size of one text character, because people will use
different font scaling on different computers. You can never really
control things, just set rules for how people will fit things into their
browser windows. Try changing the text zoom periodically to see if
things still work.
Keep it simple and clean and ask here how to add each new trick you want
to learn & make sure you are doing it correctly. People won't complain
if you have clean code and you won't end up copying things wrong all
over making a mess to clean up and won't learn bad habits. See who is
smart & steal their techniques! Use view > source to steal people's code
from any web page, look for their external CSS file in the head to steal
that, it's OK to steal in bits & pieces gradually, really it is.
Learn some real basic server side scripting techniques to duplicate your
header & menu to all the pages for easier updates. Just a very simple
"include" statement is all you need. Use PHP for that if your host
supports it.
When making links, don't say ["click here" for my hobby page], instead
say [this is my "hobby page"] so the link text makes sense. "Click here"
is meaningless.
