链接和文本标签的应用

 更新时间:2016年9月20日 19:06  点击:2174

专栏文章将结束关于文本部分的XHTML的讲解。那么这篇主讲的内容涉及链接、标题、插入、删除、上下标、分割线、换行等标签。

网页教学网


我们都知道网页的最大特性是“链接”,是的这个在我们现在看起来习以为常的东西,让我们的生活发生了巨大的变化,是这个小小的标签成就了这个世界上无数的互联网天才。那么让我们看看这个标签的真面目:
<a href="URL" >文本区</a>
,就是这个简单的标签,其实大家都在使用,用Dreamweaver可以很简单的添加链接。但是尽管如此我们还是需要知道A的属性是什么,这样才能更好的利用它。A是个内联标签,也就是说它本身并不会产生分行。他是流于文本之中的无素。那么我们都知道内联元素是不能包含块元素的。那就是说在A中不能包含段落、DIV等这些块级的元素。那么你工作中是否有这样的情况呢?是否在A里加了无数的块级标签呢?那从现在开始改掉这个坏习惯,这样不光可以避免一些没必要的BUG问题,同时也能给GOOGLE等这些搜索引擎一个好印象,多点印象分。当然除此之外振之还推荐在大家伙在A中加入titile属性。例:
<a href="URL" title="这可用以解释或是显示完整的文本内容">文本区</a>
。为什么这么做呢,我这里有这样一篇文章《当标题不能显示完整的时候》,大家可以看一下,这只是加title属性其中一个小小的用处,但是作用非常有效。 网页教学网

链接标签中的href=“URL”这个URL是个非常强大的东西,当然这不是我们这个专栏的内容,但是也非常推荐读者们可以认真阅读一下相关的知识。我从百度百科中找到了相关文档,请大家点击阅读(站外链接请读者们选择新窗口阅读)。关于链接就暂时只讲这么多,如有什么疑问请通过文后的联系信息与我联系或是在线给我留言。

 

标题几乎是所有文章都会有的要素,也是我们用以识实与索引文章的重要元素。我们通过标题去感知文章内的核心。那么你知道吗?合理使用标题标签会让你的文章更受关注。我们都知道XHTML给我们提供了h1~h6,六个标题标签,那么我们如何分配这六个标题标签的使用呢?下面给出一些建议:h1,在浏览器中显示最大,那么自然用来表示最大的标题,对于一个网站来说哪个标题才是最大的?是LOGO,我们通常会在网站的最前面先标注这个网站的名称。所以h1就用来放LOGO,当然如果你的网站没有LOGO,只有一个网站名称,那也可以。当然振之是不推荐在大家在h1中放个图片。我们完全可以通过CSS来实现以图换字。并且推荐网页中h1只出现一次。

网页教学网


当h1找到了专用的功能,那么担任内容标是,或是基它标题的重担就要放在另外几个标题标签上了。在余下的几个标题中h5与h6在浏览器默认显示字体是小于正常文本字体的。那么推荐h5与h6只作为免责声明或是版权通告来使用。这样即表明重要性,又不会太过明显影响阅读。对于标题标签的使用尽可能的注意一下他们之间的等级关系。当然标题的使用还是需要根据实际使用来决定。这里只是给出个建议。标题标签是块线元素,但是他并不能再包含块级元素了,只能包含内联的元素,比如链接、图像,换行之类的。记得有个朋友前两天在文章中提到过关于标题的内容,但是写法就有错了,他把链接写在了H1标签的外面,把H1包起来了,这样的写法是不推荐的。也不符合标准思维容易给以后的学习产生不好导向。 网页教学网

