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

您当前正在浏览必威体育下载克里斯蒂安·海尔曼六月份的博必威体育简介客档案,2017。

6月存档,二千零一十七

任何网站都可以成为一个PWA,但我们需要做得更好。

星期二,6月27日,二千零一十七

在他的博客上,我只是去杰里米·丁.

从字面上讲,任何网站都可以而且应该是一个进步的网络应用程序。别让别人告诉你。去年我在一个活动上听到克里斯·海尔曼说你不应该把你的博客变成一个进步的网络应用。我简直不敢相信我听到了什么。他在视频聊天中重复了这个信息:“当某人,例如,把他们的博客变成 聚乙烯醇,我不明白这一点。我不想在我的主页上有那个图标。这对我来说毫无意义“对不起!?只是因为你不想在主屏幕上显示某人的图标,那个人不应该使用最先进的技术!?对不起,我的法语,但是他妈的。那。倒霉!
我们的想象力已经被本土移动应用程序目前所做的事情所限制,以至于我们看不到过去仅仅像一个悲伤的货物崇拜者一样模仿现状。
我不希望网络与本地网络一样;我希望网络能超越它。我,一方面,我更喜欢这样一个现实:在我的主屏幕上,没有充满初创企业和符合门卫标准的公司的图标。但是一个主屏幕上满是不需要征求任何人的同意就可以发布的人的脸?这就是我想要的!

可以说,我不会告诉任何人不要用伟哥,现代技术使其最终用户受益,并使其出版方便.以及构成聚乙烯醇如果能比现在更成功,那就太好了。

波兰JSPoland的PWA演示
我,字面意思是告诉世界 聚乙烯醇可以是任何东西

我希望我们做得更多.我希望现代网络技术不会成为一种个人的东西来使用。我想让它成为我们工作的方式,不是为了工作,也不是指某个惊人的网络人的网络存在或一个大型网络公司的展示。

在我们控制的环境中使用任何伟大的技术,但我们需要更高的目标。我们需要去错误发生的地方,为老旧的解决方案带来便利和明智的升级。我没有权力告诉任何人不要在他们的博客上使用某些东西。但我也不想有很多被吹捧为“PWA”的事情,那是一次可怕的经历。我们用各种各样的包装格式一遍又一遍地完成了这项工作。我们这次需要把它做好,因为我们的工具从来没有这么好过。

我一遍又一遍地公开反对当前形式的商店,因为它们是访问的障碍。一个看似人造的屏障,当我们有了网络,正确的?

也许吧。事实上,新一代人都知道应用程序。不是网络。他们知道网络上充斥着你需要的广告和恶意软件。在有些地方,网络并不像我们这样方便地使用,人们甚至认为Facebook就是网络。因为它比膨胀的网络更容易被人们使用。

当我说我不明白把博客变成聚乙烯醇它正好触及“应用”部分的混淆点。对我来说,应用程序是“做”的事情,不是“读”的东西。我觉得有线电视没用,监护人,滚石,《泰晤士报》等…应用。拥挤的桌面上的图标无法缩放。我用新闻阅读器阅读新闻。我用RSS阅读博客的聚合器。我用电子书阅读器阅读书籍(或浏览器)。我用Spotify或iTunes听音乐。我没有适用于每个乐队或电影的应用程序。

我已经在网上发表了好几年了。我选择使用博客,因为我不知道你是如何使用它的。我喜欢这样。我认为你的桌面上不应该有“克里斯·海尔曼”的图标。应该在联系人中,它可能会显示为一个帖子或书签。你不能在这个博客上做任何事,除了阅读它。用你最乐意做的。

我非常同意杰里米的观点:

我不希望网络与本地网络一样;我希望网络能超越它。

当我不想博客作为一个应用程序时,这正是我的意思——不管应用程序的格式如何。我希望人们创建的PWA不仅仅是书签,甚至是离线工作的,当新内容可用时,它们会给我一个通知。

这是否意味着我说你不应该使用清单和服务工作人员来改进网页或博客?地狱,不。狂野–做正确的事。尤其是做一件PWA要求的事情:停止发布超文本传输协议并保护您的服务器。中间人的攻击需要停止,尤其是在各国政府都很高兴成为中间人的情况下。

我希望网络在重要的地方能够成功。我想让本地应用消失。我不想下载一个应用程序来获取柏林地铁的票。我不想在我去的每个机场都有一个应用程序。我非常不希望我参加的每一个活动都有一个应用程序。我不想为我经常光顾的每一家餐厅都提供应用程序。我不需要那些关系,我必须在手机上给他们一部分有限的空间。或者在我的桌面/启动栏上。

