zhuxianfei.com

﹤首页 > 编程技术 > html

给网站添加优质内容的25种方式

发布时间：2016-9-20 19:05

　　我们早已知道，网站的质量在Google中起关键作用。高级Google工程师Matt Cutts在他的blog中多次提到，“优质”对于Google至关重要，无论是内容还是连接。

　　不过，创建内容和连接并不一定要经历痛苦的过程。网站搭建者们开始趋于从某些角度考虑如何组织内容。所以，让我们放开创新的思维，来想一想所有这些给网站添加优质内容的方法吧。

　　请先记住以下几点：

　　现在我们进入正题了：面向目标群体的优质内容。

　　1、事件日历。对于房地产网站，它可用于展示新开房屋信息；对于在线书店，可用于介绍新书签名会、作者见面会等；对于收藏类网站，可用于介绍最近的聚会活动等……确保访客能添加他们自己的事件到日历中去。

　　2、地图。考虑给房地产网站、捕猎/捕鱼网站、露营网站、酒店或者其他任何户外休闲网站建一个地图。在地图的底部添加内容来描述该地图并说明它的意图。

　　3、售前/售后经历。如果你的顾客能就你提供的产品或服务写一小段文字，或者探讨你的产品/服务带来的好处，就再好不过了。你可以把它们作为成功的证明放在网站上。

　　4、来自顾客的图片。你可以为已有顾客设立一个特别的地方，让他们能够在你的网站贴出自己的图片和日志等等。这个方法比较适合度假网站、休闲网站、婚姻网站、宝宝网站、摄影工作室等等。想一想，在Halloween网站该怎么做？花卉网站呢？

　　5、在线填色画。发挥你的想象力。如果你将一些度假物品做成填色画，孩子们就可以在旅程开始前给它们填完色然后 贴到他们在网上专有的版块。旅程结束后，他们的父母又可以贴上度假的图片和日志。这样，一个属于他们的度假纪念“网站”（其实完全是建立在你的网站上）就 成为了你这个度假网站的招牌。他们会怎么使用这个“网站”呢？他们会告诉朋友、爷爷奶奶、叔叔婶婶等等。他们会在其他地方给这个“网站”做连接。你可以把 这个招牌作为独特的核心卖点来跟对手竞争。你将会获得以往顾客过来的连接和未来顾客的浏览。你会赢得优势。如果网站可以作孩子们的文章，你可以想很多增添 填色画的方法，或者类似的针对孩子的创造性活动。

　　6、blog或论坛当然会给网站增添新内容。

　　7、令你的目标群体感兴趣的文章或者新页面。有规律的写出新内容——你的目标应该是每周1-2篇。

　　8、在站内主页展示专家问答。请个专家来回答问题，然后每周在主页贴出一问一答（或者每天都贴出，自由控制）。把站上以往的问答做个可搜索的归档。

　　9、产品评测。如果你的行业有产品或软件需要评测，可考虑写一些公正的评测文章。将文章发布到自己的网站和在线 刊物上。读者永远都会对完整的公正评测感兴趣，因为作者不失偏颇的列出产品的优点与弱点。如果你手头的是风景区业务，应该如何去“评测”呢？作为专家的你 将会使用什么产品呢？为什么？

　　10、小提示。如果你的产品或服务适合用小提示，就写一个系列并把它们发布到你的网站上。作为新闻信来发送。邀请使用你的产品的读者也来写小提示/技巧，如果他们提交过来，就给他们一些购买其他产品的优惠/折扣。

　　11、常见问题。常见问题（FAQ）是你的目标群体想要了解的内容。当你从读者那里收到提问，就在FAQ里面添加新的问答内容，使它保持更新。

　　12、使用手册/指引。人们喜欢看使用手册。如果你正在线销售抽水马桶部件，为何不写一份关于“如何在卫生间安 装抽水马桶”的指导手册呢？为你的顾客提供便利，客人就会源源不断。撰写一系列的使用手册。做一个网络上的“厕所超人”。听着这好像不够有魅力，不过如此 一来你就会被高度关注，并能将网站访问流量转化为销售，你会在互联网以外魅力十足。

