8 个供设计师学习 HTML、CSS 和 JS 的免费资源
8 个供设计师学习 HTML、CSS 和 JS 的免费资源
架构师会理解混凝土的属性，那么设计师为什么不理解代码的属性。
-Aaron Walter，InVision 设计教育副总裁
我在网上冲浪时发现了这句话，并认为它非常适合这个博客。
了解一点 HTML 和 CSS 肯定会让开发人员轻松地传达您的设计（因为当您说他们的语言时，开发人员会更好地理解），您也可以更好地了解网站的功能。
在销售产品时，我们欣赏并有时从中汲取灵感的许多设计都不是很有效。这些设计展示了 Web 的创造力和功能，但这些页面加载所需的时间是一个问题。
由于注意力持续时间短，我们的设计应该会产生影响。使其尽可能简单，仅在对增强体验至关重要或使用户更快地理解或使网站更易于使用时才添加一些额外的内容。
在浏览网站时奖励品牌—— 看板 ，看看一些设计师欣赏的网站，页面加载时间超过 3 秒。对于浏览您的类别中的多个产品并做出快速决策的用户来说，这可能不是很令人印象深刻。
在这个博客中，我将分享一些帮助我学习 HTML、CSS 和 JS 的资源，这将帮助您创建设计时牢记构成产品的成分 -
我开始使用的免费资源列表：
斯克林巴 **
**Scrimba 是一个面向刚入门的开发人员的网站，提供大量免费和付费课程。这个网站非常独特，因为课程是由导师在代码编辑器上教授的。此代码编辑器可让您暂停视频并对导师输入的任何代码进行编辑并实时进行实验。
完成后，您可以继续观看导师继续教授您的更改的视频。该课程最后有一个项目，它很好地解释了这些概念，你应该能够轻松地完成你的最终项目。
交互式界面使本课程变得有趣，导师教授它，从基础解释概念。查看免费的 html 和 css 课程 这里 .
码学院 **
**Codecademy 有大量的免费和付费课程。学习 HTML、CSS 和 JS 的免费课程足以让您了解所需的一切。
该网站以文本形式教授课程，其中解释了一个概念，并为您提供了一个应用您所学知识的问题。您可以实时检查答案是否正确。您可以查看所有 html 和 css 课程 这里 和js课程 这里 .
自由代码营 **
**Freecodecamp 是自学开发社区中最受欢迎的网站，当我对代码产生兴趣时，这是我被派往的第一个网站。该网站的功能很像 Codecademy，在解释一个概念后会给出一个简单的问题，但这里的证书是免费的，无需共享您的卡详细信息即可访问网站中的所有内容。你可以学习他们的 HTML、CSS 课程，这些课程解释得很好，可以开始使用。
**YouTube 频道
** 有很多渠道可以解释 HTML、CSS 和其他编程的基本概念。但我想分享两个对我有帮助并且个人喜欢的渠道：
TraversyMedia
这个频道谈论前端的一切并且解释得很好，他视频上的评论自豪地展示了他的订阅者和观众的忠诚度。
凯文鲍威尔
这个频道主要是关于 CSS 的。有很多视频解释了 CSS 中的不同概念，也有很多视频，他制作了真正的交互式界面，我们作为设计师可以将其作为我们自己设计的灵感。
弹性盒青蛙 **
**Figma 中自动布局的概念（据我所知）来自 flexbox，一个 CSS 布局模块。如果你想看到自动布局的实际效果，你需要学习 flexbox。该网站通过有趣的游戏教授整个概念。
他会吃 **
**Javascript是一种在前端使用很多的编程语言。在我学习 javascript 的最初几天，如果有一个网站让我的 javascript 基础知识变得强大，那就是这个网站。您可以选择难度级别，如果您遇到困难，它将共享参考资料，您可以在其中阅读有关概念并进行另一次尝试。如果你被卡住了，你也可以检查答案。
密码笔 **
**这个页面充满了灵感，它是前端开发人员的运球。这个网站就像一个沙盒，您可以在其中尝试不同的想法并练习，而无需安装代码编辑器，您的代码可以实时反映。
您也可以为您的下一个设计找到灵感， 签出这支随机笔 看看你能期待什么。
希望这些资源能像对我一样帮助您，开始您学习宝贵技能的旅程。
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明
