I would like toknopw where what code do I use for making my background and main images load first on a page
posted by:
|
Seattle
|
-
Re: more basic html questions
Tue, April 1, 2008 - 4:55 PM
Sounds like your talking about preloading... www.htmlgoodies.com/tutorial...p/3480001
Preloading will cache the you background and main images so that users can navigate without have to load each image over and over again.
If you not talking about preloading, than one thing to note is that the browser is going to read the page from top to bottom.
Hope that helps -
-
Re: more basic html questions
Tue, April 8, 2008 - 2:40 AMif you place everything in a stylesheet and the stylesheet is linked from the top of the page in the header where it should be, then the stuff in the stylesheet will load before the rest of the page- because once the browser gets to the line of code where the stylesheet is, it will load the stylesheet before it contiues on with the rest of the code. if your background image isn't very big, this is a good thing. if you have some huge thing that you want to place back there, it could lag, in which case, you might want to reconsider the big huge background if that may be the case that may be.
-
-
Re: more basic html questions
Tue, April 8, 2008 - 8:56 AMWhich brings up a good point. I know that *I* have never got to this point (my site style info is usually pretty small and simple) but....
What is the way for detecting that your stylesheet is too bulky and you should span your CSS into 2 or more style sheets instead of having the page load one huge one? If you do have to use 2 or more style sheets, where should each style sheet reference be placed within the body?
Kat -
-
Re: more basic html questions
Tue, April 8, 2008 - 10:40 AMStyle sheet should ALWAYS be in the head of the document. Scripts however... canbe placed at the end of the body depending on thier function.
Breaking your stylesheets up doesnt really save you anything you still have to load the same amount of data. Its better to break them up for logical things... for examle my css directory usually looks like this:
css/
lib/
grid.css
typography.css
forms.css
ie.css
reset.css
modules/
modulename/
modulename.css
lib/
node.css
ie.css
global.css
main.css
print.css
then depedning on the page requested i dynamically write my link statements. modulename and main sheets are just "collectors" they hold only a series of @import declarations for other sheets. so basically when everything is said and done this what a list of sytlesheets looks like for a page in order of loading:
(imported by main.css)
css/lib/reset.css
css/lib/typography.css
css/lib/grid.css
css/lib/forms.css
css/global.css
(imported by modulename.css)
css/modulename/lib/node.css
(only if ie sheets are needed)
css/lib/ie.css
css/modulename/lib/ie.css
-
-
Re: more basic html questions
Tue, April 8, 2008 - 11:45 AMBut you would agree that a site loading could be slowed down by a rather large stylesheet file, right? -
-
Re: more basic html questions
Tue, April 8, 2008 - 12:15 PMit potentially could be... but splitting them up is not going to make much of a difference.. because all of them still have to load and the body isnt goign to load untl the head where the stylesheets are is done.
REally the only thing you can do short of serverside gzip compression is to make your CSS as concise as possible and use the cascade so you arent defining the same thing in seven places... On top of that you can do what i do and "minify" them... mean instead of easy to read css you basically remove all the whitespace (except in properties of course). -
-
Re: more basic html questions
Tue, April 8, 2008 - 12:20 PMIm not sure I understood the cascading you are talking about. Did you mean your folder structure of all the seperate css files? -
-
Re: more basic html questions
Tue, April 8, 2008 - 1:34 PMNo.. i mean using the CSS cascade effectively. CSS opperates like a hierarchy with more specific riles overiding more general ones. This can allow you to keep your code fairl compact because you can define broadly how thing should look say on an h2. and then depending on other factors you can redefine only what needs to be changed for that particular instance instead of redefining every little thing. This allows you to use inheritence/cascade to your advantage. You probably do this but most likely not anywhere near as efficiently as you could be using it - and that can probably be said for 95% of us. -
-
This is the maximum depth. Additional responses will not be threaded.
Re: more basic html questions
Tue, April 8, 2008 - 4:13 PMOkay. I do admit that the last CSS sheet I worked with had so many classes and tags. It wasnt very organized, at least compared to your diagram and it was probably still pretty simple in all comparison. It only looked complicated to me. :)
-
-
-
-
-
-
-
-
