跳至主要内容
CSS-Tricks
  • 文章
  • 笔记
  • 链接
  • 指南
  • 年鉴
  • 随机
搜索

Links

来自网络各处我们正在阅读并有一些想法的东西。有我们应该知道的链接吗?告诉我们!

Apple 对 HTML 模板实例化的提案

🔗 https://github.com/w3c/webcomponents/blob/gh-pages/proposals/Template-Instantiation.md
阅读评论

我确定我没有足够的专业知识来理解其中的细微差别,但我喜欢这种精神

HTML5 规范定义了 template 元素,但没有提供本地机制来使用其某些部分进行替换、有条件地包含或基于 JavaScript 值重复,就像 Ember.js 和 Angular 等流行的 JavaScript 框架允许的那样。因此,在模板中进行替换和条件语句存在许多不兼容的模板语法和语义,这使得 Web 开发人员在使用不同的模板库时难以组合可重用的组件。

虽然之前我们都决定首先关注 Shadow DOM 和自定义元素 API,但我们认为现在是时候了——现在 Shadow DOM 和自定义元素 API 已在 Safari 和 Chrome 中发布,并且正在 Firefox 中开发——提出并标准化一个实例化 HTML 模板的 API。

让框架在速度和开发者便利性方面进行竞争。

管理和保护您的 Apple 设备

🔗 http://synd.co/2lmsHuU
阅读评论

Jamf Now 是一款适用于工作场所 iPad、iPhone 和 Mac 设备的移动设备管理解决方案。

我们使部署 Wi-Fi 密码、设置电子邮件帐户、保护公司数据和执行密码等管理任务变得简单且经济实惠,以便企业能够支持其用户。无需 IT。

CSS-Tricks 阅读者可以永久免费管理其前 3 台设备! 立即注册创建您的免费帐户!

继续阅读 →

来自 Adobe Originals 的可变字体

🔗 https://blog.typekit.com/2017/10/19/new-variable-fonts-from-adobe-originals/
阅读评论

看到可变字体的演示是一回事(哦哦哦,一种字体可以改变重量、宽度和倾斜度?),但当您一直看到和使用的字体变为可变字体时,感觉就真实多了。Adobe 提供了六种可变字体:Source Sans、Source Serif、Source Code、Myriad、Acumin 和 Minion。您还不能通过 TypeKit 直接在 Web 上提供它们,但您可以从 GitHub 下载它们 并开始使用。

印刷设计师也有同样甚至更多的理由感到兴奋,只要您有支持可变字体的软件,您现在就可以使用它们。

WordPress + PWA

🔗 https://www.youtube.com/watch?v=Di7RvMlk9io
阅读评论

Chrome Dev Summit 上的一个主题演讲,由 Das Surma 和 Daniel Walmsley 主持。与其说是关于 WordPress,不如说是关于不是真正“应用”的 CMS 驱动的网站,如果有这种东西的话,以及将该网站转换为渐进式 Web应用网站的可能性。

我发现 CMS + PWA 组合很有趣,因为

  • 如果您对 AMP 不感兴趣,而且让我们面对现实,很多人对 AMP 不感兴趣,但喜欢超快速网站的想法,那么 PWA 可能会引起您的高度兴趣。虽然 AMP 感觉像是您正在制作网站的替代版本,但 PWA 感觉像是您正在使您现有的网站变得更好。
  • 一些 PWA 工作是通用的且比较容易(使用 HTTPS),而一些 PWA 工作是定制的且比较困难(使网站离线工作)。由于缺乏更好的解释方式,CMS 以某种方式“了解自身”,从而可以提供工具来简化 PWA 的开发。例如,Jetpack 正在为您完成此操作。这与我们在响应式图像中看到的情况相同。手动处理并不容易,但 CMS 可以为您完成。

如果这个话题没有引起您的兴趣,这里有一个所有主题演讲的播放列表。Dan Fabulich 观看了全部 10 个小时的视频,并总结如下:

Google 希望您构建 PWA、减小 JavaScript 文件大小、使用 Web Components 并配置自动填充。他们仅宣布了少数与支付、身份验证、Android Trusted Web Activities、Chrome Dev Tools 和 Chrome 用户体验报告相关的功能。

草图界面

🔗 https://airbnb.design/sketching-interfaces/
阅读评论

与参与使用 React 制作 Sketch 文档的令人难以置信的想法的同一个团队提出了一个更疯狂的想法。

