Your first mistake was when you used the term "directory". URLs may
look like filesystem paths, but they are
not filesystem paths. They are resource locator strings. The slashes are simply parts of the URL strings and only have special meaning if the webapp wants them to have special meaning. There's no actual "directory" in a URL.
Sometimes a URL may be parsed by the webapp and part of the URL is then applied as an internal resource path (for example, "images/pic1.jpg"), but that's only because the webapp decided to map things that way. It could have done something entirely different with the URL if it wanted to.
The h:link element is new to JSF2. I'm not quite sure what it does that the older h:outputLink tag didn't, although I suspect that it may have to do with the ability to add parameter options to the resulting URL as well as the fact that it can accept
JSF navigation targets for their "outcome".
Relative link locations can be tricky in
J2EE, but JSF can make that better because it allows you to use absolute locations, instead. Normally to get the true URL of a J2Ee resource, you'd have to know the context path that the app was deployed under, but by using this feature, you can code a portable path. For example:
Notice that this is an "absolute" location because it begins with "/" instead of ".."