title: Java Faces and resource path mapping to images. I misunderstand
body: <p>I developed a dynamic web project, with maven, jsf and richfaces.
  I omit the history, straight  to my problem. After not so long break with development, I stated my project in Eclipse->Tomcat.
  And on my starting page there are images and simple login form. Images and design is OK, due address <code>http://localhost:8080/myapp/</code> (links to images and css is like - <code>myapp/img/header.png</code>)</p>
  
  <p>after logging I redirected to landing page (which is richfaces dynamic page) <code>http://localhost:8080/myapp/faces/statistics.xhtml</code> and all links to images and css converts to <code>myapp</code><strong>/faces/</strong><code>img/header.png</code> and after that no images and css.</p>
  
  <p>I confused, what's going on? a couple days ago it worked perfect.</p>
  
  <p>in web.xml i have this</p>
  
  <pre><code>&lt;servlet&gt;
      &lt;servlet-name&gt;Faces Servlet&lt;/servlet-name&gt;
      &lt;servlet-class&gt;javax.faces.webapp.FacesServlet&lt;/servlet-class&gt;
      &lt;load-on-startup&gt;1&lt;/load-on-startup&gt;
    &lt;/servlet&gt;
    &lt;servlet-mapping&gt;
      &lt;servlet-name&gt;Faces Servlet&lt;/servlet-name&gt;
          &lt;url-pattern&gt;/faces/*&lt;/url-pattern&gt;
    &lt;/servlet-mapping&gt;
      &lt;servlet-mapping&gt;
      &lt;servlet-name&gt;Faces Servlet&lt;/servlet-name&gt;
      &lt;url-pattern&gt;*.faces&lt;/url-pattern&gt;
    &lt;/servlet-mapping&gt;
  </code></pre>
  
  <p>I even don't know where to start to solve my problem. How return images to design?</p>
  
  <hr>
  
  <p><strong>Update</strong></p>
  
  <p>I have found that  this unpleasant behavior resides in my layout.xhtml only. Because only this file which I didn't create. It's our design for all project, in brief it looks like this:</p>
  
  <pre><code>…
  &lt;h:head&gt;
  &lt;link href="css/main.css" rel="stylesheet" type="text/css" /&gt;
  &lt;link rel="shortcut icon" href="favicon.ico" type="image/x-icon" /&gt;
  &lt;img src="img/header.png"&gt;
  … design …
  &lt;div class="menuAndContent"&gt;
      &lt;div class="menuLeft"&gt;
          &lt;ui:insert name="menuLeft" /&gt;
      &lt;/div&gt;
      &lt;div class="content"&gt;
          &lt;ui:insert name="content" /&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  … design …
  &lt;img src="img/selector2.gif"&gt;
  …
  </code></pre>
  
  <p>So I create only files for div=content and div=menu. This files works good, all images on them are present.</p>
  
  <p>It's only this layout file is "joking" with me. All links : <code>css/main.css</code> <code>img/header.png</code> <code>img/selector2.gif</code> they work at first step! at address <code>http://localhost:8080/myapp/</code> and browser.dev.tool shows me that he take this resources from path <code>myapp/css/main.css</code> <code>myapp/img/header.png</code>
  and when i go deeper <code>http://localhost:8080/myapp/faces/statistics.xhtml</code>, after logging in, I redirects to the same page with different content. And in browser.dev.tool I see the page with this links <code>css/main.css</code> <code>img/header.png</code> <code>img/selector2.gif</code> - it all correct and it is good, BUT the path for take this resources from this ones <code>myapp/css/main.css</code> <code>myapp/img/header.png</code> converted to this ones <code>myapp/faces/css/main.css</code> <code>myapp/faces/img/header.png</code>. that's the problem.</p>