系统自带网页字体分析和效果
作者:dangbao 日期:2009-04-08
网页字体显示一直是中文的硬伤，默认的中文字体只有少的可怜的几种。而且字体太大了会有明显的锯齿，严重影响了网页整体效果。正式网页中我们能用的也就是宋体和黑体两种。而且黑体的使用一般也只用在标题或者导航中。所以一直以来，我们想要绚丽的中文字体，只能通过图片来表现。当然也可以用@font-face来显示我们需要的字体，但是对于网络及带宽来讲，字体的体积也太庞大了。如果连英文操作系统的中文显示效果也考虑到，那么我们还是乖乖的用默认的字体吧。定制字体语法：
既然中文字体很难做文章，那么就让我们来看看英文字体的变换吧。下面是本博整理的系统英文字体实际效果对比。
Code
@font-face{font-family:Mistral;src:url(字体文件地址);}
Html
网站型网络公司和人员现状
作者:dangbao 日期:2009-04-02
本文要描述的只是建设和经营网站的中小型网络公司，也只针对对有前端人员的公司进行分析。不包含网络硬件以及IDC类型的网络公司。网络软件产品类的也不作评析。大型的网络公司机构设置复杂、人员分工明细，无法相对比。
目前来说，网站型网络公司的类型大致分两种。一种是企业建站型。一种是门户网站型。下面就目前形势下，分别对两种类型网络公司的通常情况做一些个人的分析和观望。
目前来说，网站型网络公司的类型大致分两种。一种是企业建站型。一种是门户网站型。下面就目前形势下，分别对两种类型网络公司的通常情况做一些个人的分析和观望。
- 公司职能：企业型公司职能较单一，为企业或个人建设网站以及提供相关网络服务;门户型公司则涵盖的范围广,为企业或个人提供网络信息服务。
- 客户群体：企业型公司客户群较小，有局限性，是有建立网站需求的公司和个人。门户型公司客户群范围大，是有网络信息需求或网络服务的公司和人个。
仿Facebook自动圆角头像
作者:dangbao 日期:2009-03-25
Facebook最近改版了，突然发现在朋友的头像列表里都是圆角的图片。保存后看到的却是一张直角的图。而最近有朋友也翻译了一篇老外的关于PNG透明背景的文章。于是摘出来效果以供学习。查看了一下它的源文件，结构嵌套达10多层，怪吓人的哦。也看到了这种所谓的圆角效果，其原理就是在图片上用span绝对定位一个圆角效果的透明PNG图片，遮罩后恰恰是我们可以看到的圆角效果了。当然只要修改PNG图片，可是加各种印花效果了。当然不要忘记了老朋友IE6下PNG的不透明问题，如果浏览器低于IE7,则使用一个HTC来修正吧。
Code
<!--[if lt IE 7]>
<style type="text/css">
.photo span{behavior:url(iepngfix.htc);}
</style>
<![endif]-->
<style type="text/css">
.photo span{behavior:url(iepngfix.htc);}
</style>
<![endif]-->
Tags: 圆角
自动循环切换Tab选项卡
作者:dangbao 日期:2009-03-23
09年ICP备案成功
作者:dangbao 日期:2009-03-18
CSS Sprites之宽度自适应菜单
作者:dangbao 日期:2009-03-16
JavaScript中的CSS属性及命名规范
作者:dangbao 日期:2009-03-12
许多CSS样式属性的名字中都有连字符，在JavaScript中，连字符被解释为减号，因此，CSS2Properties对象的属性名和真正的CSS属性名有点不同。如果一个CSS属性名含有一个或多个连字符，在JS中则需要删除了连字符，并且原来紧接在连字符后的字母改为大写。要注意的是float是JS的关键字，所以在JS中float被写作cssFloat与或floatStyle。下面是CSS自身属性与JavaScript中CSS编码对照表:
盒子标签和属性对照:
盒子标签和属性对照:
Code
CSS语法 (不区分大小写) JavaScript语法 (区分大小写)
border border
border-bottom borderBottom
border-bottom-color borderBottomColor
border-bottom-style borderBottomStyle
border border
border-bottom borderBottom
border-bottom-color borderBottomColor
border-bottom-style borderBottomStyle
Tags: JavaScript
cookie记忆-防刷新菜单
作者:dangbao 日期:2009-03-10
本人收集的一个效果，通过cookie记忆最后一个点击菜单的class，从而实现菜单当前选中的状态。在点链接的时候会出现难看的虚框，所以我更改了代码，使之看起来更加美观。当然这个效果并不适用于大型交互网站，因为它只是记忆上次点击来显示。如果本页内有其它菜单下的内容，那么它依旧会显示选中的是上次点击后的菜单。因此此效果用在交互性不是很强的网站，如展示型企业站和个人站。不想为每一个页面都新建一个头部，每个头部只是在被选中的菜单上加一个class。那么就用这个防刷新菜单吧。
查看完整"cookie记忆-防刷新菜单"效果
查看完整"cookie记忆-防刷新菜单"效果
Tags: cookie-menu
网页前端制作发展小漫谈
作者:dangbao 日期:2009-03-06
CSS和XHTML经过这几年在国内的发展，已经占据了主导地位。也成了网页前端必须掌握的技能之一。关于两三年前用TABLE布局好还是DIV布局好的争议已经烟消云散，已经完全没有必要提了。网站的各个职位要求似乎都跟CSS沾上了边，设计、程序都要会写几个样式。网页前端制作也一下子成了热门职位，即使在金融危机的困难风潮下，招聘前端职位的公司还是很多。毕竟作为一个新兴的职位，和其它职位比较起来，前端技能熟练的人还不能算是太多。不过新人学习的劲头也足一些，很多人为了换博客和空间的皮肤也开始学习CSS，所以也产生了好多CSS相关的网站、论坛、QQ群。也是个好现象吧。
CSS3标准的呼之欲出，将使得CSS也会发展成为一门弱编程语言。所以前端的难度也会更大，更多的样式和属性需要使用。而且各个浏览器也会推出自己有关CSS功能的额外扩展需要我们知道。未来的CSS会更加强大和健壮。当然，浏览器的兼容问题依旧存在。最近WEB界掀起了反IE6的运动，为推动W3C标准和更好的用户体验，建议升级IE6。而目前来说，IE8仍在测试阶段，对CSS3也提供了部分支持。而新版的火狐、Safari也开始支持CSS3。
JavaScript在最近几年也重新焕发了光彩，编程的要求也会越来越高，不过prototype、jQuery等JS插件的不断更新使我们更充满了想象力,也让代码书写更加从容简单。因而也是前端人员需要掌握的技能。不过IE的自身标准和W3C的标准不兼容问题，也需要我们从头开始学习。本博推荐JavaScript权威指南，比较详细的介绍JS核心内容和浏览器支持特性。
就我个人来看，网页前端在将来还会在网站中占据很大的空间和位置。网页前端的水准会走上一个新的发展历程。
CSS3标准的呼之欲出，将使得CSS也会发展成为一门弱编程语言。所以前端的难度也会更大，更多的样式和属性需要使用。而且各个浏览器也会推出自己有关CSS功能的额外扩展需要我们知道。未来的CSS会更加强大和健壮。当然，浏览器的兼容问题依旧存在。最近WEB界掀起了反IE6的运动，为推动W3C标准和更好的用户体验，建议升级IE6。而目前来说，IE8仍在测试阶段，对CSS3也提供了部分支持。而新版的火狐、Safari也开始支持CSS3。
JavaScript在最近几年也重新焕发了光彩，编程的要求也会越来越高，不过prototype、jQuery等JS插件的不断更新使我们更充满了想象力,也让代码书写更加从容简单。因而也是前端人员需要掌握的技能。不过IE的自身标准和W3C的标准不兼容问题，也需要我们从头开始学习。本博推荐JavaScript权威指南，比较详细的介绍JS核心内容和浏览器支持特性。
就我个人来看，网页前端在将来还会在网站中占据很大的空间和位置。网页前端的水准会走上一个新的发展历程。
css相关的seo事项
作者:dangbao 日期:2009-03-02
SEO的重要性会越来越重要，它已经渗透到网站的层层面面了，一个健康积极的网站会使得搜索引擎非常友好。下面来谈谈关于前端人员在写代码时的SEO事项，当然我不是SEOER，所以以下言论纯属个人体会，还请看客您指点指正。
以上各项的重要性依次递减，希望能对网页同仁有所帮助。
- 结构。良好的结构是搜索引擎所青睐的，代码结构层次分明，逻辑清楚。蜘蛛爬行的时候也会很顺当。这可能是每个搜索引擎都想要的吧。通常在写一个页面之前先构思一下整个的布局，选择一种合适的版式再来写结构，本着尽量少嵌套层的原则上进行。用最简洁的代码来描述出网页，相信对自己也是一种不断提高。
- 标签。语义化的标签也是一种良好的习惯。弄明白每个标签该出现的合适地方。比如H1的重要性，但是不能因为它重要就疯狂使用，也许你是无意的，但是搜索引擎很可能以为你在作弊。保持页面标签的整洁和语义化，让爬虫能良好的阅读代码。请查看本博关于标签使用的一篇文章DIV癖
- css命名规则。个人感觉良好的命名规则会让搜索引擎快速的识别理解本段代码。查看css命名规则
- W3C验证。这项似乎可能有人会不认同。因为即使不通过W3C验证，网站也依旧很友好，收录很好。但是我想说，作为网页界统一标准和规范的权威机构，搜索引擎对网页质量的考核上也肯定会越来越重视验证服务的。这里我想提醒大家一点，尽量少在用页面中用style，需要写样式的地方要写在样式表中。请查看本博的通过W3C标准验证
以上各项的重要性依次递减，希望能对网页同仁有所帮助。
