what is the best practices around links and url in asp.net-mvc

Question

looking at different sites, i see conflicting conventions.

if you want to have links to images, other pages, js files, i have seen:

URL.Content("~/scripts/myscript.js");
<a href="/scripts/msscripts.js">
<img src="../../images/test.jpg" />
<img src="../images/test.jpg" />
<img src="/images/test.jpg" />
<img src="~/images/test.jpg" />

these all seem to work in asp.net mvc but it seems like there are all doing slightly different things.

I am moving to a new webserver where they are changing from IIS redirecting to isapi rewriting and i was told to make sure my links were done in a correct way or the site not work.

Can someone clarify what the "correct" way is ?

Answer 1

The best way is to use Url.Content, and make sure you have the ~ in it.

Url.Content will then replace the ~ by the correct path (the root of your website).

Only use relative paths in your css file.

If your css is located in

/css/style.css

and a background image in /images/background.png

then in your style.css use:

#divTest
{
   background-image = url("../images/background.png")
}

Since your website gets moved around as a whole this will keep working.

Answer 2

Use the first option. That way, you can relocate your application to any subdirectory or top level of your domain.

The second option is fine, if you know for sure that the application will NEVER run from a subdirectory (i.e. it will always be at the server's root).

The third and fourth are bad, because they refer to your URL structure, which is meaningless in a MVC environment: add a new bit to the path (one more argument for example) or refactor the paths, and nothing will work.