How to reference an image <img> tag

Question

I’m studying Asp.Net MVC and I’m having trouble defining the tag URL

HTML:

      <!-- menu profile quick info -->
            <div class="profile">
                <div class="profile_pic">
                    <img src="~/Views/Home/images/img.jpg" alt="..." class="img-circle profile_img">
                </div>
                <div class="profile_info">
                    <span>Welcome,</span>
                    <h2>John Doe</h2>
                </div>
            </div>

My doubt is, this right this URL: src="~/Views/Home/images/img.jpg"?

My project hierarchy:

Yeah, when I do, I’m making the mistake:

Answer 1

You may have noticed that inside the folder Views there’s a file web config..

By default, this config restricts access to all files in this folder.

<httpHandlers>
  <add path="*" verb="*" type="System.Web.HttpNotFoundHandler"/>
</httpHandlers>

I’m sure you can change that, but it doesn’t make sense. You can end up allowing anyone (good or bad) to have access to Views files.

The tip I give you is to put your images in subfolders in the folder Content, and use them along the way ~/Content/Images/Home/img1.png. Of course you have the option to create other folders too, but I think Content already serves for this.