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

Links

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

占位符文本的替代方案

🔗 https://uxdesign.cc/alternatives-to-placeholder-text-13f430abc56f
阅读评论

Andrew Coyle 关于何时使用<input placeholder>

  • 不要将其用作标签
  • 不要将其用作辅助标签
  • 不要将其用作示例输入
  • 不要将其用作帮助文本

这几乎等同于:“不要使用它们”。请注意,没有好的用例示例,即使“操作”图形中的示例也只说“占位符文本”,这并不是对有用性的确切证明。

我想知道占位符文本是否会完全不受欢迎。

它让我想起了浮动标签。浮动标签是一个有趣的小把戏,但实际上并没有用。您使用它们的原因是当您的空间非常有限,无法在输入框旁边显示常规标签时。但是您实际上永远无法删除标签,只能移动它。因此,如果标签仍然存在并且可读,为什么不一直保留在那里呢?

通过配置推动开发者体验

🔗 http://kevinsuttle.com/posts/propelling-dx-through-config
阅读评论

Kevin Suttle 关于项目中不断增长的 .dotfiles 数量

每个仓库的配置文件数量正在缓慢但肯定地超过代码文件数量。

在我看来,/config/ 或 /.config/ 作为保存它们的目录也过于冗余,无法成为真正的解决方案。我同意:“在某个时刻,总得做出一些让步。”

为什么内联 SVG 是最佳 SVG

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

📹 由 Glen Maddern 制作

我认为大多数前端开发人员对 SVG 的熟悉程度不如他们应该的那样。它是网络上最强大的技术之一。

他为内联 SVG 进行了非常有力的论证,我完全同意。视频中的此屏幕很好地说明了这一点

在提升您的 SVG 知识方面,您可以做得更糟,而不是购买一本《实用 SVG》。

客户电子邮件助手

🔗 http://jessicahische.is/helpingyouanswer
阅读评论

对于所有自由职业者来说,Jessica Hische 编写了一些文案来帮助您阐明如何对您应该拒绝的事情说“不”。

我创建了这个方便的工具来帮助您拒绝免费和低预算的工作,并在项目开始之前要求更优惠的合同条款。

优先使用 `defer` 而不是 `async`

🔗 http://calendar.perfplanet.com/2016/prefer-defer-over-async/
阅读评论

Steve Souders

比较 ASYNC 和 DEFER 的瀑布图,我们可以看到,使用 DEFER 可以更快地触发 DOM Interactive 并允许渲染更快地进行。

即使<script async></script>在实际应用中更常见,defer通常也更可取,因为它们永远不会阻塞其他同步脚本,并且可以按可预测的源顺序加载。

【WebKit 现在拥有】HTML 交互式表单验证

🔗 https://webkit.ac.cn/blog/7099/html-interactive-form-validation/
阅读评论

Chris Dumez

WebKit 不支持 HTML 交互式表单验证,该验证在表单提交时发生(除非在<form>元素上设置了novalidate属性)或使用reportValidity() API。我们很高兴地宣布,此功能现在已在 WebKit 中实现并在 Safari Technology Preview 19 中启用。在交互式表单验证时,WebKit 现在将检查表单中所有表单控件的有效性

Safari 中的表单验证一直很糟糕。它甚至没有阻止提交包含无效数据的表单。为此得到改进而欢呼!它现在将阻止表单提交并显示视觉错误

我最近才听说过reportValidity()。它就像checkValidity(),除了返回有关有效性的true或false之外,它还会触发 UI

如果至少有一个表单控件违反了约束,WebKit 将聚焦第一个控件,将其滚动到视图中,并在其附近显示一个气泡,其中包含解释问题的信息。

查看 Chris Coyier 在 CodePen 上的 Pen checkValidity 与 reportValidity (@chriscoyier)。

在创建该演示以进行测试后,我看到 Chris Dumez 已经创建了自己的演示。

我想这最终会渗透到 iOS 中?不确定它是如何工作的。

弹性 Web 设计

🔗 https://resilientwebdesign.com/introduction/
阅读评论

Jeremy Keith 发布了一本新书,免费,仅在网络上发布

这不是一本手册。更像是一本历史书。

CSS 简写语法被认为是一种反模式

🔗 http://csswizardry.com/2016/12/css-shorthand-syntax-considered-an-anti-pattern/
阅读评论

我记得 Estelle Weyl 过去在她的演讲中经常提到这一点。如果您设置.button { background: red; },您会无意中或有意地将大量其他属性设置为其初始值。Harry Roberts 清楚地演示了这一点,并进一步表示这是一种不好的做法。

我不会避免它,但我每次要使用简写时都会积极思考。我想“我这样做不是为了偷懒,而是因为我确实想设置所有这些值。” 此外,代码库越大、越不熟悉,我使用简写的可能性就越小。

为您的未来自我提供帮助

🔗 https://24ways.org/2016/a-favor-for-your-future-self/
阅读评论

Alicia Sedlock,关于删除网站的大部分内容

……这是最终的“我真的希望这不会破坏其他东西”的情况。这是一个压力很大且乏味的过程,需要反复检查我们删除的内容是否在其他地方存在依赖关系。老实说,如果没有我们的测试套件,我们将无法以任何程度的成功或信心做到这一点。

测试不仅在您更改代码或编写新代码时对您有所帮助,而且在您删除代码时也有所帮助。在我看来,测试已经成为行业思维定势中至关重要的一部分。随着今年的结束,我想全球范围内的管理者都在考虑员工在绩效评估中编写测试的能力。

这也让我想起了我们无休止地追求定义“前端开发”的目标,这是一份工作描述,其技能要求每天都在变得越来越广泛。测试是一套独特的技能,有自己的学习曲线。但是,如果 JavaScript 完全属于前端领域,那么测试 JavaScript 也应该属于前端领域吗?

这也是您每年的提醒,即24 ways已经启动。

Firebug 停止维护

🔗 https://getfirebug.com/
阅读评论

Firebug 扩展程序不再开发或维护。我们建议您改用 Firefox 内置的 DevTools。

看起来这是超过 2 年的过程的结束。

Firebug 可能是前端开发短暂生命周期中最重要的工具改进之一。未来的景象,确实如此。

Quick Hits

# 2024 年 8 月 23 日
# 2024 年 8 月 21 日
# 2024 年 8 月 14 日
# 2024 年 8 月 14 日
更多快速提示 →
  • 更新
  • 1
  • ...
  • 115
  • 116
  • 117
  • ...
  • 219
  • 较旧

CSS-Tricks 由 DigitalOcean 提供支持。

随时了解 Web 开发动态

使用我们精心制作的时事通讯

DigitalOcean
  • 关于 DO
  • Cloudways
  • 法律事项
  • 获得免费积分!
CSS-Tricks
  • 为我们写文章!
  • 与我们一起做广告
  • 联系我们
社交
  • RSS 订阅
  • CodePen
  • Mastodon
  • X
返回顶部

© 2024 . All rights reserved.