前端学习笔记一:关于一个新页面的开发

刚开始做前端开发,只是要整体做个页面,这次还是第一次,做下总结。

页面是一个新的页面,视觉设计师给了一份标注稿和视觉稿,还有一个ps程序的页面设计稿(后来发现这个很重要)。

开发上面使用: 

1。必须的html,css,js基础,同时还有模板开发语言基础;

2。最好能够熟悉各种字体,大小尺寸;

3。最好要熟悉前端现有的规范和基础库,这样做起来就会得心应手;


调试使用:

1。使用各种前端开发工具,比如调色器,PS截图;

2。firebug插件,这个很有用;

3。性能测试工具;


整个页面弄完,刚开始走了点弯路,不过在专业人士指点下,又绕回来了,整体布局很重要,目前公司前端的用的比较多的是div,盒结构,所以写的时候要注意多个浏览器测试,还有写前端的一些经验也要多向专业人士请教,比如整体页面就是952大小,最好使用静态像素不要使用%等,因为页面位置就这么点,线条等都要算像素,所以算术也要好哈 。

 

开发过程中比较好的开发方式是:

1。由于新的页面,完全可以自己先写个html的demo版本,调试显示符合要求了,再合并到模板上面去,这样可以减少后台代码或者业务的干扰;

2。视觉稿上面,如果出现了渐变色、隐性图片等背景,基本可以直接使用截图来处理;

3。引入外部文件的时候,要了解里面的有那些css处理,有些页面上面出现“莫名其妙”的问题,很有可能就是这个造成的;

4。盒模型,用的比较的多是 padding,float标签;做来定义层次关系和内部数据显示;

5。标签的命名最好也能有一定的含义和规则,但要保持css整体有一个结构组织性,这样看css也能大致了解层级关系;

6。写的时候,html代码最好格式化,标签的闭合,层级关系要清晰;自己好,看的人也好!


PS:css学习网站:http://www.w3school.com.cn/css/


  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值