（评论）

（评论）
(comments)

原始链接: https://news.ycombinator.com/item?id=41243992

Notion 的网址系统使用稳定的 URL 格式，无论页面重命名、重组或移动。格式如下：notion.so/:account/Page-Title:pageID。当页面标题因重命名而发生变化时，新 URL 与旧页面 ID 保持不变，确保连续性。还可以使用 notion.so/:account/:pageID 进行导航，它直接引导至相应的页面。如果改用通用术语后跟页面 ID，则仍会重定向到正确的目的地。这种设计方面提供了便利，特别是在从概念数据库提取数据并将其传输到替代工具期间，因为链接保持一致，而不依赖于准确的页面标题或与命名约定相关的复杂性。 URL 排列将层次结构详细信息隐藏在导航系统中，而不是通过 URL 结构显式显示。因此，页面重定位仍然有效。尽管可能存在局限性，但该策略已被证明是实用且有效的。演示者概述了六项 URL 指南，强调： * 唯一性 – 每个资源对应一个 URL。 * 持久性 – 无需更改现有 URL，消除依赖性。 * 可管理性 – 跨站点部分的一致逻辑应用程序，排除复杂的异常并避免复杂化。 * 可扩展性——轻松扩展逻辑。 * 简短 – 最小化字符长度。 * 部分变化 – 目标短语允许轻微修改。第 1 条规则最为重要，而第 2 条规则的重要性则排在第二位。规则 3、4、5 和 6 分别根据重要性递减而遵循。 SEO 友好的 URL 满足所有上述 URL 准则。首选 URL 结构显示为 example.com/\[short-namespace\]\[\[unique-slug\]]。下面提供了该 URL 结构的简要说明： - \[短命名空间\] 由一两个字母符号组成，标识网页类别，独立于整个网站架构。 - \[Unique-Slug\] 仅包含小写字母、数字、连字符，并且不包括重复的连字符实例或最后的连字符或下划线。如果编辑控制权完全落在作者手中，则仅使用口语。在注意到个人对蛞蝓的偏好的同时，作者建议

He calls file extensions cruft, but i've come to value them. They are a simple way to indicate file type - desired or offered - which is easily understood by machines and people.

I currently work with an API which does a bit of content negotiation using the Accept header, so clients can request data in various formats - application/json for a snapshot, text/event-stream for an updating feed, or text/html for an interactive dashboard. I wish it didn't. I wish we'd just used file extensions. Trivial to use in a browser or via curl, trivial to implement on either side.

That's fine (and already common) for images, JSON, etc.

But nobody wants webpage URL's that randomly end in .php, .htm, .html, .aspx, and so forth. That's just noise that is both gibberish and entirely irrelevant to the user.

.htm and .html is relevant just like .pdf and .zip etc etc

But I agree about .php, .aspx and other extensions that are telling something about the server side. That’s irrelevant for the user.

> .htm and .html is relevant just like .pdf and .zip etc etc

it's _kind of_ relevant, if it weren't for the fact that the absence of any extension implies .html >99% of the time

