最近工作小总结(DIV+CSS网页制作)

January 15th 2008,02:59 PM 学习工作 , 8 comments

上周,被分配到一个网站的改版任务
时间安排是9-18号页面制作然后交由程序组去嵌套程序

这是我第一次做网站任务
之前只是做些网站活动页面
那到psd图后发觉页面全是圆角和渐变,不禁头大了一圈
不过对于公司视觉组同事的设计风格我也早就领教了
他们的设计做的很漂亮,但个人感觉更像平面设计而非网页
当然,我的工作还是要做的

首页,着实让我头痛
在写首页的过程中发现很多知识还有待学习
而对于结构的合理性、重用性等也有待提高

开始制作页面时思路框架还是挺清晰的
后来发觉随着DIV不断的嵌入,思路也有些混乱起来
对于我这种菜鸟级别的人,在写页面之前应该先把框架图画出来
主体框架、嵌套、最好可以把每个DIV的名字也写出来
先把整体框架搭建好,然后逐渐往里面填充细节内容
框架搭好后往里面填内容,发现有用到tab切换
就是一小导航,点每个栏目下方就出现对应的内容
说实话,这个tab切换平时见到很多网站在用,可我是不会这个操作的
也行这对很多人来说是再简单不过的东西,可却着实难为我了
为此,特意去了几个网站,用FireBug看人家的代码和CSS
本以为“偷”过来稍加改动即可,可谁知没能实现
虽然没有偷成懒,但了解了整个的原理
就是ul li,然后用js来控制切换
这问题就又来了,我不会js,还好有了高人指导

解决了tab切换,再来就是图片和文字的对应了
一个图片对应几行文字,这个说起来并不难
但我的担心就是怕写的不周全嵌套程序后会因为文字的多少而导致撑破页面或错位

兼容问题:
调整了首页的兼容问题,包括IE和FireFox浏览器,宽屏和普屏的显示器,也就是不同分辨率下的兼容问题
做了自适应

这些都还好,最头大的还是圆角问题
按照平常做圆角的方法,用两个div来合成一个圆角
可这样的方式就会造成N多个div
后来发现PPLIVE的圆角做的很好,方式如下
把圆角的四个角切下,然后用这四个角新建合成一个图片
这样不管网站中有多少个圆角框,都可以只用这一个图片
然后在根据background:url() x轴像素 y轴像素来选择定位
可我最终还是没能完全很好的解决所有圆角框以及圆角按钮问题

这个首页,前后来回做了不下五六个
到最后我完全被打败了
写的都不知道什么是什么了,越来越乱
好像走进了固有模式里出不来了,又好像走到岔道上回不来
也可以说是钻到牛角里找不到回来的路了
哭过,大哭过,痛哭流涕
因为页面写不好,也因为自己
想过放弃,放弃全部,完全的否认了自己
和naman说,我不行,做不来
但被说服教育了一番后还是要做
也行一切都要慢慢来吧
也只有让自己加油了

8 Responses

  1. noman, January 15 2008 , 21:44 ,#1
    恩,有进步,会总结了
  2. Iceapple, January 16 2008 , 08:42 ,#2
    拜托~~~我一直都会总结的好哇
  3. 小繁, January 18 2008 , 13:33 ,#3
    Iceapple 哪里人{^_^}
  4. Iceapple, January 19 2008 , 15:31 ,#4
    嗯,Apple是石家庄人哦{^_^}
  5. 小繁, January 21 2008 , 18:02 ,#5
    哈~~~老乡啊~~~
    在外地工作么?
  6. Iceapple, January 24 2008 , 12:03 ,#6
    对啊。老乡哦~~Apple现在上海
  7. 小繁, January 24 2008 , 12:46 ,#7
    ^_^
  8. glssly, May 30 2008 , 16:11 ,#8
    总感觉做美工很累,做程序更累,可是做什么最好呢?

Write a comment:



 



[b][/b] - [i][/i] - [u][/u]- [quote][/quote]

:-/ :d :o :p :( :han: :cry: :zzz: o_o