H5/C3基础(1)
建站基本常识
1.域名
1.1、域名基础知识
● 域名分为:国际域名、国家域名
● 国际域名:由于Internet最初是在美国发源的,因此最早的域名并无国家标识,全世界都在通用。
● .com (用于商业公司)
● .net (用于网络服务)
● .org (用于组织协等)
● .gov (用于政府部门)
● .edu (用于教育机构)
● 现在用途并没有完全区分,混用情况大量存在。
● 国家域名:指的是一个独立的国家或地区所使用的顶级域名。
● 中国国内使用的是 .cn,香港使用 .hk,美国使用 .us 。
● 国家域名一般由国家的相关域名管理机构所管理分配使用。
● 例如中国的国家域名.cn的管理机构是中国互联网络信息中心(CNNIC)
● Ps:域名注册机构和管理机构的不同:
● 域名注册机构负责域名的注册费用收取,其- 部分费用上交至管理机构。(从中抽取部分费用以盈利。)
●而域名管理机构-般来说只负责根域名服务器的维护(并不接受跨过注册机构直接注册)。
1.2、域名分类
有顶级域名、二级域名和三级域名之分。
●更多域名理论知识参考《计算机网络(第七版)》P251- 260页。
1.3、域名特点
● 域名主要特点有:唯-一性、归属性、时效性。
● 唯一性:域名的注册遵循先到先得,当某个域名已经被注册后(在有效期内)其他组织或个人就无法再注册相同域名。
● 归属性: 域名的归属性指的是某个域名属于某个人或组织,在注册有效期内专有。可通过whois查询了解。
● 时效性:一 般域名按年计费,费用主要用于域名管理机构维护根域名。一年之内属于某人,一旦过期将被删除接受重新注册。时效性可通过whois查询到。
● 而我们并不从管理机构注册域名,而是在注册机构(注册商)处进行注册。
1.4、域名的删除
域名的删除:域名的删除指的是过期后所进行的处理过程。在域名有效期内不牵扯域名的删除问题。也就是说域名一旦被注册后则无法主动删除,这也就体现了域名的“不可逆性"。
● 不同注册商和管理机构对不同的顶级域名删除时间规定不同。
● 域名管理机构: .com .net .org等国际域名删除时间,通常在域名到期后的第65或75天,凌晨2点30左右会删除。国内域名的删除时间,通常在域名到期后的第15或16天,凌晨4: 30会删除。域名注册机构:下面列举国内几大域名注册商对删除时间的规定。
● 域名的注册所有 人和有效期可以通过whois查询到。
● 举例: https://www.whois.com/whois/
2.主机
2.1、主机分类
● 服务器: 及整个服务器设备,强悍的性能。用于大型网站的运行。具有完全的操作权限,可以安装网站所需要的件。
● VPS (虚拟服务器) :采用虚拟化技术将一整个服务器进行“分割”使中型网站或者需要特殊配置(环境)的网站运行,具有和服务器一样的操作权限,只是配置般要比服务器稍差些。
● 虚拟主机: 最最推荐新手使用的主机,它有着控制面板,能使新手更容易操纵主机,同时其价格是三者当中最低的。但其可用性,方便性要远远大于上面两者。虽然它的操作权限不是很高,但对于些小型网站是完全够用的。(足够新手使用)
● 无论选择哪种主机,网站是可以相互迁移的。不用担心以后升级的情况! (新手前期还是虚拟主机比较好,省钱而且使用简单,后期可以升级到VPS.服务器)
2.2、补充 “云” 的概念
● 云虚拟主机、云VPS云服务器是什么意思?
●"云” 的意思在主机当中就是说,这个主机采用了集群技术。
● 所谓集群技术指的是你所看到的一台服务器或者虚拟主机其实是由不同地方的很多硬件服务器构成的。这里具体的原理我们不做过多了解。采用“云”的虚拟主机相对于般的虚拟主机来说其稳定性会增强,
● 最后要说的一点是,现在市面上的所有虚拟主机大部分都是部署在云服务器(集群服务器)上面的,再加上专人维护,其稳定性相当高。
2.3、总结
● 无论是虚拟主机、VPS还是服务器都牵扯到地理位置的问题。
● 这里的地理位置当然指的是实际存在的物理位置,而不是互联网上的某个虚拟抽象地址。
● 我们所指的地理位置是大范围,例如国内(大陆)、香港和美国。
● 我们暂不讨论小范围,例如某省、某市。
● 为了更好的让大家理解,我们简单的学习下”多层次ISP结构的互联网”。我们以《计算机网络(第七版) 》这本书为参考。
3.互联网
3.1、互联网基础结构发展的三个阶段
3.2、建站基础步骤
3.3、补充:国外域名注册机构
● 由于我国相关政策的限制。我们无法注册一些未要求实名认证的域名。
● 如果你确实需要这个后缀的域名,那么你可以到国外的域名注册机构进行注册。
● Ps:在国外注册的国外线路的主机,而不能将网站放置在国内。这是由于我国的另一项政策《非经营性互联网信息服务备案管理办法》。
3.4、http状态码
➢ 200: (成功)服务器已成功处理了请求。 通常,这表示服务器提供了请求的网页。
➢ 301: (重定向) 请求的网页已永久移动到新位置。 服务器返回此响应(对GET或HEAD请求的响应)时,会自动将请求者转到新位置。
➢ 403: (禁止) 服务器拒绝请求。通常出现在禁止列出目录。
➢ 404: (未找到)服务器找不到请求的网页。网页已经不存在。
➢ 5xx: (服务器错误)。
…
页面布局整体题思路
1.基础思维
为了提高网页制作的效率,布局时通常有以下的整体思路:
1.必须确定页面的版心(可视区) ,我们测量可得知。
2.分析页面中的行模块,以及每个行模块中的列模块。其实页面布局第一准则。
3.一行中的列模块经常浮动布局,先确定每个列的大小之后确定列的位置,页面布局第二准则。
4.制作HTML结构。我们还是遵循,先有结构,后有样式的原则。结构永远最重要。
5.所以,先理清楚 布局结构 ,再写代码尤为重要这需要我们多写多积累。
2.头部制作
导航栏注意点:
实际开发中,不会直接用链接a而是用li包含链接(li+ a)的做法。
1.li+a语义更清晰,一看这就是有条理的列表型内容。
2.如果直接用a,搜索引擎容易辨别为有堆砌关键字嫌疑(故意堆砌关键字容易被搜索引擎有降权的风险),从而影响网站排名。
注意:
- 1.让导航栏一行显示,给li加浮动,因为li是块级元素,需要一行显示。
- 2.这个nav导航栏可以不给宽度将来可以继续添加其余文字。
- 3.因为导航栏里面文字不一样多,所以最好给链接a左右padding撑开盒子,而不是指定宽度。
3.CSS书写顺序
建议遵循以下顺序:
1.布局定位属性: display / position/ float/ clear / visibility/ overflow (建议display第一个写 ,毕竟关系到模式)
2.自身属性: width/ height/ margin/ padding / border/ background
3.文本属性: color/ font / text-decoration/ text-align/ vertical-align/ white- space / break-word
4.其他属性(CSS3) : content / cursor / border-radius/ box- shadow / text- shadow/ background:inear gradient…
4.模块化开发
● 有些样式和结构在很多页面都会出现 ,比如页面头部和底部,大部分页面都有。此时,可以把这些结构和样式单独作为一个模块,然后重复使用。
● 这里最典型的应用就是 common.css (公共样式)。写好一个样式 ,其余的页面用到这些相同的样式。
● 模块化开发具有重复使用、修改方便等优点。
common.css公共样式里面包含版心宽度、清除浮动、页面文字颜色等公共样式。
5.网站 favicon 图标
favicon.ico -般用于作为缩略的网站标志,它显示在浏览器的地址栏或者标签上。
目前主要的浏览器都支持favicon.ico图标。
5.1.制作favicon图标
1.做一张png图片作为自己的图标。
2.把png图片转换为ico图标,这需要借助于第三方转换网站,例如
比特虫: http://www.bitbug.net/
5.2.favicon图标放到网站根目录下
5.3.HTML页面引入favicon图标
1.在html页面里面的 元素之间引入代码。
语法:
6.网站 TDK三大标签SEO优化
SEO ( Search Engine Optimization )汉译为搜索引擎优化,是-种利用搜索引擎的规则提高网站在有关搜索引擎内自然排名的方式。
SEO的目的是对网站进行深度的优化,从而帮助网站获取免费的流量,进而在搜索引擎上提升网站的排名,提高网站的知名度。
对于前端人员来说,只需要准备好这三个标签,具体里面的内容,有专门的SEO人员准备。
页面必须有三个标签用来符合SEO优化。
6.1.title网站标题
title具有不可替代性,是我们内页的第一个重要标签,是搜索引擎了解网页的入[和对网页主题归属的最佳判断点。
建议:网站名(产品名) -网站的介绍( 尽量不要超过30个汉字)
6.2. description网站说明
简要说明我们网站主要是做什么的。
我们提倡, description作为网站的总体业务和主题概舌,多采用“我们是…" 、“我们提供…" 、“xxx网作为…”、“电话 :010…之类语句。
例如:
<meta name="description" content= "京东JD.COM-专业的综合网上购物商城销售家电、数码通讯、电脑、家居百货、服装服饰、母婴、图书、食品等数万个品牌优质商品.便捷、诚信的服务,为您提供偷悦的网上购物体验!" /> .
6.3.keywords关键字
keywords是页面关键词,是搜索引学的关注点之一。
keywords最好限制为6~ 8个关键词,关键词之间用英文逗号隔开,采用关键词1,关键词2 的形式。
例如:
<meta name= "keywords" content="网上购物,网上商城手机笔记本,电脑,MP3,CD,VCD,DV,相机,数码,配件,手表存储卡京东" />
7.常见模块命名
8.LOGO SEO优化
1.logo 里面首先放一个h1标签,目的是为了提权,告诉搜索引擎,这个地方很重要。
2.h1 里面再放-一个链接,可以返回首页的,把logo的背景图片给链接即可。
3.为了搜索引擎收录我们,我们链接里面要放文字(网站名称),但是文字不要显示出来。
●方法1:text-indent移到盒子外面(text-indent: -9999px),然后overflow:hidden 淘宝的做法。
● 方法2:直接给font-size:0; 就看不到文字了的做法。
- 4.最后给链接-个 title属性,这样鼠标放到logo.上就可以看到提示文字了。
H5/C3基础(1)相关推荐
- H5/C3基础(2)
1.网页 1.1.什么是网页 网站是指在因特网上根据一定的规则,使用HTML等制作的用于展示特定内容相关的页面集合. 网页是网站中的一"页",通常是HTML格式的文件,它要通过浏览 ...
- datagridview 绑定list 不能刷新界面_人人都可写代码-H5零基础编程-首页界面实操06...
欢迎来到人人都可写代码,大家好,我是杨晓华,今天我们的课程内容是,项目实操,开发一个首页界面的H5. 这是要实现的H5首页界面展示效果,下面就是教大家如何制作的步骤: 1.在views的项目smart ...
- datagridview 绑定list 不能刷新界面_人人都可写代码-H5零基础编程-发布活动界面实操07...
欢迎来到人人都可写代码,大家好,我是杨晓华,今天我们的课程内容是,项目实操,开发一个发布活动界面的H5. 这是要实现的H5发布活动界面展示效果,下面就是教大家如何制作的步骤: 1.在views的项目s ...
- h5可以获取本机手机号码么_人人都可写代码-H5零基础编程-登录界面实操05
欢迎来到人人都可写代码,大家好,我是杨晓华,今天我们的课程内容是,项目实操,开发一个登录界面的H5. 这是要实现的H5登录界面展示效果,手机号+验证码的登录方式:下面就是教大家如何制作的步骤: 1.在 ...
- h5+css3基础面试题
h5+css面试题 一 HTML5中新增了那些内容? 广义上的html5指的是最新一代前端开发技术的总称,包括html5,css3,新增的webAPi html, 中新增了 header,footer ...
- H5 C3中的概念(一)
2019独角兽企业重金招聘Python工程师标准>>> 阿里web字体的使用 (1)进入官网 点击webfont (2)输入对应的文字 然后选择添加字体 (3)可以直接引用线上地址 ...
- Android和H5交互-基础篇
hybrid App开发也不是什么新鲜事了,其中native和h5之间的交互则是必不可少的.Android中是如何和H5交互的? 1.webView加载页面 我们都知道在Android中是通过webV ...
- H5 canvas基础入门到捕鱼达人小游戏实现(1)
为什么学习canvas? 看见别人网页一些非常炫酷的效果,羡慕不已,于是对canvas产生了浓厚的兴趣,所以想仔细学习学习canvas.下面就一起来学习吧,本文为系列文章,最后会编写一个简单版的捕鱼达 ...
- H5 canvas基础入门到捕鱼达人小游戏实现(3)-canvas运动入门,渐变,文字渲染,阴影
上一篇主要讲解了矩形柱状图,弧形和饼图的绘制,但是离我们的目标还是有点远,不要紧,我们基础api都还没有学习完,今天继续. 本节主要内容 - canvas画板制作 - 块的直线运动 - 粒子运动 - ...
最新文章
- 题目1189:还是约瑟夫环
- 如何查看Python安装目录
- Swift -- 6.函数和闭包
- 手机版python配置_appium+python 连接手机设备的yaml配置文件
- 第二次考试:错题总结
- ASP.NET-权限管理五张表
- 基础研究到底要基础到什么程度?
- MapGuide open source开发系列教程六: 地图状态与事件(含问题)
- linux视频补帧,SVP(电脑视频补帧软件) V4.3.180 Linux版
- 如何判断函数极值点与拐点
- 多闭环PID控制算法
- 用类描述计算机CPU的速度和硬件的容量
- RHEL8红帽子系统 网卡命令
- Python_爬虫_猫眼电影网电影预告片批量下载
- 天涯共此双11——天猫升级港澳台“购物天堂”
- 图像形状及数量识别(matlab实现)
- sql时间函数以及格式转换
- 面向对象三大特征之继承
- 计算机硬件及组成原理中文版,计算机硬件及组成原理.docx
- FFmpeg源码分析:avformat_open_input()打开媒体流