必威体育下载克里斯蒂安·海尔曼

贴有“语义”标签的帖子

Lynx不会对语义和HTML印象深刻。

星期三,11月16日,二千零一十一

未受影响的山猫最近有很多关于标记的讨论,尤其是新的HTML5元素。有一个很大的呼哈哈当希希这个沃特沃想要从中删除时间元素HTML规格迪维亚和她在一起激起了很多感情”我们对语义价值的无意义追求“当然啦!杰瑞米发表了他的观点,在对位文章中也是如此”追求语义价值“。

也许没有对位,也许有。坦率地说,我太忙了,没时间看那本书。也没什么关系,随着我越来越觉得我们真的需要考虑网络的现状以及它将如何发展。对我来说,对语义标记的价值缺乏理解只是一个正在发生的变化的征兆。

昨天的故事

关于语义值和正确使用HTML被那些已经存在了很长一段时间,并且看到浏览器以更多我们想要记住的方式失败的人们保持着活力。有效的标记和合理的结构是我们实现可维护性和理解周围事物的唯一机会。这在很久以前特别重要。我记得用猞猁上网冲浪。

lynx显示twitter.com

我还记得让林克斯在我的军火库里呆得更长一点。我用它来“查看”搜索引擎和辅助技术看到了什么。前者在当时是正确的(不再是,谷歌索引是否闪烁JavaScript实际上是这样使用hashbangs的构思错误的链接

后者在当时甚至是错误的。关于正确使用HTML5现在试图支持“像屏幕阅读器这样的辅助技术需要它”的论点。不,还不完全是这样.

快速构建,使它工作

我在几次谈话中提到过,当人们提到标记很重要、人们关心的美好的过去时,他们都在胡说八道。这些日子从来都不存在,当我们开始开发Web时,我们努力使事情工作起来。我们使用表格进行布局,NBSP对于空白,大量的br元素用于垂直空格和更多邪恶的东西。然后,我们使用间隔棒来填充和边缘,并开始关注什么时候CSS出来支援。原因不是我们想写得更干净HTML.原因是我们想让一切正常运转,因为我们得到的只是一个设计来建造,不是如何构造文档或构建内容的描述。从Web产品的外观开始,语义学已经在濒临灭绝的名单上。

少写,实现更多

这是现在的咒语。jquery的巨大成功是基于它的。JavaScript标准过于复杂和冗长,无法快速编写代码并快速更改。所以jquery人群分析了人们做的最多的事情——对DOM以及添加和删除类(以及后来的Ajax),使它变得非常简单和简短。不需要编写不起多大作用的代码。

同样的事情一次又一次地发生。较少的萨斯在中为不同的浏览器设置前缀hell和replicationCSS易于维护和客户端模板语言浏览器内部模板和客户端MVC制作HTML计算和编程逻辑的结果,而不是起点。

如果你看不到,为什么会这样?

很多什么的粉丝HTML语义学正因为看不见而兴奋。每当新HTML元素得到了支持,在浏览器中有一个可视化的表示,这是一个很简单的方法。人们立即使用它。在大多数情况下,他们使用错误,但是他们使用了它(我看到了在图像周围使用的字段集和图例,因为它很漂亮,当然还可以用块引用

很多语义丰富的元素根本不存在。blockquotes的cite属性旨在通过告诉我们引用的来源来赋予引用的含义。首字母缩略词ABBR我们应该告诉人们TLA意思是——见鬼,我们甚至在会议和新闻发布会上都不这么做,所以为什么还要添加浏览器不向用户显示的信息呢?

这也是微格式的一个大问题。如果浏览器使地址可拖动到您的通讯簿或为Votelinks创建投票按钮,如果一个浏览器能够自动检测事件,并给你一个简单的界面来添加到你的日历中,那么你就不用费心去使用它们了。事实上,我们有几个成功的故事要讲,做了很多工作。

大书咏叹调

当我们谈论可访问性时,它会变得非常令人沮丧。当我们坚持保持简单并遵循人类的逻辑时,为具有各种能力的人提供Web文档应该是容易的。

它应该,但事实并非如此。通过保持事情非常简单,我们可以接触到更多的人,但我们也可以剥夺一大群伟大的界面。每当我们在浏览器中做一些疯狂的事情,并且谈论到让它们可以访问时,走出去的路就是神话。咏叹调.

如果你潜入咏叹调你很快就会意识到这是一项很大的工作,很难理解概念,最重要的是许多要写入的代码。而不是将可访问性作为HTML5,我们必须处理两个并行标准。一种是快速实现目标,将Web从文档移动到应用程序,另一种是让所有人都可以使用它。这不是个好地方。当你从一开始就接受它时,可访问性就发生了。在这个过程的最后,没有什么神奇的子弹层可以让事情运转起来。

那么呢?HTML语义学?

你知道吗?没有解决所有问题的办法。原因并不是因为技术的进步,或者人们不关心用户,或者我们的标准阻碍了我们,或者其他类似的事情。原因是“写一次,“部署到任何地方”简直是胡说八道。到目前为止,使Web工作并成为令人惊叹的工作市场的一件事是灵活性。我们都很高兴,您可以通过许多不同的方式为我们的最终用户提供类似的体验。那么,我们为什么要在开发范围的一个方面或另一个方面进行讨论呢?

这个怎么betway体育官方网样?

  • 如果你亲手写一份文件,使用您可以添加的所有语义。这是你的笔迹,你的代码就是你的诗,人们从你所做的事情中学习。必威体育下载
  • 如果您需要编写一个核心应用程序,而每个字节都是一个囚徒,那么尝试使用语义,但要遵循最终的交付速度目标。尽管如此,请确保告诉人们您的代码是转换和优化的最终结果,而不是供人类查看。
  • 不管你做什么——当你可以使用新技术的时候——都要使用它。
  • 请记住,网络不是您的浏览器和计算机——使用前沿技术时,为其他浏览器添加回退。当其他人追上来的时候,你就不必修改你的代码了!
  • 标记和Web代码的主要焦点并不是为边缘应用程序优化的,而是让人们更容易维护它。如果人们能看到HTML发生了什么事——赢。如果只与JS一起工作的是JS-甚至更好。
  • 更多的加价是增加价值的加价,而不是犯罪。论证强的比B更糟,因为这意味着在服务器上执行gzip时,更多的代码和较慢的加载页是不相关的。
  • 我们只能逃避新的鸡和蛋的问题HTML当我们使用它的时候。马上,如果您在浏览器中请求对新元素的支持,大多数供应商的答案是没有人使用它们,那么为什么要麻烦呢?当你问人们为什么不使用它们时,他们会告诉你,因为浏览器不支持它们。我们中的一个必须开始改变这一点。

要炸的大鱼

就我个人而言,我现在更关注那些令我担心的网络问题,列出它们可能很有趣。

  • 长寿之死–我一直喜欢这样一个事实:我可以在网上找到一些东西,然后再回到它上面。这种情况已经不复存在了。我的很多旧书签都死了,我的推特在一定数量后进入数据涅盘,我无法再访问它们,你为公司写的代码在你离开后不久将完全不同。这不是我想要的网络。它是娱乐和档案的完美结合,“实时网络”真的把这搞得一团糟。
  • 高保真网站–我记得当闪光灯使我们的500兆赫机器闪光时。现在,几乎每一个我尝试过的酷炫的新网站都会对我的双核MacBook这样做。在不久的将来,我可以看到一些网页告诉我,我的视频卡不够好,不能享受它们。这就是我从未在电脑上玩游戏的原因。让我们换一种明智的方式来使用新的炫酷的。
  • 身份–我们现在正在网络上散播自己,留下了很多过时和错误的个人资料。你在网络上的身份正在成为一个非常奇怪的概念,我现在所做的一些工作正试图把它重新变成一种更容易维护的时尚。
  • 开放式网络今天,美国在辩论像中国这样审查互联网是否是个好主意,叙利亚和其他国家也有。这吓坏了我。我从网络上开始,因为它没有广播或电视那么规范,也没有那么商业化。我们不要放弃自由
  • 制造者网络网络无处不在,我们把它作为日常工作和娱乐的一部分。最近我发现,尽管网络的创造性部分正在消亡,人们正在消费它,而不是使用和丰富它。这个,再一次,吓坏我了。我们不应该成为虚伪的懒汉。

语义学就像美妙的散文。你用它们来提供一个令人愉快的产品。人们不因写书而出名。他们以充满他们的东西而闻名。如果我们不断地把有结构的东西放到网络上,并且在更复杂的显示产品上做得更好,我们将为未来而构建。如果我们指责别人做错事,我们就浪费时间。

有评论吗?给他们谷歌+脸谱网

2011年国家地理摄影大赛中吉米·托希尔拍摄的林克斯照片

生锈——我们需要新的最佳实践来适应不同的发展世界。

星期一,8月15日,二千零一十一

好消息是:我们,那些推广开放网络标准的人,赢了!今天的网络使用越来越少的封闭技术和插件HTML,CSS和JavaScript是用来创建大量优秀Web体验的工具。

例如,几乎没有人使用flash作为简单的图片库,越来越多的公司向我们以及世界宣传自己“支持Web标准”和“使用开放技术”。

当然,有很多人在说假话,正如布鲁斯·劳森所说,我们得到了HTML5,空洞的演示和忘记基础知识.布鲁斯指出很多HTML5演示没有任何语义标记,甚至不要创建工作链接,也不要有很多我们在90年代和千年之初在Flash隧道中看到的特性。

在这场争论的另一方面,有几个人一直告诉我,他们正在写博客文章“为什么语义标记和javascript回退不再重要”。

我认为有一个快乐的中间地带有待发现,这主要意味着我们需要了解以下内容:作为一个Web开发人员,您所做的工作在很大程度上取决于我们的工作所使用的媒介.

多年来,我们如何使用互联网已经发生了变化,如果我们不想被视为进步的敌人,我们需要改变我们的最佳实践,并在应用它们时给予它们更多的灵活性。

就像一个在每一个浏览器中查找和工作相同的网站,意味着要迎合最低的共同点,而不是巧妙地使用我们的平台,“以某种方式使用的一堆技术”限制了我们接触那些刚开始在网上工作并只想完成一些工作的人。

我们的最佳实践真的植根于现实吗?

改变最佳实践?这怎么可能?好,首先,我认为我们所宣扬的很多是货物崇拜而不是基于真实的事情。我们告诉人们的许多“在网络上工作是绝对必要的”的事情是不需要的,而且许多关于语义标记有用性的激动人心的解释实际上并不是基于事实的。作为最佳实践,我们所做的很多工作都是为我们而做的,不适用于最终用户或我们使用的技术。但以后会更多。

回首往事(不生气)

我们是如何到达现在的位置的,新建的Showcase网站违反了最简单的概念,例如为图像提供可选文本或使用结构化的HTML而不是几个空的沙发?

为了了解我们是如何陷入这必威体育下载种混乱的,了解我们过去所做的事情是很重要的。许多演讲、书籍和帖子描绘了一幅勇敢的网络标准新世界的图景,厚颜无耻地在封闭技术的丛林中开辟了一条通向光明未来的道路。这与实际情况相差甚远。如果我们诚实,我们所做的很多事情都是为了让事情变得有意义,然后试图找到一种方法让我们所做的事情可持续发展。最后一步是语义。当我听到赞扬波什—简单的旧语义HTML就像我们过去建造东西的方式一样,随着时间的推移,我们忘记了这项技能,我不得不窃笑。我们没有这样做——至少在生产中没有。

卑微的开端-HTMLCGI

很久以前,HTML用于表示,行为和结构

起初没有插件,也没有javascript。我们有HTML图像和人们已经犯下的最大错误是把文本显示为没有任何可选文本的图像。这意味着只有文本的浏览器(仍在使用中)和那些连接速度较慢的浏览器存在短端。交互被定义为点击链接和提交表单。

我们已经开始尝试使用帧来加快速度。例如,我们保留了一个“粘性导航”,只加载没有任何菜单的内容页。这是为了提高性能而打破诸如书签等基本浏览器功能的开始。我记得我曾用cookies存储页面状态,并在随后的访问中相应地重新编写框架集。这只为当前用户修复了它——再也不可能向其他用户发送链接了。但是页面加载得更快。

布局实现于HTML-水平线,之前元素,很多和桌子。最重要的是让它在所有浏览器中都看起来正确,而不是HTML真的是。

然而,我们告诉人们的是,这是一个简单的时代,HTML它的语义价值真的很重要。我记得不一样。

DHTML天(1)

当Javascript得到支持时,我们就开始正常工作了。整个菜单都是用document.write()。我们使用了弹出窗口,其中动态写入了框架(例如图像库):

Javascript允许更丰富的交互和更多的错误

我们甚至开始检查使用的是哪种浏览器,在更明智的情况下,提供了不同的体验。在考虑较少的解决方案中,我们只是告诉人们“这个网站需要Internet Explorer 4才能工作”。

我们还开始用JavaScript隐藏和显示内容。有时候我们用JS写出来的,并没有给文本浏览器(或者那些通过代理默认关闭JS的公司)提供任何内容或太多内容而不太关心结构。

什么时候?SEO开始重要了,我们也用了诺斯本标签提供回退文本和链接——大多数时候都是关键词而不是意义。

DHTML天(2)

什么时候?CSS得到支持的东西真的起飞了——我们不仅可以创造动态的东西,展示和隐藏它们,而且还可以真正地去城镇移动,旋转的,动画制作和堆叠它们。我们做到了。DHTML图书馆网站上有数百个效果菜单、图像滑块和旋转按钮等:

JavaScript和CSS让我们有机会构建许多闪亮的东西

大多数行为都是用javascript完成的,但我们也开始使用CSS悬停伪选择器用于构建“仅限于CSS的多级下拉菜单”以及其他没有鼠标就无法使用的东西。

当时正是DHTML几乎所有脚本的第一行都在检查IE和所有文件或Netscape文件层.计算机的速度也迫使我们经历各种危险的黑客和诡计(危险的是,他们使维护非常困难,因为黑客往往没有得到记录),使事情看起来很顺利。

福音书(根据塞尔德曼)

塞尔德曼之书这就是我们要传达的信息:让我们停止尝试为浏览器解决问题,跳过障碍,让我们的产品在一个不值得信任的环境中工作,转而依赖标准。此消息的主要工具是分离技术:

为了使Web开发界保持清醒,我们声称HTML是一种结构,CSS是表示,JS是行为

HTML是结构,CSS是为了视觉上的外观和感觉,而javascript是为了行为。如果我们把这些东西分开,然后我们有了一个好的易于维护的Web产品,为每个人工作,干净的扩展和工作。

这就是我们的想法,我们创造了一个术语不引人注目的javascript(我记得写这门课很有趣)然后DOM脚本(使用DOM编写黄蜂工作组的脚本杰瑞米基思S和我的书举例说明如何使用它)。

今日国家

如今,我们似乎已经回到了混合和匹配发展关注点和层次的世界:

今天,似乎,所有的分离层被混合并再次匹配。

强大的力量带来了巨大的责任感,而现在我感觉到后者在我们的雷达上是非常低的,因为和我们拥有的酷的新东西一起玩太有趣了。我们的移动电话有非常快的处理器,我们有能够进行3D动画和硬件加速的超音速javascript引擎。CSS动画。这使得人们很难对语义值感到兴奋。

在这个新的Web技术世界中,几乎所有栈中的技术都被淘汰了,分离变得更加困难。什么是好帆布没有任何脚本?我们应该在CSS还是用JavaScript?动画是行为还是表现?仅用于视觉效果的元素是否应位于HTML或者用javascript生成,或者用:after和:before生成CSS

这些天我们在客户身上做的比过去多得多。是时候我们在最佳实践中给予客户更多的信任了。对,旧的浏览器不太可能很快就消失(这有时是有意的,例如微软不提供对Windows的IE升级XP-很快Vista–用户

关注点与Web开发人员的形象

在其意义和方法上,塞尔德曼首先解释的分离仍然是一个令人难以置信的好主意——不同技术分离背后的思想是伟大的。一些公司在培训中非常认同这一概念,例如雅虎甚至进一步将其称为“可理解”。关注点分离“而不是发展的层次。

这种微妙的差异也部分地说明了为什么这个伟大的想法不总是在现实产品中实现:你需要了解不同的技术是如何工作的,以及如何正确地编写它们。本质上,你想让一个拥有不同专业主题的团队一起构建一个令人兴奋的产品。

事实上,尽管Web开发仍然被视为任何一个经过培训的开发人员都可以做的事情,或者当您雇佣一个专门的Web开发团队时,他们被认为是全面的专家,不允许专注于语义,CSS或JavaScript。

这就是为什么最终的Web产品没有清晰的分离的主要原因。在大多数情况下,开发人员意识到他们本可以做得更好,但他们不得不赶时间或者使用一种他们不太关心的技术。如果你必须调试和优化CSS由Java开发人员编写,你就会明白我的意思。

Web标准展示和消耗

每当我们称赞一个新产品以正确的方式使用网络标准时,它就不是一个大产品。它几乎不是企业框架或细胞质雄性不育.而且,在很多情况下,它的构建实际上是为了强调使用Web标准,而不是简化构建Web产品的过程。

以最有可能成为突破CSS在社区看来:CSS禅宗花园.花园很简单XHTML文件,语义正确,但已经有很多id和类作为要应用的句柄CSS规则。它的工作是通过分离外观和感觉来显示你可以轻松地重新设计一个网站,使它看起来(以及稍后对用户的反应)完全不同于一个案例到另一个案例。

这一切进展得非常顺利,直到我们对图像替换的可能性感到兴奋。后来提交到花园的材料中有大量的背景图片文本,这很讽刺,因为最初的论点是所有的内容都应该在HTML.

在现实世界中,然而,我们从来没有固定过HTML要玩的文档–我们细胞质雄性不育为我们创建网页,一切都在不断变化。你不能控制菜单元素的数量,你不能控制文本的数量,您将无法“简单地将类添加到元素”以赋予它一些额外的功能。现在是时候让我们明白,我们可以通过展示网站和演示来激发灵感了,但我们确实不帮助人们开发网站,也不反对“每个人都可以做前端”的概念。这不是硬代码”。

当我们乘坐喷气式滑雪板时,没有人想知道海洋的深度和组成。

现在,“最佳实践Web开发”讨论,演示和教程都是非常自我参照的。我们同同同一个人谈论同一个主题,并声称人们在使用语义的同时,网络在世界范围内很小的一部分市场上与围墙花园开发和本地移动开发作斗争。

人们高兴地说他们“只为WebKit构建”,因为这是“最好、最快、最稳定的浏览器”。如果你没有合适的浏览器和操作系统,人们可以看到一个展示网站完全失败。

我们开始退到各自的专家领域,并在专家会议上发言。在设计会议上教授的很多东西与在性能会议上听到的完全相反。我们在抽象层之上构建抽象层,以解决浏览器问题,并在会议上发布数十个“奇迹”库和脚本,而不考虑是否有人会使用它们。

速度仍然是我们讨论的主要问题。如何在脚本加载程序上减少20毫秒的时间?如何使动画由30帧改为50帧?

开发人员新市场的最佳实践

我最喜欢的例子是参加Google IO可访问性谈话。大约一个小时我们学会了如何把一个元素变成一个按钮并保持它的可访问性。.没有人提到我们为什么不使用纽扣作业的元素。在那次谈话中有很多很好的信息,但是当我们模拟浏览器提供给我们的JS和CSS.

我们现在拥有的新一代开发人员对技术非常兴奋。我们,“最佳实践”的教育者和解释者都被浏览器多年来的失望所玷污。jquery和其他环境传播“写更少,“实现更多”是成功的主要目标。我们告诉人们的大部分是“加上这个和那个来赋予事物意义”,当他们问我们“为什么?”我们必须想出谎言,例如,现在没有一个浏览器关心大纲算法。

使用Web标准的唯一真正好处

使用Web标准首先意味着一件事:提供一个干净的专业工作。您没有为浏览器编写干净的标记,你不会为最终用户写的。你为从你手中接过这份工作的人写的。就像你应该在简历中使用好的语法,而不是用蜡笔写它一样,当你留下一堆“有用”的东西时,你不能指望维护代码的人会尊重你。

这就是我们需要努力让新开发人员理解的。这是一种为提供一份干净的工作而自豪的态度。不是使用最新的技术和追求光泽。对于我们自己,我们必须理解,唯一真正关心我们所钟爱的标准和关注点分离的人是我们——正如我们所认为的,可维护性,而不是快速部署和持续的代码迭代。网络不是代码——网络是一种媒介,我们使用适合现有目的的技术组合,为最终用户提供出色的体验。

追逐闪亮的HTML5,CSS3过渡期——哦,天哪!

星期五,5月14日,二千零一十

昨天我在推特上和保罗·爱尔兰和迪维娅·马尼安在推特上反复讨论了一件充满胜利但也让我发疯的事情。

那两个小伙子http://html5readiness.com/–一个关于你能做什么的漂亮演示CSS转变,Javascript和标记。它看起来是这样的:

HTML5准备就绪

本质上,这是设计师的眼光http://canius.com/它以一种不那么直观但非常有用的方式列出了相同的信息。

当我看到视觉化的时候,我“哇”了一声,其他人也一样。但事实上,当使用这个网站时,我的兴趣和魅力很快就消失了。

我认为自己是一个很有观察力的人,我能真正地阅读,真的很快。尽管如此,看着这幅图像,我发现自己经常要检查从彩色光线到传说,才能了解我们现在谈论的是哪种浏览器。单击“固定浏览器位置”复选框使这一点更加明显,但我仍然很困惑,特别是当颜色彼此接近(在我的笔记本电脑上)并且滚动颜色更改不再与图例匹配时。当主光线和翻转的颜色发生变化时,这会变得更加混乱:

HTML5准备就绪黑暗翻转。

我不知道为什么光线的颜色不同。我可能认为它是HTML5CSS3,但是地理位置不是HTML5.

我通常对任何接口做的下一件事就是关闭CSS看看它对非可视用户或旧的移动设备有什么影响(是的,我必须时常使用一个旧的黑莓手机)。

如果你这样做HTML5准备就绪你会得到一个可怕的经历:

没有CSS的HTML5

  • 年份名称和浏览器支持之间没有联系(除了链接之外——嵌套列表会使连接更加明显)。
  • 所有链接(如“多个背景”)都不起作用。

但真正让我困惑的是看源代码。作者在整个商店使用B和I标签,其中一种射线是:
















多背景

好啊,我懂了-我和B都是文本在风格上与普通散文相去甚远,但没有表现出任何额外的重要性。>从技术上讲,这让我们全权处理这些元素。

回到现实世界,然而,所见即所得编辑器有b和i按钮,其中包括以下元素大胆的斜体字.现在,作为可访问性和语义的粉丝,我们多年来一直在争论这是一个坏主意,因为这是用HTML而不是告诉用户代理需要强调或加强文本。我们在这方面取得了相当大的进展——人们开始倾听我们的声音。现在我们回去说“哦,那好吧,事实上,这一切都很好——你想用什么就用什么”。

总之,这个例子让我想起了我建立的东西8年前

带有布局表的徽标

那时候这很酷。这是为64号准将的场景做的,它必须在每一个知道HTML-包括阿米加人。我设法使它成为一个“如何做到”的时刻,不使用图像,而是一个布局表与间隔gif:




















































































































.:最好的:




真的,可怕的,正确的?谁会使用桌子对于布局?这太疯狂了——这些是我们不需要再使用的技术。

或者是?用过多的HTML在我们上面的视觉化中的元素确切地同样的事情!HTML有没有逻辑结构的内容,并赋予它语义意义-而不是画可爱的图片。

页面使用我能用吗?作为它的数据源——但不是使用刮刀并将其转换为必要的HTML(通过这种方式,可以自动更新)数据是重复的——一旦显示,就没有任何语义值或逻辑结构。我们有技术来改变理智,好洁HTML把它变成不同的东西。我已经证明过去数据表到图表的转换脚本

使用Google图表API从可访问的数据表生成图表。

我真的不明白为什么我们忘记了一次又一次与用户分享的简单承诺:

  • 以有用的东西为基础,然后使其更具互动性和美观性。

在这种可视化的情况下,使用数据表并生成您需要的所有fluff和类CSS使用javascript进行训练。或者——怎么样使用静止无功发生器为了整个事情

我不是说保罗和迪维亚做了什么坏事——我是他们工作的忠实粉丝——我只是说我们一直在犯同样的错误。如果你不写一些HTML用手,只需要一个效果-你做的事情是错误的。