我们的文章难免会有错误的地方,那么有错就要改,但是有时候我们需要告诉读者这段是被删除的但是又能让读者看到。那么删除标签的作用就产生了。以前我们会使用<s></s>或是<strike></strike>来得到一个删除线的效果。但是这仅表是一个删除线的效果,语义上没有DEL来得更为明确,所以这里我要告诉大家放弃以前的方式,采用<del></del>这个标签。同样能表达我们需要的效果,并且意义更为直接明确。那么除了删除有时我们还需要对删除的部分作出一些添加与修改。那么时候这个标签就非常有作用了那就是插入标签<ins></ins>。相信不用我说大家也知道如何使用这两个标签,但是千万别忘记了给这两个标签加上两个重要的属性:cite与datetime。解释与时间。解释不用说了,只要用文字注明为什么要删除或是为什么要插入就可以了。但是这个时间需要明确一下格式。严格的格式是:YYYY-MM-DDThh:mm:ssTZD。呵呵与我们平时用的差不多但是有区别,其中T是表示时间段开始的必需字符,而TZD则是表示时区,Z是表是格林威治标准时间。一秀的写法是:2008-03-25T14:26:22Z Webjx.Com

在所有的标签中有两上标签是样式标签,但是却没有被禁用,因为这两个标签所表述的内容很特别,上下标,<sup>上标</sup>,<sub>下标</sub>。

Webjx.Com


这两个标签用得到机率比较小,但是上标应该还是会常用到的,比如温度中的摄氏度的上的小圆圈,当然现有有专业的字符对应“℃”,还有我们常看到书中的脚注上标[1]。

hr,分平分隔线,这个标签与换行标签只要注意标签的写法就可以了<hr /><br />

关于文本部分的标签就讲到这里,当然标签可能还有很多,但是一些不推荐使用的,不常用的,这里就不再推荐,有兴趣的可以搜索一下相关的内空阅读一下即可。下一篇将引入CSS,一点点的美化我们的文档。

 

Response.Expires = -1是什么意思啊

Response.expires 该属性指定了在浏览器上缓冲存储的页,距过期还有多少时间

1、在Asp页面首部加入Response.Buffer = True Response.ExpiresAbsolute = Now() - 1 Response.Expires = 0 Response.CacheControl = "no-cache" Response.AddHeader "Pragma", "No-Cache"
2、在HtML代码中加入<HEAD><META HTTP-EQUIV="Pragma" CONTENT="no-cache"><META HTTP-EQUIV="Cache-Control" CONTENT="no-cache"><META HTTP-EQUIV="Expires" CONTENT="0"></HEAD>
3、在重新调用原页面的时候在给页面传一个参数Href="****.asp?random()"
4、<body onLoad="javascriptocument.yourFormName.reset()">
5、Content.Response.Cache.SetCacheability(HttpCaxheability,NoCache);

网站栏目策划
相对于网站页面及功能规划,网站栏目规划的重要性常被忽略。其实,网站栏目规划对于网站的成败有着非常直接的关系,网站栏目兼具以下两个功能,二者不可或缺。 Webjx.Com

第一、提纲挈领,点题明义。 Webjx.Com

网速越来越快,网络的信息越来越丰富,浏览者却越来越缺乏浏览耐心。打开网站不超过10秒钟,一旦找不到自己所需的信息,网站就会被浏览者毫不客气地关掉。要让浏览者停下匆匆的脚步,就要清晰地给到他们网站内容的“提纲”,也就是网站的栏目。 Webjx.Com

网站栏目的规划,其实也是对网站内容的高度提炼。即使是文字再优美的书籍,如果缺乏清晰的纲要和结构,恐怕也会被淹没在书本的海洋中。网站也是如此,不管网站的内容有多精彩,缺乏准确的栏目提炼,也难以引起浏览者的关注。

网页教学网


因此,网站的栏目规划首先要做到“提纲挈领、点题明义”,用最简练的语言提炼出网站中每一个部分的内容,清晰地告诉浏览者网站在说什么,有哪些信息和功能。 网页教学网

第二、指引迷途,清晰导航

网页教学网


网站的内容越多,浏览者也越容易迷失。除了“提纲”的作用之外,网站栏目还应该为浏览者提供清晰直观的指引,帮助浏览者方便地到达网站的所有页面。

网页教学网

网站栏目的导航作用,通常包括以下四种情况: Webjx.Com

1、全局导航

