页面重构合理化讨论(第三期WEB标准化交流会总结)

发表于 WebBuild

昨天参加第三届WEB标准化交流会,讨论的话题是页面重构的合理化。会上大家都讨论得很热烈,我也在这里做下个人的总结吧。

WEB标准化交流会在北京已经成功举办了三届,首先感谢这三期以来积极参与讨论的参会者,感谢身边网百度UXday的场地支持,感谢W3C中国简单网buleidea、谷歌中国软件部、百度FE及WED团队的支持。我们也希望更多的前端爱好者参与到讨论会中来,共同讨论和推广WEB标准。

好了,回到昨天的讨论的话题吧。先从DTD开始,DTD其实主要是告诉终端你的doc是什么type的。就好像在入校之前你会告诉学校你的性别以方便安排你到男宿舍还是女宿舍一样,不写DTD就留给了浏览器一个“猜”的任务,这样其实是比较危险的,很多情况下你不知道浏览器会怎样来处理。假如春哥入学不写明性别,就可能有分错宿舍的危险。接下来讨论的是通过W3C验证的必要性,大部分同学观点比较明确和统一:通过W3C验证至少可以去除一些基础的嵌套错误。就像是照镜子吧,脸上有个脏的地方可以通过镜子照出来,有没有前列腺炎是不能照镜子照出来的,所以镜子是必要的,但是镜子不能反映所有的问题。这就是为什么会有医生为什么会有专业的前端开发者。语义化及命名规范以及由此衍生的microformats和RDFa等知识好像在昨天的参会者中研究的同学并不是很多,记得原先初中政治课中有说道规则是为了更大方面的自由。第二期交流会的时候就有提到行业规范化的东西、后来我和月影回来一直觉得可以推动这方面的工作,这个真的还是挺有意义的。社会主义是有可能实现的,关键是不能做空想社会主义也不能在实现的时候变质,我们的国家已经走了中国特色,我们的网页不能再走中国特色,如果你和我一样觉得互联网是当今世界社会主义最好的呈现的话。如果能理解就不会出现div和ul标签泛滥的情况,扯远了~。微格式和twiter的@符的马太效应使我们想到可以做和应该做的还有很多。关于标签更大语义化的工作W3C也在努力,大家应该可以在HTML5中感受到,就有同学提到了实际应用中经常遇到不知道该选择什么样的标签的问题,这也确实是现阶段HTML标签存在的一个问题。当网页内容越来越“丰富”的时候问题将会更加明显化,最开始的网页不是也不支持图片?现在的网页上img标签已经遍地都是了。不过世间万物可以归宗两象五行,又但是W3C曾有想将图片归用object标签来描述是合理的么?这方面可以思考的还有很多。会上有很多同学不太熟悉属性语义和属性值语义方面的东西,特发几个传送门:语义网microformats.orgRDFa

交流会的第二个讨论话题是样式合理化的问题。在实际应用中会分项目的性质来把不同的组织,一般小的个人网站就一个样式文件就行了,节省请求。对于具体的应用项目可以分离公共样式+项目特定样式的形式组织,大家的意见也都比较统一。讨论期间rekey有提到公用样式后期的特殊化的问题,相信这也是很多页面开发者遇到的实际问题。其实克军在12号的webrebuild要也有讲到这个问题,关于模块化的组织。核心还是在页面架构方面,好的架构可复用性和单独拓展性都是需要考虑到的,当然在实际项目中还要评估为什么以前的统一模块中有一个或几个要单独加/减其他东西。能不能实现改的功能是我们在架构时候需要考虑的,为什么需要改是产品和设计和我们协作的问题,有一个前期的一致规范是好的。克军上次也有提到接下来HTML要走一段路了,关于模块化方面的东西个人觉得某些方面是可以借鉴js框架的思维。HTML是洋葱的核心(?,见克军ppt),是牵一发动全身的东西,这么重要的东西不能三思而后行么?

