How would I make an html file SMALLER, so that I could save more bandwidth. Are there any tips and tricks for optimizing code and making the files smaller and quicker to load?

1) Switch from a table driven design to a DIV driven design.
2) Change all inline style changes to external CSS.
3) Use Behaviors and external cached javascript for rollovers instead of repeating it every time you want to use it.

Aside from the previous suggestions, you can optimize your javascript, as well as strip out any HTML/JS comments. However, stripping comments may leave you wondering just what's going on when you take a look at a page you haven't updated in months. Don't laugh; it's happened to many of us before!

Yeah, I'm going to take them out.

1. Ok, I THINK i can do that, but I'm going to need some help from you guys. Should I use absolute positioning for the divs? I'm not very familiar with them.

2. I think most of the css IS external... Point out the parts that are internal please.

3. Yeah, i was wondering how to do that, ... HOW? I have no idea!

All the background="#XXXXXX" stuff should be in your CSS file.

Ok, let me do that real quick....
but, what about the 3rd point, can you help me with that please?

While it won't physically decrease the size of your HTML files, if you have PHP and a server that supports it, you can compress pages on the fly using GZIP.

Put this at the top of the pages you want to be compressed.

You'll get a nice performance gain, and your bandwidth should decrease quite a bit if you use it properly.

so i should put that at the top of EVERY page? before the html tag and html decleratioN?

Ok , I got the gzip code at the top of the page, check it now, http://www.neowizard.dynu.com

Does it load quicker than before? Past loading time was anywhere from 5 seconds to 10.

You can use this site to check if the gzip compression is working:

http://leknor.com/code/gziped.php

If it's not working, use the phpinfo() function and check if the output_buffering value is set to true.

Sorry, but it takes much longer than that for me. You could start by changing the header image to this, which would reduce the total size by 10k. The other images could also be reduced

Sean

Defiantly compress those images! Your whole page should be less than news.jpg image at 55k, and preferably smaller than title.gif at 33k. It's an easy fix, though--just play with the settings in your image software. :-)

~~Ian

ok, it says it is off, how do I turn it on?

I optimized the pictures! Cut down about 50-100kb overall. Check how much faster its loading now.

Actually, it is about the same for me.

If it's your server, I believe there's a value you can edit in your php.ini file. It might be called output_buffering (correct me if I'm wrong).

If you're on a hosting company's server, there's not really much you can do about it. A lot of ISP's disable output buffering because it can sometimes actually use *more* bandwidth when not used properly.

I'd advise e-mailing your host if this is the case and see if there's anything they can do about it.

its on my own comp... so i'm in luck hehehe

It takes a long time to load for me, and I'm on broadband.

One thing, Looking at your source code,

and the such appears a WHOLE lot of times, have you looked into using css if you want mouseover effects in the menu or anywhere else?

Here is a site that explains it a bit... http://www.alistapart.com/stories/taminglists/

Not specifically for your site:

Cut out all the white spaces (spaces and tabs) in your source code - this can cut file size down by up to 40%. Try it with programs like HTML Shrinker.

Shorten any file, CSS class, and folder names to the absolute minimum, and consider moving items in subfolders into the site root.

Rewrite any Javascript that doesn't interact with the browser/DOM as server-side script (PHP, ASP etc.)

How can i rewrite any javacode as a serverside (php) ?

And how could i do a table cell rollover effect? is it the same as a link hover?