vs2013开发web_Web设计人员和开发人员的新资源（2013年11月）

多亏了您的支持， 本系列文章已完成了12个月的完整运行。 到目前为止，您已经了解了演练，但是如果您不熟悉本系列， 我们将提供大量资源，可帮助设计师和开发人员完成工作 。 如果您还没有，请在这里查看我们以前的版本。

在2013年11月的这一轮中，我们正在寻找工具，这些工具可让您将图像嵌入CSS代码，实现网站的快捷键，批量命名PSD图层以及让您在多个设备上检查网站。

继续使用工具！

我发现许多设计师残酷地将其Photoshop图层保留得井井有条。 他们没有命名图层并正确分组。 如果您使用Photoshop进行网页设计，则有组织的工作将使开发人员更轻松地将其转换为代码。 PSD Validator使您可以在构造Photoshop文件时验证是否遵循Photoshop礼节 。

我们可以使用background属性在CSS中附加图像，并指定指向该图像的URL。 在某些情况下，最好将图像嵌入CSS中，这可以通过将图像转换为Base64代码来完成。 Daturi可以让您快速地做到这一点。 只需将您的图像拖到网站上，然后单击“ 转换为Base64代码”按钮。

您是否曾经想过向网站添加键盘快捷键或组合键？ 以Facebook为例； 打L是喜欢还是不喜欢？ 搜索， 1进入主页。 如果您想在网站上实现类似的想法，则可以使用Keypress （JavaScript库）来捕获键盘输入。

如今，构建网站可能是一个真正的挑战，因为有太多设备需要满足不同的尺寸和要求。 在尽可能多的设备上对其进行测试是一个真正的痛苦。 Ghostlab是一个Mac应用程序，可用于在多个移动设备，电话或平板电脑上同步测试您的网站。 滚动，单击或重新加载页面时，该页面也将反映在其他连接的设备上。

RulerGuides是一个JavaScript库，用于在网站上构建标尺并向其中添加指南。 它与Photoshop相似，我们可以通过单击标尺并将其拖动到画布上的任意位置来创建参考线。 它还提供了一些用于切换标尺以及保存或清除指南的热键。 查看演示以了解内部外观。

根据Photoshop Etiquette的介绍 ，您必须为PSD中的每个图层命名。 未命名的图层可能会使设计师疯狂。 但是，必须重命名成堆的图层也是一项繁琐的工作。 因此，如果您经常这样做，则可以利用此Photoshop脚本，该脚本允许在组中命名PSD图层。

GenerateWP是用于使用最新标准生成WordPress API的网络工具。 我们可以使用此工具创建17种API，包括分类法，帖子类型，帖子状态，简码和侧边栏。

翻译自: https://www.hongkiat.com/blog/designers-developers-monthly-11-2013/