SlideShare une entreprise Scribd logo
1  sur  15
产品设计:URL     Ken@baicai.com
index 类型: 动态型,静态型 带扩展名,不带扩展名 数值型,内容型 目录型,非目录型 长型,短型 Html 型,非HTML型 从大到小,从总到分 问题: 连接线 大小写 语义化 非英文编码 长度 空格
动态?静态? 例子 /product.php?id=123 /product/123 选用静态型 用户不需要知道 html/php/asp/jsp… 早期 web server 基于文件后缀解析 URL 只是一个寻址对象,意义在于标识 标识应该简洁和优雅 短比长好 simple is better 利用 URLRewrite重写
数值型?内容型? 例子 /product/123 /product/suzuki-cultus-tie-rod-end /product/suzuki-cultus-tie-rod-end-id123 尽量选用内容型 用户看地址就知道内容 有利于 SEO(关键词布局) 不适合中文
目录型?非目录型? 例子 /product/suzuki-cultus-tie-rod-end/ /product/suzuki-cultus-tie-rod-end 尽量选用非目录型 除非他下面真的还有内容 /product/category/a/ /product/category/a/arake-disc 我偏好非目录型 目录型有开发上的便利(?)
从大到小?从总到分? 例子 /archives/2009/12/abc /archives/200912/abc /archives/abc
长?短? 例子 /archives/2009/12/abc /archives/abc special.baicai.com zt.baicai.com hr.baicai.com/user.php?name=jade hr.baicai.com/i/jade Abc.com/123.html Abc.com/job/123
问题:连接线 例子 /archives/2009/12/hello_world /archives/200912/hello-world 在链接有下划线的情况下,用户不易分清是空格还是下划线 使用中杠线做连接符
问题:大小写 例子 /archives/2009/12/HelloWorld /archives/200912/hello-world 用户分不清什么时候应该大小写 全部使用小写
问题:语义化 例子 /archives/2009/12/123 /product/suzuki-cultus-tie-rod-end 让用户一看就知道当前主题内容 但是中文不适合,如何? /job/5566 /company/234 /category/seo /area/guangzhou /key/name(id),规则:/什么/多少 /view/123:无法分清当前对象,“看”什么? 不使用 ad 字样在 url中;
问题:非英文编码 例子 /archives/2009/12/你好 /archives/200912/%C4%E3%BA%C3 不要使用中文做为URL的参数或组成; 一定要使用时要做 urlencode处理; 早期百度不认中文URL; 在很多应用中,中文不能被链接; 转码后太长,不够简洁; /archives/你好 /archives/%C4%E3%BA%C3
问题:不使用空格 例子 /archives/2009/12/hello world /archives/2009/12/hello%20world
问题:长度 浏览器有不同的约定: IE:2083 字节,其中纯路径部分不超2048字节。  Firefox:超过 65536 字符后就不再显示。  Safari:到 80000 字符还工作得好好的。  Opera:到 190000 字符的时候,还正常工作。  Web 服务器: Apache Web 服务器在接收到大约 4000 字符长的URL时候产生“413 Entity Too Large”错误。  IIS 默认接收的最大 URL 是 16384 字符。
小结:设计原则 静态比动态好 短比长好 清晰与含糊好 简单比复杂好 优雅比肮脏好 照顾用户的感受,用户在意URL Simple is better!
谢谢大家

Contenu connexe

Similaire à 产品设计:URL 设计

搜索引擎优化培训
搜索引擎优化培训搜索引擎优化培训
搜索引擎优化培训Wang Feng
 
很详细的搜索引擎优化培训教材
很详细的搜索引擎优化培训教材很详细的搜索引擎优化培训教材
很详细的搜索引擎优化培训教材mysqlops
 
Seo流程框架
Seo流程框架Seo流程框架
Seo流程框架grey0511
 
谷歌搜索引擎优化初学者指南
谷歌搜索引擎优化初学者指南谷歌搜索引擎优化初学者指南
谷歌搜索引擎优化初学者指南donotbeevil
 
Servlet & JSP 教學手冊第二版 - 第 1 章:簡介Web應用程式
Servlet & JSP 教學手冊第二版 - 第 1 章:簡介Web應用程式Servlet & JSP 教學手冊第二版 - 第 1 章:簡介Web應用程式
Servlet & JSP 教學手冊第二版 - 第 1 章:簡介Web應用程式Justin Lin
 
Inside the-browser
Inside the-browserInside the-browser
Inside the-browserjy03845581
 
Inside the-browser
Inside the-browserInside the-browser
Inside the-browserjy03845581
 
HTML 入門 - 前端工程開發實務訓練
HTML 入門 - 前端工程開發實務訓練HTML 入門 - 前端工程開發實務訓練
HTML 入門 - 前端工程開發實務訓練Joseph Chiang
 
网站重构&Web标准设计第二版
网站重构&Web标准设计第二版网站重构&Web标准设计第二版
网站重构&Web标准设计第二版志勇 孙
 
HTML & JavaScript
HTML & JavaScriptHTML & JavaScript
HTML & JavaScriptSanji Zhang
 
Google analytics代码部署补充 + SEO 搜索引擎优化
Google analytics代码部署补充 + SEO 搜索引擎优化Google analytics代码部署补充 + SEO 搜索引擎优化
Google analytics代码部署补充 + SEO 搜索引擎优化Vinny Wu
 