我们需要网络打败本地的可怕之处:分布和便利。我想让人们不用去商店就可以做事,下载并安装应用程序并运行它。我希望人们不用信用卡就能获得免费内容。你需要一张信用卡才能在应用程序商店里买到免费的东西——这是一个巨大的障碍。我希望人们能找到下一班火车,预订餐厅,无论连接和设备如何,都要请医生来检查。我想让人们拍照和分享。我不想让人们利用不安全感,他们的应用程序版本过时,因为每天更新50MB太多了。我不希望人们使用手机上的东西,把浏览器作为最后的手段。为此,我们需要知名实体的伟大PWA和伟大的新玩家。

先试后买
聚乙烯醇是先试试再买

我想让人们明白他们是在控制之中的。正如我上周在波兰所说,聚乙烯醇在你买之前是适当的尝试。你去了统一资源定位地址,你喜欢你所看到的。在以后的访问中,您会宣传它以获得更多的访问权,离线工作,甚至给你通知。

波娃必须要争取这个权利。这就是我们需要的例子。我再也没有本地推特了,推特这样做可以节省大量的数据和空间。我到处向人们展示这个,我看到他们把本地推特踢出去。这就是我们需要的。

每次我们把网络推广成酷的东西,我们都会重复同样的观点。

  • 很容易发表
  • 每个人都有
  • 它不欠任何人的情
  • 它独立于平台,外形和一般的吸引力。

当你看到数百万人每天使用的网络时,情况就大不一样了。

每个浏览器制造商都有一个跨浏览器遵从性部门,这是很糟糕的。我们都会与大公司接触,指出他们的产品是如何破裂的,以及可以采取什么措施来修复它们。我们甚至提供开发人员资源,以避免依赖WebKit前缀。在几乎所有的情况下,我们都会被问到这样做的商业利益是什么。

当然,我们有很多小胜利,但是现在向别人展示网络是很可怕的。在我们的泡沫中,一切都很棒,令人惊叹。

那是怎么发生的?我们有技术。我们有知识。我们在数百次会谈中得到了信息,书籍和帖子。问题是我们能联系到谁。谁建立了这个可怕的网络?或者是谁在家里制造好东西,而工作时却因为无法修复而感到沮丧?

当我说我不希望博客作为一个应用程序时,我并不是说你不应该给你的博客增压。我并不禁止任何人发布和使用技术。

但是,我认为这还不够。我们需要商业上的成功。我们需要击败本地应用程序的营销。我们需要通过更好的建设来揭穿本土便利的神话,基于Web的解决。

我们已经证明网络在自我发布方面很好地工作。现在,我们需要去那些构建iOS和Android应用程序的人那里,让他们的公司拥有更高的功能。我们需要这些人理解,网络是一种发布和让用户使用你的产品的好方法。我们认为这是常识,但事实并非如此。我们必须再次提醒人们网络有多伟大。使用网络技术要容易得多。

为此,我们首先需要了解如何在网络上大规模赚钱。我们需要找到一种人们为内容付费的方式,而不是出版商以更简单的方式展示大量广告。我们需要展示商业的数量和成功,现有产品。谷歌在这方面花了很多钱聚乙烯醇路演。每个大的网络公司都有。我还直接与合作伙伴合作,通过浏览器修复他们的网络产品,并将其转化为PWA。还有一些很好的第一个案例研究.我们需要更多的。

我希望开发人员不必利用他们的业余时间,在他们的个人项目中学习新的网络技术。必威体育下载我希望公司了解聚乙烯醇最重要的是,修复他们在网络上的废话,并保持维护模式。

如果你认为这些和其他聚乙烯醇案例研究是偶然的,因为参与研究的人喜欢网络——再想想。说服公司做“非常明显”的事情需要付出很多努力。这涉及到大量的时间和金钱成本。很多内部开发人员把他们的职业生涯放在网上,告诉他们的上级有另一种方式,而不是提供想要的东西。我们希望这能奏效,我们需要提醒人们,质量意味着努力。没有添加一个清单和一个服务工人到一个已经在维护地狱多年的现有产品。

杰里米想要一个特定的世界:

我,一方面,我更喜欢这样一个现实:在我的主屏幕上,没有充满初创企业和符合门卫标准的公司的图标。但是一个主屏幕上满是不需要征求任何人的同意就可以发布的人的脸?这就是我想要的!

我想要更多。我希望“在线”的商业世界和营销宣传不要针对本地应用程序和关闭的商店。我不希望人们认为要求iPhone访问他们的内容是可以的。我不想让公司浪费金钱,当他们很容易在网上找到的时候,他们会出现在应用商店里。我想我们已经有了杰里米描述的世界。再说一遍,我不希望任何人不接受这个,如果他们愿意,或者他们认为这是个好主意。

