安装基础软件
- 计算机
- WebStorm
- Web浏览器:Microsoft Edge
- 图像编辑器
- 版本控制系统:Gitee - 基于 Git 的代码托管和研发协作平台
- 自动化构建工具:用来自动完成压缩代码和运行测试等重复性任务(使用WebStorm中的插件:Gradle)
设计网站外观
做出计划
- 网站主题是什么?
- 基于所选主题要展示哪些信息?
- 网站采用怎样的外观?
注:复杂项目需要更详细的指引,包括颜色、字体、间距、编写规范等等。亦称为设计指南、设计系统、品牌手册
绘制草图
接下来,拿出纸笔画出网站草图。虽然第一个简单网页能做的不多,但最好在一开始就该养成这样的习惯。画草图很有用,而且并不需要梵高的手法。
选定内容
文本
包括标题和文字
主题颜色
色彩选择器:一个好用的调色板 | 颜色选择器 - Codeeeee 在线工具
色彩提取器:安装 PowerToys | Microsoft Docs
图像
- 找到心仪的图片时,单击放大。
- 右击图片,选择 “另存图像为…”,然后选择一个安全的位置存放这张图像。也可以复制你的浏览器地址栏上的图像地址以便后来使用。