Website design for beginners

A

ahodsdon

Hello-

I am trying to design and build a website dedicated to my sister. I
have had the domain and web server for a little over a year now, and
during this time I have accomplished very little. This is due, in
part, to the difficulty in writing content, but it is more that I have
been overwhelmed by the number of web design and proprietary tutorials
that are all over the place. Frankly, every time I sit down to get
some work done, I spend 6 or 7 hours reading a bunch of tutorials and
accomplish very little and end up getting so confused that I give up.

So, what I am asking is this: Does anyone here have any suggestions as
to where I can find a decent tutorial, that will outline the initial
process and what I should be doing? I have so far ended up with a pre-
written forum, a different adobe photo gallery, and a home page. All
of these look different, there is no central theme. i have tried
using site.master pages, but that has not seemed to work and frankly
CSS confuses me (at least I understand what it is supposed to, though
implementing it seems to be a convoluted process).

I want to be able to use all of the features that I assume I need, but
I feel as though I get ahead of myself. Trying to learn SQL and PHP
or ASP.NET (only because I am familiar with C#) seems way more
complicated than I should be at, but I have yet to find a good
comprehensive guide that will at least get me on the right track and
let me know the first steps (i.e. web server file structure, what
folders are for what, whether to use Linux or Windows, Visual Web
Developer or Dreamweaver, or any editor at all.)

Anyway, I haven't posted in a forum for quite some time, so I imagine
I will get a RTFM response, but any help would be appreciated.

Thanks
 
P

Paul

Hello-

I am trying to design and build a website dedicated to my sister.
Click to expand...

Probably the site for your sister doens't need to be much complicated, so
you could build it in a simple way using the knowledge you surely have.

And about beeing a beginner...I am a beginner and autodidact surely more
ignorant than you.,
but I have written a personal ecommerce website that works very well, using
only html and some css. And reading tutorials and reading this news group, I
learn and improve my knowledge and correct my website in those wrong parts I
didn't know how to do before.

The same thing you could do: start simple, and improve after.
Paul
 
D

dorayme

<[email protected]
m>,
"[email protected] said:
Hello-

I am trying to design and build a website dedicated to my sister. I
have had the domain and web server for a little over a year now, and
during this time I have accomplished very little.
Click to expand...

Perhaps we can all make one together for your sister? Let me
start by contributing the following skeleton (which I expect to
see up on your web server and a url provided so we can all
continue on on this ode):

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>My sister</title>
<style type="text/css">

</style>
</head>
<body>

</body>
</html>

Now, what is it you want to actually say or show roughly? We
could have it up and running in a few days if you co-operate.
 
A

Andrew H

<[email protected]
m>,




Perhaps we can all make one together for your sister? Let me
start by contributing the following skeleton (which I expect to
see up on your web server and a url provided so we can all
continue on on this ode):

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>My sister</title>
<style type="text/css">

</style>
</head>
<body>

</body>
</html>

Now, what is it you want to actually say or show roughly? We
could have it up and running in a few days if you co-operate.
Click to expand...

Dorayme-

I have copied the above and will post it to my site ASAP, however, I
am waiting for my ticket to be resolved and my site to be migrated to
a Linux server. Frankly I like the idea of open source, and the
dependability of Linux. As soon as the site is available, which I am
hoping will be tonight, I will post that with a link to the site. I
really appreciate the fact that you all have responded so quickly.

As to content. I have an informational essay and I have some content
that my family has provided. I will edit all of that by tomorrow
also. Aside from that, all I am looking for right now is a photo
gallery and maybe a forum, but really I am primarily concerned with a
professional and respectful website that does not look like it was put
together by a third grader (which is what I have now). I also wanted
people to be able to post pictures to the gallery for approval and to
comment below the pictures.

Anyway, I am working from a library computer because my motherboard is
fried and I cant fix it right now, so I will try and do this as soon
as possible.

Thanks Again
 
A

Andrew H

Dorayme-

I have copied the above and will post it to my site ASAP, however, I
am waiting for my ticket to be resolved and my site to be migrated to
a Linux server. Frankly I like the idea of open source, and the
dependability of Linux. As soon as the site is available, which I am
hoping will be tonight, I will post that with a link to the site. I
really appreciate the fact that you all have responded so quickly.

As to content. I have an informational essay and I have some content
that my family has provided. I will edit all of that by tomorrow
also. Aside from that, all I am looking for right now is a photo
gallery and maybe a forum, but really I am primarily concerned with a
professional and respectful website that does not look like it was put
together by a third grader (which is what I have now). I also wanted
people to be able to post pictures to the gallery for approval and to
comment below the pictures.

Anyway, I am working from a library computer because my motherboard is
fried and I cant fix it right now, so I will try and do this as soon
as possible.

Thanks Again
Click to expand...

Hey-

I just uploaded the above:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
Click to expand...

to my website which is located @ www.jessicahodsdon.com

So that is done as of now, hope this helps.
 
J

John Hosking

Andrew H wrote:

Hey-

I just uploaded the above:


to my website which is located @ www.jessicahodsdon.com

So that is done as of now, hope this helps.
Click to expand...

It helps more if you type it as http://www.jessicahodsdon.com/ so that
more newsreaders recognize it as a link.

So I've gone there and, guess what? You've got a Web site! Congrats.

Now you can change the <title> to something more globally enlightening
than "My sister". And add some text just to see something, like:

<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Ut
consequat tellus nec tellus luctus fringilla. Suspendisse potenti.</p>

And here's a contribution for you to put inside the <style> element,
although at some point[1] you will probably want to move from embedded
CSS like this to using an external stylesheet.

html, body {
font-family: Georgia, "Times New Roman", serif;
font-size: 100%;
background-color:#FFFFFF; color:#000000;
padding:0px; margin:0px; }

The most instructional thing you can do is tweak small things in your
code (markup and CSS) and see the effect(s). So don't just accept the
CSS above; add it to your page, view it in some browsers, then change it
and see what happens.

For example, a lot of folks don't care for serif fonts for long online
texts. So try something like

font:100% Arial, Helvetica, "Century Gothic", sans-serif;

instead of the fonts I gave you at first. Try using different colors
(especially if black-on-white isn't what you like). And so on.

HTH. GL.

[1] The point to start with an external stylesheet is probably when you
get a second page for the site.
 
D

dorayme

<[email protected]
,
Click to expand...
Andrew H said:
Dorayme-

I have copied the above and will post it to my site ASAP, however, I
am waiting for my ticket to be resolved and my site to be migrated to
a Linux server. Frankly I like the idea of open source, and the
dependability of Linux. As soon as the site is available, which I am
hoping will be tonight, I will post that with a link to the site. I
really appreciate the fact that you all have responded so quickly.

As to content. I have an informational essay and I have some content
that my family has provided. I will edit all of that ... Aside from that, all I am looking for right now is a photo
gallery and maybe a forum, but really I am primarily concerned with a
professional and respectful website that does not look like it was put
together by a third grader (which is what I have now). I also wanted
people to be able to post pictures to the gallery for approval and to
comment below the pictures.

Anyway, I am working from a library computer because my motherboard is
fried ...

Thanks Again
Click to expand...

O well, if you are having troubles with servers, with fried
motherboards, with as yet unedited essays, and wanting fancy
things like forums and user changeable content, please expect
long delays.

May I suggest that you could lower your aims to get going and
just dismiss for now about anything more complicated till you
have a nice something up and running?
 
C

Chris F.A. Johnson

On 2008-01-17, John Hosking wrote:
....
And here's a contribution for you to put inside the <style> element,
although at some point[1] you will probably want to move from embedded
CSS like this to using an external stylesheet.

html, body {
font-family: Georgia, "Times New Roman", serif;
font-size: 100%;
background-color:#FFFFFF; color:#000000;
padding:0px; margin:0px; }

The most instructional thing you can do is tweak small things in your
code (markup and CSS) and see the effect(s). So don't just accept the
CSS above; add it to your page, view it in some browsers, then change it
and see what happens.

For example, a lot of folks don't care for serif fonts for long online
texts. So try something like

font:100% Arial, Helvetica, "Century Gothic", sans-serif;

instead of the fonts I gave you at first.
Click to expand...

Better still, don't specify a font family for the body text, and
let the user's default (and presumably preferred) font be used.

If I have my browser set so that the default font is Helvetica (or
something similar in size) and a page is served with, e.g., Times
New Roman, the text is smaller than is comfortable.
 
D

dorayme

"Chris F.A. Johnson said:
On 2008-01-17, John Hosking wrote:
...
And here's a contribution for you to put inside the <style> element,
although at some point[1] you will probably want to move from embedded
CSS like this to using an external stylesheet.

html, body {
font-family: Georgia, "Times New Roman", serif;
font-size: 100%;
background-color:#FFFFFF; color:#000000;
padding:0px; margin:0px; }

The most instructional thing you can do is tweak small things in your
code (markup and CSS) and see the effect(s). So don't just accept the
CSS above; add it to your page, view it in some browsers, then change it
and see what happens.

For example, a lot of folks don't care for serif fonts for long online
texts. So try something like

font:100% Arial, Helvetica, "Century Gothic", sans-serif;

instead of the fonts I gave you at first.
Click to expand...

Better still, don't specify a font family for the body text, and
let the user's default (and presumably preferred) font be used.

If I have my browser set so that the default font is Helvetica (or
something similar in size) and a page is served with, e.g., Times
New Roman, the text is smaller than is comfortable.
Click to expand...

This guy is never going to get this site up if anyone suggests
the least thing that is not needed. See how many concerns are
crowding him already? I tend to agree with Chris on this because
it is less to worry about for now.

John's points are all fair enough though. Later we will hive off
the CSS to external. The title point is not a bad one to start
with though (see John's previous post). OP needs a nice short
better than "My sister".

But you have to admit, the site does not seem to have any obvious
visual faults right at this moment. <g>
 
A

A-OK-SITE

On 2008-01-17, John Hosking wrote:
...
And here's a contribution for you to put inside the <style> element,
although at some point[1] you will probably want to move from embedded
CSS like this to using an external stylesheet.
html, body {
font-family: Georgia, "Times New Roman", serif;
font-size: 100%;
background-color:#FFFFFF; color:#000000;
padding:0px; margin:0px; }
The most instructional thing you can do is tweak small things in your
code (markup and CSS) and see the effect(s). So don't just accept the
CSS above; add it to your page, view it in some browsers, then change it
and see what happens.
For example, a lot of folks don't care for serif fonts for long online
texts. So try something like
font:100% Arial, Helvetica, "Century Gothic", sans-serif;
instead of the fonts I gave you at first.
Click to expand...
Click to expand...
Better still, don't specify a font family for the body text, and
let the user's default (and presumably preferred) font be used.
Click to expand...
If I have my browser set so that the default font is Helvetica (or
something similar in size) and a page is served with, e.g., Times
New Roman, the text is smaller than is comfortable.
Click to expand...

This guy is never going to get this site up if anyone suggests
the least thing that is not needed. See how many concerns are
crowding him already? I tend to agree with Chris on this because
it is less to worry about for now.

John's points are all fair enough though. Later we will hive off
the CSS to external. The title point is not a bad one to start
with though (see John's previous post). OP needs a nice short
better than "My sister".

But you have to admit, the site does not seem to have any obvious
visual faults right at this moment. <g>
Click to expand...

Coppermine for photo gallery. Anyone can set up and use and it has
all the features he needs..

Daniel

http://a-ok-site.com
 
A

AGw. (Usenet)

Now you can change the <title> to something more globally enlightening
than "My sister". And add some text just to see something, like:

<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Ut
consequat tellus nec tellus luctus fringilla. Suspendisse potenti.</p>
Click to expand...

Note for the OP:
All content, such as John's example paragraph, must be placed between
the <body> and </body> tags of the skeleton code you've already been
given.
 
A

AGw. (Usenet)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
Click to expand...

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>
Click to expand...

This tells the browser that the HTML code is now beginning.
<head>
Click to expand...

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>
Click to expand...

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">
Click to expand...

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>
Click to expand...

And now you're telling the browser that you've stopped writing CSS,
and have gone back to writing HTML.
</head>
Click to expand...

And now you've told the browser that you've finished giving it header
information.
<body>
Click to expand...

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>
Click to expand...

And now you've told the browser that you've finished giving it marked-
up content.
</html>
Click to expand...

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!
 
A

Andrew H

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
 
B

BobaBird

I just uploaded ... to my website which is
located @ http://www.jessicahodsdon.com
Click to expand...

A few suggestions:

The <h1> does not need to be part of the layout table. Put it by
itself above <table> and delete that row/td. Keep it simple.

Put your paragraphs within <p>...</p> markup. Only use <br> to force
a new line without the default blank line, such as for your "designed
by" note.

The <img> is on the same site, so you can use a relative URL rather
than specifying the whole thing. Also, for those who can't see the
image, provide some alternate text that describes what they're missing
(required for 4.01 Strict). Specifying the size of the img is
optional, but allows the browser to reserve space for it before it's
loaded.

I see how the layout table keeps the text to the right of the photo,
but you can get much the same effect without it. (Take this as
showing you another way.)

Start by clearing out all the table/row/td markup. Next, apply some
in-line CSS to the image. (If you want all images to have this CSS,
put it in your internal or external stylesheet instead.) First,
"float:left" keeps the img on the left side, with the rest of the <p>
on the right, then wrapping underneath as you add paragraphs. Then,
to keep the text from touching the img and allow for easier reading,
add "margin-right:1em". (An "em" is a unit of line /height/ that is
frequently recommended for specifying width because it will adjust as
the user adjusts the text size.)

Link text should be descriptive of the destination.
http://www.w3.org/QA/Tips/noClickHere

Your page with revised markup:

<body>

<h1>In Loving Memory of Jessica Hodsdon</h1>
<p><img style="float:left; margin-right:1em"
src="images/jess_obit.gif" alt="Photo of Jessica" width="215"
height="320">Jessica Hodsdon, after years of struggling ...</p>
<p>Thank You,</p>
<p>Andrew Y. Hodsdon</p>
<p>Also please visit
the <a href="http://photo.jessicahodsdon.com">Jessica Hodsdon photo
gallery</a></p>
<p style="clear:left;">Website Designed by Andrew Y. Hodsdon<br>
(e-mail address removed)</p>

</body>

The final <p> adds "clear:left;" to break the float and allows the <p>
to be placed under the photo when there is not enough content to
extend below it. (Or, if you keep the table, move this <p> below the
table, but without the inline style, just like we moved <h1> above
it.)
 
A

AGw. (Usenet)

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.
Click to expand...

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.
Click to expand...

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.
Click to expand...

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?
Click to expand...

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.
 
D

dorayme

<[email protected]
m>,
"AGw. (Usenet) said:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
Click to expand...

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>
Click to expand...

This tells the browser that the HTML code is now beginning.
<head>
Click to expand...
[...]

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".
Click to expand...

[...]
Hope this has helped just a little bit more!
Click to expand...

I am certain this will help OP and also many others, it is good
of you to have taken the trouble.

I leave a quibble to last: Perhaps your "Basically, browser
defaults are there as a safety net, and should never be relied
upon." could be qualified to avoid the onerous responsibility
that is then thrust on the author if he were really to start his
CSS with

* {margin: 0; padding: 0;}

I don't think a newbie should be tempted down this road too early.
 
A

Andrew H

AGw. (Usenet) said:
On Jan 18, 2:51 pm, Andrew H <[email protected]> wrote:
Click to expand...
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.
Click to expand...

{and lots of good further advice from AGw... snipped here]

Here is a suggestion for a look:

<http://netweaver.com.au/alt/andrewHodson.html>
Click to expand...

I like the design you came up with dorayme, and AGw that discussion of
CSS was helpful. I feel more confident that I am on the right track
now and I thank you all for that. BTW am I bottom posting at this
point? I am using google groups and I think I am posting correctly,
but if not let me know.

For that design, if I wanted to use that as say a theme and then
create a number of pages with that template, would that require me to
use that CSS style page, as opposed to the inline style?

I have been using dreamweaver, but only to edit the html text (I find
it is helpful to see the results of each change) and things seem to be
going well.
 
A

AGw. (Usenet)

[snipped]
Click to expand...

BTW am I bottom posting at this point?
Click to expand...

Yes, that was bottom-posted! :)
I have been using dreamweaver, but only to edit the html text (I find
it is helpful to see the results of each change) and things seem to be
going well.
Click to expand...

I hope you've not forked out for it! But your approach to how you're
using it is absolutely the right one; soon enough you'll start to
understand what it's about, and can perhaps start to use some of its
various features to speed up the stuff you'll already know how to code
by hand.

The main reason why beginners are generally warned off from
Dreamweaver in particular is that its price is poor value for someone
who isn't a professional; also, it won't make better websites for you
just because it's a professional tool, in the same way that a really
expensive camera won't (by itself) make a beginner photographer into a
great artist. However, it's a pretty reliable product, so you're in
safe hands, and by using it the way you are you'll be getting the most
benefit out of it without suffering most of the pitfalls that plague
other web design programs.
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Similar Threads

Suggestions for new Website project 3
First website practice project advisement 4
Help design HTA 0
I need help fixing my website 2
Functioning website now fails 0
How to add augmented reality content to a website? 3
Looking for feedback on this markup language I developed and my website idea? 0
Collect Excel Data from Website 5

Members online

No members online now.
Total: 37 (members: 1, guests: 36)
Robots: 451

Forum statistics

Threads
473,769
Messages
2,569,580
Members
45,054
Latest member
TrimKetoBoost

Latest Threads

Top