无需将当前Web产品转换为聚乙烯醇是浪费。所有步骤都有利于产品的健康和质量。这是最棒的部分。但这确实意味着应该达到一定的质量目标,以避免有“应用”期望的用户得不到他们想要的东西。我们必须讨论这些质量目标,现在有相当多的公司推出了他们的想法。这并不意味着我们审查网络或者把人们拒之门外(还有其他人在公司外从事这方面的工作)。这意味着我们不想让另一个“HTML5应用程序在我们手上是糟糕的体验”。

我经营这个博客已经很久了。我学必威体育下载到了很多。那太好了。但我不想让网络成为人们已经相信的东西。我希望每个人都使用它,而不是像应用商店这样的小仓库,尤其是商业公司。我们已经逃避了让人们日常使用的企业和产品拥抱网络的责任太久了。目前原生/应用商店模式的消亡是一个很好的机会。我希望所有有兴趣和知识的人都参与进来。

我看不到自己有一个充满了人的脸的电话。这就是通讯簿的用途。同样,我的电子书阅读器(这是我的浏览器)也是我阅读书籍的方式。我没有适合每个作者的应用程序。

我喜欢让一个订阅阅读器批量检查激励我的人在做什么的概念。我喜欢阅读搜索我的聚合器。如果我想和这些出版物背后的人交谈,我会联系他们并与他们交谈。或者——甚至更好——去见他们。

对我来说,一个应用程序就是我做的事情。这个博客是我的一个应用程序,但不适合其他人。你不能编辑。我甚至拒绝评论,因为我花更多的时间来缓和而不是回答。这就是为什么它不是聚乙烯醇.我可以把它变成一个,但当你把我提升到你的主屏幕上时,我会觉得我应该再发表很多东西。

所以当我谈论个人博客而不是我的pwas时,这就是我的意思。对我来说,应用程序就是用来做事情的。如果除了阅读和分享之外我什么都不能做,我不会阻止你把它作为聚乙烯醇.但我不太可能安装它。同样,我不会下载Kim Kardashian应用程序或乐队的应用程序。

这与你的出版权无关。它是为了在有限的环境中获得空间,这是我们用户的主屏幕,码头和桌面。如果你很高兴有那么多朋友的博客或者你喜欢的人,那就太好了。我宁愿很快看到商店里的电话,开箱即用,配备有PWA让人们做事情。不是第一次连接时需要200MB更新的本地应用程序,也不会获得升级并成为安全风险。我想让网络访问成为新设备的前端和中心。要做到这一点,我们需要更高的目标,做得更好。

CSS VSjavascript:信任与控制

星期三,6月21日,二千零一十七

当哥托康要求我发言时,我认为这将是另一个机器学习或进步的网络应用程序的谈话。必威体育下载相反,组织者让我报道CSS.在他们的“编程语言”轨迹中,一种代表性不足的语言。现在,我一直很喜欢CSS从一开始。我认为参加一个核心开发会议的人不会那么兴奋。他们不会看的CSS详细地说。相反,我的假设是,这对他们来说更是一种必要的烦恼。所以我写了一篇关于CSS手段和我们如何不利用它的优势。

这是我谈话的笔记。

无聊的战斗

美国队长vs.铁人

前几天我又看了一次“美国队长:内战”。我又一次感到厌烦,我不太明白它的概念。超级英雄被迫对附带伤害负责的想法并不新鲜。要求控制他们也不是什么新鲜事。“不可思议的人”在这方面做得很好。

我对所有这些超酷英雄互相战斗的前提感到更无聊。我们知道他们的能力。我们知道,他们是在无数场合拯救彼此生命的深层次的朋友。我们知道他们的力量是一致的。没有暴力,没有真正的驱动器,在这些遭遇中没有愤怒。感觉就像Marvel介绍了太多酷的角色,现在试图找到一种让人们站在一边的方法。卖更多的玩具,创造人造戏剧。

当我们谈论使用CSS或布局的javascript。两者都有各自的优点,他们都有自己的力量。他们都有粉丝团准备挖掘最详细的信息来互相宣传。但我觉得这很无聊。两者共同使用是推动网络向前发展的原因。有两个巨大的营地,这让我们束手无策。一端看到CSS作为过去的事情,在模块驱动的世界中,我们应该在脚本空间中完成所有工作。另一个看到CSS它的预处理器和构建脚本都足以完成所有工作。记得DHTML我们用JavaScript做一切的日子?还记得“仅CSS解决方案”的反冲吗?当我们(ab)使用复选框进行复杂的交互以避免使用任何javascript时?

吉安娜·布兰廷说得很好

