Very Old Website Using Frames Needs New Look

Hi,

I have been running a website for a local softball league for over 10 years. I have basic HTML experience that I used to set up the website way back then. I’m sure my knowledge is very out-dated by now.

The website was designed using frames, with the left column being the Menu and the right column having the content. It’s very simple, but it gets the job done for the players in the league.

I heard that frames will be obsolete soon with HTML 5.

I was thinking I better change the look and get rid of frames soon.

I update the standings and scores every week during the season. All I do is use Excel to enter the data for the standings and scores and then convert that Excel sheet to HTML and upload it. It has always worked and its very quick.

So below is my outline of what I would like to try and design.

Could anyone give me some ideas where to go online and learn how to do this.

It seems that it’s very basic, but I haven’t been keeping up with web design improvements.

Below is all I need:

Logo at the Top

Menu with some drop downs right under the Logo going across Horizontally under the logo.
Home
Mens - drop down (Standings, Scores, Playoffs)
Womens drop down (Standings, Scores, Playoffs)
Rules
Contact
Forum

Then under the menu:
All the Content would be displayed using HTML files when you click on the menu item, for the Standings, Scores, Rules and Contact info etc.

Thanks

HTML 50 could come out tomorrow, but if you built the site a while ago, you will either have an old doctype, or no doctype, so it will have absolutely no effect on your site. It will still run perfectly okay. The doctype says which version of html to use to interpret your code.

You do want to move into the modern age however and try to move away from frames. Also using excel to generate your results page will mean that the html page is very large and is slow to upload and download.

To learn how to design a web page, I suggest that you get a copy of BUILD YOUR OWN WEBSITE THE RIGHT WAY
USING HTML & CSS, 3RD EDITION by Ian Lloyd,
and then either THE CSS ANTHOLOGY: 101 ESSENTIAL TIPS, TRICKS & HACKS, 3RD EDITION
101 ESSENTIAL TIPS, TRICKS & HACKS - 3RD EDITION by Rachel Andrew
and/or
THE ART & SCIENCE OF CSS by Cameron Adams & Jina Bolton
All are available under Bookstore > Design in the sitepoint menu.

There are a couple of very basic tutorials in HTML and [URL=“http://www.w3.org/Style/Examples/011/firstcss”]CSS on the W3C web site. These might be enough to get you started. They also have a [URL=“http://www.w3.org/2002/03/tutorials.html#webdesign_htmlcss”]list of other resources, some of which will be more relevant to you than others.

HTML5 is still a work in progress - the specifications are likely to keep changing. My advice would be to steer clear of HTML5 and concentrate on learning HTML4 for now, which is supported by all current browsers. I would, however, recommend using the following doctype declaration, rather than the more outdated one used in the HTML tutorial.

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

If you have any questions or need any help, you can always come back here and ask. :slight_smile:

Thanks for the replies…Very much appreciated!
I checked out those links and I have been playing with the code…Pretty cool.

One more Newbie question:

Is there a way to load an html file into a webpage, like frames does, but with another html command, while keeping a drop down menu on the top of each page?

The reason I ask is that in order to make changes to the Softball Schedule and update the scores, requires that I take the Excel spreadsheet and convert that spreadsheet to html and up-load that to the website.

If I had to delete the code and re-paste the new code every time I updated the Scores, it would be much mote time consuming.

Thanks

I just discovered the php include command and I have been running a few tests and it seems like a good start to finding my answer to my previous question.

Yes, server-side includes are what you need to be focusing on regarding inserting common elements on a page such as navigation menus and footers, etc.

Well HTML is HTML. If you at least understand how it works you are already half way there. Now your next step is to learn CSS and how to create a layout (box model is a simple way of going about the layout). Just because HTML5 is out doesn’t mean your old doctypes won’t work. If fact, xhtml1 and html4 are still really popular, because they work on so many browsers.

For css, Smashing Magazine has a pretty big guide to almost anything you will need to know. Some of it may be a little overwhelming if you are used to table or frame based layouts. Id suggest reading “[URL=“http://coding.smashingmagazine.com/2009/10/19/the-mystery-of-css-float-property/”]The Mystery of the CSS float property” or even learning about the [URL=“http://reference.sitepoint.com/css/boxmodel”]box model here on sitepoint.