全国统一热线:
028-86758058
18980748058
购买流程
付款方式
常见问题
在线提问
续租服务
购物车(
0
件)
用户名:
密 码:
记住
首 页
HOME
域名注册
DOMAIN
虚拟主机
WEB HOST
成品网站超市
AUTO Site
VPS主机
VPS SERVER
云 主 机
CLOUD HOST
租用托管
SERVER
海外主机
HK HOST
代理专区
AGENT
客服中心
SERVICE
站长教程
SERVICE
欢迎光临西部数据云计算中心,我们将竭诚为您提供最优质的服务!
中文域名
域名转入
域名转出
DNS管理
动态域名
获取域名证书
域名停放
域名过户
集群主机
双线主机
基本主机
港台主机
论坛主机
Linux主机
Vip合租主机
超G型主机
ASP.net主机
Java主机
智能建站主机
网店主机
美国主机
数据库
成品网站超市
智能建站主机
集群VPS主机
国内VPS主机
香港VPS主机
美国VPS主机
云主机介绍
云主机购买
服务器租用
主机托管
常见问题
香港主机
港台主机
美国主机
国内免备案
步骤流程
代理级别
代理合同
代理模式
代理优势
在线申请
产品列表
常见问题
代理商分布图
常见问题
有问必答
跟踪提问
购买流程
产品价格
付款方式
常用软件
网站备案
续租服务
汇款确认
相关文档
联系我们
域名资讯
主机资讯
行业动态
网页制作
php教程
mysql教程
域名资讯
云计算资讯
网络编程
您当前的位置:
首页
>
网络编程
>
网站制作
HTML其实就是学习几个重要标记的应用
时间:1970-01-01 来源:互联网 作者:佚名
《这将是一场革命》一文出来以后。得到业界大伙的认同,当然与此同时也得到部分来自内部与外部的挑衅,不过的更加多的是更多人来寻问每一个点的细节。今晚回家很早就睡了,半夜在一个梦中醒来,梦里正在和小学的同学玩一个游戏——“The Next”。醒来以后觉得自己需要做点什么,于是终于将TMENU修改了(拖了很久了);然后觉得近期需要对之前提到的五点详细的出一部分实在的案例写得详细点,于是开始写本文。
梦里回到小学,是有道理的。一是那个“The Next”的游戏提醒我,另外一个则是我和飘飘经常和别人说的,要学好HTML先回去看看小学的语文书。回小学的原因是那里的书本不会受到过多的应试教育的干扰,里面的“本质”存有真实性,而语文书这是意味HTML的本质:标题、段落、列表、书目。
HTML学习的本质就是该是什么就用什么
——Ghost。当然这句话是需要一个解释的,参照的范例就是你的小学语文书。
我们先来看看我们制作网站的历程。记忆中我第一个网站是产生于1998年,当时都是一群用table做网页的人。在table的时代我们觉得最难的题目是什么?
奇特的三行不定列布局:
奇特的一像素边界:
table时代过后(记忆中是2001年前后),出现了第一批使用<div>的人。于是国内吹起了一股CSS之风。用法是将他套着若干的table然后利用CSS的绝对定位,还有的加上些JS让他飘来飘去。后面就有人开始研究CSS起来,记得“风人设计”的初期就有若干谈合作的人拿着一本CSS的书和我说这说那的(当然这些人最后都转行了)。在这个时候我们觉得最难的题目是做一个当时被叫做“Java特效”的咚咚。于此时我被一个人提出的XML所吸引,但只是将他看作一种数据储存(其实这也就奠定了Qzone实现的雏形)。
时间飞快如梭,2004年5月1日,国际劳动节当天,电子工业出版社出版了一本名为《网站重构——应用Web标准进行设计》的书译。于是国内就遍布了“DIV CSS”的信念,真正的意味上中国网站重构的跨时代性起步开始了;但另一个角度而言,这本书将中国的WebReBuilder从一个火坑拉出来,丢进了另外的一个火炕。我想我们只能使用看待隋唐盛世的眼光去看待这本书。因为它只是意味一革新的皇帝和新的朝代的诞生,并没有从本质上面推动社会的变革和进化。这本书将table嵌套,变成了div嵌套。当时最流行的话语(直到现在)是“我的网站是‘DIV CSS’做的。”这个时候我并没有加入这个行列,一直是在等待;因为我有一个很关键的问题没有解决“为什么要‘DIV CSS’而不是‘TABLE CSS’”:
引用《这将是一场革命》内容:
我们先看看一下两个范例。table做的,div做的表面上他们是一样的,但是一旦产品经理提出修改,表现需要变化。对于div会很轻易的变化成为这个 范例 。范例可以看出不修改html的情况下,table就是打死也完成不了这样的改变。“DIV CSS”比“TABLE CSS”优秀就是排版的自由化,就以上例为题,table就一辈子都无法做到。
一直到了Qzone3.0前后,我才开始想明白上面的答案,历时差不多有一年。接着在Qzone4.0的时候动用了三个标记“dl、dt、dd”和 TMENU 的诞生。现在非常悔恨的是我也将大家带入了另一个跨时代的起步——“XHTML CSS”,同时也是将大家带进了一个新的火炕。进火炕容易出火炕难,我才开始明白为什么两个重构名人——阿捷、老甘会在互联网当中逐渐消失。我开始不去怪责他们之前的事情,更多的是一种体谅,与此心中也暗下决心。便开始了进行铺垫“良性竞争”的“SB”观念。
历史路程如上,回归到HTML学习的本质就是该是什么就用什么;意思就是标签不能滥用,还原到内容的本质的标签才是合格的标签。就以 TMENU 为范。
之前的HTML代码是:
<ul class="menu">
<li><a href="#"><span><span>123123</span></span></a></li>
<li><a href="#"><span><span>123123</span></span></a></li>
<li><a href="#"><span><span>123123</span></span></a></li>
<li><a href="#" class="now"><span><span>123123</span></span></a></li>
<li><a href="#"><span><span>123123</span></span></a></li>
</ul>
现在的HTML代码是:
<map id="directmenu" class="menu">
<div><a href="#"><span><span>123123</span></span></a>
<a href="#"><span><span>123123</span></span></a>
<a href="#"><span><span>123123</span></span></a>
<a href="#" class="now"><span><span>123123</span></span></a>
<a href="#"><span><span>123123</span></span></a></div></map>
<h2>以下是一个菜单列表</h2>
<ul class="menu"><li>
<a href="#"><span><span>123123</span></span></a></li>
<li><a href="#"><span><span>123123</span></span></a></li>
<li><a href="#"><span><span>123123</span></span></a></li>
<li><a href="#" class="now"><span><span>123123</span></span></a></li>
<li><a href="#"><span><span>123123</span></span></a></li>
</ul>
两者的不同点,大家也看到了。多了一块map的标签和一个hn的标签。为什么是这样呢?我们再来看一个例子:操场上面有100台不同牌子,不同外形,不同颜色的车;现在让你将这些车分成若干组,反馈一个列表以供选择。当然,使用列表是大家都会想到的。但是大家有没有想到这个列表能表现什么呢?
引用范例
<ul>
<li>XXX牌子XXX型号</li>
<li>XXX牌子XXX型号</li>
</ul>
再或者
引用范例
<ol>
<li>XXX牌子XXX型号</li>
<li>XXX牌子XXX型号</li>
</ol>
就这上面的列表,我根本就看不清楚这个列表的分类是怎么形成的,为什么一个是有序,一个是无序的。他们是怎么样会这样排,为什么放在一起。很多很多的问题。我们再来看看下面的范例
引用范例
<h3>黄色系列车</h3>
<ul>
<li>XXX牌子XXX型号</li>
<li>XXX牌子XXX型号</li>
</ul>
再或者
引用范例
<h3>出厂年份</h3>
<ol>
<li>XXX牌子XXX型号</li>
<li>XXX牌子XXX型号</li>
</ol>
上述的范例,大家是否一看就一目了然了。所有的来龙去脉都变得清清楚楚。然而为什么TMENU代码里面还有map标签呢?我们看看一个范例
以上的范例当然是正确的。然而这样的结构就会让人觉得用户极度低能了,站名和副标过后不是站点地图导航菜单么?(
特指menu在顶部的站点
)而且与此同时HTML本身就提供了一个特指站点地图导航的标签——<map>。既然有一个本身就有这样意义的标签你又何必使用文字去说明呢?你总不会使用<h3>这是一个无序列表</h3><ul>这么白痴吧。大家都知道阿妈是女人啊。我们再看看下面的范例:
是不是,代码更加的简单清晰明了了。
其实要走好WebReBuild的第一步HTML不会很难的,回去看看小学的语文书,想想最本质的,多点问问自己“为什么?”。和做人一样,该是怎么样就应该怎么样,不应该被复杂的社会和繁琐的人际关系干扰你,坚持做人脚踏实地的原则,踏踏实实地工作和做人,是金子总是要发光的。
引用内容
我有个怪癖。我很喜欢在面试的时候我总是要先考面试人XHTML。就好像以前师傅招收学徒一样,能力和慧根属其次,人品首当其冲。
我以为,XHTML好比一个人的本质,CSS好比人的处事方式和态度,JS好比人做事的行为以及作风。三者的分离再加上些周边的SEO、人机交互也就是我们所说的网站重构,也就是一个很不错的人。之前总是有一部分人认为CSS就是网站的最主要的元素,其实自然而然的也就代表了一种人生观。的确,一个人没有好的处事方式和态度很难在现在的社会很好的存活;但是这个处事的方式和态度位置过于偏重了,就成了一个善于欺骗、做事不择手段的人。
引用范例
<h1>站点名称</h1>*
<h2>站点副标</h2>*
<map><div><a href="#">连接1</a> <a href="#">连接2</a></div></map>
注:*号注释部分为强调站点为推广首要的时候用。
引用范例
<h1>站点名称</h1>*
<h2>站点副标</h2>*
<h3>站点地图导航菜单</h3>
<ul>
<li>连接1</li>
<li>连接2</li>
</ul>
注:*号注释部分为强调站点为推广首要的时候用。
来顶一下
返回首页
推荐资讯
从零开始学ASP.NET-基础篇第1/7页
第一天 学习目的: 掌握最基本的Label、TextBox、Button控件
ASP.NET入门数据篇
对于网站编程的初学者来说,总是会上网找些源码来看,但久而
相关文章
我今天开始正式学习.net遇到的问题
C#Web应用程序入门经典学习笔记之二
介绍几个ASP.NET中容易忽略但却很重要的方法函数
关于.NET动态代理的介绍和应用简介
为自己的ASP网站系统构建一套标记语言
ASP.NET:一段比较经典的多线程学习代码
Asp.net中处理一个站点不同Web应用共享Session的问题
调试ASP.NET应用程序的方法和技巧
vs.Net2003无法打开或创建Web应用程序若干解决办法.
C#Web应用程序入门经典学习笔记之一
栏目更新
栏目热门
返回首页
关于我们
联系我们
付款方式
价格总览
资讯中心
友情链接
媒体关注
有问必答
投诉建议
网站备案
《中华人民共和国增值电信业务经营许可证》编号:川B2-20080058号
官方网址:
xibushuju.com
西部数据
Copyright © 2002~2015
天府快车
版权所有
电话总机:
028-86758058
(50线) 传真:
028-86758058