这两组能不能:
“CSS非常简单,它甚至没有编码”
“CSS太难了,我们需要用JS替换它!”
请互相谈谈?

很多关于CSS因为开发人员不理解它与编程有什么不同。相反,我们玩弄它,改变它。打碎东西后,我们认为它不够好,我们需要更换它。

我知道OpenGL-我可以做梯度

这常常超出了标准。很像使用用于创建简单渐变的OpenGL我们不需要一直把大炮拿出来。CSS有一些我们无法与客户端脚本匹配的技巧。它与语法或语言特性无关。这是关于分担责任。

谁是错的,谁应该宽容?

CSS,很像HTML容错.这可能会令人困惑。这意味着最终用户不应该遭受开发人员的错误。产品与CSS当开发人员出错时仍会出现。它们看起来不完美,但是他们工作。当ACSS解析器遇到一个它不理解的属性——它跳过它。当它遇到一个它无法处理或不支持的值时,它跳过它。这样我们就可以向后兼容。

具有背景色和渐变色的按钮将在较旧的环境中显示颜色。它还显示在由于性能问题而不支持渐变的环境中。更快,更多的高保真和支持环境将呈现渐变。

你不需要了解环境,也不需要做出决定。操作系统,浏览器和相关代理为您做出这些决定。

JavaScript是不容错.这可能是灾难性的。在使用JavaScript时,您的控制能力更强。但你也更负责任。

客户机上的javascript可能会因多种原因中断。浏览器可能不支持,这种连接可能是不稳定的。最终用户所拥有的移动服务提供商可能会将其视为他们缩小和打包脚本的工作。当javascript遇到一些它不理解的东西时——它会崩溃。它装进去了,什么也不显示,因此,你的产品的用户会因为你的错误而受到惩罚。或者其他人和脚本引入的错误,这些错误涉及到将代码交付给最终用户。

换言之:

  • CSS-你运用你的风格,你希望它能奏效。
  • JavaScript-您可以控制样式,并且应该验证它是否有效。

CSS意味着拥抱网络的“无光泽”,作为布拉德·弗罗斯特说的.网络不是可以设置像素的固定画布。很多事情都是你无法控制的:

  • 用户的浏览器
  • 决议案,其设备的像素密度和颜色设置
  • 它们的连接可靠性和速度
  • 他们的连接限制——资源阻塞是一回事
  • 他们的字体大小和缩放需要
  • 他们机器上为您的产品提供的资源(是中央处理器已经燃烧了?)
  • 产品中文本内容和图像大小的数量-细胞质雄性不育有人吗?

这可能是令人望而生畏的,而且我们经常希望控制产品运行的环境——如果只是为了保持我们的理智的话。这意味着尽管我们屏蔽了很多潜在用户。

在这个未知的环境中,我们必须决定谁来承担工作来处理其性能问题:

  • CSS-浏览器的工作是性能良好,使用图形处理器资源和跳过功能。
  • JavaScript-测试支持是你的工作。为了确保渲染效果,绘画和回流很快。保持动画同步。

CSS在这方面做得非常好,浏览器制造商花了很多精力来调整界面性能。

为什么我们低估了CSS并且过分重视javascript的好处?我想有一件事应该归咎于经典的互联网浏览器。

CSS它崎岖的历史

CSS必须快速成长,并且没有得到浏览器的支持,浏览器需要一个可靠的工具。

CSS起初是非常有限的,用来代替视觉效果HTML和属性。放弃所有这些字体,BGCOLL,排列,中心,人力资源和朋友。不加调试的浏览器支持和非常奇怪的错误对它没有帮助。我们知道事情不对劲,但对此我们无能为力。我们甚至无法询问任何人,因为浏览器制造商无法获得反馈。

当iPhone出现时CSS在聚光灯下度过了它的一天。“HTML5是未来”的故事需要很多额外的功能。由于苹果公司在这方面大放异彩,而标准化花费的时间太长,所以“仅限WebKit”。T

他的意思是前缀CSS再次为不同的渲染引擎分叉。浏览器制造商进行了创新,并以前缀功能显示出了对其他浏览器的统治地位。作为开发人员,这意味着重复,必须为每个人选择一个支持计划。当然一个是支持老年人,过时的浏览器。这些围绕前缀的新浏览器战争引起了许多争论和混乱。

最后但并非最不重要的是直到最近CSS.相反,我们使用定位和浮动进行黑客攻击。定位,尤其是像素的绝对定位在网络上是不明智的。人们可以调整字体大小,内容会重叠。使用浮动定位需要清除元素。

它不是你所说的可靠的基线,也不是一个简单易懂的基线,如果你不是“网络本地人”。

我们需要CSS不管浏览器支持如何工作