全局导航可以帮助用户随时去到网站的任何一个栏目。并可以轻松跳转到另一个栏目。通常来说,全局导航的位置是固定的,以减少浏览者查找的时间。

 

2、路径导航 Webjx.Com

路径导航显示了用户浏览页面的所属栏目及路径,帮助用户访问该页面的上下级栏目,从而更完整地了解网站信息。

3、快捷导航

网页教学网

对于网站的老用户而言,需要快捷地到达所需栏目,快捷导航为这些用户提供直观的栏目链接,减少用户的点击次数和时间,提升浏览效率。 网页教学网

4、相关导航


为了增加用户的停留时间,网站策划者需要充分考虑浏览者的需求,为页面设置相关导航,让浏览者可以方便地去到所关注的相关页面,从而增进对企业的了解,提升合作机率。 Webjx.Com

归根结底,成功的栏目规划,还是基于对用户需求的理解。对于用户和需求理解得越准确,越深入,网站的栏目也就越具吸引力,能够留住越多的潜在客户。 网页教学网

网站页面策划
网站页面是企业网站营销策略的最终表现层,也是用户访问网站的直接接触层。同时,网站页面的规划也最容易让项目团队产生分歧:

 

网页设计师说:我最知道审美的标准,对于网页设计,我最有发言权;


网站开发者说:网站程序是我开发的,我最知道我的程序要如何呈现给用户; Webjx.Com

企业决策者说:我最了解我的企业和我的客户,我最能判断他们需要怎样的网站;

网站策划者说:网站的定位和规划源自于我,我才是最终的决断者;


每个人说的都没有错,但是每个人却都只看到了问题的一个方面。对于网页设计的评估,最有发言权的当然还是网站的用户,然而用户却无法明确地告诉我们,他们想要的是怎样的网页,停留或者离开网站是他们表达意见的最直接方法。好的网站策划者除了要听取团队中各个角色的意见之外,还要善于从用户的浏览行为中捕捉用户的意见。

除此之外,建议网站策划者在做网页规划时,遵循以下原则: 网页教学网

1、符合客户的行业属性及企业特点。


在客户打开网页的一瞬间,让客户直观地感受到企业所要传递的理念及特征,如网页色彩、图片、布局等等。 网页教学网

2、符合用户的浏览习惯。

Webjx.Com

根据网页内容的重要性进行排序,让用户用最少的眼球移动和鼠标移动,找到所需信息。 Webjx.Com

3、符合用户的使用习惯。

根据网页用户的使用习惯,将用户最常使用的功能放置于醒目的位置,便利于用户的查找及使用。


4、图文搭配,重点突出。

Webjx.Com

用户对于图片的认知程度远高于对文字的认知程度,适当的使用图片可以提高用户的关注度。此外,确立页面的视觉焦点也很重要,过多的干扰元素会让用户不知所措。 网页教学网

5、利于搜索引擎优化 Webjx.Com

减少FLASH和大图片的使用,多用文字及描述,以便于搜索引擎更容易收录网站,让用户更容易找到所需内容。

数据库中表名ly,字段名y_username,y_message,y_time
index.html
<HTML>
 <HEAD>
  <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
  <TITLE> My Documents </TITLE>
 </HEAD>
 <style>
 <!--
 body {font-size:12px;}
 -->
 </style>

 <BODY>
  <form name="form1" method="post">
  <input type="text" name="search">&nbsp;<input type="button" value="查询" onclick="javascript:f1()">
  </form>
  <div id="disp">
  </div>
 </BODY>
