网页前端制作中的SEO

在SEO盛行的今天到处都在谈优化,对于网站前端制作人员来说,有几点是跟SEO相关的,也就是SEO站内优化中的一部分,下面总结几点:

1.title,<title>页面标题</title>。页面的标题,不用多说,这个必须有!

2.keywords,<meta name="keywords" content="关键词1,关键词2" />。为搜索引擎提供的关键字列表,各关键词间用英文逗号“,”隔开。页面的主关键词可以列举在这里。

3.description。<meta name="description" content="页面描述"/>。告诉搜索引擎你的网站主要内容。虽然现在description对百度等搜索引擎排名影响不是很大,但是对于用户体验方面还是有用的,可以让用户了解到网页的大概内容,引导点击。

4.robots,<meta name="Robots" Content="Nofollow">。告诉搜索引擎哪些页面需要索引,哪些页面不需要索引。Content的参数有all、none、index、noindex、follow、nofollow。默认是all。

注:①<meta name="Robots" Content="">是对页面上的所有链接生效,包括站内站外。
②nofollow引申:Nofollow最常用的是在a标签上加上nofollow:<a rel="external nofollow" href=""></a>,告诉搜索引擎不要抓取特定的链接。a标签上加上这个属性可以防止权重分散到无关页面,你可以为站点的内部链接添加nofollow。比如:联系我们、关于我们、隐私保护、公司简介、网站后台等的链接,因为这些页面基本不需要权重。

所以站长在交换友情链接的时候应当留意下与你交换链接的站点有没有在其所添加的友情链接上加上nofollow,或者头部是否有<meta name="Robots" Content="Nofollow">。

5.H1,<h1>文章标题</h1>。告诉搜索引擎这个是一段文字的标题,起强调作用。经验表明H1标题确实有比较大的权重,但是不可乱用,建议用在那些长期保持的关键词/词组,H2、H3、H4这些标题已经对搜索引擎没有多大价值了,可以在文章内加上这些标题突出重点,增加用户体验。

6.alt,<img src="" alt="这里可以加上关键词"/>。alt属性对搜索引擎排名也有一定影响,因为搜索引擎目前并不能识别图像,所以在加上alt属性,是一种对蜘蛛友好的表现,有助于提高排名。alt要符合图片本身的内容,同时尽可能包含页面关键词。

7.a标签的title,<a href="" title="这里可以加上关键词"></a>。链接的提示文字,效果微弱,但是从细节做起总是有用的,更何况还能提高用户体验。

8.合理的结构。网站有合理的结构,清晰的导航,可以在页面中加入面包屑,上下篇,相关文章等,这样整个站点之间可以相互链接,形成网状结构,利于蜘蛛爬行。

9.代码精简,提高网页信噪比。网页信噪比指网页中的文本内容部分与生成这些文本而产生的html标签内容的比率。网页信噪比越高,说明页面中纯文本内容相对越多,搜索引擎抓取页面也越容易。使用div+css编码,外部引用css样式表及javascript文件,都能大幅度提高网页信噪比。

上面列举了网页制作中的一些SEO问题,网页设计及制作人员可在建站时考虑这些元素,当然上面说到每一点都有比较多的学问,都值得推敲研究,那就是众多SEOer的活了!