我们的解决方案是用JavaScript修补。我们可以读出条件并对它们做出反应HTML以及应用样式。因为JavaScript是一种编程语言,所以我们可以完全控制正在发生的事情。我们有条件,循环,比较——程序员遗漏的所有东西CSS.这个,在某种程度上是对CSS作为一个概念。匹配多个元素的选择器本质上是一个循环。我们甚至可以使用:nth-child()以集合中的元素为目标。

一般来说CSS自从我们不得不使用javascript来修补它以来,它一直在飞速发展。尤其令人失望的浏览器支持是一个小得多的问题。

  • 常青浏览器是一回事——所有浏览器都在不断升级。我们甚至可以从浏必威体育下载览器制造商那里了解下一步该做什么。
  • 浏览器工具提供了详细的洞察CSS适用于什么。我们甚至得到了动画编辑器和颜色选择器之类的视觉工具。
    firefox devtools中的bezier编辑器
    火狐开发者工具有一个可视化的Bezier动画编辑器
  • CSS跨浏览器的支持有很好的文档记录:卡尼苏是一种不可思议的资源。它不仅显示哪个浏览器和哪个环境支持什么。它还解释了实现中的错误,提供指向规范和错误报告的链接。它甚至有美国石油学会将这些信息嵌入到文档和开发人员工具中。
    我可以在Visual Studio代码的编辑器页脚中使用信息吗
    使用 “我能用”分机对于 Visual Studio代码您可以直接在编辑器中显示浏览器支持信息。当你编码必威体育下载的时候,你就知道你锁定了谁!
  • 我们支持几乎所有浏览器的通道和错误跟踪。有些甚至允许你使用Twitter提交错误.浏览器制造商的团队活跃在社交媒体上,并且可以访问。
  • 预处理器萨斯较少为创新CSS规格更快。就像今天jquery激发的javascript一样,这些会导致人们想要的功能。
  • 社区花了很多时间CSS更易于维护。类似方法面向对象CSS通过妮可·苏利文原子设计通过布拉德·佛罗斯特已经存在很久了,应该有助于降低复杂性。

什么CSS可以为你做

这里有一些神奇的东西CSS现在可以,您应该考虑使用。

计算CSS价值观

有一件事似乎总是在CSS是一种计算价值的方法。经典的例子是一个绝对定位的元素,它100%宽,但需要填充。在过去,我们需要通过嵌套另一个元素并对其应用填充来实现这一点。虽然我们可以用很长一段时间CSS()为此,应用计算宽度(100%–1em)。

计算在浏览器中得到很好的支持.使用它们不应该有任何疑虑。

媒体查询

CSS媒体查询允许您对文档视区的更改做出反应。本质上,它们意味着当视区满足特定条件时,应用部分样式表。这可以是一个至少具有一定宽度或至多具有一定高度的视区。您还可以检查屏幕的纵向或横向方向,或者文档是否为打印输出。
CSS媒体查询的javascript在媒质.这允许您按需加载内容。一个媒体查询问题是浏览器加载块中的图像,而不管匹配与否。

生成的内容

使用前:后:中的伪选择器CSS允许您创建纯视觉内容。这是一个很好的方法来确保那些出于表面原因的东西不需要自己的,空的div,跨度,B或I元素。它是一种保持样式表中所有内容的可视化的方法,而不是脚本或HTML文件。你可以把它和投影配对,坡度和其他CSS创造视觉效果的功能。令人印象深刻的展示是”单一的div“。这个网站显示了从一个div元素。

怪物的阴沉,股份有限公司。作为一个单一的div
这张图是一张 div使用生成的内容创建

动画和过渡

动画转变在里面CSS是iPhone问世时的重大突破。转换允许您创建从一种状态到另一种状态的平滑更改。你不需要知道应该发生什么变化。你只需要告诉浏览器过渡的时间以及要使用的宽松功能。动画给你更精细的控制。您可以定义关键帧,以及应该如何设置动画。动画和过渡都会在之前触发事件,期间和之后。这允许您以可预测的方式与JavaScript交互。使用的好处CSS因为浏览器可以确保动画的性能。这是通过在图形处理器以及在需要时限制帧速率。这是确保用户手机电池寿命的重要步骤。如果你用javascript制作动画,这很容易出错。

视口单元

当您想要详细定义体验时,媒体查询是有意义的。相反,还可以使用视区单位根据可用空间调整元素的大小。视区宽度(vw)是整个视区宽度的百分比。所以在480px宽屏幕上,10vw是10%或48px。这与%单位不同,它是父元素而不是视区的百分比。嵌套百分比会变小,大众不会。视区高度(vh)是整个视区高度的百分比。您还可以使用vmin和vmax使自己独立于我的方向。这些要么采取较小或较大的大众和vh。支持视区单位的唯一麻烦是迄今为止边缘不支持vmin和vmax。