第三个讨论话题是素材合理性,更多的涉及到了第一期讨论会网站重构中的文件组织和第二期讨论会CSS Sprites方面的知识。讨论到了图片格式的选择,结论还是大部分选择png-8、gif、jpg这三种格式,按需所取。比较理想的是期间讨论了图片压缩的话题,本来我们上周自己的组内也讨论了这个话题,两次讨论得到的结论都是压缩无止境,呵呵。其实素材管理很有讨论性的是图片管理和缓存方面的东西,我也很想听到各个公司对于这方面的实战经验,因为到会的有谷歌、微软、新浪、百度等大公司的前端,各个公司的部署肯定有很多不同,很有交流讨论价值,不过由于时间原因还是没来得及讨论。

很高兴在twitter直播上码头同学有提到“认为要做好页面重构的合理化最重要的是前期项目规划的合理化”。这其实是我一直在等待的答案。建筑结构工程师和只会砌墙(切图)的建筑工人,你自己怎样定位?知道这一点你就知道以怎样的态度来思考你在干的事情。

期待下一次的交流会,如果你也一样的话,请留意w3ctech官方网站,我们将在每月的最后一个礼拜的周六聚首讨论。更多信息可以follow我们的twitter:http://twitter.com/w3ctech或加入QQ群:46077068。

继续阅读 »

猥琐地实现域名转发

发表于 WebBuild

发现很久没有写东西了,因为越来越懒了。

早两天终于将域名从比较垃圾的阳光互联转出到Godaddy了,比较兴奋,并且终于可以添加SRV记录了,hoho。

不过因为天朝的强大,域名转发功能被X了。

国内的某些DNS解析提供商也禁用了域名转发。

一般的朋友会使用强大的htaccess来做重定向,可是因为我觉得写htaccess比较麻烦,又为了给不支持htaccess的朋友提供方面所以使用php来重定向,使用xml来存储,这样没有方便没有数据库的朋友。

有需要的朋友可以在这里下载,有需要修改的加了注释

有几点说明下:

  1. 将文件上传到你的空间,绑定你想转发的域名到这个空间上
  2. 没有使用登陆验证,请修改a4.php这个文件名
  3. 同时如果你不想让别人看到你哪些域名在使用转发,修改xml文件名,Linux机修改其属性为777
  4. 使用robots文件防蜘蛛暴漏你的添加域名的文件地址(像Godaddy就强大到给你生成sitmap提交到google)
  5. 如果你的空间和域名都支持泛解析,那就更乖乖了

懒人工具,提供给和我一样懒的朋友。

 

 

继续阅读 »

记录IE下一个bug,label下的图片聚焦表单元素失效

发表于 WebBuild

应该有很多朋友已经发现过这个神奇的BUG,此BUG在IE5.5-IE8下通吃,就是当label中是图片元素的时候,无法通过点击该图片来激活绑定的表单元素,请用IE看这里>>

已有朋友提供使用添加元素+背景图+绝对定位遮盖的方法来解决这个问题,请看这里>>

这种办法在使用中可能比较麻烦,因为图片极大的可能性是不一样的,并且一般背景图和页面图片会存放在不同的文件夹甚至服务器上,加上设计者的权限等乱七八糟的问题,可能麻烦性更大。

还有一种方法就是可以使用js来实现,比较简单,虽然在无js支持的情况下会失效。我想的是:js都不支持的浏览器也不在乎多这点可访问性的牺牲。(接受异议)

基本代码:

<script type="text/javascript">
        var lb=document.getElementsByTagName('label');
        for (i=0;i<lb.length;i++) {
            lb[i].onclick=function () {
                var lbfor=this.getAttribute('for')?this.getAttribute('for'):this.getAttribute('HTMLfor')+'';
                document.getElementById(lbfor).click();
                document.getElementById(lbfor).focus();
            }            
        }
    </script>

可以通过这里查看>>

