Question: Basically my goal is for my page content div to be encapsulated in a round rectangle. Sort of like this:

```
Top of round rect (White)
Page content (uses a white rectangular css background) 
Bottom of round rect(White)

```

So then the page content section can be as long as I need and retain the round rect shape. I'm just not sure the best way to do this. I tried adding an img to the top of pagecontent div, but the transparent areas were overridden by the pagecontent's background. Thanks

Answer: 
It really depends.

There is no catch all answer for this because it depends on what your javascripts are acting on. 

Putting scripts at the end of the page is sometimes needed if your acting on a DOM element that needs to be loaded for the script to run. Say you want to focus on a control and your script is:

```
var mytext = document.getElementById("mytext2"); 
mytext.focus();

```

Well in this case you would want it to execute at the end of the page, after mytext2 control has already been loaded by the browser. This is less important for script blocks that only contain functions that are called by events.

If you have a big .js file that contains libraries of functions you may also want to put that at the end of the page so the browser will load the page faster before loading the large .js file.

Google analytics suggests putting their tracker at the end, to make sure the page has been delivered before you count the hits, but in some cases it suggests putting the script into the header too, it works both ways.

So, rule of thumb for me is, HEAD scripts for everything except things that execute in-line and act on DOM objects, or large scripts that you want to load after the page.

Rick Strahl just wrote a great blog on [placement of Javascript](http://www.west-wind.com/Weblog/posts/154797.aspx) in .net too:
The only validating way is to include it on the top (in the `<head>` section), but in the bottom will be faster to load - the rest of the page will load faster if you have script near the bottom, giving the user better response and making the experience better.

The problem is that most web browser stop rendering the HTML of the page until they've fetched and parsed all JavaScript code so far. So if you have a slow-loaded .js file included in the `<head>`, no HTML will be rendered and images will not even start to download before the .js have been downloaded and parsed, therefore frontend engineers propagate for putting the scripts as far down in the code as possible.

I usually just set a far-future Expires header for my .js files so they are cached in the browser for a long time and then include them in the `<head>` section. This gives good performance and doesn't look ugly :-)

But if you are serving external .js libraries (that are on other servers than your own), you will probably want them in the bottom because you can't change the Expires-header for other servers and you canät know that the other server always will be responsive.