Website Design / HTML

[rfornal]

Excellent example!

No, I have no problem with the example. Thanks for the assist.

[wldspirit]

Ok....I have copied and pasted the info so far........ready to move to the next phase when you are.........but may have additional questions.......
so far so good..........
wldspirit

[rfornal]

The next phase is to determine what you want to place on the web-site you want to design. Once you've determined what, then you need to determine what the best way to present the information is.

In determining how to present the information, you need to decide how you want to develop the web pages. The basis for all web-pages is HTML.

If you want to learn HTML code, you can write a basic web-page using a program as simple at Notepad. Most Microsoft Applications (ie. Word, Publisher, Powerpoint) can generate HTML web-pages.

There are several commercial packages for generating pages; most of you should be familiar with the fact that most genealogy programs can generate HTML pages to display your information.

[rfornal]

I am best at designing web-pages using Notepad, writing simple code in HTML. It is remarkably easy and I can assist anyone interested in learning HTML within this topic.

There are several commercial packages (ie. Dreamweaver) that develop WYSIWYG (What You See Is What You Get) web pages. I think it would be best to let other members open up their own topics to explore the packages that they like to use best. I can pitch in and assist within those topics as needed.

Looking forward to seeing where we go next ...

[rfornal]

I was just thinking about the "space" issue ... how much space do you need for a web-site and remembered years ago when PCs were just coming into their own and a friend asked is a 10MEG (NOT GIG) hard drive would be enough ... my response was, "that's more space than you'll ever need ... you can store TEN books in that amount of space."

There might be a good about right now, but as we all know, computer technology continuously changes and tomorrow ... next month ... next year, that will change.

Also remember, that unlike most personal web-sites, sites designed to display genealogy information have a lot of content and can often be around for the long-term ... I'd like my kids (don't have any yet) and grandkids to be able to access the pages I am designing right now.

[nuccia]

Bob,

Its starting to make sense now. Edmondo has done so much for us already and between the two of you we get a mini training in website design...so cool!

Bob, I have people in and out today but I do/will have questions. As I think of how to ask them i will post them. Thanks for you offer to help. We appreciate it.

nuccia

[wldspirit]

I recieved this link for HTML....it was sent to me by the genealogy society as I was going to volunteer to help transcribe and post relevant info for our county site......one look and I was overwhelmed!!!!! 8O

As for content, I have some pages in mind....but nothing concrete......
and I did find some free graphic sites which had really nice layouts....

http://www.htmlgoodies.com/

wldspirit

[rfornal]

WOW! That's quite a collection of information. If you'd like, I'll take you through most of what is listed there only slower and simpler ... I did teach computers for a while.

Tomorrow I'll post some basic things ... some starting elements of HTML and a sample that'll get you started.

[wldspirit]

Great........because that site just blew me away!!!

Now to decide exactly what it is I want to present.......

wldspirit

[rfornal]

Don't worry about the content quite yet. Let me give you some core pieces and some code that will make it easier to plan how to present the information. This might give you some ideas that could change things slightly.

[wldspirit]

My grandmother used to say "Practice makes perfect"......

Til tomorrows lesson......

wldspirit

[rfornal]

I'm going to stagger these through the day ...

Introduction to HTML Coding

HTML is a programming language, only in the simplest sense. If you have any experience with OLD word processors, some of you might remember having to turn Bold on and off (being able to toggle between a set of flags and an awful color coded scheme). HTML is much like this.

To make something bold we are going to use what are called Tags. In HTML, we generally have Opening and Closing Tags.

Opening Tag for Bold Text: <b>
Closing Tag for Bold Text: </b>

Note the forward slash "/" indicates a Closing Tag.

Example

<b>This is bold.</b> produces ...
This is bold.

[rfornal]

HTML Files

.htm versus .html
Hopefully everyone has seen files with one of these two extensions. The only real difference is that one has an "L" and the other does not. Virtually all servers see them as the same type of file.

Remember, whichever one you use, be consistent because it does matter which is used when the name of the file is used in a link. If the filename is bob.htm and I enter bob.html in a link, it will not work because bob.html does not exist.

index.htm (or index.html)
Regardless of which method you use for the extension, the index file is the most important file for our purposes. This file is the default file to be opened if no other file is specified.

Example

http://bob.fornal.org/Genealogy/ actually opens ...
http://bob.fornal.org/Genealogy/index.html

If I had to enter the path over and over, I would rather use the first address simply because it is shorter.

[rfornal]

Basic HTML Structure

Ok, here is the basic structure for almost all HTML files:

<HTML>
     <HEAD>
          <TITLE>SAMPLE PAGE</TITLE>
     </HEAD>

     <BODY>
          Sample text goes here.
     </BODY>
</HTML>

Notice how the Opened/Closed Tags are nested; that is, the Open/Close TITLE Tags are nested inside the Open/Close HEAD Tags, which in turn is nested inside the HTML Tags.

Also notice that the text inside the Tags is ALL CAPS. HTML Tags are Case Insensitive; that is, you can enter them in ALL CAPS or ALL LOWERCASE. This is preference only; I prefer all lower case, but that probably comes from 28+ years of programming experience.

There are a few minor variations to this structure, but almost all the time this will be the basic structure for a web-page that you are creating.

[rfornal]

Now comes the FUN part.