近期,网页上的的许多流程都需要用户完全同意才可以完成。例如，用户可能需要删除帐户，更改他们的用户名，或确认货币交易。这种情况下，常用的用户体验(UX,User experience design)是显示一个具有两个按钮的对话框。一个是取消，一个是继续。这么多年，我们一直依靠JavaScript库实现此效果，但在本教程中，我们要用<dialog>元素实现此效果。

我们来讨论一下如何给我们设计的作品添加动画，使其和我们品牌标志的某些层面的内容，如字体、颜色、布局以及其它各种东西保持一致。动画是非常有趣的。给我们的设计添加动画可以使其变得有生命，同时也让我们的设计脱颖而出。动画可以是展示设计是如何组合的一起的。它们可以提供上下文帮助大家理解我们的产品。动画往往是我们放在最后的策略。我们在一个模态窗口或滑动菜单上放一个过渡，但是我们通常都不会考虑这个动画是否符合我们整体的设计。

虽然拥有特定的HTML视频元素的想法是在十多年前被提出的，但是我们才刚刚开始看到它取得的成果!忘记"HTML5 2012"那所有的繁文缛节;事实是，现在你可以在你的项目中使用视频元素!你只需要在盲目冒险前注意一些细节。

2015年已悄然离去，已成为昨天。回忆昨天，我有过2012年的《我和W3cplus的故事》,悄悄《走过的2013年》,随着《辞旧迎新，更上一层》,迎来了2015，可是时间的流逝，不知道不觉得就踏入了2016年。也走过了码农传说中的宿命节点35岁。这也是我为何将这篇总结命题为码农的自留地，希望自己能一直拥有这块自留地，一直耕耘下去。

当谈及到<meta>标签对搜索引擎排名的影响，很多人都存在误解。在过去，许多已经失去作用的标签仍然被频繁使用。所以哪些标签对搜索引擎优化(SEO)有作用，哪些没有呢?

为元素的一个角落添加样式，让它看起来像是折起来的（通常是右上角或是左下角），有不同程度的逼真效果，是这几年来一个非常受欢迎的效果。近来，有几个纯CSS的解决方案，第一个是在2010年的时候由伪元素大师——Nicolas Gallagher发布的。它们通常是通过添加两个三角形在左上角：一个用于翻页，一个用于模糊主元素的角。这些三角形通常是通过旧的border技巧来创建的。

半透明颜色的一种应用是，使用它们作为背景。在照片或者颜色比较复杂的背景下，通过降低对比度，提高文本的可读性。结果非常有效，但是阅读起来仍然不是那么好，特别是非常低透明度的颜色或非常杂乱的背景的情况下。

为灰度图像添加色调（或已经转换为灰度的图像）是让一组风格非常不同的图像得到视觉上的和谐的一种流行而且优雅的方式。通常情况下，这样的效果是通过:hover或其它的交互来静态地添加和删除的。过去，我们使用一个图像编辑程序来创建两个版本的图像，然后写一些简单的CSS代码来完成它们之间的切换。这种方法是可行的，但是它添加了额外的HTTP请求，而且维护非常麻烦。想象一下如果要改变颜色效果：你需要准备好所有的图像，还要创建新的黑白版本！

当我们想要为矩形或任何可以用border-radius创建的形状应用投影的时候，box-shadow是非常棒的。但是，当我们有伪元素或其他半透明的样式的时候，它可能就不是那么好用了，因为box-shadow会耍赖忽略透明度。那是否有适用这种情况的解决方案呢，还是说这里我们只能完全give up阴影效果了？

在Q&A网站上，我看到的关于box-shadow被问得最多的问题是，阴影如何只应用于物体的单侧（或双侧，问得比较少）。在stackoverflow.com上快速搜索，也能找到将近一千个结果。这是可以理解的，因为单侧阴影能呈现出一个比较细微的、但同样效果逼真的阴影效果。通常情况下，纠结于阴影效果的开发人员甚至会给CSS工作小组发邮件，请求希望能够有新的像box-shadow-bottom这样的属性，来方便他们的开发。但是，这样的效果完全可以通过巧妙地使用我们已经学习并深深喜爱着的box-shadow属性来完成。