Posted by AGw. (Usenet) on 01/18/08 18:19

On Jan 18, 2:51 pm, Andrew H <ahods...@gmail.com> wrote:

Friendly advice, to heed before someone says something rude to you:
The standard on this newsgroup, and on most other "technical" groups,
is to bottom post, not to top post.

> Wow, I really appreciate all of the responses I have received. I have
> updated the website, this time with a temporary homepage that links to
> the old photo gallery.

A couple of quick notes regarding the page as it currently is.

Firstly, when using the "img" element the general advice is that you
should always have a meaningful "alt" attribute. This provides text
for those users who don't get to see your image, such as the blind.
You may of course not consider this to be terribly important for a
personal web page that may not get much traffic; but I mention it as a
good habit to get into now, in case you find yourself creating other
websites in the future.

Secondly, you're (temporarily?) using an HTML table for layout; this
can be a bit of a "religious" issue for professional web designers!
Again, for a personal web page it's not really an issue, but using
tables does have the disadvantage that it gets you thinking about
layout in a particular way that (in my experience) makes learning good
CSS more difficult when you're just starting out. Ideally you should
only use a table for "tabular data" (basically, the sort of thing that
would have rows and columns if you were writing it out with pen and
paper).

> I definitely need to work on the site layout
> today. it seems to me that everyone here is agreed on the fact that
> it is better to use plain text files to edit the pages? So I have
> been avoiding fancy editing programs.

If you want to learn HTML, then it's definitely better in my view to
use a plain text editor, or perhaps a slightly more advanced text
editor that has handy features such as syntax highlighting.

If you do want to try out a particular piece of web design software,
the first thing I'd do is see how well it copes with you manually
editing your code (in the same way as you'd do using a text editor);
you'd be surprised how many web design products either don't allow you
to do this at all, or will add all sorts of weird proprietorial stuff
to your code, or will even rewrite or reformat your code when opening
a file (and before you use the program to edit it). Personally, I'd
leave it a while before checking any of these software products out,
though.

> I have the basic idea I think,
> at least in terms of html. The CSS I understand on this basic level,
> but I know there are classes and tags and divs, but I suppose, as you
> have pointed out, that is neither here nor there at this time.

CSS works by you defining rules for how particular HTML elements are
to be formatted. Using classes, ids, divs, and spans, gives you more
flexibility to how that actually works in practice.

Obviously it's useful to be able to distinguish between different
examples of the same type of element (for example, you might want
*this* paragraph to be blue, but *that* paragraph to be red), which is
where the "class" and "id" come into things.

Example HTML:
<p class="foo">This is one example paragraph.</p>
<p class="foo">This is another example paragraph.</p>
<p class="bar">This is a different example paragraph.</p>

You can have a CSS rule that applies to all paragraphs, like this:
p {
color: #0000ff;
}

That CSS will then make the text of all paragraphs (whether of class
"foo", or "bar", or with no class at all) display in blue.

On the other hand:

p {
color: #0000ff;
}

..foo {
color: #ff0000;
}

The above two CSS rules will make all paragraphs blue, except for
those with a "class" attribute of "foo" (which will instead be red).

The syntax for a CSS rule for an "id" attribute is slightly different
(you use a "#" instead of a "."), and in the HTML document you can
only use a given name for an "id" attribute just the once, whereas you
can use the same "class" attribute ad infinitum. Probably for now
it's best to stick with the "class" attribute, just to keep things
simple.

As for <div> and <span> elements, well you use these for when you need
to format something in your HTML that doesn't already have a
convenient element; for example, you might want to format a particular
word in a different way from the rest of its containing paragraph:

HTML:
<p>This is an example paragraph. The word "<span id="fred">wibble</
span>" will be formatted differently to the rest of this paragraph's
content.</p>

CSS:
#fred {
text-decoration: underline;
}

Using the above CSS rule, the word "wibble" will be underlined even
though the rest of the paragraph won't be.

The "span" element is used for defining in-line stuff you want to play
with, whereas the "div" element is used for block-level stuff:

HTML:
<div class="introductory">
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
<p>This is a third paragraph.</p>
</div>
<p>This is a fourth paragraph.</p>

CSS:
..introductory {
color: #ff0000;
}

The above CSS rule will make the first three paragraphs red, but the
fourth one will be left alone.

Basically your first step when coding should be to use HTML to mark
out the logical structure of your document, and only after that would
you add any necessary div or span elements that your CSS wouldn't
otherwise work without. In my example above, you could get rid of the
"introductory" div by instead using a class attribute with each of the
three paragraphs; in other cases, though, it'll be a div or nothing.

> I am still waiting to have my site moved, but I have been working on
> getting the basic layout up and running for now, working with tables,
> etc. I imagine my next move is to just put up the content first, in
> separate html files, and then link to them, or should I work on the
> theme for the first page and then add others later?

I think the correct answer to that question is "whichever works best
for you", and the only way of finding *that* out is to choose one and
see how it goes! Learning theory is good, and "getting your hands
dirty" is also good. A hundred professionals might do it one
particular way, but they're them and not you.


--
AGw.

[Back to original message]