web开发流程
1.什么是WEB？
网络应用。
2.熟知的WEB应用程序？
聊天工具、网站、app、小程序、游戏：王者等。
3.从开发的角度分析，分类应用程序：
-
C/S:client/server 客户端-浏览器有安装包。
缺点：占用硬盘空间。
优点：运行速度快，用户体验好。
eg：app等。 -
B/S:browser/server 浏览器-服务器。系统自带浏览器，使用浏览器访问应用程序。
缺点：必须依赖于网络，网速快慢影响用户体验。
优点：无须安装，有网和浏览器就可体验。
eg：网站，网页游戏。
web应用程序的开发流程
需求分析–明白要做什么
- 网站类型分析
思考内容：展示内容、色彩搭配、板块布局、功能
-
网站技术分类：
固定分辨率网站：固定页面的最小、最大宽度。
瀑布流网站：纵向放置内容，列对齐，每个内容高度不一致宽度一致。
响应式网站：根据浏览器窗口大小而改变。 -
网站布局方式：
流式布局：类似于瀑布流
水平布局：横向滚定
垂直布局：最常见
- 针对用户群体（定位）
- 市场价值及竞品分析
- 业务功能分析
- 网页是功能的载体：页面架构展示功能（展示）。
- 用户操作功能（交互）包含功能的入口和出口。
- 业务流程分析
- 主要功能说明，如：
- 画业务流程图，如：
- 网页的布局和内容：
- 要求做到整体风格的一致性，布局统一性，以及色彩的搭配和素材的选用处理上都有严格要求。
- 网页的基础结构：
- 页头、内容、页脚。
- 网页布局
- 封面型：单页
- 国字型：大学、政府机构等
- 拐角型（厂字型）：后台管理系统等
- 标题正文型：以标题文本内容为主
- 左右框架型：左右结构
- 上下型：上下结构
- 综合变化型：大部分为综合型布局
- 产出：
- 需求分析文档（功能分析、功能的业务流程、功能实现的页面流程），页面架构设计（分析出页面数）线框图、低保真原型图、高保真原型图、交给客户确定产品是否满意。
网站设计
- 根据原型图线框图，UI做效果图的设计。
- 后端人员根据功能和业务流程，设计数据库。
- 前端思考项目工程架构，技术栈的选择，制定项目开发的标准。
编码
- 前端根据分析文档和UI的效果图，写页面；
- 后台写服务器代码和数据库代码。
测试
- 开发环境测试——>生产环境的设置
维护
- 测试无bug后交给运营部去进行运维。
- 在运营中发现有需求改变，重新重复前面步骤。
PS
新建项目
- 设置：宽1366 高768 分辨率72
网页 颜色模式：rgb 彩色 8位
存储文件
- 存储为PSD格式文件具有图层管理功能。
PS基础
- RGB颜色：红，绿，蓝，三原色。
- ctrl+j 抠出选区中的内容保存到新的图层上
- 抠图时shift +，alt -
- H按住不放：移动图层
- ctrl+t：自 由变换
切片（图片优化）
常用的三种网页文件存储格式：
- .jpg：一般用于照片、高清大图、存储更多的色彩。字节数较大。
- .png：常用的图片都可以是png格式，存储的颜色数量比jpg少。背景支持透明。字节数一般比jpg小。
- .gif：背景透明，动图。
- 做背景透明的切片时要把背景隐藏。