For _APIs_ I prefer to use both - the only downside is that resource names need to be restricted to _not_ include trailing `.{EXT}`s (either at all or limiting EXT to things that aren't valid content types).

E. g. `/books` - looks at the `Accept` header. `/books.json` - sets the `Accept` header to `application/json`. `/books.xml` - `application/xml`, and so on.

I guess this reflects a view of blogging that maybe is more what people today would use twitter or mastodon for, with lots of blogposts with the same title like "open thread" or "links for sunday". Today people mostly use blogs to publish essays, and then a slug based on the title should be sufficient, since you're not going to publish two essays with the same title. That's what substack uses.

I think the date is still extremely valuable. Knowing whether something is from last month or a decade ago makes a huge difference. It's also useful so that URL's can be sorted by date.

Also, "you're not going to publish two essays with the same title" feels false. If you write 1,000 pieces and use short titles and tend to write about the same subjects, it feels extremely likely that you'll wind up repeating titles.

And it's sad how often one needs to use the URL to find the date, since many authors just don't put it on the page (corporate sites are particularly scared of dating their stuff)

Others seem to think just day and month is fine, as if the year isn't the most significant part. And if both numbers are <=12 then you have to go and find out what locale the author formats their dates in...

I agree, but I think it's important to note that the date in the URL can also be misleading. For example, it's often assigned at time of creation. If that page or post gets updated years later, even if almost entirely rewritten, it still has the original date in the URL

> even if almost entirely rewritten, it still has the original date in the URL

If we're talking about blogs/news, they don't ever get almost entirely rewritten. The original publication is the only date that matters, and it matters a lot.

If we're talking about evergreen content like documentation, then of course you don't put dates in the URL. A small "last updated" on the page itself is appropriate there.

> If we're talking about blogs/news, they don't ever get almost entirely rewritten.

Unfortunately, this isn't the case. It should be the case IMHO, but it (currently) isn't. The SEO/marketing people nowadays (ab)use popular pages for the search rankings and update them regularly to keep the content fresh and highly ranked (since search engines give much preference to new content).

Also, even for strict blogs/news, it's not unusual for a particular post to be a draft for many months before publishing. Most serious blog will fix the date to match publish date, but that isn't what happens by default especially in Wordpress (which is the most important platform for blogs).

> then a slug based on the title should be sufficient, since you're not going to publish two essays with the same title.

Disambiguation is one thing, but as a reader, I really like having the date indicated in the URL for informational purporses. It's very helpful.

How do search engines figure out the date of webpages that don't contain it in the metadata?

Poorly.

I have a blog so old I titled it an "online diary." It pre-dates search engines, so they tend to date the diary entries (blog posts) based on first crawl. Which means lot of the dates presented by the search engines are off by several years.

Well, arguably both Movable Type and Radio Userland's URLs were already pretty cruft-free. The success of Wordpress was mostly due to other factors (free, php, great feeds, great markup in default templates, great support for plugins).

I found Notion's URL schema interesting as well. They have to contend with renames of pages, reorganisation of the hierarchy and all that. So they have something like:

    notion.so/:account/Current-Name-of-Page-:pageid

where the name changes if the page is renamed, but the redirect works, as the page ID is unchanged. In fact, one can just use

    notion.so/:account/:pageid

and gets redirected to the right page, or even

    notion.so/:account/Anything-else-:pageid

works too...

This is very handy in my use cases, when various Notion data is extracted into another tool, reassembled, and then needed to have a link to the original page. I don't need to worry about the page's name, or how that name gets converted into the URL, or any race conditions....

The page hierarchy is then just within the navigaton, not in the URL, so moved pages continue to work too (even if this looks like a flatter hierarchy than it really is).

I'm sure there are plenty of drawbacks, but I've found it an interesting, pragmatic solution.

I've noticed that Confluence, Reddit, and a good number of news sites do the same thing. Usually the title segment is entirely ignored, meaning you can prank someone by changing the title part to something shocking, and it just redirects to the usual page, because the server only cared about the ID bit

The fact that so many sites do this (including "normie" news sites) shows that site designers clearly believe users want and expect "informational"/"denormalized" URLs, rather than /?id=123

It’s an SEO thing.

The better way to implement this is to serve a 301 redirect if the words in the URL don't match the expected ones, that avoids trickery and also removes the risk of the same page being accidentally indexed as duplicate content.

So you can tell what the URL might point to by looking at it. That’s one of the important things mentioned in the article linked on this HN post: URLs are used by both computers and people.

its for humans I would expect, to know what the page refers to without opening it.

Kinda smart.

Also; taking it from the end means you only need to parse the string as an offset from the end. It can make load balancing much faster in theory.

It's also for crawlers. When doing technical SEO, having a human readable slug in the URL is low hanging fruit that is often overlooked. This, as well as having a structure of `CURRENT_CONTENT_TITLE | WEBSITE_NAME` are things that are quite trivial to implement and provide a significant uplift in both SEO and UX.</p> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41246396" readability="3.8443396226415"><td></td></tr> <tr class="athing comtr" id="41245059" readability="2.2407407407407"><td></td></tr> <tr class="athing comtr" id="41246606" readability="2.8872180451128"><td></td></tr> <tr class="athing comtr" id="41245526" readability="6.4291845493562"><td><table border="0" readability="3.2145922746781"> <tr readability="6.4291845493562"> <td class="ind" indent="0"><img src="s.gif" height="1" width="0"></img></td><td valign="top" class="votelinks"> <center><a id="up_41245526" href="vote?id=41245526&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default" readability="5.9699570815451"><br></br><div class="comment" readability="11.858490566038"> <p>Back when I was working on GOV.UK Verify we had URLs that looked something like /verify-passport for English and /cy/verify-passport for Welsh. I made the decision that if readable URLs was a design goal they should be readable in both languages, and ended up localising them all to (for example) /verify-passport and /gwirio-pasbort. No idea if anyone ever noticed, but sometimes it’s nice to sweat the small stuff.</p> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41245757" readability="5.3809523809524"><td><table border="0" readability="2.6904761904762"> <tr readability="5.3809523809524"> <td class="ind" indent="1"><img src="s.gif" height="1" width="40"></img></td><td valign="top" class="votelinks"> <center><a id="up_41245757" href="vote?id=41245757&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default"><br></br><div class="comment" readability="8.3731343283582"> <div class="commtext c00" readability="12">I had the same thought for a restaurant website that served multiple languages. I figured customers might glance at the URL when it's being shared, and appreciate it being in their language.<p>What do you do when the translated slug happens to be the same in multiple languages? I ended up still having the country code in the slug.</p></div> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41245776" readability="2.9461077844311"><td></td></tr> <tr class="athing comtr" id="41246760" readability="8.2579281183932"><td><table border="0" readability="4.1289640591966"> <tr readability="8.2579281183932"> <td class="ind" indent="1"><img src="s.gif" height="1" width="40"></img></td><td valign="top" class="votelinks"> <center><a id="up_41246760" href="vote?id=41246760&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default"><br></br><div class="comment" readability="10.377049180328"> <div class="commtext c00" readability="16">This is important to do, in my opinion. You should not assume that non-English-speaking users all understand a little bit of English. It also confers some SEO benefits.<p>That being said, if the URL has a language code (/en/), it would be good to change the language code manually, and still end up on the right page. Sometimes the language switcher is really well hidden. However a visible language switcher is even better.</p></div> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41254261" readability="1.0888888888889"><td></td></tr> <tr class="athing comtr" id="41256132" readability="5.0939597315436"><td><table border="0" readability="2.5469798657718"> <tr readability="5.0939597315436"> <td class="ind" indent="2"><img src="s.gif" height="1" width="80"></img></td><td valign="top" class="votelinks"> <center><a id="up_41256132" href="vote?id=41256132&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default" readability="5.0939597315436"><br></br><div class="comment" readability="10.776422764228"> <p>Best time of my professional career, broadly (although there were obvious frustrations). I’d 100% recommend at least a couple-year stint at GDS if it’s an option, as it completely changes the way you think about a huge number of things.</p> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41246315" readability="3.14"><td></td></tr> <tr class="athing comtr" id="41247092" readability="2.2539682539683"><td></td></tr> <tr class="athing comtr" id="41246983" readability="0.85294117647059"><td></td></tr> <tr class="athing comtr" id="41244667" readability="1.3165467625899"><td></td></tr> <tr class="athing comtr" id="41244685" readability="1.2352941176471"><td></td></tr> <tr class="athing comtr" id="41244794" readability="1.1785714285714"><td></td></tr> <tr class="athing comtr" id="41245064" readability="7.8861788617886"><td></td></tr> <tr class="athing comtr" id="41244901" readability="2.0217391304348"><td></td></tr> <tr class="athing comtr" id="41245072" readability="0.58585858585859"><td></td></tr> <tr class="athing comtr" id="41244850" readability="2.0851063829787"><td></td></tr> <tr class="athing comtr" id="41245501" readability="4.0126050420168"><td><table border="0" readability="2.0063025210084"> <tr readability="4.0126050420168"> <td class="ind" indent="2"><img src="s.gif" height="1" width="80"></img></td><td valign="top" class="votelinks"> <center><a id="up_41245501" href="vote?id=41245501&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default" readability="4.0126050420168"><br></br><div class="comment" readability="8.7513812154696"> <p>"Q: Can I provide my own wood? A: In most cases we can handle your wood. We do require all shipments to be clean, free of parasites and pass all standard customs inspections."</p> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41247038" readability="8.61328125"><td><table border="0" readability="4.306640625"> <tr readability="8.61328125"> <td class="ind" indent="0"><img src="s.gif" height="1" width="0"></img></td><td valign="top" class="votelinks"> <center><a id="up_41247038" href="vote?id=41247038&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default"><br></br><div class="comment" readability="13.407660738714"> <div class="commtext c00" readability="22">I’m glad this article mentions GitHub, who have had some of the best URL design I’ve ever seen, and have done since they first launched.<p>I use that ALL the time. I can navigate straight to any issue by typing a URL. I can switch to the “actions” view for a repo by adding /actions. I can see the file I’m looking at in a branch by editing the URL and swapping “main” for the branch name.</p><p>All available via the UI as well, but I interact with GitHub so often that the tiny efficiency boost I get from navigating by URLs really starts to add up.</p><p>I also trust them not to break links, based on their track record. My notes and blog posts and even my source code are full of links to issues or code snippets on GitHub.</p></div> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41247064" readability="2.0839694656489"><td></td></tr> <tr class="athing comtr" id="41248261" readability="1.8571428571429"><td></td></tr> <tr class="athing comtr" id="41250464" readability="2.034965034965"><td></td></tr> <tr class="athing comtr" id="41247228" readability="10.936363636364"><td><table border="0" readability="5.4681818181818"> <tr readability="10.936363636364"> <td class="ind" indent="1"><img src="s.gif" height="1" width="40"></img></td><td valign="top" class="votelinks"> <center><a id="up_41247228" href="vote?id=41247228&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default"><br></br><div class="comment" readability="12.341370558376"> <div class="commtext c00" readability="20">I believe this is a (happy) legacy from Rails.<p>In rails, if you don't spend effort to undo, you get URLs that match your database setup in a RESTful way. For me, that's far to tight coupling, and problematic in other ways.</p><p>But the result is that without thinking about it, without a second of time spent on designing an URL structure, you get a very nice, consistent and clean one for free.</p></div> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41245691" readability="1.3793103448276"><td></td></tr> <tr class="athing comtr" id="41246092" readability="3.3965517241379"><td><table border="0" readability="1.698275862069"> <tr readability="3.3965517241379"> <td class="ind" indent="1"><img src="s.gif" height="1" width="40"></img></td><td valign="top" class="votelinks"> <center><a id="up_41246092" href="vote?id=41246092&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default" readability="3.8211206896552"><br></br><div class="comment" readability="7.7927461139896"> <p>I agree that is a cool feature. I would say it's from its Rails background where such a thing is encouraged (.json or .html (or no extension)) on a resource give you two different outputs</p> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41246585" readability="1.2666666666667"><td></td></tr> <tr class="athing comtr" id="41244590" readability="4.4603174603175"><td><table border="0" readability="2.2301587301587"> <tr readability="4.4603174603175"> <td class="ind" indent="0"><img src="s.gif" height="1" width="0"></img></td><td valign="top" class="votelinks"> <center><a id="up_41244590" href="vote?id=41244590&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default" readability="4.4603174603175"><br></br><div class="comment" readability="8.8375451263538"> <p>An example of a not-so-great URL design: Amazon product links have an optional slug before everything else like `{slug}/dp/{id}`. So you end up copying a gigantic URL everytime you wish to share a product unless you use the share product button to get the shortened link.</p> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41244979" readability="4.6478873239437"><td><table border="0" readability="2.3239436619718"> <tr readability="4.6478873239437"> <td class="ind" indent="1"><img src="s.gif" height="1" width="40"></img></td><td valign="top" class="votelinks"> <center><a id="up_41244979" href="vote?id=41244979&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default"><br></br><div class="comment" readability="8.9141221374046"> <div class="commtext c00" readability="13">I think this is actually a really great design in that the name of the product can always be in the URL. The "slug" is completely ignored and just there for SEO/humans. If you send a link I instantly know what it's for -- that's pretty useful!<p>I also like that the "id" which is an ASIN (Amazon Standard Identification Number) which is a superset of all ISBNs. This means you can just enter any book ISBN directly into the browser and end up on the right page (at least historically) instead of having to search for it.</p></div> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41245013" readability="3.4176245210728"><td><table border="0" readability="1.7088122605364"> <tr readability="3.4176245210728"> <td class="ind" indent="2"><img src="s.gif" height="1" width="80"></img></td><td valign="top" class="votelinks"> <center><a id="up_41245013" href="vote?id=41245013&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default" readability="4.272030651341"><br></br><div class="comment" readability="8.7916666666667"> <p>This got a major retailor (Walmart maybe?) into issues awhile back as they were pulling the product title (only) from this param so people were having a heyday "renaming" official products on the official site.</p> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41247488" readability="6.4744408945687"><td><table border="0" readability="3.2372204472843"> <tr readability="6.4744408945687"> <td class="ind" indent="2"><img src="s.gif" height="1" width="80"></img></td><td valign="top" class="votelinks"> <center><a id="up_41247488" href="vote?id=41247488&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default"><br></br><div class="comment" readability="9.9121265377856"> <div class="commtext c00" readability="15">>><i>Amazon product links have an optional slug BEFORE everything else</i><p>><i>I think this is actually a really great design in that the name of the product can always be in the URL</i></p><p>he said "before". you could accomplish your goal putting the slug "after". he's making the point that having a place after which you can harmlessly delete the rest of the url is better than having embedded NOPs surrounded by identifying information (not that the average user will ever edit any url, but there is still merit in what he said that you missed, and he's not disagreeing with you)</p></div> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41245520" readability="3.957345971564"><td></td></tr> <tr class="athing comtr" id="41246207" readability="4.5298165137615"><td><table border="0" readability="2.2649082568807"> <tr readability="4.5298165137615"> <td class="ind" indent="3"><img src="s.gif" height="1" width="120"></img></td><td valign="top" class="votelinks"> <center><a id="up_41246207" href="vote?id=41246207&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default"><br></br><div class="comment" readability="8.3904639175258"> <div class="commtext c00" readability="12">I dont know if I'm in the minority but I really dislike link previews the vast majority of the time. They take up too much space and offer to little value. In discord I often x out of the preview and I know lots of others who do too.<p>Maybe on some sites it's fine but I feel like link previews need more modularity on size or something. Perbaps even configurable both host and client</p></div> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41246744" readability="5.04"><td><table border="0" readability="2.52"> <tr readability="5.04"> <td class="ind" indent="4"><img src="s.gif" height="1" width="160"></img></td><td valign="top" class="votelinks"> <center><a id="up_41246744" href="vote?id=41246744&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default"><br></br><div class="comment" readability="8.3102678571429"> <div class="commtext c00" readability="12">You're not in the minority.<p>The information density of the preview has to match, if not exceed, that of the context in which it is provided. Most of the times it's a placeholder image with less text than the URL itself.</p></div> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41244697" readability="2.1020408163265"><td></td></tr> <tr class="athing comtr" id="41244857" readability="1.1264367816092"><td></td></tr> <tr class="athing comtr" id="41245272" readability="3.2121212121212"><td><table border="0" readability="1.6060606060606"> <tr readability="3.2121212121212"> <td class="ind" indent="3"><img src="s.gif" height="1" width="120"></img></td><td valign="top" class="votelinks"> <center><a id="up_41245272" href="vote?id=41245272&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default" readability="4.0151515151515"><br></br><div class="comment" readability="8.7039473684211"> <p>Which makes sense because URLs are often displayed such that only a prefix is visible. And for editing, it’s still easy to cut and paste the ID.</p> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41245377" readability="3.2828685258964"><td><table border="0" readability="1.6414342629482"> <tr readability="3.2828685258964"> <td class="ind" indent="1"><img src="s.gif" height="1" width="40"></img></td><td valign="top" class="votelinks"> <center><a id="up_41245377" href="vote?id=41245377&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default" readability="3.6932270916335"><br></br><div class="comment" readability="7.7989949748744"> <p>At least that stuff is actually informative to a human. A lot of Amazon's URL bloat is the analytics crap they shove into query string. I started using ClearURLs specifically because of Amazon.</p> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41245104" readability="2.1818181818182"><td></td></tr> <tr class="athing comtr" id="41245556" readability="4.2337164750958"><td><table border="0" readability="2.1168582375479"> <tr readability="4.2337164750958"> <td class="ind" indent="2"><img src="s.gif" height="1" width="80"></img></td><td valign="top" class="votelinks"> <center><a id="up_41245556" href="vote?id=41245556&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default" readability="4.6570881226054"><br></br><div class="comment" readability="9.7663551401869"> <p>If you're referring to the StackOverflow example from the article, it's different because they follow `/questions/:id/:slug`. Keeping slug at the end makes it a lot easier to delete while keeping it readable.</p> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41246158" readability="7.7852760736196"><td><table border="0" readability="3.8926380368098"> <tr readability="7.7852760736196"> <td class="ind" indent="1"><img src="s.gif" height="1" width="40"></img></td><td valign="top" class="votelinks"> <center><a id="up_41246158" href="vote?id=41246158&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default"><br></br><div class="comment" readability="10.309090909091"> <div class="commtext c00" readability="16">It is a curious decision why they chose to put the ID before the slug.<p>Stack Overflow, in contrast, puts the ID first, followed by an often very long slug. Which seems to be the more common pattern generally, as far as I can tell.</p><p>I do wonder what their rationale was/is.</p></div> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41245245" readability="2.35"><td></td></tr> <tr class="athing comtr" id="41246179" readability="7.2233009708738"><td><table border="0" readability="3.6116504854369"> <tr readability="7.2233009708738"> <td class="ind" indent="1"><img src="s.gif" height="1" width="40"></img></td><td valign="top" class="votelinks"> <center><a id="up_41246179" href="vote?id=41246179&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default"><br></br><div class="comment" readability="9.3698630136986"> <div class="commtext c00" readability="14">> So you end up copying a gigantic URL everytime you wish to share a product<p>Yeah, when I used Amazon I found this incredibly annoying. When I wanted to share a link, I'd have to spend a few minutes figuring out how much of that stuff I could remove and testing the resulting URL before sharing it. A relatively minor irritation, but an irritation nonetheless.</p></div> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41247560" readability="6.5546218487395"><td><table border="0" readability="3.2773109243697"> <tr readability="6.5546218487395"> <td class="ind" indent="2"><img src="s.gif" height="1" width="80"></img></td><td valign="top" class="votelinks"> <center><a id="up_41247560" href="vote?id=41247560&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default" readability="5.3256302521008"><br></br><div class="comment" readability="11.68085106383"> <p>having, like you, studied amazon urls, I just automatically delete everything?inclusive after the "?", then I edit the slug to make it contain a message personalized for my recipient</p> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41246193" readability="4.9952153110048"><td><table border="0" readability="2.4976076555024"> <tr readability="4.9952153110048"> <td class="ind" indent="0"><img src="s.gif" height="1" width="0"></img></td><td valign="top" class="votelinks"> <center><a id="up_41246193" href="vote?id=41246193&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default" readability="4.5789473684211"><br></br><div class="comment" readability="9.7058823529412"> <p>Note, if you are using optional slugs or otherwise, you should have a canonical url in the header so that search results will be collated to a single canonical url.</p> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41245885" readability="2.469696969697"><td><table border="0" readability="1.2348484848485"> <tr readability="2.469696969697"> <td class="ind" indent="0"><img src="s.gif" height="1" width="0"></img></td><td valign="top" class="votelinks"> <center><a id="up_41245885" href="vote?id=41245885&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default" readability="3.7045454545455"><br></br><div class="comment" readability="7.748427672956"> <p>Post author here. There are so many great additional examples of intriguing URL patterns in the comments here. TY everyone for sharing ones you remember!</p> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41246842" readability="5.3786982248521"><td><table border="0" readability="2.689349112426"> <tr readability="5.3786982248521"> <td class="ind" indent="0"><img src="s.gif" height="1" width="0"></img></td><td valign="top" class="votelinks"> <center><a id="up_41246842" href="vote?id=41246842&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default"><br></br><div class="comment" readability="8.8494983277592"> <div class="commtext c00" readability="13">> website under a .is domain (which is for Iceland, apparently).<p>I don’t super like repurposing country names like that. Including .io.</p><p>It feels this disregards the actual meaning of the extension while ignoring some very legal consequences to be under Indian legal system instead of EU or US.</p></div> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41247160" readability="5.3877551020408"><td><table border="0" readability="2.6938775510204"> <tr readability="5.3877551020408"> <td class="ind" indent="1"><img src="s.gif" height="1" width="40"></img></td><td valign="top" class="votelinks"> <center><a id="up_41247160" href="vote?id=41247160&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default" readability="4.9387755102041"><br></br><div class="comment" readability="9.8355263157895"> <p>To be fair most countries rolling out ccTLDs these days aren't doing it so patriotic citizens can represent their home country - it's an international cash grab. They're fine with randoms from all over the world giving them money, so randoms from all over the world are welcome to use their ccTLDs.</p> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41245179" readability="15.961992136304"><td><table border="0" readability="7.980996068152"> <tr readability="15.961992136304"> <td class="ind" indent="0"><img src="s.gif" height="1" width="0"></img></td><td valign="top" class="votelinks"> <center><a id="up_41245179" href="vote?id=41245179&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default"><br></br><div class="comment" readability="29.92276695769"> <div class="commtext c00" readability="55.751854349292">These are my URL rules, in any project where I or my clients violate one of the rules - or their priority, we will regret it down the road.<p>URL-rules</p><p>URL-Rule 1: unique (1 URL == 1 resource, 1 resource == 1 URL)</p><p>URL-Rule 2: permanent (they do not change, no dependencies to anything)</p><p>URL-Rule 3: manageable (equals measurable, 1 logic per site section, no complicated exceptions, no exceptions)</p><p>URL-Rule 4: easily scalable logic</p><p>URL-Rule 5: short</p><p>URL-Rule 6: with a variation (partial) of the targeted phrase</p><p>URL-Rule 1 is more important than 1 to 6 combined,</p><p>URL-Rule 2 is more important than 2 to 6 combined,</p><p>URL-Rule 3 is more important than 3 to 6 combined,</p><p>URL-Rule 4 is more important than 4 to 6 combined.</p><p>URL-Rule 5 and 6 are a trade-off. 6 is the least important.</p><p>A truly search optimized URL must fulfill all URL-Rules.</p><p>My preferred URL structure is:</p><p><a href="https://www.example.com/%short-namespace%/%unique-slug%" rel="nofollow">https://www.example.com/%short-namespace%/%unique-slug%</a></p><p><a href="https://" rel="nofollow">https://</a> – protocol</p><p>www – subdomain</p><p>example – brand</p><p>.com – general TLD or country TLD</p><p>%short-namespace% – one or two letters that identify the page type, no dependency to any site hierarchy</p><p>%unique-slug% – only use a-z, 0-9, and – in the slug, no double — and no – or – at the end. Only use “speaking slugs” if you have them under your total editorial control.</p><p>i.e.:</p><p><a href="https://www.example.com/a/artikel-name" rel="nofollow">https://www.example.com/a/artikel-name</a></p><p><a href="https://www.example.com/c/cool-list" rel="nofollow">https://www.example.com/c/cool-list</a></p><p><a href="https://www.example.com/p/12345" rel="nofollow">https://www.example.com/p/12345</a> (does not fulfill the least important URL-Rule 6)</p><p><a href="https://www.example.com/p/12345-product-name" rel="nofollow">https://www.example.com/p/12345-product-name</a></p></div> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41244889" readability="10.913580246914"><td><table border="0" readability="5.4567901234568"> <tr readability="10.913580246914"> <td class="ind" indent="0"><img src="s.gif" height="1" width="0"></img></td><td valign="top" class="votelinks"> <center><a id="up_41244889" href="vote?id=41244889&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default"><br></br><div class="comment" readability="10.958333333333"> <div class="commtext c00" readability="17.652482269504">Similar to the Slack example given in the post with /is/ URLs, KDE has /for/ URLs with pages which present the KDE project and software for various user profiles: developers, kids, scientists, students, creators, gamers, activists, etc.<p>See all these pages here: <a href="https://kde.org/for/" rel="nofollow">https://kde.org/for/</a></p></div> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41244683" readability="4.4615384615385"><td><table border="0" readability="2.2307692307692"> <tr readability="4.4615384615385"> <td class="ind" indent="0"><img src="s.gif" height="1" width="0"></img></td><td valign="top" class="votelinks"> <center><a id="up_41244683" href="vote?id=41244683&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default"><br></br><div class="comment" readability="7.8601398601399"> <div class="commtext c00" readability="11">Love this. A big miss teams have are with affiliate/refer a friend urls. Like if you think of your Uber referral code being 5 characters instead of a general 16 character hash. Shorter makes it easier for people to remember and share their code.<p>e.g. RJF01 vs ab0fhct99fh2h4fqi2fj9</p></div> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41247171" readability="9.3827160493827"><td><table border="0" readability="4.6913580246914"> <tr readability="9.3827160493827"> <td class="ind" indent="0"><img src="s.gif" height="1" width="0"></img></td><td valign="top" class="votelinks"> <center><a id="up_41247171" href="vote?id=41247171&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default"><br></br><div class="comment" readability="13.867424242424"> <div class="commtext c00" readability="23">The Reuters links are an example of good links IMHO. They're not earth-shattering, and follow some fairly generic guidelines, but work quite well.<p>Format is reuters.com/:category/:headline:date</p><p>which is all you need to know what you're clicking on. For example, I don't need to describe this link in order for its contents - and its time-relevance - to be understood:</p><pre><code> https://www.reuters.com/world/us-navys-newest-air-to-air-missile-could-tilt-balance-south-china-sea-2024-08-14/ </code></pre> Edit: they are a bit long, though, I suppose</div> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41244776" readability="9.4851794071763"><td><table border="0" readability="4.7425897035881"> <tr readability="9.4851794071763"> <td class="ind" indent="0"><img src="s.gif" height="1" width="0"></img></td><td valign="top" class="votelinks"> <center><a id="up_41244776" href="vote?id=41244776&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default"><br></br><div class="comment" readability="13.388245033113"> <div class="commtext c00" readability="22">Using a numeric ID + ignored path part is easy to implement, but actually using the textual part without an exposed ID seems more elegant to me. Tip for implementing that:<p>* have a separate table that maps slugs to IDs, allowing many-to-one relationship, because content's title will be updated, and you don't want to break old links.</p><p>* long slugs will get truncated by users. A zero-cost way to recover from that is `select id where slug >= ? order by slug limit 1`</p><p>* in either case don't forget to redirect to the canonical URL, so that people can't create duplicate or misleading URLs on your site.</p></div> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41244848" readability="6.020979020979"><td><table border="0" readability="3.0104895104895"> <tr readability="6.020979020979"> <td class="ind" indent="1"><img src="s.gif" height="1" width="40"></img></td><td valign="top" class="votelinks"> <center><a id="up_41244848" href="vote?id=41244848&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default" readability="5.5909090909091"><br></br><div class="comment" readability="11.752066115702"> <p>I don't like slug-only URLs because they are hard to make concise. If the textual part can be compressed into one or two words, like what qntm does in his website, then it is okay, but most schemes do not really care much about slugs...</p> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41244957" readability="7.8226744186047"><td><table border="0" readability="3.9113372093023"> <tr readability="7.8226744186047"> <td class="ind" indent="1"><img src="s.gif" height="1" width="40"></img></td><td valign="top" class="votelinks"> <center><a id="up_41244957" href="vote?id=41244957&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default" readability="6.0843023255814"><br></br><div class="comment" readability="12.777397260274"> <p>the problem with that, as mentioned in the article, is that that breaks if the content of the page changes. So on stack overflow for example, what happens if someone changes the title of their question? you either break the url or use an old version of the title, thus being misleading.</p> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41244990" readability="1.8333333333333"><td></td></tr> <tr class="athing comtr" id="41245393" readability="1.7179487179487"><td></td></tr> <tr class="athing comtr" id="41246011" readability="4.3986486486486"><td></td></tr> <tr class="athing comtr" id="41245845" readability="6.4115044247788"><td><table border="0" readability="3.2057522123894"> <tr readability="6.4115044247788"> <td class="ind" indent="0"><img src="s.gif" height="1" width="0"></img></td><td valign="top" class="votelinks"> <center><a id="up_41245845" href="vote?id=41245845&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default"><br></br><div class="comment" readability="9.8780487804878"> <div class="commtext c00" readability="15">From a URL=Resource perspective I don't love unstructured strings in the url because they make it trickier (never impossible) to extend with sub-resources. For example, if I have a url for a blog post with a slug, it's more difficult to represent a comment as a sub-record of that post:<p>`my.domain/post/123/my-great-slug-that-is-pretty-long-but-doesnt-matter/comment/456`</p><p>vs</p><p>`my.domain/post/123/comment/456`</p></div> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41245785" readability="5.4717832957111"><td><table border="0" readability="2.7358916478555"> <tr readability="5.4717832957111"> <td class="ind" indent="0"><img src="s.gif" height="1" width="0"></img></td><td valign="top" class="votelinks"> <center><a id="up_41245785" href="vote?id=41245785&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default"><br></br><div class="comment" readability="9.38125"> <div class="commtext c00" readability="14">I've come to regret that most of my projects have this URL design- mainly because it gets harder to track via third party analytics platforms like Sentry and Clarity.<p>eg. series/9876545678 and series/098767890 get treated differently and the analytics get difficult to merge. But really they're the same page just hydrated with different data.</p><p>Should've used query params, eg series?id=9876545678</p></div> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41246932" readability="7.031847133758"><td><table border="0" readability="3.515923566879"> <tr readability="7.031847133758"> <td class="ind" indent="0"><img src="s.gif" height="1" width="0"></img></td><td valign="top" class="votelinks"> <center><a id="up_41246932" href="vote?id=41246932&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default"><br></br><div class="comment" readability="14.092790387183"> <div class="commtext c00" readability="23.795423956931">Another interesting related area is designing URLs for third-party components.<p>Third-party component have to coexist with existing site navigation logic, so generally you can't safely add URL-based configuration to such a component.</p><p>Fortunately, configuration can now be stored in fragment directives in order to hide this from normal site routing. e.g.</p><pre><code> https://example.com/page#routing-info:~:additional-routing-info-for-third-party-component </code></pre> With fragment directives, location.href and location.hash exclude the additional content in the hash after :~:<p>This is used in Transcend Consent Management for configuring parameters to debug and simulate various privacy experiences[1].</p><p>1. <a href="https://docs.transcend.io/docs/consent-management/reference/debugging-and-testing#config-overrides" rel="nofollow">https://docs.transcend.io/docs/consent-management/reference/...</a></p></div> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41244653" readability="8.3600917431193"><td><table border="0" readability="4.1800458715596"> <tr readability="8.3600917431193"> <td class="ind" indent="0"><img src="s.gif" height="1" width="0"></img></td><td valign="top" class="votelinks"> <center><a id="up_41244653" href="vote?id=41244653&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default" readability="6.9667431192661"><br></br><div class="comment" readability="13.825436408978"> <p>What’s the best way to handle url slugs that change? For example, if I have www.example.com/page/foo, and the user changes that page’s title to bar, the slug updates to www.example.com/page/bar and anyone visiting the old url gets automatically redirected to the new one. But now the old slug of foo can’t be used again (without appending some unique identifier to it, like foo-th683gh9i).</p> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41244696" readability="3.5815602836879"><td></td></tr> <tr class="athing comtr" id="41245106" readability="3.0952380952381"><td></td></tr> <tr class="athing comtr" id="41244682" readability="3.392"><td><table border="0" readability="1.696"> <tr readability="3.392"> <td class="ind" indent="1"><img src="s.gif" height="1" width="40"></img></td><td valign="top" class="votelinks"> <center><a id="up_41244682" href="vote?id=41244682&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default"><br></br><div class="comment" readability="7.3170731707317"> <div class="commtext c00" readability="10">The first example is just that. Put the id in the URL and make the slug optional.<p>Stackoverflow makes the slug completely optional but you have the choice of only accepting foo and bar in your example</p></div> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41244779" readability="0.61363636363636"><td></td></tr> <tr class="athing comtr" id="41244812" readability="3.1538461538462"><td></td></tr> <tr class="athing comtr" id="41244873" readability="6.7934426229508"><td><table border="0" readability="3.3967213114754"> <tr readability="6.7934426229508"> <td class="ind" indent="3"><img src="s.gif" height="1" width="120"></img></td><td valign="top" class="votelinks"> <center><a id="up_41244873" href="vote?id=41244873&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default" readability="5.5196721311475"><br></br><div class="comment" readability="11.759036144578"> <p>It’s not great but it matters less when the content you get going to that page is so unremarkable. Don’t forget you can do that to any url, even of sites that don’t use optional slugs, if your goal is just vague, evil-by-link-appearance.</p> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41244825" readability="4.1632653061224"><td><table border="0" readability="2.0816326530612"> <tr readability="4.1632653061224"> <td class="ind" indent="3"><img src="s.gif" height="1" width="120"></img></td><td valign="top" class="votelinks"> <center><a id="up_41244825" href="vote?id=41244825&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default"><br></br><div class="comment" readability="7.7938144329897"> <div class="commtext c00" readability="11">What is the actual harm in allowing people to put random text at the end of the url?<p>Not to mention something similar can be done to any url, e.g. #whatever-you-want or ?_=whatever-you-want</p></div> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41245293" readability="1.0630630630631"><td></td></tr> <tr class="athing comtr" id="41245585" readability="8.0064935064935"><td><table border="0" readability="4.0032467532468"> <tr readability="8.0064935064935"> <td class="ind" indent="0"><img src="s.gif" height="1" width="0"></img></td><td valign="top" class="votelinks"> <center><a id="up_41245585" href="vote?id=41245585&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default" readability="6.2272727272727"><br></br><div class="comment" readability="12.759259259259"> <p>I gotta say, Datadog does this pretty well. They manage all their state (just information state, not like user sessions lol) in the URL, which makes it easy to integrate with and dynamically generate links and share information, and manages to stay human readable.</p> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41245710" readability="10.23"><td><table border="0" readability="5.115"> <tr readability="10.23"> <td class="ind" indent="0"><img src="s.gif" height="1" width="0"></img></td><td valign="top" class="votelinks"> <center><a id="up_41245710" href="vote?id=41245710&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default"><br></br><div class="comment" readability="11.375271149675"> <div class="commtext c00" readability="18">The Slack URL scheme, and a few others mentioned in other comments take me right back to hp.com/go/, so hp.com/go/proliant would take you to Proliant servers, maybe.<p>The idea was really cool, but from talking to people at HP at the time, the implementation was apparently a complete nightmare done with an insane number of rewrites. It was sort of a hit and miss if the thing you typed in after /go/ would actually take you to the correct location, if any.</p></div> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41245911" readability="2.2237762237762"><td></td></tr> <tr class="athing comtr" id="41247885" readability="4.7428571428571"><td></td></tr> <tr class="athing comtr" id="41245022" readability="4.83"><td><table border="0" readability="2.415"> <tr readability="4.83"> <td class="ind" indent="0"><img src="s.gif" height="1" width="0"></img></td><td valign="top" class="votelinks"> <center><a id="up_41245022" href="vote?id=41245022&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default" readability="4.4275"><br></br><div class="comment" readability="9.6815286624204"> <p>I don't think will be relevant going forward, Safari already hides the URL beyond the domain name by default, and I presume other browsers do/will too.</p> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41245058" readability="5.0540540540541"><td><table border="0" readability="2.527027027027"> <tr readability="5.0540540540541"> <td class="ind" indent="1"><img src="s.gif" height="1" width="40"></img></td><td valign="top" class="votelinks"> <center><a id="up_41245058" href="vote?id=41245058&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default" readability="4.6328828828829"><br></br><div class="comment" readability="9.7267759562842"> <p>As the article mentions, URLs are used in more contexts than being displayed in the address bar, so the content remains relevant regardless of Safari's poor aesthetic decisions.</p> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41245578" readability="2.0719424460432"><td></td></tr> <tr class="athing comtr" id="41247559" readability="1.3181818181818"><td></td></tr> <tr class="athing comtr" id="41244985" readability="8.2384615384615"><td><table border="0" readability="4.1192307692308"> <tr readability="8.2384615384615"> <td class="ind" indent="0"><img src="s.gif" height="1" width="0"></img></td><td valign="top" class="votelinks"> <center><a id="up_41244985" href="vote?id=41244985&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default"><br></br><div class="comment" readability="10.351274787535"> <div class="commtext c00" readability="16">I forget where I ran across it, but one interesting adoption of URL design is to make the root of the directory part of the site's domain name. I.e. there was someone's website that was shared on HN, where their name was assembled with the domain name, TLD, and some characters after the first slash:<pre><code> firstna.me/lastname/ firstna.me/lastname/about</code></pre></div> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41245244" readability="3.7037037037037"><td></td></tr> <tr class="athing comtr" id="41245330" readability="1.1685393258427"><td></td></tr> <tr class="athing comtr" id="41245383" readability="3.0935960591133"><td></td></tr> <tr class="athing comtr" id="41245475" readability="1.8666666666667"><td></td></tr> <tr class="athing comtr" id="41245840" readability="6.1923076923077"><td><table border="0" readability="3.0961538461538"> <tr readability="6.1923076923077"> <td class="ind" indent="0"><img src="s.gif" height="1" width="0"></img></td><td valign="top" class="votelinks"> <center><a id="up_41245840" href="vote?id=41245840&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default" readability="5.3076923076923"><br></br><div class="comment" readability="10.813559322034"> <p>I think the URL design of stackoverflow leavs room for improvement. The id should not be necessary. StackOverflow demands unique questions. If a question doesn't have a unique slug, is the question unique? Great URL design to me is if the slug is suffficient for uniqueness, without an id.</p> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41245852" readability="1.2272727272727"><td></td></tr> <tr class="athing comtr" id="41245283" readability="2.2317073170732"><td></td></tr> <tr class="athing comtr" id="41245496" readability="0.84507042253521"><td></td></tr> <tr class="athing comtr" id="41247202" readability="1.4842105263158"><td></td></tr> <tr class="athing comtr" id="41244703" readability="4.5979899497487"><td><table border="0" readability="2.2989949748744"> <tr readability="4.5979899497487"> <td class="ind" indent="0"><img src="s.gif" height="1" width="0"></img></td><td valign="top" class="votelinks"> <center><a id="up_41244703" href="vote?id=41244703&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default"><br></br><div class="comment" readability="10.354972375691"> <div class="commtext c00" readability="16">One big question in URL design is this:<p>Do path parameters get to have / in their values?</p><p>Let’s say you have a link shortener service and want to allow users to define shortcuts like /mypath/:rest where rest is appended to example.com/</p><p>Now you’re in a very interesting position when it comes to resolving URLs.</p><p>Curious to hear folks with experience in this</p></div> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41244791" readability="4.448275862069"><td></td></tr> <tr class="athing comtr" id="41245752" readability="2.2919254658385"><td></td></tr> <tr class="athing comtr" id="41245048" readability="10.283018867925"><td><table border="0" readability="5.1415094339623"> <tr readability="10.283018867925"> <td class="ind" indent="1"><img src="s.gif" height="1" width="40"></img></td><td valign="top" class="votelinks"> <center><a id="up_41245048" href="vote?id=41245048&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default"><br></br><div class="comment" readability="12.879182156134"> <div class="commtext c00" readability="21">This can be a complex topic if you don’t set clear constraints on what constitutes a valid character in your URL or domain.<p>For instance, in query parameters, spaces are encoded as '+'. But what if '+' is also a valid character in your domain? You then need to disambiguate i.e between "name?foo+bar" meaning "foo bar" or "foo+bar". Which one is the user actually referring to?</p><p>In our case, we ended up needing users to send the name in the body, and now we have to manage multiple encoding protocols (url, queryparam, the body...).</p></div> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41245409" readability="1.8688524590164"><td></td></tr> <tr class="athing comtr" id="41246131" readability="13.041441441441"><td><table border="0" readability="6.5207207207207"> <tr readability="13.041441441441"> <td class="ind" indent="3"><img src="s.gif" height="1" width="120"></img></td><td valign="top" class="votelinks"> <center><a id="up_41246131" href="vote?id=41246131&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default"><br></br><div class="comment" readability="14.357843137255"> <div class="commtext c00" readability="24">A better example is the name: "foo%20bar".<p>A user might have entities named "foo bar", "foo%20bar", and "foo%2520bar". Sometimes, mistakes happened because users forgot to double encode or they used the wrong protocol. As this names were used in URL, query parameters, and the body, and each has its own.</p><p>As I mentioned, with clear constraints and rules, we can accomplish anything we need, it can get complex. My takeaway from this project is to limit the valid characters and make it simple for everyone.</p></div> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41249366" readability="6.4875621890547"><td><table border="0" readability="3.2437810945274"> <tr readability="6.4875621890547"> <td class="ind" indent="1"><img src="s.gif" height="1" width="40"></img></td><td valign="top" class="votelinks"> <center><a id="up_41249366" href="vote?id=41249366&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default"><br></br><div class="comment" readability="8.4985754985755"> <div class="commtext c00" readability="12.701449275362">Actually, not encoded slashes in the paths are not that unheard of as one might think. As an example, this is actual Wikipedia article about... the meaning of "two slashes": <a href="https://en.wikipedia.org/wiki///" rel="nofollow">https://en.wikipedia.org/wiki///</a> . Also, encountering buggy concatenations like example.com//some-path or example.com/base//some-path is quite common.<p>Don't ask how I know.</p></div> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41245051" readability="2.9064748201439"><td></td></tr> <tr class="athing comtr" id="41246916" readability="2.5346534653465"><td></td></tr> <tr class="athing comtr" id="41246610" readability="4.40329218107"><td><table border="0" readability="2.201646090535"> <tr readability="4.40329218107"> <td class="ind" indent="0"><img src="s.gif" height="1" width="0"></img></td><td valign="top" class="votelinks"> <center><a id="up_41246610" href="vote?id=41246610&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default" readability="4.843621399177"><br></br><div class="comment" readability="9.7619047619048"> <p>How about great email address design? Of course firstname@lastname.com is top tier. But there are some interesting hacks you can do, such as firstn@melastname.com if your last name domain isn't available.</p> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41246839" readability="5.9915254237288"><td><table border="0" readability="2.9957627118644"> <tr readability="5.9915254237288"> <td class="ind" indent="1"><img src="s.gif" height="1" width="40"></img></td><td valign="top" class="votelinks"> <center><a id="up_41246839" href="vote?id=41246839&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default" readability="5.135593220339"><br></br><div class="comment" readability="10.722222222222"> <p>I never thought of this! I have an 'a' in my first name but just checked, 'rest of my first name + last name'.com is already taken. Oh well, I already have 'my initials'.dev, it'll have to do.</p> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41247032" readability="4.1696750902527"><td><table border="0" readability="2.0848375451264"> <tr readability="4.1696750902527"> <td class="ind" indent="1"><img src="s.gif" height="1" width="40"></img></td><td valign="top" class="votelinks"> <center><a id="up_41247032" href="vote?id=41247032&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default"><br></br><div class="comment" readability="7.8214285714286"> <div class="commtext c00" readability="11">Not sure it counts but mine is wicky(AT)nillia(DOT)ms. Which aligns with my username practically everywhere, and is a spoonerism of my actual name.<p>The downside is that it's a massive pain to explain to people verbally!</p></div> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41244724" readability="5.2446043165468"><td><table border="0" readability="2.6223021582734"> <tr readability="5.2446043165468"> <td class="ind" indent="0"><img src="s.gif" height="1" width="0"></img></td><td valign="top" class="votelinks"> <center><a id="up_41244724" href="vote?id=41244724&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default" readability="5.2446043165468"><br></br><div class="comment" readability="10.769874476987"> <p>I can't check this because I'm on mobile, but I presume Stack Overflow uses a canonical tag in the HTML to state their preference that the longer version with the slug should be the default, because that's the one search engines use.</p> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41245718" readability="2.872852233677"><td></td></tr> <tr class="athing comtr" id="41246813" readability="3.3191489361702"><td><table border="0" readability="1.6595744680851"> <tr readability="3.3191489361702"> <td class="ind" indent="0"><img src="s.gif" height="1" width="0"></img></td><td valign="top" class="votelinks"> <center><a id="up_41246813" href="vote?id=41246813&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default" readability="3.7340425531915"><br></br><div class="comment" readability="7.7905759162304"> <p>Everything should be accessible via the identity of its composition (a hash or equivalent). Then all the data needed to render it be computed or downloaded from some peered cache (DHT).</p> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41246950" readability="4.1086956521739"><td><table border="0" readability="2.054347826087"> <tr readability="4.1086956521739"> <td class="ind" indent="1"><img src="s.gif" height="1" width="40"></img></td><td valign="top" class="votelinks"> <center><a id="up_41246950" href="vote?id=41246950&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default" readability="4.1086956521739"><br></br><div class="comment" readability="8.7567567567568"> <p>So when you bookmark the Hacker News frontpage, that would be a hash of its current content and then you will visit that stale stale version forever and never see any new stories?</p> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41247386" readability="2.1862348178138"><td></td></tr> <tr class="athing comtr" id="41247109" readability="3.2657004830918"><td><table border="0" readability="1.6328502415459"> <tr readability="3.2657004830918"> <td class="ind" indent="0"><img src="s.gif" height="1" width="0"></img></td><td valign="top" class="votelinks"> <center><a id="up_41247109" href="vote?id=41247109&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default" readability="3.6739130434783"><br></br><div class="comment" readability="7.7575757575758"> <p>It was cool to see Jessica Hische called out. We own a couple of her children's books. Always fun when my parenting and tech worlds collide in surprising ways.</p> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41244952" readability="0.20408163265306"><td></td></tr> <tr class="athing comtr" id="41246167" readability="2.4545454545455"><td><table border="0" readability="1.2272727272727"> <tr readability="2.4545454545455"> <td class="ind" indent="0"><img src="s.gif" height="1" width="0"></img></td><td valign="top" class="votelinks"> <center><a id="up_41246167" href="vote?id=41246167&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default" readability="3.6818181818182"><br></br><div class="comment" readability="7.7142857142857"> <p>I always liked that you can prepend reddit.com/ or redd.it/ to any URL (http and all) and get taken to a prefilled submit page for it.</p> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41246149" readability="1.752"><td></td></tr> <tr class="athing comtr" id="41244929" readability="5.4666666666667"><td><table border="0" readability="2.7333333333333"> <tr readability="5.4666666666667"> <td class="ind" indent="0"><img src="s.gif" height="1" width="0"></img></td><td valign="top" class="votelinks"> <center><a id="up_41244929" href="vote?id=41244929&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default"><br></br><div class="comment" readability="8.8767123287671"> <div class="commtext c00" readability="13">id's that skip the textual part on their lookup/url validation and also don't redirect are not ideal, probably as bad as soft 404s. Maybe not as bad for bots if the canonical tag shows the intended URL.<p>Personally I'd avoid using id's and use a 32-bit hash of the URL which is more or less as performant as a straight id lookup. I usually went with murmurhash.</p></div> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41247260" readability="2.8376068376068"><td></td></tr> <tr class="athing comtr" id="41245420" readability="2.05"><td></td></tr> <tr class="athing comtr" id="41246426" readability="2.8843537414966"><td></td></tr> <tr class="athing comtr" id="41245135" readability="1.1176470588235"><td></td></tr> <tr class="athing comtr" id="41245324" readability="0.33497536945813"><td></td></tr> <tr class="athing comtr" id="41244966" readability="12.572456320658"><td><table border="0" readability="6.2862281603289"> <tr readability="12.572456320658"> <td class="ind" indent="0"><img src="s.gif" height="1" width="0"></img></td><td valign="top" class="votelinks"> <center><a id="up_41244966" href="vote?id=41244966&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default"><br></br><div class="comment" readability="18.401280683031"> <div class="commtext c00" readability="32">I might be an outlier, but I don't like slugs in URLs.<p>They make URLs unnecessarily long, often forcing people to use URL shorteners -- completely defeating the purpose.</p><p>They get awkward when the author changes the title. Other commenters mentioned some tricks to get around this issue, but all involve redirects. Cools URLs shouldn't change in the first place.</p><p>They don't copy cleanly if you use nonalphanumeric characters, as in nearly every language other than English.</p><p>Virtually nobody just looks at a URL these days anyway, with all the search engines, cute thumbnails, and OpenGraph metadata that provide a glimpse of the actual content for you before you even click on it. This is doubly true in the non-English-speaking parts of the world where a slug in a shared URL is often just a jumble of %HEX.</p><p>Hand-picked words in URLs are fine, e.g. /about/me. I'm only talking about autogenerated slugs for user-submitted content above.</p></div> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41245987" readability="7.0759878419453"><td><table border="0" readability="3.5379939209726"> <tr readability="7.0759878419453"> <td class="ind" indent="1"><img src="s.gif" height="1" width="40"></img></td><td valign="top" class="votelinks"> <center><a id="up_41245987" href="vote?id=41245987&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default"><br></br><div class="comment" readability="10.317073170732"> <div class="commtext c00" readability="16">> They don't copy cleanly if you use nonalphanumeric characters, as in nearly every language other than English.<p>I haven't noticed this ever being an issue.</p><p>At least in Firefox, non-ASCII characters will show as-is in the URL bar, but in the copied URL they will be properly encoded.</p></div> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41253522" readability="7.2857142857143"><td><table border="0" readability="3.6428571428571"> <tr readability="7.2857142857143"> <td class="ind" indent="2"><img src="s.gif" height="1" width="80"></img></td><td valign="top" class="votelinks"> <center><a id="up_41253522" href="vote?id=41253522&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default"><br></br><div class="comment" readability="9.3815461346633"> <div class="commtext c00" readability="14">Of course they work properly once you paste them into a browser. But then you've visited the URL.<p>One alleged justification for slugs is that they allow people to guess what the URL is about <i>without actually visiting it</i>. This usually happens in forums, comments, text messages, and other places where people can only use plain text. But non-ASCII slugs look undecipherable in exactly such places.</p></div> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41245513" readability="2.961038961039"><td></td></tr> <tr class="athing comtr" id="41246936" readability="1.9487179487179"><td></td></tr> <tr class="athing comtr" id="41246427" readability="7.9862778730703"><td><table border="0" readability="3.9931389365352"> <tr readability="7.9862778730703"> <td class="ind" indent="0"><img src="s.gif" height="1" width="0"></img></td><td valign="top" class="votelinks"> <center><a id="up_41246427" href="vote?id=41246427&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default"><br></br><div class="comment" readability="25.265497076023"> <div class="commtext c5a" readability="46.151408450704">Just remember to build localization into your URLs.<p>mysite.com/en-us/some-page mysite.com/en-ca/some-page</p><p>You can 301 redirect some locale to your "base" URL if you want.</p><p>mysite.com/en-us/some-page > mysite.com/some-page</p><p>But don't stress too much. Google doesn't really care about URL content any more. People on phones don't care what your URL says. It's at most desktop users, and devs.</p><p>Don't stress localizing your URLs...</p><p>mysite.com/fr-ca/some-page is just as good as mysite.com/fr-ca/une-page... and the former is a lot easier to tie into email marketing variables.</p><p>Just keep your sitemaps in the localized folder.</p><p>mysite.com/sitemap.xml... just a link to the various localized sitemaps.</p><p>mysite.com/en-us/sitemap.xml etc.</p><p>By keeping sitemaps in a localized folder, it'll make it a lot easier for yourself as you go to register your site with each market's locale.</p><p>If you just have to localize URLs... consider doing what Amazon does and just tie the URL to an ID.</p><p><a href="https://www.amazon.com/Moen-One-Handle-Bathroom-Deckplate-84771BZG/dp/B0CFYPTKF8" rel="nofollow">https://www.amazon.com/Moen-One-Handle-Bathroom-Deckplate-84...</a></p><p>the above is the same as this... <a href="https://www.amazon.com/dp/B0CFYPTKF8" rel="nofollow">https://www.amazon.com/dp/B0CFYPTKF8</a></p><p>And you can put anything you want in the URL string, it just matches on the ID.</p><p><a href="https://www.amazon.com/literally-whatever-you-want-here/dp/B0CFYPTKF8" rel="nofollow">https://www.amazon.com/literally-whatever-you-want-here/dp/B...</a></p><p>“We use the words in a URL as a very very lightweight factor. And from what I recall this is primarily something that we would take into account when we haven’t had access to the content yet… [but] as soon as we’ve crawled and indexed the content there then we have a lot more information. And then that’s something where essentially if the URL is in German or in Japanese or in English it’s pretty much the same thing.”</p><p>- John Mueller, Google Search Advocate.</p></div> </div></td></tr> </table></td></tr> <tr class="athing comtr" id="41245284" readability="6.7463651050081"><td><table border="0" readability="3.373182552504"> <tr readability="6.7463651050081"> <td class="ind" indent="0"><img src="s.gif" height="1" width="0"></img></td><td valign="top" class="votelinks"> <center><a id="up_41245284" href="vote?id=41245284&how=up&goto=item%3Fid%3D41243992"></a></center> </td><td class="default"><br></br><div class="comment" readability="10.602739726027"> <div class="commtext c5a" readability="16.929065743945">> Granted, it can also be used deceptively. For example, this is the same URL as above but it portends completely different contents (without breaking the link):<p>> stackoverflow.com/questions/16245767/how-to-bake-a-cake</p><p>Fortunately for SO the fake slug is not preserved and redirects to the real one (so e.g. stackoverflow.com/questions/16245767/motheficker is <i>not</i> served from their site), much to the chagrin those of us with childish sense of humor who some 25 years ago enjoyed dynamically generated nonsense like:</p><p><a href="https://web.archive.org/web/20031007123544/http://john.isgay.com/" rel="nofollow">https://web.archive.org/web/20031007123544/http://john.isgay...</a></p></div> </div></td></tr> </table></td></tr> </div></body> </div> </div> </div> <div class='clear'></div> </div> <div style='position:fixed; bottom:0; left:0; right:0;'> </div> <div align='center' style='border-top:1px solid #EEE; padding:1em; margin-top:2em;'> 联系我们 contact @ memedata.com </div>  <script async src="https://www.googletagmanager.com/gtag/js?id=G-PFMR8YTWGP"></script> <script> window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'G-PFMR8YTWGP'); </script> </body> </html>

（评论） (comments)

（评论）
(comments)