事件处理比较简单,你可以自己修改针对不同类型的表单元素使用switch来触发条件,对于checkbox框再来判断是否选正等,我省略了这些,就在js前加了IE判断。

两个小插曲:

  1. 在IE下使用getAttribute获得的值类型是Object,需要处理下,关于这点请参考rank的这篇文章
  2. 感谢屈屈提示在IE8以下版本的IE无法直接通过some.getAttribute('for')的方法获取到for的值,因为for是保留字,类似的还要class,需要使用HTMLfor。
继续阅读 »

关于ZJL2doc的说明

发表于 杂七杂八

zjl2doc是我在去年找工作的时候写的一个很简单很烂的php小应用,因为那时候找我给他们做简历的同学很多(因为现在还有很多同学对使用$MS word做一个简单的简历都比较有难度,其实很不能理解),我又是很懒的人,所以写了这个给他们用,这是初衷。

怀着不怕丢脸的“伟大”精神,将这个发在落伍者了,后来有些朋友用了,也和很多朋友交流了。一直就有很多朋友提建议,真的很感谢这些朋友,我也一直说等有时间了我会帮他实现。只是从去年找工作,做毕业设计,然后毕业了匆忙来到公司,来到公司又很快开始做事了,时间一直没有很多(可能是借口,呵呵)。

虽然当初写的时候就知道有很多很不完善的地方,现在看起来,好像没有一个地方能有稍微满意的。当然也不会再发布什么新版本了,虽然我一直想打翻再重做。一直以来就有很多朋友在Gtalk上给我聊天,这些朋友欢迎继续和我交流,有什么需求我会抽时间帮大家实现。不过我本来就基本不怎么会php,加上很久没用过了,现在职业也基本与它脱钩,还有可能存在的没有时间的偷懒的借口,所以并不会在很短的时间给朋友们交满意答卷。

还有一个最重要的问题:我现在没有电脑用。郁闷啊!

这篇博文算是对近段时间在IM软件或邮件一直问我关于zjl2doc的“官方”——这个词感觉怪怪的——答复。

谢谢所有关注过Zjl2doc的朋友!

 

继续阅读 »

毕业了

发表于 Life

很久没有在博客上写东西了,毕业也快一个月了,以前一直在想到毕业的时候要留点东西给以后的自己看,可是自己很懒,一直都没有更新博客。

现在已经到了公司,上了一周多的班了,接下来一周的时间会很忙,所以趁PD那边还没有出成品来(借口)将“欠下”的毕业博客写下。

被抓拍到的我 寝室兄弟和班上的美女 毕业前一周我们在校园 我们毕业了

 

(上面的衣服是借的,都穿错了,哎)

 

大学四年一晃而过,在学校时候经常有朋友问到在干什么,我的回答也老是:“不知道在干什么,但是很忙。”(可能我真的需要看看《时间管理》这本书)。

如今再回想下在大学里面,好像除开拿奖学金好像“什么都干了”。汗!

交了一群朋友,挂过N多的科,也在学生会混过,干过兼职,当过苦力,和女孩子也“牵过手”(虽然这一点很失败,不过很纯洁吧?虽然我寝室人老是说我有“搂搂抱抱”的事情发生过,但是我“忘记”了),捣鼓过“无数”的网站,结识了不少的“狐朋狗友”——使我后来所谓的真正步入社会很有帮助,学会了打CS和魔兽——虽然n菜,丢过图书馆几本书(之所以提到这一点是想自欺欺人的“说明”我也进过图书馆),最后还“顺利”地拿到毕业证和学位证并且在毕业之前将工作的事情解决了,OK了!

阿肆“小朋友”之所以能在这四年能茁壮地成长没有发生什么大的意外(能有什么大的意外发生呢?)我觉得我得感谢很多的人,真的,毕业的那一刻,我心里的第一个强烈的情感就是:感谢。

