学习UI设计和网页设计以及web前端分别有什么样好的网站推荐？

web前段、UI设计、网页设计几乎是三个不同的职业岗位，你所有都学没有侧重点的话学不精哦。我是做网页设计的，上面所述的UI设计、web前段这一块都会有所涉及，但侧重点主要是网页设计这个方向。

我是从做传统的平面设计转向网页设计的，工作中也涉及到手机网站的UI界面设计，也因此习得了些Web前段的知识，做了一个自己的博客网站：「平面设计学习日记网」里面有分享一系列整套的平面设计、网页设计教程，教程更多的是侧重设计方面，也有几门教程涉及到Web前段的基础知识。如下图：

1.透过DW软件，入门学习Web前段基础知识

其中的Dreamweaver CC零基础入门教程，里面涉及到了部分Web前段的HTML、CSS3以及JS、JQuery知识等，当然如果是要作为一个web前段工程师来学习，肯定是远远不够的，但作为一个侧重设计的网页设计师来学习也足够了。

2.专业的网页设计教程

另外里面推荐的网页设计高级教程（上篇），则是正儿八经的网页设计教程了，专业性极强且系统全面，是由腾讯高级设计师Gordan录制在此Repost课程大纲如下：（注：腾讯的设计师按经验实力分为初级、中级、高级、专家级）。上篇课程总共分为九章 ：

第一章 网页设计概述

对网页设计的分类、应用范畴进行详细分析。

第二章网页设计组成元素

包括色彩、排版、人像、静物处理以及交互处理等。

第三章色彩搭配及配色误区

不同行业、不同类型的网页，在色彩基调选择上的规律。

确定主色调之后，我们通过何种方式来进行色彩搭配，不同的颜色会给人怎样的视觉效果等。

第四章 网页设计构图及形式感的打造

内容包括：设计构图的方式有哪些？形式感如何打造？以及构图形式的适用范围等。

第五章 网页中的文字处理

文字部分在网页设计中占有举足轻重的地位，它是网页信息传达的主要载体。

我们通过分析文字的排版、图文混排的方式，以及标题文字排版三个方面来讲解。

第六章 交互处理

随着网络和新技术的发展，各种新产品和交互方式越来越多，人们也越来越重视对交互的体验。

那么本章节我们就针对网页设计中常用的交互方式进行分析，同时还讲解到了“分割法”以及响应式页面的概念。

第七章 图像处理

通过一个地产页面向大家演示和讲解了网页图象，如何调整色相、饱和度和明度，从而塑造画面的景深关系、透视关系以及画面的层次感。

第八章 人像处理

我们通过细部刻画人物的光影关系，来塑造人物的立体感。根据需求，打造场景氛围。

第九章 逆光效果制作

在素材不完美的情况下，如何通过逆光效果，来突出氛围？逆光效果具有哪些特征？场景又该怎样塑造？这些，我们都会在课程中一一为大家解答。

以上就是网页设计高级教程（上篇）的全部内容，课程通过理论结合实践的方式进行讲解，相信学完之后，大家会对网页设计有更深刻的认识，也能做出更加优秀的作品。更多详细内容，大家可以去正式课程参加学习。除此之外，其网页设计高级教程（下篇）则有更加丰富的是实例教程可供学习。

3.UI设计类的两套教程推荐

这两套教程UI设计教程主要是讲授UI图标设计，适合中高级提高的设计师学习，不足以喂饱一个0基础一心想要从事UI设计行业的小伙伴学习。

里面的这套UI主题图标设计案例教程，讲解了用PS绘制不同风格图标，由UI设计师韩锐主讲。

比较推荐的是这套精品ui图标制作教程，由站酷推荐设计师李世钦主讲，课程案例图标非常精美，里面学到的绘制技法可以沿用到你的其他设计作品当中，感兴趣的可以学习一下。

上面推荐的教程集中在勤学网（http://u.qinxue.com/z17921/774），其主要侧重于设计类教程，提供全面的网页设计教程知识，以及部分的web前段知识，UI图标设计知识等穿插其中，如果要学习里面的课程，可以去注册会员。