Html&css培训 舒克
Html&css培训 舒克Html&css培训 舒克
Html&css培训 舒克jay li
 
2010 01-07周五分享 前端的那些事儿-小米猪
2010 01-07周五分享 前端的那些事儿-小米猪2010 01-07周五分享 前端的那些事儿-小米猪
2010 01-07周五分享 前端的那些事儿-小米猪小 米猪
 
Seo4sales20080103 網路行銷SEO
Seo4sales20080103 網路行銷SEOSeo4sales20080103 網路行銷SEO
Seo4sales20080103 網路行銷SEOHui-kang Tang
 
[2008]网站重构 -who am i
[2008]网站重构 -who am i[2008]网站重构 -who am i
[2008]网站重构 -who am iTwinsen Liang
 
4. Go 工程化实践-0124-v2.pdf
4. Go 工程化实践-0124-v2.pdf4. Go 工程化实践-0124-v2.pdf
4. Go 工程化实践-0124-v2.pdfssuserd6c7621
 

Similaire à 产品设计:URL 设计 (20)

搜索引擎优化培训
搜索引擎优化培训搜索引擎优化培训
搜索引擎优化培训
 
很详细的搜索引擎优化培训教材
很详细的搜索引擎优化培训教材很详细的搜索引擎优化培训教材
很详细的搜索引擎优化培训教材
 
Seo流程框架
Seo流程框架Seo流程框架
Seo流程框架
 
谷歌搜索引擎优化初学者指南
谷歌搜索引擎优化初学者指南谷歌搜索引擎优化初学者指南
谷歌搜索引擎优化初学者指南
 
Div+css培训
Div+css培训Div+css培训
Div+css培训
 
Servlet & JSP 教學手冊第二版 - 第 1 章:簡介Web應用程式
Servlet & JSP 教學手冊第二版 - 第 1 章:簡介Web應用程式Servlet & JSP 教學手冊第二版 - 第 1 章:簡介Web應用程式
Servlet & JSP 教學手冊第二版 - 第 1 章:簡介Web應用程式
 
Inside the-browser
Inside the-browserInside the-browser
Inside the-browser
 
Inside the-browser
Inside the-browserInside the-browser
Inside the-browser
 
HTML 入門 - 前端工程開發實務訓練
HTML 入門 - 前端工程開發實務訓練HTML 入門 - 前端工程開發實務訓練
HTML 入門 - 前端工程開發實務訓練
 
网站重构&Web标准设计第二版
网站重构&Web标准设计第二版网站重构&Web标准设计第二版
网站重构&Web标准设计第二版
 
HTML & JavaScript
HTML & JavaScriptHTML & JavaScript
HTML & JavaScript
 
Google analytics代码部署补充 + SEO 搜索引擎优化
Google analytics代码部署补充 + SEO 搜索引擎优化Google analytics代码部署补充 + SEO 搜索引擎优化
Google analytics代码部署补充 + SEO 搜索引擎优化
 
Html&css培训 舒克
Html&css培训 舒克Html&css培训 舒克
Html&css培训 舒克
 
2010 01-07周五分享 前端的那些事儿-小米猪
2010 01-07周五分享 前端的那些事儿-小米猪2010 01-07周五分享 前端的那些事儿-小米猪
2010 01-07周五分享 前端的那些事儿-小米猪
 
Seo4sales20080103 網路行銷SEO
Seo4sales20080103 網路行銷SEOSeo4sales20080103 網路行銷SEO
Seo4sales20080103 網路行銷SEO
 
[2008]网站重构 -who am i
[2008]网站重构 -who am i[2008]网站重构 -who am i
[2008]网站重构 -who am i
 
Html&css基础
Html&css基础Html&css基础
Html&css基础
 
4. Go 工程化实践-0124-v2.pdf
4. Go 工程化实践-0124-v2.pdf4. Go 工程化实践-0124-v2.pdf
4. Go 工程化实践-0124-v2.pdf
 
S_E_O
S_E_OS_E_O
S_E_O
 
Hibernate
HibernateHibernate
Hibernate
 

Plus de changxing qi

易度云查看 - 产品介绍
易度云查看 - 产品介绍易度云查看 - 产品介绍
易度云查看 - 产品介绍changxing qi
 
产品笔记:产品需求传递,员工学习与绩效管理
产品笔记:产品需求传递,员工学习与绩效管理产品笔记:产品需求传递,员工学习与绩效管理
产品笔记:产品需求传递,员工学习与绩效管理changxing qi
 
网络招聘那些事
网络招聘那些事网络招聘那些事
网络招聘那些事changxing qi
 
生活中的产品设计
生活中的产品设计生活中的产品设计
生活中的产品设计changxing qi
 

Plus de changxing qi (6)

易度云查看 - 产品介绍
易度云查看 - 产品介绍易度云查看 - 产品介绍
易度云查看 - 产品介绍
 
用文字做Logo
用文字做Logo用文字做Logo
用文字做Logo
 
产品笔记:产品需求传递,员工学习与绩效管理
产品笔记:产品需求传递,员工学习与绩效管理产品笔记:产品需求传递,员工学习与绩效管理
产品笔记:产品需求传递,员工学习与绩效管理
 
网络招聘那些事
网络招聘那些事网络招聘那些事
网络招聘那些事
 
生活中的产品设计
生活中的产品设计生活中的产品设计
生活中的产品设计
 
全民营销
全民营销全民营销
全民营销
 

产品设计:URL 设计