In my website the menu is loaded from a file called "menu.php".
But my website has some sub-directories - /blog/ , /searchtool/, /shop/
They are with the same design, using the same CSS file.
But the urls for the images and for the links are like this:
<a href="my-page.html" >
<img src="images/my-image.jpg" >Image description</a>
If I add my website full URL before them - it works
<a href="http://example.com/my-page.html" >
<img src="http://example.com/images/my-image.jpg" />Image description</a>
My question is how does this affect my website performance?
Is it good or bad?
What problems can it cause?
Is there anything I should know before doing it?
How about using "../" before the addresses, will it work?
It depends.
The performance gain from using relative URLs is absolutely negligible compared to using absolute URLs. Of course, it is recommended to use relative URLs where you can, for example, the content residing on your own server within folders, which you can link easily.
The browsers are efficient enough to resolve relative URLs and as I said, it gives you no major performance increase as such. To answer your question, it is generally a common practice to use relative linking if you are referring to resources on your servers.
One could argue that using absolute URLs could cause a subtle decrease in load time as there will be a touch more DNS lookups, but don't worry, its so minimal it won't even matter. But always, use relative resource referencing where you can, its just less fussier.
Reasons for using Relative URLs
Easier to debug issues on localhost
Migrating to a different server like from Bluehost to Hostgator
Easier to work with shorter paths for development reasons
Helpful in developing on multiple environment
Reasons for using Absolute URLs
From a SEO standpoint,its better.Offers canonicalization
For search engines, doesn't matter really. They resolve relative well enough too.
All sorts of SEO problems on the web are caused by the use of relative URLs in links, canonicals and more.
An absolute URL contains more information than a relative URL does. Relative URLs are more convenient because they are shorter and often more portable. However, you can use them only to reference links on the same server as the page that contains them
Relative URLs are often used because developers have a test environment on another hostname and it makes it easy for them to move stuff between their test environment and their live environment. Other reasons include that it’s “just easier in website maintenance”. They’re also, in my opinion falsely, promoted by some websites about site speed because they’re “shorter” and thus “faster”.
have a good read here relative-urls-issues
Related
The question is very simple and even tho I might get downvoted into oblivion for it, I can't find a good search query for this.
If I link images, stylesheets, scripts and other things with the full website url (http://url.tld/css/style.css) instead of path (css/style.css) , are the visitors affected negatively? Is there any difference?
The html page is on the same link as the resource, so we're not talking about external resources.
This only makes a difference if you change your domain name. You cannot simply transfer the scripts over but have to change each line or the include of those files then.
One small thing to keep in mind: Your string will be longer and so your file will be a very bit bigger in size but it doesn't really matter.
Either won't affect visitors. Specifying the protocol might cause problems in the future if your users can switch between http and https. Specifying the folder also means changes when you move the site. So best to use relative
We are in the process of redesigning our company's web site, and we have been told by consultants that it is important that we either:
1.) Always link to a specific page i.e. foo.com/buy/default.aspx
or -
2.) Always link to a directory and allow the default document to load i.e. foo.com/buy/ where "default.aspx" is the default document
Is there any practical benefit to either approach? Does being 100% consistent in doing one or the other really gain us anything?
In your first example, always linking to a specific page helps prevent ambiguity in your URLs. Prefer a canonical URL (can be with or without a file extension). If you have to have multiple URLs for a single resource, for example /products/product1.aspx and products?productID=product1, then take advantage of the Canonical URL property in your code to specify which is the proper one.
Using extensionless URLs allows you to change technologies later. For example, /blog/post1.aspx is different than /blog/post1.php, say if you ever switched to WordPress (not common, of course, but it happens). It's just an easy way to make the links work no matter the technology. Plus, in my opinion it's always better to, as much as possible, mask the technology stack that you're using where possible. Extensionless URLs are becoming the norm (in my opinion) as people seem to be moving more toward an API-based approach to URIs as resources, and mixed technology stacks.
The second method you mentioned is good because it helps you make clean URLs
(don't click these urls they are just examples)
okay URL
http://www.example.com/example/example.php
clean URL
http://www.example.com/example/ (so much easier to remember, and shorter to write out)
here is a good tutorial I found that shows you how to accomplish this: http://www.desiquintans.com/cleanurls (htaccess)
I've just added a subdomain to my website, but can I point it to files in the main website with relative links? Like in the way that ../ goes back a folder, can you tell it to remove the first part of the url?
Also, I've just seen perhaps it's better putting the image folder as a subdomain too, is it worth doing this?
It's not possible to link to another domain using relative links, even if it is a subdomain. If you really want to do this you could make some kind of scripting helper to do that, but it would need to run on every page. With this you could run into problems on clients that have scripting disabled.
Putting images in a different subdomain is usually done to optimise loading speed. Browsers usually have a limited number of simultaneous requests to a single (sub)domain. By putting images on a separate (sub)domain you allow the browser to make more simultaneous requests and (in theory) allow your site to be loaded faster.
You can't use relative links, but you can use mod_rewrite to help you make a 'pseudo relative' link.
If your desired relative link were: href='folder/filename.typ'
then make it: href='root/folder/filename.typ'
in .htaccess enter: Rewriterule ^root/(.+)$ http://yourdomain.com/$1
You don't have to use 'root' of course, any word will do so long as it's unique in this context (i.e. not an actual folder name).
CAUTION: I found this thread looking for a solution myself. I've only just worked out this method. It does work on my site but I've not tested exhaustively yet.
Is there any reason to prefer
<a href="alpha/beta.html">
over
<a href="http://mysite.com/dir/alpha/beta.html">
(assuming that the links refer to the same location)? And similarly for references to scripts and style sheets.
I worry that the former might be slightly slower because the browser might reuse a connection in the former case but open a new connection in the latter.
Or are browsers smart enough to handle this in the optimal way?
Yes, there is a major reason : portability. When something changes, you feel better if it is not hard-written in one thousand places.
Additionnally, the relative form — the first one — is much shorter. So, when you have dozens of internal links in your page, using the relative links saves many bytes. Here is for the performance. This gives shorter transfer times, so it saves energy and it is good for the planet Earth.
Regarding the reuse of connections, the relative or absolute form of the links do not matter. Web browsers don't work that way. Anyway, Web browsers are very good at using relative links and directing them to the good server.
Relative links are definitely the way to go.
HTTP is a state less protocol, therefore everytime a user clicks on a link which links to a new HTML page a HTTP request is sent to the server, so using the full URL is not slower or faster than a relative URL.
No, there isn't any difference in performance in terms of requesting the page to load because they will both resolve to the exact same address, though the page size will be slightly larger with absolute paths by virtue of the src attributes being longer but that is obviously, not worth mentioning unless you have a page with thousands of links on of course.
Relative paths (your first example) are in most cases preferred over absolute as if the domain needs to change, you wont have to go through your entire site updating the image/file paths.
Since I started making my own web applications, rather than managing other peoples, I have fallen into the habit of making each reference url start from / .
This was becuase I wanted a convention, and I would find I was testing/deploying apps that used relative and absolute(/ not including http://....) urls in the app.
What convention should I be using for web applications, and will I run into problems with either approach (Aside from not being able to run apps in different folders with the absolute one)
Is there a benefit I get from using absolute? Or would relative always work just as well, and give me an added benefit of portability?
No benefit from absolute versus relative as long as the reference gets properly resolved. As for portability, this is one of those "it depends" situations.
For external page it is obviously that you can use only absolute paths. But for internal links I would suggest to use relative paths, as you'll gain from portability of the site.