• 关于写毕业设计网页代码写后感


    哎,心累!

    开始

         本次本着自己养活自己的原则,接了三个学姐的毕业设计,都是是把她们的设计图编写成网页。实际都是一些布局规整,页面简介的网页。虽然一份网页有15页,但其实以正常速度大约两天就可以写完。所以毫无顾虑,接了三份,时间比较赶,差不多都三天之类要(不是同时接的)。

     

    过程

        第一个学姐的设计是关于美食方面的网页,十五张网页大概只有五种样式。一共是三个人做,但第一次经验不足,在分配任务时非常随意,没有按照网页样式来分配,本来里面有八张样式一样的网页,硬是我们三人一人两三张给做完了(header和footer是一个人早就做好的)。第一份毕业设计做完得还算快,五天完事了(没有一直做,因为有课也有其他事)。在合代码时我们只是检查了部分兼容性和动态效果实现,发现没问题直接发给那个学姐,结果得到的反馈是有大!!问·!!题!!,其实当时我也是懵逼的,虽然不是非常仔细的完成的网页,但大问题应该不至于吧,所以约了学姐见面谈。结果学姐一见面直接就跟我们讲网页与设计图严重不符,变形严重,布局偏差大,不能接受。拿出设计图和我们写的网页一比对真的有问题,所以只能抱歉的帮学姐修改网页。就从这里开始,让我意识到写网页需要注意很多很多东西。

          一,修改代码真的是麻烦,不说别人的代码,自己的也看着累。

                长篇的代码一行行怎得让人眼花缭乱,那么多的英文字母更是让人认不清谁是谁。所以在修改的时候,代码工具,切图工具以及浏览器调试工具一起上,能用浏览器调试工具调试是最好的,明了快速。遇上重新测像素的也还好,就怕自己的代码哪一块只要稍稍加了1px,都会让整个布局崩塌。所以自己的代码一定要注释清楚,样式命名直观(尽量给每一块代码或样式一个特殊的开头),重复样式写在一块,尽量减少代码行数。每张网页复用的header和footer用js引用过来,这样如果遇到修改,修改一次就够了。最后当然是别人的代码啦,看不懂就算了,尽量不在别人代码上做修改,而是让他本人来修改,这样来得比较快速高效。

         二,做好网页自适应

               这是这次写网页遇到的最大的问题。网页变形!这个变形倒不是指网页放大或缩小之后得布局文字混乱,只是每个div块高变矮8了或者变高了,紧接着页面上的图片就跟着变形了。这点让那些做UI的学姐简直无法接受,我们当时也一直没注意到这问题,而且也确实有网页出现了浏览器缩放后布局混乱(这就是没有做好自适应布局了啦,应该是用像素定位而且没有采用三栏布局),后来仔细一想,问题是设计图问题,因为学姐给的设计图是宽为1024的图,高固定,而我们在写代码时习惯将图片的高设置定值(ps测出来的值),宽设置为所在容器的100%。所以出现了在1366或者其他分辨率电脑上图片被压缩的情况。这个问题不是通过改变电脑分辨率来解决,而是如何在代码中能够解决才对。当然我只知道有弹性图片,这个问题我还不知道怎么解决啦。然后就是在写网页是尽量用居中div来包含其他div,这样网页的自适应也会比较好。

         三,认真对待每张网页,做到尽量一比一还原设计图。

  • 相关阅读:
    使用Application Insights 做分析
    UWP中GridView右击选中的实现
    Bing Map
    UWP深入学习六:Build better apps: Windows 10 by 10 development series
    从上往下打印二叉树
    二叉树中和为某一值的路径
    二叉树的镜像
    树的子结构
    由前序遍历和中序遍历构建二叉树
    二叉树常见题目
  • 原文地址:https://www.cnblogs.com/shuixiaohao/p/6905929.html
Copyright © 2020-2023  润新知