CSS技巧有一篇很棒的文章视区单元有多强大.从分辨率无关的嵌入到视区相关的排版,您可以使用视区单位来创建高度灵活的界面。

柔性箱

柔性箱是在中创建元素布局的方法CSS.从本质上说,所有声称布局表的人都更容易被遗漏CSS-还有更多。可以将元素的子元素右对齐,左,顶部或底部。您可以定义它们来填充可用空间,每一个都使用相同的数量或比其他更多。您还可以定义它们以使用彼此之间或它们周围的可用空间。它就像罐头上说的那样灵活。如果你想让一个可视化的编辑器来看看这意味着什么,用react构建具有出色的flexbox编辑器

使用flexbox的不同设置进行播放

还有一个游戏叫弹性箱蛙式.它以一种令人愉快和容易理解的方式教授概念,并且对于孩子们来说是很好的开始CSS.

Frasbox蛙

关于flexbox的好话就是那个佐伊吉伦沃特在各种事件中给予。关于这个话题,我最喜欢的是佐伊如何展示他们如何在生产中使用flexbox。例子来自预订网并显示不支持它的浏览器的回退。

CSS网格

如果flexbox是行或列中布局元素的答案,CSS网格正在将它提升到下一个层次。使用它,您可以在定义的二维网格中布局元素,行和列。网格已经烹饪了一段时间,现在终于得到了全面的支持。

一个简单的网格示例
一些设置可以将一系列元素转换为灵活的网格

网格可以令人望而生畏,因为它的灵活性意味着有很多选项可供选择。到目前为止,最简单的开始方法是瑞秋安得烈“S”网格实例“资源”。这个有复制+粘贴网格布局的例子。它们中的许多都带有不受支持的浏览器的回退。培训视频解释了它们的进进出出,使它成为一个令人惊奇的资源。

如果你能更好地必威体育下载接受挑战,你可以掌握CSS通过播放网格CSS网格花园.

网格花园
必威体育下载学会给胡萝卜浇水 CSS网格花园

有一些“必须看到”的说法CSS网格在线。第一个是”CSS网格布局“瑞秋·安德鲁的作品。

仁西蒙斯正在采取不同的方法。在她的“网上真正的艺术指导她向我们展示了网格的多功能性如何帮助我们摆脱“框布局”思维。

混合和匹配网格和flexbox没有问题。它可以并且应该在其单元格中使用flexbox.一起,这些工具允许您创建灵活的布局。允许可变内容和更改以适应可用空间的布局。网页布局。

CSS自定义属性(变量)

最需要的特征之一CSS像Sass和Less这样的预处理器在很长一段时间内拥有的是变量。现在我们有CSS自定义属性哪件事让我最兴奋CSS.您可以在文档中定义一次可重复使用的设置,并在整个过程中应用它们。最常见的使用案例是定制颜色和尺寸。但您可以进一步定义字体和其他字体。也可以使用它们将计算嵌套到CSS.这在以前是不可能的。一个惊人的特性是,自定义属性也可以用JavaScript动态设置。

在javascript中读取和设置CSS自定义属性的示例
如何读写自定义 CSS带javascript的属性–(摘自Lea Verou的演讲)

如果你想了解必威体育下载CSS自定义属性有一个您不应该错过的谈话。李维鲁“S”CSS变量:var(-subtitle)“是信息宝库。

CSS特征查询

另一个非常受欢迎的附加CSS特征查询.这些功能与媒体查询非常相似。通过使用@supports,可以检查当前用户代理是否支持特定功能。然后定义一个块CSS只有在有功能支持时才会应用。这可能会让人觉得奇怪,因为CSS应该已经处理好了。但它所做的是给你更多的粒度控制。它还允许您在不支持使用“not”关键字的特定功能时定义回退。

CSS和JavaScript?

CSS而javascript协同工作是强大的,而且是正确的。到目前为止CSS已经来了,它仍然不能做任何事情。有些情况下CSS与我们想要实现的目标形成鲜明对比。

AS克里斯蒂亚诺·拉斯泰利在他的解释中让和平来吧CSS“说话,“关注点分离”这一宝贵特征在模块世界中并不适用。

组件世界中的关注分离

什么时候?CSS变成了一件事,我们把所有的外表、感觉和行为HTML进入之内CSS和JavaScript。我们可以在文档甚至项目范围内定义。我们庆祝的是CSS不从父元素继承。当我们构建可以一致重用的组件时,我们不希望这样。我们要他们带着他们的表情,感觉和行为,不向相邻的人流血,也不从父母那里继承。

