Smashing 网站地图 Chris Coyier 于 2009年1月23日 DigitalOcean 为您旅程的每个阶段提供云产品。立即开始使用 200 美元的免费积分! 我为 Smashing Magazine 撰写了一篇关于 使用 jQuery 创建彩色网站地图 的文章。它涵盖了各种内容,例如语义标记、使用 CSS3 增强、构建快速 jQuery 插件以避免重复代码等等。示例和下载链接都在那里! 这篇文章也是我作为那里新作者的介绍。我将每隔几周撰写一次问答文章。重点将是 CSS,但我认为这将涵盖我们这里讨论的网页设计。关于提交问题的详细信息也在文章中。
无意冒犯,我欣赏你的一些作品,但这毫无用处,自定义网站地图或任何与此相关的事情都没有意义(也许菜单可以,但也不太美观),此外,我认为你并不符合 SM 作者的描述,你的教程面向初学者,而 SM 则关注任何非初学者的事物
你是坏人 Raven
Razvan
显然 SM 不同意你的看法。
此外,如果你要随意在某个你显然一无所知的博主博客上发牢骚,请尝试使用拼写检查。
恭喜,Chris!
所以现在写网站地图需要额外的资格吗?天哪,为什么没人告诉我……
同意 Jarod 的说法。
恭喜你发表这篇文章,Chris!
再说一次。感谢你向我们展示了如何不显示网站地图。
我理解你不喜欢它,但如果你想参与讨论,如果你能帮助我们理解你将如何显示网站地图,或者至少,你到底不喜欢这个版本中的哪些内容,这将更有帮助。
还要记住,我提供的任何演示示例都不建议直接拿来使用,它们主要是概念证明,旨在让人们从中学习并将这些概念应用到自己的项目中。
但这很明显,对吧,它们是教程。
网站地图的目的是完全确保访问者在浏览您的网站时不会遇到任何问题,并帮助爬虫/蜘蛛轻松浏览您的网站。它应该保持简洁明了。文本应易于阅读。
你的淡入淡出效果过于夸张。与所有内容融合在一起的文本将难以阅读。
我认为如果将这个概念用于网站地图以外的其他用途,效果会更好。
我明白这只是一个教程,不应按原样使用。但当你的博客是关于网站地图时,我认为它应该提供更有用的信息。
我知道你做得很好。我喜欢你大多数的教程,只是这个教程对你和 SM 来说显得有点业余。
我回答的问题**明确地**要求我使其多彩并使用 jQuery。但我完全理解为什么这对于网站地图来说会显得“过头”。
关于“业余”——从头开始创建 jQuery 插件、使用 CSS3 增强、专注于可访问和语义标记,以及围绕它进行设计……这大约是我们在这里所能达到的最复杂程度。
哈哈:可访问和语义标记:一些基本的 ul 标签,CSS3:webkit 阴影,这不是 CSS3,它是 webkit 规范,jquery 插件:它只有 44 行,这不是插件,更不用说 hover() 的基本用法了(想过在网站地图中添加另一个列表吗?)。换句话说:这就是不应使用 javascript 行为以及不应显示网站地图的方式。现在可以走了
这变得相当令人厌烦,但我再为它辩护一次。
是的,它是无序列表。这确实使其具有语义性。有很多不同的方法可以使用 HTML 创建带链接的框。在网站地图和一堆具有层次结构的链接的情况下,这是最佳的语义选择。仅此而已。
阴影效果是 CSS3。它目前是浏览器扩展,因为完整规范尚未完成,WebKit 正在帮我们一个忙,让我们尽早使用它,以便我们习惯使用它并测试错误。
从什么时候开始代码行数决定了某件事是否值得成为插件?它节省了原本会重复的代码。我之前见过一些非常天才的一行插件。
所以,再次强调,如果你想继续参与对话,让我们停止所有粗鲁的行为,并讨论如何改进它,或者至少具体说明你不喜欢哪些方面。
没有方法也没有理由改进网站地图,网站地图仅仅是为了索引和可访问性问题而存在的,用 CSS 浏览器规范、jquery、模式和其他内容对其进行自定义的全部意义都没有,因为你的普通用户不需要这些,大多数普通用户甚至不知道什么是网站地图,或者它有什么作用,对他们来说,它只是一些链接。对不起我之前很粗鲁,但这是我诚实的意见,我坚持我的观点
只想重申 Chris 的话
“我回答的问题**明确地**要求我使其多彩并使用 jQuery。”
@Razvan Pavel:你的“诚实意见”同时显得粗鲁、傲慢且不着边际。我想如果 SM 想聘请你撰写一篇关于此主题的文章,你的回复将是一篇整版文章,基本上说“多么愚蠢的问题”。
我认为它很棒。它具有很强的可用性。
除了标准的“列表层次结构”外,颜色也有很大帮助。
对我来说,它可以使一个难以找到正确内容的长列表更容易导航。
这个想法本身就很好。谢谢。
嘿 Chris,我注意到你越来越多的教程都在使用 jQuery。有些甚至专注于 jQuery。你有没有想过将你的网站分支出来,也许创建一个 jquery-tricks 网站?=)
那将非常棒。
-Chris
Chris,
我非常喜欢这个教程。它融合了三个主要元素,从而构建了一个很棒的网站:用户界面、激发通常很无聊的内容的动态效果,以及保留访问网站内部资源的便捷性,无论是在 404 页面还是网站地图页面中显示。
使用 jQuery 使无聊变得有趣,而且仍然有用!
我绝对是粉丝——继续保持出色的工作 :)
这个 404 参考是一个很好的观点。虽然普通访客可能不会遇到网站地图,但他们有可能(不幸的是)在某个损坏的链接上迷路或输入错误的网址。在这种情况下,这是网站地图视觉增强的一个绝佳理由。
我当然会使用一些不同的颜色,来吧 Chris!哈哈
不过,我认为它很酷。网站地图在很多情况下确实可能达不到预期效果,但我认为这很好地展示了层级,并提供了易于导航的功能;这正是网站地图应该做的,对吧?
嘿 Chris,
我喜欢这篇文章,它本身就是一个有趣且多彩的网站地图方法/想法。不要理会那些反对者,他们可以在任何发表的文章中找到。继续加油!
-Drew
我从未见过这样的东西,这是一个很酷的概念证明。我真的很喜欢不同层级之间的交互,动画也很流畅。
哇,负面情绪真多!写得不错,我喜欢这篇文章。继续努力!
Chris,我认为这篇文章很有用,非常感谢你回答问题并发表这篇文章。除了颜色选择(我知道这只是任意的)之外,一个视觉上令人愉悦的站点地图由于很多原因非常有价值。视觉上令人愉悦的层次结构是一种非常友好的方法——它可以访问那些缺乏处理站点地图经验或难以浏览网站的人(这也有可能是设计人员的错误,但那是另一个问题)。虽然某些元素是不必要的(例如淡出效果),但这些是主观的,因为它确实取决于网站的设计目的。
站点地图中真正需要包含的元素——无论样式如何——是:一目了然的可读性和代码的简洁性(为了搜索引擎蜘蛛)。从本质上讲,你同时兼顾了这两点(你的文件大小仍然相对较小)。这篇文章的全部目的是回答一个问题,它做到了。但是,在此过程中,它还探讨了站点地图的目的以及如何改进这些目的。这篇文章侧重于人类(代码已经针对搜索引擎蜘蛛进行了优化),我认为你既完成了手头的任务,也重新审视了站点地图的本质。
谢谢,Chris,干得好!
我的天哪,你们这些人真是太矫情了。这只是一个教程,喊什么喊!Chris可以在这里发布任何他想要的东西,如果你不喜欢,那就算了。我个人认为这是一个很棒的想法,虽然可能不是展示**站点地图**的最佳方式,但你仍然可以从中获得一些非常有用的知识。所以别再因为他试图帮助你们而为难他了。
干杯,Chris,继续努力
太棒了,谢谢!
不错,很棒。虽然Chrome中的填充有点不对劲,看这里。
我喜欢它。它很有趣也很创新。它是一个教程,如果你想将其用于站点地图,很好,如果不是,也没关系。哦,好吧。很高兴看到使用CSS和jQuery以及其他一些插件来完成某些事情。我对jQuery和一些CSS3的东西还比较陌生。我对CSS2比较熟悉。这些东西帮助很大。
总是有不同的、更好的或更糟糕的方法来做事情。事实是,Chris在这里在他的网站上提供了一些知识,以及一个接受了他的文章的网站(SM)。
这些用在站点地图的示例中,它可以用于其他用途。可能有人知道其他方法。制作站点地图没有真正的“规则”或法律。或者使用GUI控件的任何其他内容。这取决于设计师或开发人员希望如何设计他们的网站。
仅仅因为你认为自己可以做得更好或者对它有负面评价而抛弃它并不意味着它对其他人没有帮助。你不必阅读这篇文章,没有人强迫你使用这里提出的想法,没有人强迫你浪费时间。仅仅因为你不喜欢它并不意味着其他人也不会喜欢这个想法。
为这篇文章点赞,Chris。
关于负面评论而不是建设性评论,这里有一篇每个人都应该阅读的好文章。就像Chris和其他人在这里遇到的争吵一样,Chris做了一件正确的事情,他推动了关于如何改进事物的建设性对话。我们的目标是改进网络,而不是批评彼此的想法。分享想法和获取知识才是正确的途径。阅读这篇文章,它很好。
http://www.alistapart.com/articles/puttingourhotheadstogether
对于那些评论说本教程毫无用处的人,“没有什么是毫无用处的”。每一点免费提供的知识对许多读者来说都是宝贵的。我通常不会在提供免费教程的网站上发表评论,因为我没有权利冒犯一个对想要学习某些东西的人有帮助的人。Razvan,你为什么不展示给我们一些更好的东西呢?尊重别人的工作并保持礼貌。如果我是他,我会删除这条评论。
Razvan,没有什么是毫无用处的