</HTML>
<script language="javascript">
function f1()
{
 if(document.form1.search.value=="")
 {
  alert('请输入要查询的内容');
  return false;
 }

 var xmlhttp;
 var search;
 var s="";
 search=document.form1.search.value;
   var xmlhttp;
  try
  {
   xmhttp=new ActiveXObject("Msxml2.XMLHTTP");
  }
  catch (e)
  {
    try
    {
   xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    catch (e)
    {
      try
      {
    xmlhttp=new XMLHttpRequest();
      }
      catch (e)
      {
      }
    }
  }
   xmlhttp.onreadystatechange=function()
   {
    if(4==xmlhttp.readyState)
    {
      if(200==xmlhttp.status)
   {
      var xmldoc=xmlhttp.responseXML;
   var message_nodes=xmldoc.getElementsByTagName("message");
   var n_messages=message_nodes.length;
   for (i=0;i<n_messages;i++)
   {
   var user_node=message_nodes[i].getElementsByTagName("user")[0].firstChild.data;
   var text_node=message_nodes[i].getElementsByTagName("text")[0].firstChild.data;
   var time_node=message_nodes[i].getElementsByTagName("time")[0].firstChild.data;
   s=s+"<b>用户名:</b>"+user_node+"<br><b>留言:</b>"+text_node+"<br><b>发言时间:</b>"+time_node+"<br><br>";
   }   
    document.getElementById("disp").innerHTML=s;  
   }
   else
   {
     alert(xmlhttp.status);
   }
    }
   }
   var url="search.asp?search="+escape(search)+"&t="+new Date().getTime();
   xmlhttp.open("get",url);
   xmlhttp.send(null);
}
</script>

search.asp
<!--#include file="adoconn.asp"-->
<%
 text=Trim(request("search"))
 sql="select y_username,y_message,y_time from ly where y_username like '%"&text&"%' order by y_time desc"
 rs.open sql,conn,1,1
 If rs.eof Then
  str="error"
 Else
  Response.ContentType="text/xml"
  str="<?xml version=""1.0"" encoding=""gb2312""?>"&vbnewline
  str=str&"<root>"&vbnewline
  i=1
  Do While Not rs.eof
   str=str&"<message id="""&i&""">"&vbnewline
   str=str&"  <user>"&rs("y_username")&"</user>"&vbnewline
   str=str&"  <text>"&rs("y_message")&"</text>"&vbnewline
   str=str&"  <time>"&rs("y_time")&"</time>"&vbnewline
   str=str&"</message>"&vbnewline
  i=i+1
  rs.movenext
  loop
  str=str&"</root>"
  End If  
  response.write str
  rs.close
  set rs = nothing
  conn.close
  set conn = nothing
%>

通常是利用数据库来保存数据,但也可以使用xml文件来保存数据。假设xml文件的内容是:
test.xml
<?xml version="1.0" encoding="gb2312"?>
<site>
 <root>
   <list>
     <id>0</id>
     <name>新浪</name>
     <url>http://www.sina.com.cn</url>
     <time>2007-11-1 10:10:10</time>
   </list>
   <list>
     <id>1</id>
     <name>google</name>
     <url>http://www.google.cn</url>
     <time>2007-11-2 11:11:11</time>
   </list>
  </root>
</site>

用来显示xml中的内容的asp文件
index.asp
<style>
body {font-size:12px;}
</style>
<%
strSourceFile = Server.MapPath("./") & "test.xml"
'获取XML文件的路径这里根据你的虚拟目录不同而不同
Set objXML = Server.CreateObject("Microsoft.FreeThreadedXMLDOM")
'以自由线程创建一个XML对像
objXML.load(strSourceFile)'把XML文件读入内存
Set objRootsite = objXML.documentElement.selectSingleNode("root")
'选取root节点
num=objRootsite.childNodes.length-1
For i=0 To num
 response.write "网站名:"&objRootsite.childNodes.item(i).childNodes.item(1).text&"   <a href=""javascript:delxml("&objRootsite.childNodes.item(i).childNodes.item(0).text&")"">删除</a> <a href=""editxml.asp?id="&objRootsite.childNodes.item(i).childNodes.item(0).text&""">修改</a>
"
 response.write "网址:"&objRootsite.childNodes.item(i).childNodes.item(2).text&"
"
 response.write "添加时间:"&objRootsite.childNodes.item(i).childNodes.item(3).text&"

"
next
%>
<script>
function delxml(id)
{
  if(!confirm("确定要删除吗?")) return false;
  location.href='delxml.asp?id='+id;
}
</script>

注意:index.asp要与test.xml文件放在同一目录下。

[!--infotagslink--]

相关文章