CSS以及在非组件世界中一起工作的javascript

在构建基于文档的解决方案时,没有理由不挖掘CSS.您可以也应该使用javascript来提供信息CSS不能读入CSS.不过,这样做是谨慎的,尽量减少干扰。

制造的层次CSS在这个场景中,JS与另一个JS一起工作:

  • 使用CSS当你可以–使用你在这里看到的东西
  • 如果你需要与CSS,考虑更改自定义属性
  • 如果这不是一个选择将类应用于父元素使用类列表。
  • 作为最后的手段,你可以直接更改样式

将鼠标位置放入CSS的示例
演示如何在javascript中读取鼠标位置并将其存储在 CSS自定义属性–(摘自Lea Verou的演讲)

每当您动态更改样式时,请记住,您正在使用浏览器。每一种风格变化都会导致回流,渲染和绘画。保罗·刘易斯达斯苏尔马保持一个叫做CSS触发器.这一个详细描述了CSS更改会导致对浏览器的惩罚。

CSS触发器
CSS触发器提供不同样式更改的效果信息

综上所述

CSS它比以前可靠得多,而且没有多少地方可以和现在的情况不同。最重要的是要记住CSS并不意味着要像JavaScript那样做。即使是布局语言也不会起作用CSS并满足同样的需求。这项工作很艰巨,而且做得很好。当你使用CSS,无论最终用户的设置如何,浏览器都能帮助您满足他们的需求。这是Web的核心原则,在W3C HTML设计原则

用户高于作者高于实现者高于说明符高于理论纯度

我们的用户需要平滑的界面,可靠,不要损坏电池。所以,考虑CSS再多一点。你可以懒惰,以社区的工作为基础。

激励和积极CSS要跟随的人

在研究这个话题的时候,我不断地回到由网络上优秀的人编写和维护的资源中。这里有一个简短的名单,没有特别的顺序,如果你想和你的CSS知识。我要感谢他们每个人。他们让我们所有人都能更轻松地上网。

我每天都受到这些人(其他人)的启发,希望你也能有同样的经历。

我的全息透镜的第一印象

星期三,6月7日,二千零一十七

克里斯·海尔曼带着全息透镜

中码也有售.

我现在骄傲地拥有一个全息透镜。我还没有正式接受过微软员工的培训。但我想分享设置和使用它的第一印象。

这些是我个人的印象,不是我公司的官方立场。我在这里分享我的第一次兴奋。我希望能让一些人了解这里发生了什么。

这也是一个用户波夫因为我还没有开始为它开发,但这很快就会发生——承诺过。

全息透镜是独一无二的

首先,重要的是要理解全息透镜是非常独特的。每次我提到它,人们就开始把它比作神秘或生灵,但这些不管用。

大功率的,头上有多摄像头手机

全息透镜是一个独立的电脑,你戴在你的头上。你不需要其他东西。它不是外围设备,不需要其他计算机或服务器。这在考虑价格时很重要。很多虚拟现实耳机更便宜,但他们不是混合现实,他们需要一台大型计算机来运行。它甚至不需要一直连接互联网。仅仅因为你戴在头上并不意味着你可以在平地上比较这些产品。

你应该像头上的手机一样计划编码中央处理器/GPU电源。规格很高,但对其工作方式的要求是,也是。如果你为全息透镜建立的资源是保守的,你需要的-你会让我高兴。等待并不有趣,即使它是你房间里的浮动动画。

你的自然动作是一件大事

安科校准全息透镜
当你校准全息透镜时,所有的狗都会想到你是在拿着一个礼物而不是用“布卢姆”。

全息透镜是一种利用头部和身体的自然运动来探索扩大空间的系统。这意味着你不会失去与现实世界的联系——你仍然可以通过设备看到它。你所得到的是对周围环境的不断分析,以及叠加在上面的全息图。你打开应用程序,要么在你面前使用它们漂浮,要么把它们停靠在墙上,等你看到墙的时候再使用。你把你的工作空间分配到你的生活空间,而不需要去宜家去买家具。

这意味着你的行动方式和你的面貌成为事件软件可以互动。“凝视”手势,“看东西”就好像用鼠标悬停一样。“轻击”手势是点击或提交。

这样,相对于神秘或活体来说,你的视窗相对较小的尺寸就不那么重要了。当你的观察窗跟随你的头部移动时,你不会陷入其中。你不应该有一个完整的接管。全息透镜是用来扩大世界的,而不是取代它。

你的整个身体现在是一个事件触发器。不是学习键盘快捷键,必威体育下载你学习手必威体育下载势。或者你可以用你的声音。

手势vs语音识别

