|
|
Posted by Andrew H on 01/18/08 14:51
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. 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. 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.
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 look forward to hearing from you
On Jan 18, 5:46 am, "AGw. (Usenet)" <freder...@southernskies.co.uk>
wrote:
> On Jan 17, 8:09 pm, dorayme <doraymeRidT...@optusnet.com.au> wrote the
> following skeleton code:
>
> > <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
> > "http://www.w3.org/TR/html4/strict.dtd">
>
> These two lines tell browsers that you're using version 4.01 Strict of
> the HTML specification, which is what all new web pages should be
> using (pace XHTML advocates).
>
> > <html>
>
> This tells the browser that the HTML code is now beginning.
>
> > <head>
>
> This tells the browser that what follows is the page header. All the
> stuff that goes here is informational and (the "title" element aside)
> is not displayed by the browser.
>
> > <title>My sister</title>
>
> This is the "title" element, and if you load your new skeleton page in
> your browser it should be obvious what the browser does with this!
>
> Note that if your page is bookmarked, this is what the browser will
> use as the default name for the bookmark.
>
> > <style type="text/css">
>
> This is telling the browser that you're using CSS to set out how you
> want your page to be displayed. All the CSS that you write will be
> going where I'm writing this, unless you set up a separate CSS file
> (which others here will no doubt explain how to do).
>
> > </style>
>
> And now you're telling the browser that you've stopped writing CSS,
> and have gone back to writing HTML.
>
> > </head>
>
> And now you've told the browser that you've finished giving it header
> information.
>
> > <body>
>
> Broadly speaking, this tag tells the browser that everything that
> follows is marked-up content. Your content will therefore go where
> I'm writing this.
>
> > </body>
>
> And now you've told the browser that you've finished giving it marked-
> up content.
>
> > </html>
>
> And now you've told the browser that you've finished writing HTML.
>
> Some further basic remarks:
>
> HTML is used to mark out a document's logical structure; CSS is then
> added to tell the browser how to display that document. In other
> words, HTML tells the browser that (eg) "this is a paragraph", while
> CSS tells it that "this paragraph is in Times New Roman, and is
> blue". If you don't use CSS then browsers will use their own default
> display settings, which (a) will look ugly to many people, (b) will
> differ between different browser vendors, and (c) can even vary
> between different versions (incl. platforms) of the same browser.
> Basically, browser defaults are there as a safety net, and should
> never be relied upon. Oh, and using CSS also allows you to do some
> more fancy sorts of layout design that would otherwise be impossible.
>
> An HTML document is broken down into "elements". Part of learning
> HTML is to learn what elements can be nested inside other elements,
> but the rules are generally pretty logical and easy to get the hang
> of; to give an example, a "p" element is a paragraph, so only occurs
> within the "body" element and not within the "head" element, because a
> paragraph is content, and content only goes inside the body.
>
> Elements are marked out using "tags". Some elements go in pairs, such
> as the <body> and </body> tags used to mark out the beginning and end
> of the body element. Others only have a single tag, such as the "img"
> element. Again, you'll find it easy to learn which are which, even
> though it's not always quite logical which elements get just one tag
> and which ones get both an "opening tag" and a "closing tag".
>
> Many elements also have "attributes", some of which are optional and
> some of which are compulsory; for example, the "a" (for "anchor")
> element is used to incorporate a link into your content, and naturally
> enough requires that you use an attribute to state what the link's
> destination URL is:
> <p>This is just some text I'm using as a dummy paragraph. If you
> include this paragraph in your skeleton code then you'll find that the
> word "<a href="http://news.bbc.co.uk">link</a> is in fact a hyperlink
> to the front page of the BBC News website. Note that I've done this
> using the "href" attribute of the "a" element, that there is no space
> on either side of the equals sign, and that the attribute's value is
> enclosed in quote marks.</p>
>
> Another very common element you'll be using is the "img" (for "image")
> element, which is simply used to include an image in your content.
> Here's an example:
> <img src="http://www.example.invalid/photo.jpg" width="40" height="60"
> alt="Text goes here for people who (for example) are using a non-
> visual browser" title="If users hover their mouse pointer over your
> photo and you want a tool-tip appearing with a description or other
> text, then it goes here">
> Obviously nothing will be displayed unless you've uploaded an image to
> your web server and have corrected the URL to point to it.
> Additional formatting information will be necessary to get the image
> in the correct position, and to get the text shuffling around it how
> you want.
>
> Another thing your page content will probably need is one or more
> headings, which can be placed in a hierarchy:
> <h1>This is probably going to be the very first thing in your content,
> and is roughly equivalent to the main headline on a newspaper's front
> page</h1>
> <p>You might then have some introductory text here.</p>
> <h2>You might then have a sub-heading here; for example, about the
> Republicans</h2>
> <p>Then you might have some text that relates to that sub-heading; for
> example, something talking about the Republican Party.</p>
> <h3>You might even have a sub-sub-heading; for example, about a
> particular Republican politician, or about a particular aspect of
> Republican policy</h3>
> <p>Naturally enough, your sub-sub-heading will have some text about
> it, which will go here.</p>
> <h2>You might then have another sub-heading here; for example, about
> the Democrats</h2>
> <p>And here goes the text that goes with the preceding sub-heading.</
> p>
> Note that in the above example, I've decided that a section of the
> content about the Republicans is logically equivalent to a section
> about the Democrats, so I've placed them at the same position on the
> hierarchy; ie, I've given them both an "h2" heading element. Sub-
> headings within those sections can then be given headings on the next
> level down the hierarchy, which in my example is "h3". How you decide
> to separate out your content is up to you, of course, although there
> should really only be one "h1" heading, and generally speaking you
> shouldn't really have gaps in the hierarchy (so you shouldn't jump
> from "h2" to "h4", for example).
>
> Finally, you can use comments in your code, like this:
> <p>This is some content</p>
> <!--This is a comment that won't be displayed in the browser-->
> <p>This is some more content</p>
>
> If you're already familiar with programming then you'll be familiar
> with "commenting out", which is a handy thing to use when
> experimenting with changes to your HTML.
>
> Hope this has helped just a little bit more!
>
> --
> AGw.
[Back to original message]
|