这是我参与「第四届青训营 」笔记创作活动的的第1天
如何创建一个web网站？
一、准备工作
计划
考虑以下问题：
- 网站的主题是什么？
- 根据所选主题，需要展示哪些信息？
- 网站的外观样式是什么？
绘制草图
（略显粗糙）
选定内容
一个完整的网站，需要考虑文本内容、主题颜色、图像、字体等诸多要素，通常情况下建立一个网站会有一个专门的页面设计师，也会有专门的测试人员对于用户体验方面进行相关测试。
纵观上述三个步骤，似乎建立一个网站也没有那么复杂啊，那不如现在便开始吧！
注意：在刚开始学习建立网站时，对于本地网站，最好将所有的相关文件放在一个单独的文件夹下，这样可以映射出服务器端站点文件结构，方便查看。
所以：我选择了在D盘创建一个文件夹web-projects， 来存放我接下来会建立的所有网站，在其中又建立了test-site文件夹，来存放我即将建立的第一个网站。
二、网站结构
任何网站项目，最常见的时有一个主页HTML文件，和包含图像、样式和脚本等各类文件的文件夹：
index.html
在这个文件中，我们会加入网站的主页内容。
images
这个文件夹用于存放网站上将使用的所有图片。
styles
这个文件夹用于存放设置内容、样式等各类信息的CSS代码。
scripts
这个文件夹用于存放所有向网站添加交互功能的JavaScript代码。
三、文件路径
让我们来先看一段代码
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>My test page</title>
</head>
<body>
<img src="images/icon.jepg" alt="My test image">
</body>
</html>
这段代码中的其他部分我们先按下不表，请看第8行的src="images/icon.jepg"，在这句话中，src是地址属性，“”中记录的是图片的路径，这样，我们便可以在网站中添加进我们想要展示的图片了。
让我们来看看最终效果：
注意：文件路径引用过程中
- 如果引用的文件与HTML文件在同一目录下，只需要直接使用文件名即可。
- 如果引用的文件在子目录中，需要在文件名前添加目录名，并加上一个
/ - 如果引用的文件在上一级，可通过
..返回上一级目录。 - 上述方法可以任意结合。
