Insert quarter. Avoid Klingons.
Collected web clippings, ramblings, and scribblings from me to you.

Friday: July 14, 2006

The benefits of webrooting.

Ever wanted to ensure a smoother transition when uploading your newly designed website to your newly purchased web server space? Rolling up your sleeves and setting up a webroot in your code may save you some time and some unnecessary headaches.


Setting up a webroot is simple if your code is structured in a semantic way already. My general practice in designing websites is to give myself virtual include files for the header and footer of the site in question. This way, making global changes is far more easier than having to make individual changes to your website page by page. For those of you advanced web designers this is probably second nature. For those just starting out, this method will save you lots of time. The main content of the page generally lives between the two calls to the header and footer includes (see above example for diagram, if confused).

The next step is to set up the actual webroot variable in your code. You may preferably want to do this in your header include file so that each time a page is loaded, this variable carries over to the rest of your content. In this tutorial, I am going to show how to set up a webroot using ASP (my programming language of choice). The same concept can be applied to those of you who use PHP; you just need to use the proper syntax (which escapes me at the moment).


So lets begin by declaring a variable intuitively called 'WebRoot' for this example. Set this variable equal to whatever folder you are currently coding your website in. In my case, I had been working locally in a folder called 'glm_06' so my webroot becomes '/glm_06/' (the beginning and end slashes are important, we'll get to that later).

Then in the content of your pages start adding this variable to your image tags, anchor tags, and basically any part of your site that has a path pointing to something in your local work folder where your site lives.


You may be asking, why not just avoid this method and just point paths to where they are supposed to go without using this variable? One advantage right off the bat is working with subfolders. If you happen to have a portion of your site that you want to encapsulate into a folder underneath your main work folder, webrooting makes things a whole lot easier. By using a webroot your paths will line up automatically to the root of your server (hence the term webrooting) rather than you having to adjust every single image and href path to work in said subfolder (rather than having to make image paths line up by changing the source path to '../img/' for example).

Finally, this method comes in handy when you need to push your website to a live environment. If your web host demands that all of your HTML documents must live within a designated part of the server, all you would need to do is change the webroot variable in your top include file to sync things up.

While there is nothing groundbreaking here in terms of coding, I felt like explaining the benefits of this methodology because it has helped me out in the past. It may be of more use to those who are just starting out with web programming and don't use this kind of structure. It could possibly save some frustration and be a time saver in the long run.

Posted to Verbose filed in Programming @ 2:36 PM | Tags (2) | webroot | asp |  | Discuss (0) |  | facebook | twitter | 1 Click | Posted by Vin

Add a New Comment




Obligatory Human Check:


Enter code from said obligatory human check above:

Customize Your Comment

Add a nifty badge:

  • No badge
  • Cool
  • Fail
  • Huh?
  • I approve of this
  • Interesting
  • Lame
  • LOL
  • Nerd!
  • WTF
Potentially Related Posts (beta)