先准备好文件夹

记得引入CSS初始化文件

模块化：将一个项目按照功能划分，一个功能一个模块，互不影响

可以将相同的样式放在一起，common.css 写好一个样式，其余页面用到这些相同的元素

模块化开发具有重复使用，修改方便等优点。

记得在html中引入css文件

网站 favicon图标

favicon.ico 一般用于作为缩略的网站标志，它显示在浏览器的地址栏或者标签上。

1.制作favicon图标

把图片切成png图片

把png图片转换为ico图标

2.favicon图标放到网站根目录下

3.HTML页面引入favicon图标

    <link rel="shortcut icon" href="bitbug_favicon.ico" />

网站TDK三大标签SEO优化

        SEO 搜索引擎优化，是一种利用搜索引擎的规则提高网站在有关搜索引擎内自然排名的方式

        SEO 的目的是 对网站进行深度的优化，从而帮助网站获取免费的流量，进而在搜索引擎上提升网站的排名，提高网站的知名度。

        页面必须有三个标签来符合SEO优化。

title  description keyword

1.title 网站标题

        具有不可替代性，是我们内页的第一个重要标签，是搜索引擎了解网页的入口 和 对网页主题归属的最佳判断点。

建议：网站名（产品名）-网站的介绍（尽量不要超过30个汉字）

例如：

• 京东(JD.COM)-综合网购首选-正品低价、品质保障、配送及时、轻松购物！
• 小米商城-小米5s、红米Note4、小米笔记本官方网站

2.description 网站说明

        简要说明我们网站主要是做什么的。

例如：

3.keywords关键字

        keywords是页面关键词，是搜索引擎的关注点之一。

        最好限制6~8个关键词，关键词之间用 英文逗号 隔开

例如：

<meta name="Keywords" content="网上购物,网上商城,家电,手机,电脑,服装,居家,母婴,美妆,个护,食品,生鲜,京东"/>

 常用模块类名命名

 logo SEO优化

1. logo里面先放一个 h1 标签，目的是为了提权，告诉搜索引擎，这个地方很重要
2. h1 里面再放一个链接，可以返回首页的，把logo的背景图片给链接即可
3. 为了搜索引擎收录我们，我们链接里面要放文字（网站名称），但是文字不要显示出来
4. 最后给链接一个title属性，这样鼠标放到logo上就可以看到提示文字了。

文字隐藏方法：

• text--indent 移到盒子外面（text--indent：-9999px；）然后overflow：hidden
• 直接  font-size：0；

Tab原理-布局需求

注册页类名命名

注册页面比较隐私，为了保护用户信息，我们不需要对页面进行SEO优化

web服务器

web服务器一般指 网站服务器，是指驻留于因特网上某种类型计算机的程序，可以向浏览器等web客户端提供文档，也可以放置网站文件，让全世界浏览

根据服务器在网络中的位置不同，可以分为 本地服务器 和远程服务器

远程服务器

通常是别的公司为我们提供的一台电脑（主机），我们只要把网站项目上传到电脑上，任何人都可以利用域名（www.baidu.com）访问我们的网站

将自己的网站上传到远程服务器

一般稳定的服务器都是要收费的

免费的远程服务器（免费空间）：http://free.3v.do/

1. 去免费空间网站注册账号
2. 记录下主机名，用户名，密码，域名
3. 利用cutftp软件上传网站到远程服务器
4. 在浏览器中输入域名，就可以访问

http://leetong.web3v.work