你在找的正在找你——百度WED前端开发招聘

作者: 阿肆 发表时间: September 28, 2010 分类: WebBuild 8条评论

你是不是正在找一份前端开发方向的工作或实习机会呢？

如果回答是：“是！”。那么太有缘分了，我们也正在找你。

我们是谁？

  • 我们是WED——百度电子商务技术研发部前端开发团队。
  • 我们是专业的前端开发团队，致力于为百度电子商务产品的用户打造最佳体验。
  • 我们是年轻的技术团队，明年1月份才迎来她的第三个生日。
  • 我们是充满快乐的团队，她的官方全称是Web Engineering & Development，但更多情况我们称为：We Enjoy Days~
  • 我们是拥有很多美女、很多帅哥、很多牛人的优秀团队。

加入WED团队，你可以做这些事情：

  • 为百度最优秀的互联网产品改善用户体验
  • 让自己亲手开发的作品被亿万人使用
  • 和众多技术牛人一起钻研最新前端技术
  • 和许多优秀团队进行技术交流
  • 为Web标准和W3C做点自己能做的事儿

加入WED团队，你可以拥有这些：

  • 一边工作一边聊天、搞笑、吃零食
  • 随时表达你的想并得到关注和支持
  • 技术全面发展、辅导和长期的培养计划
  • 享受亲如兄弟姐妹的团队氛围
  • 个人自由支配的时间和发展空间
  • 得到为团队成员精心设计的有趣纪念品

加入WED团队，你可以同我们一起分享这些评价：

  • WED团队是强大专业的团队，快速响应需求，有效率有质量地完成任务
  • WED团队是无所不能的团队，看似不可能实现的交互效果，在不经意间被轻松搞定
  • WED团队是创新求变的团队，我们不时有新想法，迎接新变化，不断给新的惊喜

如果

(你决定成为国内最专业前端开发工程师
&& 你喜欢轻松愉快地工作
&&你享受团结、自由、像一个大家庭般的团队氛围)

只要你接触过这些技术中的一部分

(html/xhtml、css、页面架构和布局
|| Web标准、表现与数据分离、html语义化
|| JavaScript或ActionScript
||php、ruby、python或perl)

只要你能做到

(热爱前端开发这个事业
&& 有很好的学习能力和逻辑思维能力
&& 不错的团队意识和沟通影响力 )

那么，点击下面的链接，加入我们吧：

http://hr.baidu.com/www/job/jobDetail.action?jobId=2259

你也可以直接将你的简历发送给我。

We Do The Same Thing

作者: 阿肆 发表时间: March 29, 2010 分类: WebBuild 3条评论

前天参加了w3ctech第六期的WEB标准化交流会，本期交流会的主题是：前端开发在研发流程中与其他岗位协作效率的提升。会上所有与会者对此话题都发表了自己的看法，也借这个机会了解了很多其他兄弟团队协作项目开发的经验。同时会上其他非前端职位的同学也发表了很多很有参考意义的看法。

随着交流会发表意见的同学越来越多，可以发现最终关键词一致性的落在了“沟通”上。崔凯通过“请吃饭”这一最明了的例子说明了良好的沟通方式可以有效解决跨团队协作中遇到的“困难”。月影在接下来两杯水的例子中用带有哲学又易懂的方式解释了如何从本质上解决跨部门协作难题，那就是我们放开各自心中的“成见”，通过换位思考再大家站到同一个视线上来看问题。如果大家还记得彪叔《一专多长》的PPT的话，应该对引言中法拉利车队的故事印象深刻吧？

到场的同学都觉得前端需要和很多部门打交道，认为前端是“最累”的部门。这一点可能是因为到会者中大部分职业是前端开发的缘故。其实，每个部门都是“最累”的，我们需要与UE打交道，同样UE需要与PM与我们等部门打交道，我们需要和RD、QA、OP打交道，同样RD需要与PM与我们与QA与OP等部门打交道。每个部门都有需要协同合作的人和部门。当我们抱怨UE生气我们页面切出来与UE图相差的时候其实我们可以换位想想当RD将我们的HTML嵌套得“乱七八糟”的时候我们是多么生气的。

我相信在任何一家公司，所有部门的人都是在干同一件事情，那就是将这个项目这个产品做好，大家将自己各自杯子里的水倒干，拥有同样一份事业心将杯子叠到同样一个方向同一个目标。我们可以思考月影在会上提出的问题：你将你做的事情怎样看待？工作、职业还是事业？如果你不思考这个问题，那么工作中“被”遇到的问题将越来越多。相反，你就会知道你要做到什么程度会有成就感？什么时候要换家公司为互联网做贡献了。