草图似乎是开始的自然之地。作为界面设计师,草图是表达概念的一种直观方法。我们想看看跳过产品开发生命周期中的几个步骤并将我们的草图立即转换为成品会是什么样子。

换句话说,相机查看草图,找出正在暗示的设计模式,并在浏览器中呈现它们。

我毫不怀疑设计工具在未来几年会变得如此复杂。我主要认为:如果您的设计团队具有如此前瞻性和实验性,那么您在组建团队方面做得非常出色。希望您可以让他们继续快乐地设计旅游网站,或者以某种方式转向设计工具本身。

一个关于 head 元素的免费指南

🔗 http://gethead.info/
阅读评论

Josh Buchea 汇总了所有可能出于各种原因放入<head>中的内容。

我刚刚了解到的一个有趣的事实是,head 中唯一可接受的元素是<link>、<script>、<meta>、<title>和<noscript>(更新:还有<base>和<template>)。如果您在其中放置任何其他内容,所有浏览器都会突然结束<head>并开始<body>。

此外,head 中内容的激增至少部分是manifest.json成为一项事物的原因。

Houdini 实验

🔗 http://lab.iamvdo.me/houdini/
阅读评论

Vincent De Oliveira 的这些实验正是 Houdini 需要吸引开发人员感兴趣的内容。或者也许我应该说设计师,因为这些演示特别擅长展示允许低级绘制到屏幕上是如何解锁您想要的任何内容的。

沉重的图像导致您的网站速度变慢?

🔗 http://synd.co/2zctDIp
阅读评论

速度是网站用户体验的重要组成部分。由于图像平均占网页重量的 70% 或更多,因此优化它们对于创建更快的网站至关重要。这就是我们创建 Page Weight 的原因,这是一个工具,它将诊断您网站中最有问题图像并提供有关如何优化它们的解决方案。

只需将您的 URL 输入 Page Weight,我们就会为您准备一份关于图像性能的自定义报告,以及您可以采取哪些措施来改进它们。

免费测试您的网站!

继续阅读 →

Hexatope

🔗 http://hexatope.io/
阅读评论

前几天在CodePen Radio上听到 Charlotte Dann 的演讲真是太棒了,她正在Kickstarter上启动一个新的珠宝业务。这个想法是您自己设计珠宝(您绘制的所有东西看起来都很棒,因为它位于这个有趣的六边形网格上),然后它会被真正制作出来。她对这些热情的结合在 CodePen 上焕发生机。

MDN 产品咨询委员会

🔗 https://blog.mozilla.org/blog/2017/10/18/mozilla-brings-microsoft-google-w3c-samsung-together-create-cross-browser-documentation-mdn/
阅读评论

我们都知道并且都喜欢MDN,因为它已经是目前最好的 Web 功能文档。看起来它即将变得更好,因为Google和Microsoft都加入了一个新的委员会。

Mozilla 对 MDN 产品咨询委员会的愿景是建立合作关系,帮助 MDN 社区共同维护 MDN,使其成为最全面、完整和值得信赖的参考,记录现代浏览器和 Web 标准的最重要方面。

有趣的是,他们都没有提到WebPlatform,这是之前一次类似的尝试,但最终失败了。这项努力似乎更有可能取得成功,因为它已经拥有一个成功的基础、实际的工作人员以及 Mozilla 这个仁慈的独裁者。看到浏览器在用户功能方面展开竞争,但在标准和教育方面进行合作,真是太好了。

值得一提的是,我们在 CSS-Tricks 中也涉足了 CSS 功能的“文档”,使用了年鉴,但如果其中任何内容值得作为 MDN 等统一资源使用,请随意使用。更不用说 CodePen 上的所有公开内容都是 MIT,并且有很多 Pens 以极好的方式展示了 Web 功能。例如,这就是我构建这个的原因。

Quick Hits

# 2024 年 8 月 23 日
# 2024 年 8 月 21 日
# 2024 年 8 月 14 日
# 2024 年 8 月 14 日
更多快速提示 →
  • 更新
  • 1
  • ...
  • 96
  • 97
  • 98
  • ...
  • 219
  • 较旧

CSS-Tricks 由 DigitalOcean 提供支持。

随时了解 Web 开发动态

通过我们精心制作的时事通讯

DigitalOcean
  • 关于 DO
  • Cloudways
  • 法律信息
  • 获取免费积分!
CSS-Tricks
  • 为我们撰写文章!
  • 与我们合作广告
  • 联系我们
社交媒体
  • RSS Feed
  • CodePen
  • Mastodon
  • X
返回顶部

© 2024 . All rights reserved.