你可以用你的手来选择和互动。或者你可以说“选择”进行交互,然后在菜单中说“下一步”继续。语音识别功能一直处于开启状态,Cortana离我们只有一个“嘿,Cortana”。你可以用它打开应用程序,搜索网页,研究,各种各样的东西。和我的手机通话对我来说还是很奇怪。我在安卓上,也许Siri是更好的体验。我在家里分发的应用程序空间里和声音交谈感觉更自然。

空间声音

全息透镜内置了许多扬声器,可以让你听到来自各个方向的声音。当涉及到像roboraid这样的游戏时,这是非常惊人的:

在片段中更是如此:

使用扬声器时,不过,这里没有多少隐私。当你和戴着全息透镜的人很近的时候,很容易听到全息透镜说的话。

如果你想要一个键盘,你可以要一个

如果你在网站或类似的地方输入大量的文本,您也可以配对蓝牙键盘。或点击器,或者什么。一开始,在浮动键盘中输入相当安全的密码让我很恼火。但我越习惯全息透镜的相互作用,变得越容易。

全新的互动方式

我不太喜欢虚拟现实,因为如果帧速率不理想,我很容易恶心。我也经常晕车,所以这不是什么值得期待的。我也感到被它所束缚——当我身处一个虚拟的空间时,它让我充满了对周围事物错过的恐惧。我也不喜欢眼罩和耳塞。

我唯一感到不舒服的是全息透镜有重量接近一公斤的东西在你的头上。但你已经习惯了。开始的时候,你也会感觉到你的手指在拍打空气时抽筋,肩膀也会受伤。这意味着你做错了。动作越自然,全息透镜越容易理解你。抽头不需要完全移动。考虑一下举起你的手指,指着那些东西。就像打断会议一样。

出色的入职经验

让我“哇”的是你设置和开始使用全息透镜的方式。这个队在那里干得很出色。同样的,当iPhone问世时,苹果公司在让人们习惯使用触摸设备方面也做得很好。建立全息透镜是一种发现的体验。

你打开设备,一个友好的“你好”出现,Cortana的声音告诉你该怎么做。你可以根据你的眼睛来校准这个装置,以满足你的需要。Cortana一步一步地告诉你如何使用你需要的手势来找到你的方法。每一步都充满了友好的“做得好”信息。当你被卡住的时候,系统会告诉你不要担心,以后再回来。这是一次愉快的学习经历。必威体育下载

我如何使用它

把猫的全息图放在狗身上

马上,我的厨房橱柜是我的工作台。Edge在其中一个上面,旁边是我当天的任务列表。我在房间的另一边有一些游戏。当涉及到全息图时,我们的狗碗上有一只猫,床上有一只独角兽给我们美梦。因为我们可以。

Skype在全息镜头方面非常出色:

我有些烦恼

重要的是要记住关于全息透镜的一些事情:

  • 它不是消费类设备,但现在是商对商工具。一方面价格很高。我们关注的是如何使用它,而不是玩游戏。
  • 它不是外部设备。全息透镜扫描你的环境并把它变成网格。在创建网格之后,它将它们存储在“空间”中,以避免继续扫描。这意味着对空间的不断重新评估。这很贵,暂时不值得。因此,街上那些讨厌的谷歌玻璃人不会再出现。看着一个不知道是不是在拍你的人,我还是很不安。
  • 我同意很多其他人应该有一种方法在一个全息透镜上存储多个用户帐户和校准信息。虽然您可以与其他全息透镜用户分享体验,如果不进行重新校准,也不允许其他人访问我的Windows帐户,就可以将它移交给我。
  • 应该有一种方法可以用一个命令擦除空间中的所有全息图。当你让别人玩你的设备时,你最终会遇到很多老虎,太空人和你的空间里所有你需要手动删除的东西。
  • 虽然拍摄视频和拍摄您的体验很容易,分享经验非常基础。您可以将其存储到OneDrive或Facebook。没有发送或添加Twitter的选项。这就是说,Skype对此有所帮助。

这真的是一些新的经验

我相信在虚拟现实/现实/磁共振空间里会有很棒的东西。许多经验可能会更加详细和高保真。然而,这个装置的用处使我大吃一惊。我看到合作伙伴和公司已经使用它来计划架构项目。我看到人们如何使用办公室的Skype指令修复现场设备。我看到了《星际迷航》的全息甲板的倒叙,这是我十几岁时喜欢的东西。

能够将你的物理空间用作数字画布是非常令人信服的。你不必离开你的公寓。而且,在你进入网络空间的时候,你不会冒着撞到东西的危险。它应该是增强的。几年后,当我的网络联系人和耳塞为我做同样的事情时,我可能会在这篇文章中轻笑。但是现在,我很高兴有机会尝试一下。