　　13、能够解决实际问题的内容。人们为何访问互联网？为了寻找信息或者对比购物。如果你能为你的访客解决这些问 题，就帮他们达到了目的。举例说，你在卖东方的小毯子。你的潜在顾客可能正寻求点子如何装饰她的办公室。她的办公室很狭小，她想要增加点颜色。墙壁的大部 分都被窗子和金属书橱占据了。如果你创造出一系列内容/图片来展现你的东方小毯子能如何的解决她的问题，其中一个例子里提到长条形的东方地毯。这些内容不 但包含图片，还有文字描述各个问题并给出解决方案。你的潜在顾客自然能从搜索引擎里找到你的页面。

<

　　我们可以用CSS语法来控制超链接的形式、颜色变化。

　　下面我们做一个这样的链接:未被点击时超链接文字无下划线，显示为蓝色;当鼠标在链接上时有下划线，链接文字显示为红色;当点击链接后，链接无下划线，显示为绿色。

　　实现方法很简单，在源代码的和之间加上如下的CSS语法控制:

　　<style type="text/css">
　　 <!--
　　 a:link { text-decoration: none;color: blue}
　　 a:active { text-decoration:blink}
　　 a:hover { text-decoration:underline;color: red} 
　　 a:visited { text-decoration: none;color: green}
　　 -－> 
　　 </style>


< 经常听到网友苦述自己的网页中有许多图片不能正常显示，究竟为什么不能正常显示呢？总结其原因绝大部分都是因为使用了错误路径所致。网页中的图像、动画等素材都有自己固定的存放位置，网页只是通过路径使用HTML语言来调用它们，然后把它们显示在网页中。在网页中的路径大体可分为相对路径和绝对路径，大家(尤其是初学网页设计的朋友)往往对它们不够认识，在应该使用相对路径的地方使用了绝对路径，从而导致浏览器无法在指定的位置打开指定的文件，使素材不能正常显示。

　　那什么是相对路径？什么是绝对路径呢？为什么使用了绝对路径有时就不能显示呢？让我们一起来认识一下它们吧。

　　比如C盘的My Pictures目录下有一个tp.jpg图像，那么它的路径就是c:My picturestp.jpg，其实这种完整地描述文件位置的路径就是绝对路径。如网页index.htm中有一张图片tp.jpg，它们的绝对路径是：

　　c:My picturesindex.htm

　　c:My picturestp.jpg

　　如果你使用了绝对路径c:My picturestp.jpg进行图片链接，那么在本地电脑中将一切正常，因为在c:My pictures下的确存在tp.jpg这个图片。但你将它们上传到网站服务器上后，就不会正常了，因为服务器给你划分的存放空间可能在C盘其他目录中，也可能在D盘其他目录中，总之不会那么巧的就是c:My pictures。那么图片路径应该如何设置呢？这里就必须使用相对路径了，所谓相对路径，顾名思义就是自己相对与目标位置。在上例中index.htm中连接的tp.jpg就可以使用My picturestp.jpg来定位文件，这样不论将这些文件放到哪里，只要它们的相对关系没有变，就不会出错。具体的链接方式是这样的：“..My picturesimg.jpg”，其中使用“..”来表示上一级目录，“....”表示上上级的目录，以此类推。

　　我们一起来看看初学的朋友可能犯的几个路径错误：

例1

　　c:mywedwedindex．htm

　　c:mywedimgtp．jpg

　　在此例中，index.htm网页中有tp.jpg这个图片，因为两个文件同在Mywed目录下，所以初学者可能把图片链接写为imgtp.jpg，那么这样实际的链接就变为了C:mywedwedimgtp.jpg，显然这是不正确的。正确的路径应该是相对路径..imgtp.jpg。

例2

　　c:mywedwedwed1index．htm

　　c:mywedimgimg1tp．jpg

　　在此例中，index.htm网页中有tp.jpg这个图片,初学者可能错误的把图片链接写为..imgimg1tp.jpg，那么这样转为绝对路径就是C:mywedwedimgimg1tp.jpg了，因为在该目录下并没有此文件，所以显然这种链接是错误的。正确的应该是....imgimg1tp.jpg。

