网页设计用什么语言编写-网页设计的语言，APP可能看不懂

交互设计师已经成为随时脱口而出互联网思维的现代社会的热门职业。 随着5G技术的普及，互动水将成为发展迭代最快的方向，也将成为很多艺术设计专业学生的憧憬。 专业之一。

申请交互设计专业组合应该怎么做？ 康石石身边的同学，一提到交互设计，几乎都把交互设计和APP设计等同起来。 终端的应用场景还是非常广泛的，不容忽视。

因此，在创作交互设计作品集之前，我们首先要明确APP和WEB的区别。

从上图可以看出表情包设计，就计算机语言而言，WEB语言和APP语言是完全不同的。 虽然界面表现可以重叠，但开发方式却有很大不同，就像英语和德语的区别一样。 从功能上来说，WEB以显示功能为主，APP以应用功能为主。 在刷新速度表现方面，我们也可以看到，网页的加载很大程度上取决于网络速度，但APP有缓存和离线功能。 更新方式和测试平台也存在较大差异。

接下来，康石石将帮助同学们梳理网页制作的具体流程步骤，以便他们尽快检查和弥补作品集的空白。

01

网页制作与实施流程Workflow

一套完整的网页制作流程是从WEB Browser开始，中间是WEB构建格式—WEB UI—WEB UX—WEB IDE—WEB Framework—WEB Automation，最后以WEB结束发布 . 我们把每个链接拿出来单独解释一下网页设计用什么语言编写，详细了解一下，明确每个链接的操作和目的，然后才能有条理地进行创建。

每天浏览网页时，不同的浏览器会带来不同的布局差异。 如果学生想要真正制作网页并在网站上使用，则需要考虑每个网页的浏览效果。 市场上最常见的浏览器软件包括：Microsoft Internet Explorer、Google 的 Chrome、Mozilla Firefox、Apple 的 Safari 和 Opera。 浏览器可用性取决于计算机使用的操作系统（例如：Microsoft Windows、Linux、Ubuntu、Mac OS 等）。

图片来源：

网页实现的显示形式有很多种。 第一个是定制网站，它可以定制一切，从布局、效果到用户读取数据的方式。 这才是真正意义上的从0到1。 第二种是网站建设者，以 Squarespace 和 Wix 为代表的模板网站。 模板网站有自己的布局和效果。 我们只需要在里面嵌套文本即可。 第三种是CMS，论坛模板网站，以WordPress为代表的网站模板。

这三种方法基本涵盖了我们在实现过程中会考虑的输出方式。

即网页中的视觉可视化。 在设计初期就需要设定布局、配色、图标、图形比例等。 UI的制作通常在Photoshop中进行，因此学生需要掌握如何在PS中剪出网页适用性图片。 同时我还给学生推荐一款插件Cutterman，它可以替代传统的切割模式，提高相关工作的效率。

图片来源：

即，一个可以清晰排列网页逻辑的线框原型工具。 原型制作工具包括Adobe XD、Sketch、Axure RP、Principle等。

其中Adobe XD是一款免费软件，MAC和Windows通用，使用门槛较低。 它还支持多种免费插件，可以通过比较基本的方式达到使用组合的效果。 Sketch是MAC端的付费软件。 虽然有破解版，但功能略有不同。 老软件支持多种插件。 Axure是一款Windows的付费软件，很多Windows设计师经常使用它。 Primaryple是专门为原型动态演示视频而设计的网页设计用什么语言编写，经常与Sketch配合使用，可以起到很好的动态演示效果。

即网络软件开发工具。 当我们的网页有了视觉效果和逻辑框架后，我们就需要把UI和UX放入IDE中进行开发，并真正编写成可用的网页。

常见的IDE工具有Dreamweaver，它是一款设计和编程的集成软件。 可以可视化代码编写过程，让网页开发更加可视化。 设计师更多地使用它。 另外，Brackets也是一款比较轻量级的前端编辑器，适合新手。 这两种模式比较适合学生→制作作品集。

也就是网页的前端开发框架，比较常用的是Bootstrap，这也是外教经常推荐的框架，帮助前端工具轻松处理一些繁琐的预设比如自适应等。

来源：引导程序

也就是网页优化工具，学生很少用。 毕竟，这关系到专业发展领域。 从字数，从跳转功能，到代码规则的优化，减少一个网页加载节需要下载的字数。 这一步，学生只需要有一个宏观的认知即可。

资料来源：NordiAPls

即网页发布时需要添加的架构逻辑。 一个网页必须有一个索引主页，即主页，可以以你的名字命名。 除了主页之外卡通形象，还有其他带有链接的附属页面，每个人都需要有一个命名约定。

来源：科普媒体

发布网站时，如果不是用模板网站搭建的，我们需要自己找服务器，比如Namecheap、Bluehost、Dreamhost都是不错的服务商。 目前大多数学生都会选择使用模板网站服务商，毕竟操作更直观，价格也实惠。

资料来源：教会杂志

02

案例分析

上一节简单介绍了网页设计的具体流程。 接下来，我们以康石石老板的优秀学生——韩艺国际的案例来看看网页设计的完整实现：

中国艺术学院第十八届学生L作品藏品展示（部分）

获得埃因霍温交互设计硕士offer

从L同学的作品展示中可以看出，她首先拥有清晰直观的网页设计逻辑，同时UI也根据网页制作的要求进行了裁剪。 那么后续的实现操作就会变得直观。

部分切除

网址结构

L同学的作品展示，高保真效果

L同学的作品展示，网页Demo效果

最后对比两张图可以发现，高保真的效果和网页demo差不多，这得益于设计前期清晰明了的UI和UX结构。

因此，上面列出的8个环节虽然看似复杂繁琐，但每一个环节都是息息相关的，缺少一个环节就会极大地影响最终的实现。 学生想要实现项目的实施，需要梳理网页设计的工作流程，清晰地把控细节。 如果遇到困难，不要跳过，要多尝试，多练习。

全程跟踪和高质量的视觉呈现，会让网页设计成为你作品集中的高水平项目，向大学考官展示你从设计到实现的实践能力，让考官看到你的作品集值得“投资”的潜力提高申请成功率，如果同学们对于艺术留学或者互动作品集创作有任何疑问，请通过以下方式联系康石石：

长按下方二维码