这次交流会回来一直很有感想，因为自己所在的部门最近也遇到了一点事情。但是面对外界的质疑和猜想我们依旧保留那份创业心凝聚在一起，很高兴能和这样一群拥有事业心的同事并肩奋斗。

最后，以个人情感并代整个交流会组委会感谢腾讯北京公司提供的场地、茶水和礼品，感谢易联主机CEO tesion提供的奖品，感谢winter和kejun分享的PPT，感谢所有到会的同学和所有关注w3ctech的同学。(p.s：特别赞扬在整个交流会中站着做记录的我们的场记吕婷MM，大家给点掌声！)

使用geolocation API定位你的访问者位置

作者: 阿肆 发表时间: March 8, 2010 分类: WebBuild 6条评论

今天要说一个跨省的好东西玩玩。

那就是geolocation，W3C对geolocation的解释是“defines an API that provides scripted access to geographical location information associated with the hosting device”。Firefox从3.5起就支持geolocation了，习惯赶时髦的opera也发布了一个支持geolocation的版本，几天前Chrome dev 5也正式支持geolocation了。如果你的浏览器被鄙视了也可以使用google gears的Geolocation API曲线救国来玩（关于这一点请参考JerryQu同学早一段时间写的文章）。于是记录和朋友们分享下。

如果你有兴趣可以使用上面提到的浏览器点击这里看个简单的demo。

简单说下前端的实现吧，主要代码如下：

function displayPosition(position) {
    //得到两个值：position.coords.longitude(经度)、position.coords.latitude(维度)。
    /*任意鞣虐得到的经纬度信息来展示你想要的样子吧。
    */
}
navigator.geolocation.getCurrentPosition(displayPosition);

geolocation的原理就是收集你上网的终端设备的某些信息发送到特定的服务接口用来查询以获得你的地理信息，如果你是使用的是无线wifi上网的方式，发送的信息如JerryQu提到的一样，大致如下（Firefox下的抓包）：

post http://www.google.com/loc/json
post_data='{"version":"1.1.0",
            "request_address":true,
            "access_token":"2:OLzIuqa-P8tZYOpu:Gu-LV8OcMFK28CVE",
            "wifi_towers":[
                {
                    "mac_address":"00-23-eb-b7-ef-70",
                    "ssid":"abc","signal_strength":-45
                },
                {
                    "mac_address":"00-23-eb-b7-ef-72",
                    "ssid":"abc_Guest","signal_strength":-48
                }
                ]
            }=';

返回的信息类似如下(可以查看我通过curl脚本模拟的数据 http://www.ivershuo.com/did/geolocation/loc.php)：

{
    "location":
        {
            "latitude":40.0475799,
            "longitude":116.2947221,
            "address":{
                "country":"China",
                "country_code":"CN",
                "region":"Beijing",
                "city":"Beijing",
                "street":"Tangjialing Rd"
                },
            "accuracy":278.0
            }
        }

可以发现firefox也是使用的google的loc接口，如果你提供的access_token值为空或者是错误的在respone的时候会给你返回一个正确的access_token（该值是2周有效的）。wifi_towers包含了你的wifi信息数组用来判断你离热点们(?)的距离等信息。如果你使用的是有线上网的方式会发现传送的wifi_towers数组是空的，但是也会返回地理位置的值，应该是通过ip来返回的（因为我使用服务器脚本去请求该接口的时候返回的是服务器所在地的地理信息），所以偏差很大。现在还不知道是不是可以传送gps数据，有条件的同学可以试试在android手机上验证可以使用gps数据。

不过照前面的demo来看，就算是wifi的方式得到的位置信息还是有一定的偏差（这中间也有不同地图服务的定位信息的偏差），但是比ip获得的位置已经精确很多了。对位置信息精确度教高的web应用可以试点应用玩玩。

回到开头的那句话，大家不要担心跨省，因为浏览器在发送这个信息的时候会先要获得你的授权的。

p.s1：要使用geolocation：Firefox浏览器需要保证about:config中geo.enabled的值为true，chrome dev需要带参数“"--enable-geolocation"”启动。

p.s2：如果你也想构造数据请求google的loc接口，需要保证数据是以application/json的格式请求的。

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

作者: 阿肆 发表时间: August 20, 2009 分类: WebBuild 11条评论

应该有很多朋友已经发现过这个神奇的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。

页码：

    1. 1
    2. 2
    3. 3
    4. 4