例3

　　c:mywedwedwedindex．htm

　　c:mywedwedimgtp．jpg

　　在此例中，index.htm网页中有tp.jpg这个图片，初学者可能错误地把图片链接写为....imgtp.jpg，那么这样转为绝对路径就是C:mywedimgtp.jpg了，因为在该目录下并没有此文件，所以显然这种链接是错误的。正确的应该是..imgtp.jpg。

　　通过上面三个例子，我们可以看到网页与图片所在目录相同的部分都可以使用“..”进行代替。

　　有的读者可能会有这样的疑惑：一个网站有许多的链接，我怎么能保证它们的连接都正确，如果我调整了一下图片或网页的存储路径，那不是全乱了么？为了提高工作效率，我们推荐大家使用Dreamweaver进行网站编辑，因为它有个站点管理功能，使用该功能绝对路径可以自动地转化为相对路径，并且当你在站点中改动文件路径时，与这些文件关联的连接路径都会自动更改，实在是方便极了！


控制横向和纵向滚动条的显隐？
<body style="overflow-y:hidden"> 去掉x轴
<body style="overflow-x:hidden"> 去掉y轴
<body scroll="no">不显

--------------------------------------------------------------------------------
 表格变色
<TD onmouseover="this.style.backgroundColor='#FFFFFF'" 
onmouseout="this.style.backgroundColor=''"
style="CURSOR: hand"> 
--------------------------------------------------------------------------------
 禁止复制，鼠标拖动选取
<body ondragstart=window.event.returnValue=false oncontextmenu=window.event.returnValue=false onselectstart=event.returnValue=false> 
--------------------------------------------------------------------------------
 普通iframe页面
<iframe name="name" src="main.htm" width="450" height="287" scrolling="Auto" frameborder="0"></iframe>

--------------------------------------------------------------------------------
 iframe自适应高度
<iframe name="pindex" src="index.asp" frameborder=false scrolling="auto" width="100%" height="100%" frameborder=no onload="document.all['pindex'].style.height=pindex.document.body.scrollHeight" ></iframe> 
--------------------------------------------------------------------------------
 IE地址栏前换成自己的图标&可以在收藏夹中显示出你的图标
<link rel="Shortcut Icon" href="favicon.ico">
<link rel="Bookmark" href="favicon.ico"> 
--------------------------------------------------------------------------------
 字号缩放
越来越多的人长时间的泡网，眼镜的普及率也越来越高，让文字大点，让更多的用户看的更清楚。
<script type="text/javascript">
function doZoom(size)
{document.getElementById('zoom').style.fontSize=size+'px';}
</script>
<span id="zoom">需要指定大小的文字</span>
<a href="javascript:doZoom(16)">大</a> <a href="javascript:doZoom(14)">中</a> <a href="javascript:doZoom(12)">小</a> 
--------------------------------------------------------------------------------
 select挡住div的解决方法 
在div里加入下面的代码，根据需要调整就可以了。

　　部分站长可能有体会.做一些联盟广告时.由于联盟广告的加载慢.严重影响了整体页面的显示速度.所以我把下面这段代码贴出.希望对大家有所帮助.

　　第一步：把这段代码放在你要放广告的网页位置：

<SPAN id=ad_01>广告载入中...</SPAN>

　　第二步：把这段代码放到页底:

 <SPAN class=spanclass id=span_ad_01>
这里放广告的JS代码或其他加载速度比较慢的内容都可以.
</SPAN>
<SCRIPT>ad_01.innerHTML=span_ad_01.innerHTML;span_ad_01.innerHTML="";</SCRIPT>

　　这段代码的原理就是: 由于网页是由上往下执行代码.所以前面会暂时显示 "广告载入中..."

　　等到执行完整个页面后, 前面才会调用出来. 所以我们把广告的代码这些放到最后执行让前面调用, 就不会影响站点页面中正常的内容输出的速度了.

　　注意：可以增加多个调用，修改"id=ad_01 " 对应的几个就可以了。




标签：[!--infotagslink--]

您可能感兴趣的文章: