当前位置:首页 > 发现 > 其他 > 网页怎么开发?

网页怎么开发?

2年前 (2023-08-08)其他631

一、你必需了解的网页开发流程。

在学习网页开发前,你首先得了解网站的制作流程。有了全局的概览后,才能有计划地合理安排时间,来学习网页开发的相关知识。

1.1、网站的制作流程

△引用于:《自学网页设计,需要了解的网站开发流程》@酷coo豆

通常情况下,任何一网站的建立,都会经过“分析策划—交互设计—视觉设计—前端制作—后端制作—测试上线”6个环节。

整个流程下来,也就是网页开发的全过程。当然,这个流程也就是大型互联网公司产品开发的传统流程,涉及到的人员一般有:产品经理、网页设计师、Web前端工程师、后端工程师等多个角色。

和小伙伴们开发的企业网站

在实际的工作岗位中,一般由“网页设计师”负责「视觉设计」板块,即我们平常所说的「网页设计」。而「前端制作」环节则主要有“前端工程师”来负责,即用代码来重构还原设计师的视觉稿,这一环节也就是我们平常所说的「网页制作」。

△图: 开发的个人网站

而我们在开发个人网站或个人博客时,由于网站项目本身的功能简易性,没有太多的数据需要处理,有时只需一个人就足够了。比如,我在开发平面设计学习日记网时,就是一人饰演了多个角色,完成了全站的搭建。

网站开发流程:https://zhuanlan.zhihu.com/p/25097044

背后的故事:https://zhuanlan.zhihu.com/p/26548359

1.2、网页设计,是以视觉设计为主的工作。

学习网页设计的核心任务是学习“视觉设计”相关的知识点。用什么样的排版,或者富有创意的表现形式,才能如何更加高效的传达版面信息?如何规划页面路径?用什么样的颜色,以及多大的字号?这是新手学习网页设计应该画下的重点。

一个网页被设计出来,是给人用,给人看的。 要好看(简洁)、要好用(高效)这才是一个设计师需要反复考虑的。视觉+交互,是网页设计师的核心竞争力。

其中“视觉设计”的依据,源于前面的策划和交互设计。最后出具的“视觉设计稿”得符合品牌定位,满足生产运营、以及用户需求,这是网页设计师必修的基本功!

1.3、网页制作,是以前端代码为主。

网页制作在协作流程上,紧跟设计之后。这部分工作通常是由WEB前端工程师来完成的,工程师通常会运用到HTML、CSS、以及JavaScript、jQuery等网页前端代码,来还原网页设计师的“视觉设计稿”,以及交互动画等。

“前端工程师”除了要配合网页设计师外,还要配合做后端工程师,做好网页端的数据收集处理等工作。如果你要励志成为一个优秀的网页设计师,请牢记自己的岗位职责和学习重点,在没有认清“视觉设计”前,要当心自己是不是越位到Web前端开发这个坑里去了。

再比如优化网站所需的SEO、Ajax等技术,虽无需你动手实践,但能做到了解一二,也是不错的加分项。在设计的时候,也可充分利用这些规则和技术来规划你的版面,使其更加的专业友好。

二、从这里开始,系统学习网页设计。

学习路线参考:http://www.xxriji.cn/career/7.html

(1).【基础】首先要精通设计软件,把photoshop玩转,这是网页设计的主力工具!

(2).【基础】深入学习排版设计,以及三大构成中的平面构成、色彩构成、立体构成,掌握一定的素描基础,以明确:光影变化、透视结构、构图平衡的基本视觉规律。

(3).【核心】掌握网页设计规范,学习网页设计概述、网页布局、制作流程、视觉元素、色彩搭配、以网页布局排版、切图、交互知识等。

(4).【核心】学习网页设计创意表达的思路流程,如何将文案创意具体到视觉化呈现的全过程,以及画面光影细节刻画的技能提高。请参考:网页设计高级教程

(5).【核心】了解一点前端代码HTML、CSS的运用,学一款代码编辑软件,推荐网页设计师用Dreamweaver

△图例。上图案例中,采用左右布局的排版,页面整体色调偏暖,采用衬线宋体使页面显得端庄大气,导航及标题文字采用金黄色的质感处理,使得整个页面稳重而富有商业文化的气质。(来源:腾讯设计师郭亮网页设计高级教程

(6).了解你设计网站的公司及产品,熟悉这个公司及其产品面向的人群!

(7).拓展学习网站优化、开发、后台数据处理常识(加分项目!)

三、推荐几本经典的网页设计书籍。

(1).网页设计实践畅销:《界面设计模式(第2版)

(2).设计入门启蒙书籍:《写给大家看的设计书(第4版)

(3).色彩搭配实践书籍:《互联网产品(Web/移动Web/APP)视觉设计·配色篇

(4).网页交互设计经典:《简约至上:交互式设计四策略

(5).如何制作响应式网页:《响应式Web设计实践

(6).腾讯TGideas团队出品:《形式感+网页视觉设计创意拓展与快速表现》

知识的学习并非一成不变,不同公司的岗位职责、业务工作内容各不相同,以上只是从最基础的层面谈到了一些通识的东西,希望对初学者有所帮助!开卷有益,祝大家学有所成!

未经许可禁止转载,侵权必究!

关于@酷coo豆

「平面设计学习日记网」的站长,非科班平面设计师,乐于分享自学平面设计的书籍、教程、经验等资源参考,希望和初学平面设计的你一起进步!

优质学习资源推荐:网页设计视频教程

订阅我的专栏:平面设计学习日记 - 知乎专栏

(完)

相关文章

软件开发的八个流程,你知道吗?

软件开发的八个流程,你知道吗?

软件开发就是依据用户需求打造软件系统中软件局部的过程,它通常以项目的方式停止,用软件的办法,以项目管理的手腕来执行。软件开发流程有八个步骤:   (1)需求调研   需求调研...

软件开发六大发展趋势,真正“软件人”都在关注,值得一看

软件开发六大发展趋势,真正“软件人”都在关注,值得一看

随着摩尔定律的终结,未来5至10年将迎来计算机硬件与软件架构的黄金时代,如何成为一个顺应时代发展的真正“软件人” ,跳出“基础代码”、告别996,这是当下众多码农十分感兴趣的话题。...

分享15个对Web开发人员有用的高效工具网站

分享15个对Web开发人员有用的高效工具网站

大厂技术高级前端Node进阶 点击上方 程序员成长指北,关注公众号 回复1,加入高级Node交流群 今天我想和大家分享一些有用的网站,有的可以提高你的工作效...

网站开发的流程有哪些

网站开发的流程有哪些

网站开发不是说做就能做的,想要开发网站就要有一定的技术基础,才能够完成。网站开发需要一个具体的流程和步骤,这样也是为了能够有一个更全面的设计方案,避免在设计的过程中,因为失去一个环节或者其他...

怎么做网站平台?有几种方式

怎么做网站平台?有几种方式

  互联网的发展让很多人开始正视这一行业,商家希望建设自己的门户网站来吸引线上用户消费,个人用户希望建站来展示自己的生活等等,那么,你知道怎么做网站平台吗?又有几种方式呢?   一、...

发表评论

访客

◎欢迎参与讨论,请在这里发表您的看法和观点。