seo-摘自网友的更多相关文章

  1. img标签中alt属性与title属性在seo的作用-摘自网友

    img标签中alt属性与title属性作用,也许大家比较迷惑,现在给大家举例说明.alt属性是图片的替换文字.title属性规定元素的额外信息,有视觉效果. 目录 alt属性 title属性 ie和f ...

  2. overflow属性-摘自网友

    关于我们 版权声明 网站地图 前端观察 专注于网站前端设计与前端开发 用IE6抢不到火车票的!!! Home 首页 CSS样式之美 Front News前端资讯 JavascriptAjax与JS技术 ...

  3. JQuery插件让图片旋转任意角度且代码极其简单 - 摘自网友

    JQuery插件让图片旋转任意角度且代码极其简单 2012-04-01 09:57:03     我来说两句      收藏    我要投稿 引入下方的jquery.rotate.js文件,然后通过$ ...

  4. IE6中CSS常见BUG全集及解决方案——摘自网友

    IE6中CSS常见BUG全集及解决方案 IE6双倍边距bug 当页面内有多个连续浮动时,如本页的图标列表是采用左浮动,此时设置li的左侧margin值时,在最左侧呈现双倍情况.如外边距设置为10px, ...

  5. 如何合理命名CSS文件——摘自网友

    有经验的网页制作者都明白,对于有多个栏目的大型网站而言,使用单一的CSS文件是不可能的.但CSS文件名如何命名对于新手来说是件容易出乱子的事.如何才能将CSS的命名做得井井有条? 坚持使用统一的CSS ...

  6. 10个CSS简写/优化技巧-摘自网友

    10个CSS简写/优化技巧23来源/作者:未知 类别:前端开发 字体大小:大|中|小 背景颜色:蓝|白|灰 ? ? CSS简写就是指将多行的CSS属性简写成一行,又称为CSS代码优化或CSS缩写.CS ...

  7. 基于android studio编译工具下的android开发之IBeacon 例子

    想直接看主要内容的请调到红字下面. 之所以会接触到android下的IBeacon,是因为我自己导师给的任务.一个网址http://estimote.com/和一句话:看看这个网站,然后试下在安卓手机 ...

  8. MySQL分表自增ID解决方案(转)

    当我们对MySQL进行分表操作后,将不能依赖MySQL的自动增量来产生唯一ID了,因为数据已经分散到多个表中. 应尽量避免使用自增IP来做为主键,为数据库分表操作带来极大的不便. 在postgreSQ ...

  9. oracle使用dbms_metadata包取得所有对象DDL语句

    当我们想要查看某个表或者是表空间的DDL的时候,可以利用dbms_metadata.get_ddl这个包来查看. dbms_metadata包中的get_ddl函数详细参数 GET_DDL函数返回创建 ...

  10. 微软Sharepoint的一些缺点

    转:http://bbs.tianya.cn/post-144-566491-1.shtml 微软Sharepoint的一些缺点(一) 微软Sharepoint的一些缺点 关于SharePoint,它 ...

随机推荐

  1. bzoj1660 / P2866 [USACO06NOV]糟糕的一天Bad Hair Day

    P2866 [USACO06NOV]糟糕的一天Bad Hair Day 奶牛题里好多单调栈..... 维护一个单调递减栈,存每只牛的高度和位置,顺便统计一下答案. #include<iostre ...

  2. 20145205 武钰 《网络对抗》Exp8 Web基础

    一点题外话 本次实验我三号完成的,由于一些原因吧,一直没发博客,拖到了现在,这里说就是评判一下自己的懒惰. 实验后问题回答 (1)什么是表单 表单在网页中主要负责数据采集功能. 一个表单有三个基本组成 ...

  3. canvas绘图详解笔记之线条及线条属性

    创建 canvas 首先创建一个canvas元素,我们只需要在html文件中加入这么一句代码: <canvas id="canvas">当前浏览器不支持canvas,请 ...

  4. JS引擎深入分析

    转载自阮一峰:http://javascript.ruanyifeng.com/bom/engine.html 目录 JavaScript代码嵌入网页的方法 script标签:代码嵌入网页 scrip ...

  5. Codeforces 788A Functions again - 贪心

    Something happened in Uzhlyandia again... There are riots on the streets... Famous Uzhlyandian super ...

  6. Python3基础 issubclass 判断基类

             Python : 3.7.0          OS : Ubuntu 18.04.1 LTS         IDE : PyCharm 2018.2.4       Conda ...

  7. bootstrap的 附加导航Affix导航 (侧边窄条式 滚动监控式导航) 附加导航使用3.

    affix: 意思是粘附, 附着, 沾上. 因此, 附加导航就是 bootstrap的 Affix.js组件. bootstrap的 附加导航, 不是说导航分成主导航, 或者什么 副导航的 而是指, ...

  8. Mysql中unique与primary约束的区别分析(转)

    本文章来给大家介绍在mysql中unique与primary约束的区别分析,unique与primary是我们在创建mysql时常用的类型了,下面我来给大家介绍介绍.   定义了UNIQUE约束的字段 ...

  9. 【分布式计算】30分钟概览Spark分布式计算引擎

    本文主要帮助初学者快速了解Spark,不会面面俱到,但核心一定点到. Spark是继Hadoop之后的下一代分布式内存计算引擎,于2009年诞生于加州大学伯克利分校AMPLab实验室,现在主要由Dat ...

  10. CodeForces Round #516 Div2 题解

    A. Make a triangle! 暴力... 就是给你三个数,你每次可以选一个加1,问最少加多少次能构成三角形 #include <bits/stdc++.h> #define ll ...