首先,得感谢我的父母,是他们给了我生命和美好的生活。并且我一辈子生长在农村的父母可能连电脑都没有见过,但是培育出了一个最终能在国内还比较出名的计算机公司工作的儿子,我觉得他们是伟大的!

还有,虽然我对现今的中国共产党情感并不是很好,但是我感谢共产党给了我受教育的机会,使一个“山里的孩子”能走到大都市。(虽然或许是其他党执政我也有可能受到良好的教育,但是这个感谢之情却是我真实的)

感谢十几年来教育我的老师们,尤其是大学之前的老师。

感谢我所有的朋友,感谢他们能容忍我这样一个任性的朋友。感谢高中312和大学201的兄弟。

感谢互联网,使我认识了很多朋友,学习了很多真正有用的知识。

感谢落伍者网站,一直伴随我大学四年的生活。

感谢Allen Iverson,他使我成长很多。

感谢广东中烟红双喜。

感谢Jeffrey Zeldman先生,是他的书使我决定从事一项有意义的工作。

特别感谢下面的老师:我小学的入门老师李艳茹老师,我小学校长李罗香老师,我初中教导主任佘志军老师,我的补习老师王爹。

特别感谢下面的朋友:和我一同长大的郭胜,他一直帮助着我;初中时候的好兄弟叶海,他教会我坚强;大哥高冲,他教会我用自己的方式生活;好兄弟随哥,他对我很照顾;一直和我在一起的乐哥,在生活上一直帮助着我;徒弟七满孩,在高中时一直对我很好;好“长辈”朱哲、覃克宏,他们对我帮助和照顾很多;感谢老乡瞿军和黎德俊,他们也一直照顾着我;好弟弟小鸣,对我真的很好。还有很多很多的朋友......

呵呵,好像在搞获奖感言一样,其实我非常不易的拿到两证的时候心情和获奖了是差不多的,加上以前也没有好好地“书面”来感谢这些人,所以“好好地感谢下”,让他们知道他们对这个社会上的其他一个人是有影响的。

 

感觉写生活类的东西比写比较“技术”点的东西要累很多,就到这里吧

纪念我毕业了,祝我以后生活顺利吧!

p.s:我现在在北京,可怜地北漂着,有在这边的朋友麻烦照应下了,呵呵。

继续阅读 »

使用Msg2phone通过网页免费发送短信到手机

发表于 WebBuild

上次偷米饭童鞋写了个WP有新评论就发送短信提醒的插件,借助的是移动139邮箱的“邮件到达提醒”,于是发现可以通过139邮箱的这个功能实现直接通过网页发送短信到手机,并且还是免费的。

无聊中我就写了这个:Msg2Phone,这个有什么用呢?首要作用就是我写着玩玩,呵呵,当我不在线有人需要找我的话可以通过这里发短信给我,而我不必告诉互联网我的手机号码。如果你有和我同样的需求,也可以试试。

 

下面是需要设置的地方:

打开你的139邮箱,点开“邮件到达提醒”设置页:(如没有注册的朋友需要先注册。顺便说一下,139邮箱使用的是和网易邮箱同样的Coremail邮件系统,对于大部分朋友来说应该比较容易上手)

sz01.jpg

在设置中,需要开启邮件到达通知,手机接受时间依自己情况设置,发送方式推荐使用350字长短信。

sz02.jpg

然后你就可以打开Msg2Phone,输入你的手机号码进入下一步,这里会发送一个验证短信到你的手机,填入验证短信(5位数字母和数字的组合)进行简单的设置就可以了。如果长时间(10分钟之后)没有收到验证短信,可以再次输入你的手机号码,会有提示消息,点击重发验证码的链接就可以了,以后需要修改信息也可以通过这里。

 

可以借助139邮箱的这个功能实现诸如手机验证,Twitter手机提醒等服务。不过还是需要提醒朋友们不要随意在网上填写你的手机号码,就算是上面的Msg2phone,如果你质疑我的RP,也不要注册。

继续阅读 »