我想知道这两种类型的url之间的区别:相对url(图片,CSS文件,JS文件等)和绝对url。

另外,用哪个比较好呢?


当前回答

一般来说,使用相对URL被认为是最佳实践,这样你的网站就不会被绑定到当前部署的基础URL。例如,它可以在本地主机上工作,也可以在您的公共域上工作,而无需修改。

其他回答

假设我们正在创建一个子站点,其文件位于http://site.ru/shop文件夹中。

1. 绝对URL

Link to home page
href="http://sites.ru/shop/"

Link to the product page
href="http://sites.ru/shop/t-shirts/t-shirt-life-is-good/"

2. 相对URL

Link from home page to product page
href="t-shirts/t-shirt-life-is-good/"

Link from product page to home page
href="../../"

虽然相对URL看起来比绝对URL短,但绝对URL更可取,因为链接可以在网站的任何页面上使用。

中间的情况下

我们考虑了两种极端情况:“绝对”绝对url和“绝对”相对url。但在这个世界上,一切都是相对的。这也适用于url。每次提到绝对URL时,都应该指定相对于什么。

3.Protocol-relative URL

Link to home page
href="//sites.ru/shop/"

Link to product page
href="//sites.ru/shop/t-shirts/t-shirt-life-is-good/"

谷歌推荐这样的URL。然而,现在通常认为http://和https://是不同的网站。

4. Root-relative URL

即相对于域的根文件夹。

Link to home page
href="/shop/"

Link to product page
href="/shop/t-shirts/t-shirt-life-is-good/"

如果所有页面都在同一个域中,这是一个很好的选择。当你把你的网站转移到另一个域名时,你不必在url中做大量的域名替换。

5. 基本相对URL(主页相对)

标签<base>指定基本URL,它会自动添加到所有相对链接和锚点。base标记不影响绝对链接。作为基本URL,我们将指定主页:<base href="http://sites.ru/shop/">。

Link to home page
href=""

Link to product page
href="t-shirts/t-shirt-life-is-good/"

现在,您不仅可以移动您的网站到任何域,但在任何子文件夹。请记住,虽然url看起来像相对的,但实际上它们是绝对的。 尤其要注意锚。要在当前页面中导航,我们必须写入href="t-shirt /t-shirt-life-is-good/#comments"而不是href="#comments"。后者将扔在首页上。

结论

对于内部链接,我使用基本相对url(5),对于外部链接和时事通讯,我使用绝对url(1)。

如果是在你的网站中使用,最好使用相对URL,如果你需要将网站移动到另一个域名或只是在本地调试,你可以这样做。

看看stackoverflow在做什么(firefox中的ctrl+U):

<a href="/users/recent/90691"> // Link to an internal element

在某些情况下,他们使用绝对url:

<link rel="stylesheet" href="http://sstatic.net/so/all.css?v=5934">

... 但这只是提高速度的最佳做法。在你的情况下,你看起来不像这样做,所以我不会担心。

在大多数情况下,相对url是可行的,它们本质上是可移植的,这意味着如果您想提升您的站点并将其放在其他地方,它将立即工作,可能会减少调试时间。

有一篇相当不错的文章是关于绝对url和相对url的,看看吧。

我不同意大多数人的观点。

我认为相对URL方案是“好的”,当你想快速启动和运行一些东西,而不是跳出框框思考,特别是如果你的项目很小,只有几个开发人员(或者只有你自己)。

然而,一旦您开始在大型的、臃肿的系统上工作,并且一直在切换域和协议,我相信一种更优雅的方法是合适的。

当你从本质上比较绝对和相对url时,绝对url胜出。为什么?因为它永远不会坏。永远。绝对URL就是它所描述的那样。问题是你必须维护你的绝对url。

The weak approach to absolute URL linking is actually hard coding the entire URL. Not a great idea, and probably the culprit of why people see them as dangerous/evil/annoying to maintain. A better approach is to write yourself an easy to use URL generator. These are easy to write, and can be incredibly powerful- automatically detecting your protocol, easy to config (literally set the url once for the whole app), etc, and it injects your domain all by itself. The nice thing about that: You go on coding using relative URLs, and at run time the application inserts your URLs as full absolutes on the fly. Awesome.

鉴于所有现代网站实际上都使用某种动态后端,这样做对网站最有利。绝对url的作用不仅仅是让你确定它们指向哪里——它们还可以提高SEO性能。

I might add that the argument that absolute URLs is somehow going to change the load time of the page is a myth. If your domain weighs more than a few bytes and you're on a dialup modem in the 1980s, sure. But that's just not the case anymore. https://stackoverflow.com/ is 25 bytes, whereas the "topbar-sprite.png" file that they use for the nav area of the site weighs in at 9+ kb. That means that the additional URL data is .2% of the loaded data in comparison to the sprite file, and that file is not even considered a big performance hit.

大的,未优化的,整个页面的背景图像更有可能减慢你的加载时间。

这里有一篇关于为什么不应该使用相对url的有趣文章: 为什么相对url应该被禁止

例如,可能会出现的一个问题是,有时服务器映射(请注意大型、混乱的项目)与文件名不一致,开发人员可能会对相对URL做出不正确的假设。我今天在我参与的一个项目上看到了这个,它把整个页面都拖下来了。

或者开发人员忘记切换指针,突然谷歌索引了整个测试环境。唉,重复的内容(不利于搜索引擎优化!)

绝对可能是危险的,但如果使用得当,并且不会破坏你的构建,它们被证明是更可靠的。看看上面的文章,它给出了一堆为什么Wordpress url生成器超级棒的理由。

:)

一般来说,使用相对URL被认为是最佳实践,这样你的网站就不会被绑定到当前部署的基础URL。例如,它可以在本地主机上工作,也可以在您的公共域上工作,而无需修改。