这篇文章试图给你，读者，一个帮助，如何教新雇员，同事，或你的侄子和阿姨使用最佳学习和格式塔原则的Web设计的基础知识。教网页设计(或任何东西)可以根据…来检验形态论．教你的新手如何设计和编写网站(或者扔足球或烤大比目鱼，就此而言)时，需要理解的一个最大的概念是:
- 在处理细节问题之前，先展示大局
- 将新的知识与以前的知识，或学习者已经知道的概念和想法联系起来
归根结底就是“学习大脑如何学习”。回想一下你不幸经历过的最无聊的高中课堂。很有可能是你无聊得心烦意乱——也就是说，你在找别的事分散注意力——你可能会觉得这是你的错。
“如果你能更好地倾听”，或者“你必须一直集中注意力，而不是只在某些时候”，诸如此类。好吧,你猜怎么着?这不是你的错。
至少不完全是这样。如果你坐在教室里制定策略士官长怎样才能打败塔耳塔洛斯或者在想今晚这集会发生什么绯闻女孩，部分原因是你的注意力没有集中起来。你的大脑没有被激活去学习老师想要教的任何科目。
这并不是说你把鞭炮塞进吉米·马奥尼(Jimmy Mahoney)的短裤里是老师的错，而是说许多老师，虽然在专业领域有深厚的基础，有着最好的意图，却没有把他们的课程教好。大多数人不会循序渐进地学习，但这就是我们大多数人被教育的方式，无论是网页设计、布匿战争还是长期除法。在谷歌上快速搜索“网页设计教程”，你很有可能会找到一些试图慢慢地、循序渐进地教授这门学科的结果，首先关注最无聊的部分。
这就是格式塔原则发挥作用的地方。归根结底，网页设计的格式塔观是最基本的(也许也是最简单的)，它建议你把整个设计问题看作一个大的(当然是复杂的)整体，在深入到细节之前，向学习者介绍网页设计的观点。你应该从那里开始，鸟瞰。
许多教授网页设计新手的人只会告诉新手去这个或那个教程网站开始学习。有时我们只是告诉他们谷歌它这样就不用去训练那些想知道CSS是不是通过亲吻女孩传染的人了。这总是一个错误。
首先，你把新手学习的全部责任都推给了新手。这是一个错误。这是一部1941年雪佛兰公司的销售培训影片这很好地说明了这一点。
即使你不需要强化，它也值得一看。你的学生依赖于你的经验和知识，但更重要的是，他相信你能让他以正确的方式开始。农夫约翰没有给吉米一份拖拉机手册，然后让他去南40个州犁地。
“千万别把我种的大豆翻了，那样我的农场就破产了!”“没问题，约翰先生!”你不应该和你的新男友犯同样的错误。你是你公司(或你的家庭、教堂或你的社区)的专家，你应该是给出最初指导的人。
他们信任你，如果他们不信任你，在你引导他们正确开始之后，他们就会信任你了。您不需要在开始时解释文档类型，或者更糟的是，邀请您认识万维网的发明者Tim Berners-Lee博士。
他们需要掌握什么是网页的总体概念，以及各种元素如何协同工作。这不仅能帮助你的新手正确上手，还能让你的工作更加有趣的对他们来说。和有趣的在学习过程中比你想象的更重要。
的作者参与经济请注意，工作中的乐趣可以创造成就感，增加与同事(希望包括你)的社交，并沉浸于手头的主题和公司。想让你的新员工为你的公司承诺至少5年?花五个小时帮助他们走上正确的学习道路。
这是一个值得的权衡。
动觉学习在网页设计教育中的价值
在我们看完形的原则如何适用于网页设计教学之前，让我们看一下三种被广泛接受的学习模式。每个人都主要通过其中一种模式学习，无论是我、你、你的新员工还是一只熊猫。
- 视觉:主要通过视觉呈现的信息学习——书籍、静态网站、ppt演示等。
- 听觉:主要通过声音-音频演示、小组讨论、讲座等方式学习。
- 运动:通过操作来学习——操纵对象来掌握概念。
大多数人在两种甚至三种模式的组合中学习，但他们主要依赖于一种模式。这里有一个大多数老师不会告诉你的秘密，甚至在你问他们的时候，他们也不会承认自己知道:几乎每个老师都被灌输过必须在课堂上采用所有三种学习模式的思想。他们都同意。
但他们中的许多人，尤其是高年级的学生，仍然主要教视觉学习者。为什么?因为许多老师本身就是视觉学习者，而我们往往在学习时采用同样的教学方式。
你不会犯那样的错误。网页设计是最好的教育kinesthetically-动手去写代码。网页设计适合动觉学习:编写一些代码，在浏览器中尝试，做出更改，在浏览器中尝试，以此类推。
这是一种动手学习，几乎可以即时强化。那么什么是动觉学习呢?让我用一个故事来解释。
十年级时，我参加了木工作坊班。和大多数极客一样，我以为这门课会很简单。第一天，老师站在我们所有人的面前，紧张地站在桌子中间，桌子上放着奇怪而吓人的电动工具(我们的课桌在哪里?)，她说:“你们会收到课本，但不会使用它们。
我会告诉你如何使用这里的工具，你可以做一些东西带回家给乡亲们。”他朝我们摇了摇手指——他还剩下八个又一半，我猜这是工作的危险——说:“我没有学习正确的方法。你会的，你的手指会完好无损地从这里走出去。”到学期结束的时候，我已经做了一个丑陋但实用的香料架(几乎所有人都做枪架，但我不知道我妈妈会怎么做)。伙计们，这就是动觉学习。
我进来的时候连钻床上的带锯都不知道，走出来的时候却带着一个香料架，对木工有了新的尊重。我通过制作香料架学会了如何制作香料架。如果老师教得不好，我可能会失去一根手指，当然也会离开他的课堂，而不知道我需要用原材料制作这个东西。
你的学生不会在学习编码的过程中失去一根手指，除非你是一个非常糟糕(或残忍)的老师，但他们很可能会因为厌恶网页设计而离开这个过程，很可能是厌恶你和公司。网页设计最好是亲自学习。关掉幻灯片，合上书，让新手边做边学。
他编写HTML/CSS。你引导，你示范。把他不知道的东西联系起来。
用他所知道的东西(例如美学和设计原则)。好了，既然我们已经确定了通过动觉学习Web设计是最好的学习方法，那么我们如何将格式塔应用到这门学科的教学中呢?
让我们假设你的公司刚刚雇佣了一个初级网页设计师。他在设计方面已经有了很强的基础，但是他的HTML/CSS知识有点欠缺。你已经对新员工进行了培训，你的目标是让他快速掌握HTML/CSS。
顺便说一下，在继续阅读之前，最好先熟悉完形论，因为我假设你已经知道它了。这里有几篇文章可以阅读:
- 格式塔原则在设计中的应用:我对格式主义是什么以及它如何应用于设计的一般指导。
- 用权力结构和格式塔实现视觉层次:本指南特别讨论格式主义，因为它与网页布局中的逻辑层次有关。
完形原则:距离
的概念接近与分组有关——将相似的对象放在一起，以鼓励网站用户将这些对象视为一个相关的组，而不是一堆不相干的小玩意。以这个为例下拉导航菜单：
来源:Servage杂志这个菜单对我们的学生来说并不太难，他会很快理解，在美学和设计的层面上，如何颜色(主菜单项用较暗的颜色，活动菜单项用较浅的颜色)和相同的颜色排版(下拉框较小)将菜单对象在查看者的脑海中组合在一起。他们将理解美学和接近性原则，这反过来又给了他们一些基础去学习他们不知道的东西:如何为浏览器创建导航菜单。
完形原则:相似
这一原则与分组密切相关;它与把相似的物体放在一起有关。任何一个五岁的孩子都会玩“这两个哪个不一样?”这句话很好地阐述了这一原则，但不管它有多明显，学习分组的新手有时会在掌握如何进行分组时遇到困难。与其他原则一样，插图通常是有顺序的。
这是音乐家和平面设计师如何Jakub施泰纳在他的网站上，有三组元素:
六个视觉上相似的“像素”图标被紧密地组合在一起，所有链接到外部网站。接下来，在一个单独的方框中有一个独立的报价。最后，一组斯坦纳的Flickr照片完成了选择，所有照片都包含在相同大小的缩略图中。
学生将立即理解分组背后的原则，这使他们更容易通过“如何”通过代码创建它来弥合差距。
完形原则:图形-背景
“图形-背景”原则与物体如何在背景中显示有关。你的初级网页设计师可能对在Photoshop中分层对象有很好的把握，但通过为浏览器编写代码来实现它是完全不同的事情。我们知道他们必须学习定位和浮动的概念，还有其他一些东西。
他们还需要了解嵌套元素的堆叠顺序和样式规则的继承。你可以考虑给你的新手看一个网站，它在“分层”对象方面做得非常好，比如我的朋友，一个有才华的网页设计师，以斯帖Maleika Attawel：
新手的座位工作:数一下Maleika在她的设计中使用了多少图像，并弄清楚她是如何将这些图像放置在彼此的顶部和旁边。高级课程:让新手(甚至是你，Maleika非常熟练)弄清楚她是如何在一个100%流动的布局中保存这个设计的。
完形原则:对称
另一个对几乎所有人都很明显的概念是，但在编写网页布局时并不总是容易实现对称。我怀疑你是否需要和你的新手一起经历这些，特别是如果他已经掌握了基本的平面设计概念。相反，您可能想使用以一些基于网格的设计为例．
在这篇文章中，Shannon Noack提供了许多基于网格的设计，因此非常对称。文章中最引人注目的例子之一是数字艺术家安东·派克(Anton Peck)网站的截图:
你的学生可能会毫不费力地看到派克设计中的各种元素是如何垂直和水平对称的;将它们定位在不同的布局部分是有点棘手的，但理解基本概念将使新手程序员朝着这个目标前进。
结论
当然，本文中的概念并不适用于阅读本文的每个人。你们中的一些人永远都不需要教任何人编写网页代码，要么因为你从来没有被要求这样做(也许你是一个独立的自由职业者)，要么你只是不愿意参与这样的工作。但是许多网页设计师，尤其是那些在公司工作的人，最终会发现自己不得不指导新员工。
下次当你发现自己不得不向新雇员、Elroy叔叔或教堂里的女士教授代码时，试着记住动觉学习和手势学的概念。我期待你在评论中提出想法、问题和建议。
