网页的设计几点问题

网页的设计几点问题（精选8篇）

网页的设计几点问题 篇1

在高职院校教育中,网页设计与制作是计算机专业的重要课程,并且在非计算机专业也是重要的选修课程;在当今社会,计算机的应用越来越普及,与人们的生活、工作密切相关,因此网页设计与制作课程的重要性得到教师与学生的普遍认可。在新形势下,高职计算机教学工作应更好地适应社会发展需求,加快改革步伐,提高教学的实效性。以下将提出几点高职网页设计与制作课程改革的具体措施。

1 创新计算机教学的内容

计算机技术的发展与变化非常迅速,如果教学不能做到与时俱进,当学生毕业参加工作后,在校期间所学的知识已经过时,失去了学习的意义。因此,在网页设计与制作教学中,教师应根据实际情况调整教学计划和教学内容,删减已经落后的知识内容,添加前沿知识。同时,教师要多关注社会变化与市场走向,培养的学生既要具备夯实的理论基础,也要具备丰富的实践经验。例如,根据网页设计与制作课程的教学目标,围绕“Dream weaver”讲解相关的基础知识,并且培养学生理论与实践相结合的意识,给学生更多动手操作的机会。

2 提高课程体系的实践性

高等职业学校的根本教育目标就是培养实用型人才,因此网页设计与制作课程改革要设计合理的课程体系,以培养更多的实用型人才。首先,课程体系建设要紧密围绕职业岗位的用人需求,着重开展实践教学,培养学生的实践运用能力;其次,由于计算机技术的类别较多、变化较快,因此教师在夯实学生基础知识的前提下,还要多引入拓展性教学内容,激发学生的拓展能力和创新能力,为学生的未来发展与就业做好准备。例如,在网页设计与制作课程的实践教学中,教师可多引入一些真题模拟练习,以某个公司企业的实际情况为案例进行题目设计,学生可以结合自己掌握的知识以及感兴趣的内容选择课题;也可邀请相关公司的工作人员实际安排任务,让学生真题真做,根据设计要求及设计步骤完成开发过程,这样在学生实际操作过程中,不仅能巩固所学的知识内容,客观认知自身的优势和不足,也能明确学习目标、制定学习计划,以此提高学习主动性与积极性,激发学习动力;学生只有将课堂学到的知识内容进行综合运用,才能真正适应未来就业与岗位需求,成为社会所需的人才;再有,教师设计的课堂教学内容要与高职学生的实际生活体验相贴近,不断调整和改进实践教学的内容与形式,保持课堂教学的新鲜感,调动学生的学习兴趣并提高教学质量。

3 运用多样化的教学方法与教学手段

高职网页设计与制作课程教学中,教师应运用各种各样的教学方法与教学手段吸引学生的注意力,给课堂教学注入活力,让学生在轻松、愉快的氛围中掌握知识。一方面,案例教学法是课堂常用形式,不仅能考核学生对所学知识的掌握情况,也可引导学生进行实践演练,灵活运用教材中的知识内容,让学生形成更为直观的学习体验。教师在课堂教学之前,组织学生进行有效的预习,将教学内容及预习资料发放到学生的邮箱中,便于学生课前准备;或者教师也可在教学中录制视频资料,课下备份给学生或上传到学校网站,这样学生在课堂没有理解的内容,可以在课下自行学习;为了方便学习讨论,教师还要组织学生开设班级交流QQ群,学生在课下可以互相学习或随时随地向教师、同学请教问题,更好地记忆、理解和运用所学知识;另一方面,网页设计与制作教学的关键在于实践环节,教师要多组织学生参加课外活动,如定期举办网页设计与制作交流会、网页设计与制作大赛等,让学生以个人或者团体的形式参加比赛,采取初赛、复赛、总决赛等晋级方法,激发学生的竞争意识与团队合作能力,最终获胜者可获得精神奖励与物质奖励,并将评选的优秀作品在学校计算机系统中展示。通过丰富多彩的课外活动,极大激发学生的学习主动性,教师也可趁机了解学生对专业知识的掌握情况,以此作为调整教学计划和教学内容的参考。

4 改变课程的考核方式

由于网页设计与制作课程具有实践性特征,所以传统的考试模式不能如实反映学生的学习水平,教师要改变过去的考试形式,设计实践操作课题,让学生根据所学的知识点进行实际操作并创新设计网页内容;因此,针对高职网页设计与制作的课程考核,应将学生的课堂学习表现与期末作品评价相结合,其中平时出勤率占20%,网页设计专业性占40%,网页创意占40%,通过这种考核方式才能更好地反馈学生学习态度、体现学生能力水平。

5 改善教学条件和教学设施

高职网页设计与制作课程的开展,离不开良好的教学条件与教学设施保障,包括专业的师资队伍、完善的实训基地等。首先,选择一支专业水平良好的教师队伍,尤其着重培养青年教师或者计算机专业教师,根据高职学生能力水平与社会发展需要,设定合理的教学改革方案;其次,完善实训基地建设,为学生创设一个真实的学习环境,不仅有利于实现网页设计与制作课程的教学目标,也能让学生提前适应社会环境,更好地融入社会岗位中。

由上可见,新形势下实现高职网页设计与制作课程改革具有必要性和重要性,作为教育工作者应转变教学观念,积极投身于教学改革工作,及时发现以往教学中存在的问题与缺陷,围绕现代社会的实际需要,培养更多高水平、高素质的计算机专业人才,体现高职教育的培养特色。

参考文献

[1]刘杰逾.高职《网页设计与制作》课程现状及改革措施[J].山东工业技术.2015(23).

[2]仲静.高职网页设计与制作课程教学改革探析[J].电脑知识与技术.2014(32).

网页的设计几点问题 篇2

当结构为float leftblock，样式为.left { float: left; width: 50px; height: 50px; background: #000; }.block { width: 200px; height: 60px; background: #F60;}

假使我们称第一个div为A，第二个div 为B，按理说，float使元素脱离正常流(Normal Flow)，A应该“浮”起来，盖在B上面;而B应该占据A原来的位置。

事实上， 在现代浏览器中，显示方式跟我们想象的完全一致，如下：

但在IE6和IE7下，发现很诡异的问题，其显示方式如下：

我们可以看到，A并没有完全脱离正常流，还占据着原来的位置，而B跟随A出现(A和B之间有3px间隔，IE6下的bug，IE7的显示方式与 上面相同，只是没有3px的间隔)。

这是为什么呢?

根据CSS1对float的规定：The normal flow will wrap around on the right side。也就是说对于左浮动的元素，其后的正常流将围绕在其右边。

而在CSS2中， 明确说明：Since a float is not in the flow, non-positioned block boxes created before and after the float box flow vertically as if the float did not exist。也就是说浮动元素脱离正常流以后，浮动元素前后创建的未定位的块级元素会垂直相连，好像浮动元素不存在。

在 CSS2中，明确说明了浮动元素的位置会被占据(在direction:ltr的正常流下，为后面的占据)，而在CSS1中，说得很含糊，没有具体说明块 级元素是否会占据前面浮动元素的位置。

为了了解是否所有只支持CSS1的浏览器对于这种情况的处理都一致，我安装了Netscape 6.2.3，其显示方式如下：

可以看到，和现代浏览器的显示方式一模一样，

难道又是IE对规范有着自己独特的理解?为此，我查询了一下微软的技术文档，其中写 道：Objects following a floating object move in relation to the position of the floating object。也就是说，浮动对象后面的对象按相对于浮动对象的位置移动。其实这也是一种很模糊的说法，并没说明后面的块级元素是否会占据前面浮动元素的位置。

由此可以推测，一般浏览器认为，对象如果脱离正常流，就不会占据其原来的位置，所以对于左浮动的元素，其后面的块级元素将会占据它的位 置，呈现浮动元素盖住后面元素的情况。

而对于只支持或部分支持CSS1的IE，则认为虽然浮动元素脱离正常流，但其后的正常流将围绕在其右 边，呈现了半脱离的情况，左浮动元素后面的块级元素跟随在其右边。

另外还有一个问题。对于上例，当对B设置左边距(margin-left) 时，对于IE6和IE7存在一个临界值，当margin-left的值小于这个临界值时，设置不起作用，当大于这个值时，才起作用，这个临界值恒等于A的宽度。

我们可以这么认为：A脱离正常流，正常情况下，B的左边距(margin-left)应当直接接触到其容器(body标签)的左填充边 (padding-left)，对于此例，其容器不存在左填充，所以原本B的左边距应当直接接触容器的左边(即margin-left等于0)，但由于在 IE6和IE7中，B跟随在A右边，相当于A把B从容器的左边顶开了，且左边距又没有发生变化(即margin-left还是等于0)，所以，当B的左边 距小于等于这个临界值的时候，都不起作用。

PS：正常流(Normal Flow)

正常流是默认的定位方式。任何没有具体指定{position:absolute}或者{position:fixed}属性以及没有被浮动的元素 都将默认获得此属性。在这种方式里，块级元素在它们的包含块里一个一个垂直延伸，行内元素在它们的包含块里从左至右的水平排布。

网页的设计几点问题 篇3

摘 要：《网页设计》作为中职计算机课程系列中的一门必修课，具有很强的综合性和实践性。本文对网页设计指导教师在使用项目教学法进行教学时应该注意的问题进行探讨，旨在提高学生学习这门课程的兴趣与设计制作网页的能力，提高《网页设计》的教学质量，避免出现一些常见的教学问题。

关键词：中职；网页设计；项目教学法

中图分类号：G712 文献标识码：A 文章编号：1005-1422（2014）03-0119-02

网页设计作为计算机实训项目之一，需要通过40-50学时的学习，学生才能完成一个完整网站的制作。在实施项目教学中，通常会出现这样几个问题：

一、分组过程中的问题

在分组中多数采用了按学生意愿自由组合，一般对全班同学进行分组，4～6人一组，采取组长负责制，由组长统筹安排其他组员的分工，这样出现的问题是，有的小组学习能力很好，很容易就完成了教师布置的任务，而有的小组全组的学习能力都很差，根本无法完成教师布置的任务，甚至出现全组人都去做其他事情，根本不做教师布置的任务的情况。

解决方法：教师根据实际情况及时调整各小组之间的成员。达到每小组都有1～2名学习能力强的学生作为负责人，带动其他学习能力差的学生。指导教师需要随时观察各小组，对出现问题的小组，及时与小组成员进行沟通与协调，解决小组内部出现的相互合作不适应的问题。

二、规划网站的问题

在制作网站前，给学生重点介绍几种流行的专题网站，也可让学生上网找出自己感兴趣的网站，要求学生在浏览网站的同时，把该网站的风格特点进行总结，并把自己的心得介绍给同学。课前让学生进行网站需求的调查，在调查过程中寻找具有一定的应用价值的网站项目。课堂上让学生结合各自调查情况，提出一个网站设计的项目，参考《网页设计》教材制定好一份初步计划书，确定网站主题。在这个过程中常常出现的问题是学生的选题过大，选择的网站功能过多，制作技术过于复杂。这些问题往往导致学生在制作的过程中完成不了相应的计划，网站设计的热情、积极性逐步降低，最终导致计划设计的网站无法实现。

解决方法：教师在学生浏览网站过程中加强引导学生进行合理的选题。指导小组负责人合理分析小组成员的能力，教师需要在每组学生制定规划时引导学生发现问题，找到解决问题的方法。

三、细化任务，分工合作中的问题

本着发挥学生个人特长，让每一位学生参与到网站设计中，结合《网页设计》课程的教学内容，引导项目负责人对每个小组成员进行合理的分工，对各成员具体需要完成的模块内容及需要的时间进行详细的规划。在这个过程中经常会出现的问题是：项目负责的学生与其他成员的沟通不足，对其他成员的能力了解不够，容易出现分配不合理，个别成员无法完成分配的任务等问题；其次还会出现项目负责的同学对模块分配过大，不够细致，导致开发的小组成员容易出现无法入手，不知道从哪里开始的情况。

解决方法：引导项目负责的学生对网站模块进行细化，把每个大模块具化到每个无法再分的最终模块；通过小组讨论，调查，形成合理的开发时间表，让小组成员能在规定的时间内做好计划的内容。

四、实施项目中的问题

学生确定各自在小组内的分工及合作形式后，按照已确定的方案进入具体的网站制作。在这个过程中，学生必然会碰到许多新问题，常规的做法是教师把问题集中起来，要求各小组在解决问题时充分发表意见，同学之间相互帮助，然后教师根据学生的掌握情况进行及时补充，在学生应用上确实有困难的地方，教师提供给他们解决问题的方法。但在实际中往往会出现收集的问题不全面的情况，这是因为学生在做设计的时候没有做相应的记录，时间长了会忘记部分问题；所以教师在收集问题，集中讲解后，仍然达不到预期的效果，还会有部分小组无法开展网站的制作。

解决方法：要求每个小组每次设计时，出现问题就记录在开发日志中，同时有好的方法也记录下来，方便以后遇到相同情况时使用。

五、验收成果，小组成果展示出现的问题

网站制作结束前，需要经过指导教师的验收，才可以宣布整个项目工作的结束。每个小组需要向教师及其他小组的同学展示自己的网站，并进行作品的答辩。以团队的形式，分模块展示，体现合作的同时还应有细致分工，这能促进学生的团队意识。但是在展示过程中通常会遇到网站演示出错的问题，这是因为学生做完网站后，自己小组进行一个简单的测试就提交给指导教师；指导教师在验收网站的时候，由于时间关系，基本不可能把学生的每个网站都很细致的进行测试，而是从专业角度，先入为主地查看估计会出错的部分，这就忽律掉了其他部分。

解决方式：在小组成果展示之前，加入小组相互测试部分。这样的好处是：第一，便于发现问题。俗话说得好，当局者迷、旁观者清。自己开发的模块太熟悉了，通常会去找熟悉的部分，很难找到问题所在，而相互测试可以克服掉这个问题。第二，节约时间。不但节约了教师验收的时间，还节约了学生认识理解别人项目的时间，便于在网站演示时大家对它的理解。因为测试过，使用过，大家对演示网站就更容易理解了。

六、评估总结出现的问题

每个小组在完成网站设计后，指导教师会要求他们对自己的网站和其他小组的网站进行评价，最后教师再对各项目组的网站进行综合评价。教师在评价学生网站时，有的教师只进行优劣评价，直接给学生一个评价量规表就结束了，忽略了网站存在的问题，没有给出具体的需要改进的地方和修改的建议等。

解决方式：在评价量规表后加入一个建议表，详细列出网站在今后的设计中需要注意的问题以及进一步提高设计水平的方向。

参考文献：

李捷.《网页制作技术》项目教学法的研究与实践[J].职业教育研究，2008（6）.

网页的设计几点问题 篇4

一、课堂内容要精而不多

很多教师总想在有限的课堂时间内, 让学生学到更多的知识, 往往在备课时, 就准备了很多内容。其实这样做的话, 收到的效果往往不够好, 因为中职学生的学习基础和态度, 不是特别理想, 上课的状态也不是特别好, 如果教师只顾着要在课堂上多讲一些知识, 而不考虑学生的接受能力, 这样只会让学生听得晕头转向。以致一个学期下来, 学生只是一知半解地学到了点皮毛知识。

因此, 教师在准备上课内容时, 一定要精读教材, 抓好重点难点。如在课堂上尽量不要把时间分得太散, 在课堂的前15至20分钟, 趁学生的精神状态比较好和注意力比较集中, 把这节课的核心及重点内容教授给学生, 让学生能在一个最好的状态下接受新知识。在课堂的后半部分, 教师可以发起一些讨论, 来活跃课堂的气氛。

二、教学方式, 以启发和体会为主

在网页设计教学中, 理论知识讲得再多, 如果学生不会灵活运用, 一点用处也没有。理论知识是学生学习和提高的基础, 但在教学中, 不必太拘束于理论, 应让学生结合实践, 去理解和体会知识。如在学习网页的模块分布和页面色彩时, 教师不需要讲太多的理论, 应找各种各样的典型网页或网站, 让学生在上网或观察中体会。有些网站的设计让用户在使用的过程中觉得很便捷, 很愉快, 而有些网站却会让用户觉得很凌乱, 使用不顺畅。学生在观察和研究这些不同的网站设计的时候, 教师可以让学生评选出自己喜欢的或者是觉得最好的和最差的, 让学生说说最好的网站设计好在哪里, 最差的, 又差在哪里。

通过这样的观察和体会, 让学生明白网页设计过程中, 需要注意什么, 怎么做才会更好。学生结合自己的实际体会, 归纳总结出自己能理解和掌握的知识。这样比教师一直在讲台上强调某些知识更有效。

三、实践环节重创新

中职计算机教学更重视实践, 重视动手操作, 否则理论知识再丰富, 如果不会动手实践, 也不能保证学生能够更好地就业。实践环节不但要重视, 还要高效, 有些学校在课程的实践方面, 分配了足够的课时, 但实践的效果并不好。在网页设计这种相对比较开放和自由的实践课上, 可让学生充分发挥自己的想象力和创造力。值得注意的是, 在学生的实践过程中, 教师要对学生进行适当的帮助, 如果任由学生自己去摸索, 那么很可能在上机实践这段有限的时间内, 学生很难做出点东西来。这个阶段并不是学生探索的阶段, 重要的是鼓励学生把设想变为现实。

四、课后任务要有针对性

课后的作业不但能检查上课的效果, 还能帮助学生巩固和复习上课所学的知识, 适当的作业是必不可少的。但作业的布置不能随便给个任务或项目, 教师一定要根据上课的情况和学生的大体掌握水平来布置一个适当的作业。作业的布置应该是抓住那些学生掌握得不是特别好的地方, 学生通过作业可以再一次思考, 或者通过查资料, 与同学交流等方式把疑问弄明白, 把不懂的知识再次梳理并巩固。因此, 课后的作业必须有要一定的针对性。

五、总结

总之, 在中职计算机网页设计教学中, 教师要根据实际的情况, 敢于打破一些传统的教学模式和方法。用更灵活、更人性化的方法进行教学。在教学中把握好重点、难点, 力求让学生对知识点的掌握更透彻。因此, 教师要认真对待教学的每一个环节, 与时俱进, 开展以学生为本, 以学生的发展为纲的课堂教学, 让每一个学生的能力都得到发展, 都能学到实实在在的有用的知识。

参考文献

[1]叶宗国.中职计算机网页设计教学模式的探讨[J].计算机光盘软件与应用, 2011 (6) .

[2]蔡晓霞.中职计算机网络教学初探[J].中国科教创新导刊, 2011 (22) .

网页的设计几点问题 篇5

是否真的需要改版?

这是在网站改版之前最需要也是最必要处理的一个问题。究竟网站改版只是一时的兴起，还是经过深思熟虑的事情。决策层是最重要的层面，决策层的任何一个决策都会影响到整个网站。所以在网改版之前请确保这次改版并不是因为一时兴起。

究竟是为了什么而改版?

既然已经决定了要对网站做一个改版，那么接下来就需要明白的一个问题是，究竟是为了什么而改版?

通常情况下，网站改版有两种情况：一是因为网站本身的内容扩充导致现在的网站架构承载不下更多的内容，二是基于网站用户需求的转变而导致网站转型。当然也不能排除纯粹是为了网站的相貌而做出改版的决策。

改版后的期望是什么?

当然这也是在网站改版之前所需要面对的一个重要问题。网站改版之前，就需要对改版后的网站做出一个期望，期望改版完成后的网站能给网站带来什么?需要评估改版过程中投入的时间、人力、物力以及其它方面的资源能否在改版后的网站中得到体现，也就是说改版后的网站能否带来此前投入的同等价值或者是最大的价值(这个当然是最好的了)。

改版时网站的架构是否需要重建?

由于网站本身内容的扩充而产生的改版需求是最为常见的，因为网站的设计并不是在一开始就是定性的，网站的设计是具有一定的流动性的，随着网站在发展中对于用户以及内容的积累，网站的运营方向需要做出阶段性的调整。这个阶段性的调整可以是大到整站的信息架构重建，也可以小到仅仅只是修改页面中的某一处细微的地 方。但是不管这个阶段性的调整是大是小，都会涉及到网站的改版，只是这个改版也是随着调整力度的大小而改变。

如果是做出大的调整，那么无疑就需要重新梳理网站原有的信息架构，并且设计出更加合理的升级版的信息架构，而这也是网站改版成功与否最为关健的一点，

改版时是否需要引入最新技术?

如果把这个问题问上十个人，相信有六个或者以上的人会认为应该引入最新的技术，因为对新技术的追求是永无止境的，而且如果能在新网站中引入最新的技术，从另一方面上也证明了网站的技术实力。

但技术实力仅仅只是网站的一部分，一个完整的网站需要的是各方面的资源综合发展，技术强运营弱或者是运营强技术弱都是不行的，“短板效应”是很多人都知道的原理，决定最终储水量的往往是木桶上那块最短的木板。

对新技术的追求本身没有错，但在这个追求过程中所投入的成本是否能有效的控制是个很大的疑问。如果不能控制这个成本，那选择适合网站目前的技术无疑是最明智的作法。

改版时需要什么样的数据支持?

有句话叫做“有钱并不是万能的，但没钱是万万不能的”，数据之于网站也是最样的道理，有数据支持并不是万能的，但没有数据支持无疑会使网站的改版陷入很被动的境地。

用户使用网站的习惯?页面上哪些内容是用户最常点击的?用户访问网站的一般路径?用户在网站的平均停留时间?以及用户的忠诚度等一系列的数据都是需要做出正确合理的分析的，因为改版后的网站肯定会引起这些数据的波动，而引起的这些波动是否会导致网站的用户流失?以及如何尽可能平缓的减少这些波动性?

改版后给用户带来的影响?

虽然网站改版的前提大部分都是为了让用户在使用网站时有更佳的体验，但事物皆有两面性，有利必然就有弊。面目全非给用户带来的影响远远大于某一处细节的修改，无论这个影响是好是坏。

如前面所说的数据的波动性，用户如何使用网站就是这些数据当中重要的一环，改版时需要尽可能的提取出数据中不能被影响到的部分，如果必须影响到用户的使用，那应该是让用户有一个平缓的过渡还是快速的过渡呢?如果改版后是一个更好的设计，当然可以使用户快速的过渡到新网站中去;但如果用户在使用网站时已经积累了长期的习惯，并且短时间内很难更改的话，那选择给用户一个平缓的过渡时间无疑是最合适的。

网页的设计几点问题 篇6

随着现代高速发展的网络技术和不断兴起的电子商务, 针对计算机网络的攻击不断出现, 设计人员在进行网页设计时必须充分考虑网络安全的问题。当一个网站建立之后, 相应的配套程序有很多, 由于网页设计的独特性, 所以, 程序的漏洞会不断的增加, 这样就给网站带来了一定的安全隐患。

2 网页设计安全漏洞

网页设计中常用的服务器端网页设计技术包括ASP、PHP或JSP等脚本语言, 这些网页技术为网站的技术开发人员提供了便利。在网页的开发设计中, 设计人员使用上面的脚本语言可以高效的管理现有的网站资源, 加强了浏览者和网站的交互。在交互之间, 漏洞就在慢慢的形成, 这主要是因为浏览者在输入信息时的不可确定性, 如果程序考虑的不周全, 用户输入的信息就有可能成为对网页的攻击, 无论这些信息是否是有意的还是无意的。网页的编程与服务器直接打交道, 它和系统的相关设置、网站数据库设置等有关, 若程序设计之中存在漏洞, 那么也称之为网站漏洞。

3 网页设计中存在的漏洞

3.1 在登陆验证中存在的漏洞

像人们常常使用的论坛、会员区、聊天室等带有交互性的网站, 登陆验证是必须完成的部分, 虽然登陆验证只是整个网站运行中的一小部分, 但却是整个网站的安全之口。网络设计者在设计时很容易疏忽这个关口的设计, 安全关口的验证程序如果没有设计好, 就会让别人有空可钻, 从而造成不必要的损失。很多网站在设计安全关口中都存在登陆验证的漏洞, 设计人员在设计时编程的不严谨造成了这个漏洞。

3.2 直接进入页面而绕过验证的漏洞

在许多的敏感页面中, 用户必须进行身份验证, 但是这个页面无需对用户的身份验证, 一旦用户在知道相关的网页设计页面的文件名和路径时, 用户就会直接绕过登陆的界面, 进入设计页面。在这样的状况下, 网站的设计人员必须对相关的页面进行身份的验证, 设计相应的身份验证程序, 来达到网站页面的安全可靠程度。

3.3 网站病毒的广泛传播

计算机中存在的病毒是人们故意设计制造的计算机应用程序, 它的特点就是感染性和自制性, 在日益扩大的网络规模下, 计算机的病毒的种类和数量也在不断的增加, 这样也对计算机的的安全造成了很大的威胁。如果网站的终端服务器被计算机病毒传染, 就会破坏网站信息的可靠安全性, 甚至影响了整个网站的正常运行。

3.4 一些网站的非受权

在网站的建设中, 程序设计人员往往会采用较为复杂的安全配置, 这样就会在网络服务的应用中存在非常巨大的安全缺陷, 因而给远程的黑客有了可乘之机, 侵入到网络服务器的内部, 给网站的安全带来了巨大的危害, 网络系统中的应用软件的缺陷、密码过于简单等等的系统漏洞, 都会让黑客非常容易的侵入。

4 解决网站安全隐患的方法

4.1 充分考虑网站登陆验证的安全性

在相关的论坛和聊天室中, 验证身份在登陆时是必要的一步。所以, 网站设计人员可以使得程序在生成SQL查询语句之前, 验证用户的用户名和密码, 或者是设计人员要求用户在进入网页时先对其用户名进行查询再验证密码。而在进入比较敏感的页面时, 设计人员可以设计相应的程序要求用户再一次进行身份的验证, 这样就增加了网页的安全可靠性。

4.2 充分考虑源代码的泄漏

程序设计人员对网页的代码加密后可以有效的减少网站源代码泄漏的机会, 设计人员可以利用组件技术将编程逻辑密封在ADLL中, 或者是对ASP进行加密, 这其中利用的是微软的Script Encoder, 这个方法有操作性强、编辑性强等优点, 这样就可以降低源代码泄漏的机率。

4.3 充分考虑文件在上传时的安全性

许多的网站具有文件上传、图片上传等多种功能, 比如一些论坛、邮箱系统、校园网这些用户量很大的网站, 但是这样的网站, 程序设计人员在设计时没有对用户提交的数据和参数进行充分的过滤, 导致了黑客能够对其进行远距离的攻击, 从而造成了相关数据库的破坏。所以, 设计人员在用户上传图片文件之前, 可以插入文件类型模式的模块, 对用户上传的文件格式进行筛选, 这样就可以将一些可能带来病毒的文件筛选出去, 提高了用户使用网页的安全性。

5 结语

在不断加快的信息化时代, 新世纪新时代的“金钥匙”逐步的被信息化的网络取代。当一个完整的网站建立并对外开放后, 它的相应的应用程序有很多, 网页设计中的交互程序的增多会带来不断增多我漏洞问题, 从而给网站的安全造成不可估量的损失。通过本文中列出的相关的安全解决方法, 在网站的建设中充分考虑网络的安全性, 有效的降低了网络系统的安全漏洞, 加强了网络的安全性。

参考文献

[1]程文彬.基于网站建设中网页设计的安全缺陷及对策[J].电子科技大学学报, 2003 (6) .[1]程文彬.基于网站建设中网页设计的安全缺陷及对策[J].电子科技大学学报, 2003 (6) .

网页的设计几点问题 篇7

关键词：网页设计,浏览器,兼容问题

随着网络技术的不断发展, 网络上的各种网站也在不断增加, 内容更加丰富, 功能更加强大。但对于网络开发者而言, 为了给用户更好的上网体验, 解决浏览器兼容问题依然是一个不小的挑战。而且网页设计是技术和艺术的组合, 在设计师考虑到美观的同时还要考虑笔记本、平板电脑和手机兼容问题, 网页设计已呈现新的发展趋势。

1 浏览器与网页兼容存在的问题

众所周知, 上网的时候一般是通过浏览器来实现的, 所谓的浏览器就是指能显示网页服务器或文件系统的HTML文件内容, 可以确保用户与该类文件进行交互。不同的浏览器之间的内核是不同的, 这就导致同一网页在不同的浏览器中的效果出现差异, 甚至不能够正常显示。目前一些网站的设计还没具备兼顾各种浏览器的能力, 通过少数的浏览器打开网页时会出现变形、无法访问、显示不全和图片不动等现象。对于这种问题, 网页开发人员把设计好的网站要放在不同的浏览器上检测其兼容性, 对出现不同的情况要通过有针对性的方法来解决。

多数的网站设计人员采用CSS来展开布局进行设计的。目前, CSS3把CSS划分为不同的模块, 功能也不断强大, 网页设计也更加方便, 不管是主流的门户网站还是各种小公司甚至个人的小站, 也都是通过CSS进行展开设计的。曾经, IE占据了浏览器的主流地位, 但随着互联网科技的不断发展, 浏览器的各类呈井喷趋势, 如搜狗、360极速、百度都在推出自己的浏览器, 而且还占领了一大块市场份额, 与此同时, 谷歌、火狐、3435等浏览器也在市场上占有重要地位。各种不同的浏览器所使用的内核也是不同的, 这导致很多网页浏览器不兼容, 因为是浏览器的内核负责对网页语法进行解读并渲染网页。因此, 浏览器的内核不同, 对网页的语法解释也是不同的, 同一个网页在不同的浏览器下的显示也是不同的, 这就是我们所说的网站设计和浏览器的兼容性问题。如果网页和浏览器的兼容性问题处理不好, 可能会导致浏览器对网页内容解读错误, 出现乱码、变形、信息错乱等现象, 影响页面的美观和使用。

2 几种网页与浏览器兼容问题的解决方法

2.1 采用Hack技术实现浏览器的兼容性问题

所谓Hack技术就是利用不同浏览器对CSS样式支持不同的特点, 针对不同浏览器分别重复定义多个不同的样式表, 由浏览器各自解析执行自己支持的样式, 从而设计出不同浏览器具有相同显示效果的页面。目前最常用的方法是利用浏览器对加入特殊字符的选择符或个别样式的支持、不支持重复定义不同的样式。对个别浏览器有特别显示效果的样式, 如果个别浏览器有自己单独支持的隐藏样式, 则先针对大多数浏览器定义通用样式, 之后再用个别浏览器单独支持的隐藏样式重复定义该样式, 使得大多数浏览器使用前者, 个别浏览器用隐藏样式覆盖后单独使用后者。如果个别浏览器不支持大多数浏览器使用的样式, 则先针对个别浏览器定义样式, 之后再用个别浏览器不支持的样式为大多数浏览器重复定义该样式, 使个别浏览器使用前者, 大多数浏览器覆盖后使用后者。

2.2 不同浏览器页边距不一致问题

比如在CSS中写一个margin—left:588px, 经过测试人们了现在IE8和火狐浏览器的显示效果民相同的, 但IE6中显示就会出问题, 主要表现就是页边距会相差几个像素, 这就影响了网页的美观。这种现象产生的原因是不同的内核对网页的解读不同导致的, 也就是渲染机制不同。不同的厂商对CSS的解释是有一定的差异的, 同一个厂商不同的版本对此也可能出现不同的解释, 正如上面讲到的IE7和IE8对同一问题的渲染是不同的。另外, 浏览器和CSS和版本一直处于动态更新之中, 这也是导致二者经常无法兼容的因素。对这一问题的解决可以对不同的浏览器书写不同的标准。例如:

如此设计, 所有浏览器的显示就会处于相同的状态。

2.3 IE6对hover的不兼容性

在做网站设计时, 设计师通常是用<ul><li></li></ul>来实现不同级别菜单的设置的。在一些精致的网站中如果把鼠标箭头指向某个导航部位会让箭头显示hover效果。这种显示在IE7和IE8中是没有问题的, 但通过IE6打开时会出现无法兼容的现象。如果IE6要达到这样效果就必须利用就javascript编写函数来协助完成。这需要创建一个hover.htc文件, 该文件使用js脚本来定义元素的样式, 如果检测到hover, 就给元素设置onmouseout和onmouseover事件, 从而实现hover的效果。如此以来, 在IE6中运用hover就不会出现问题。

3 结语

本文只是简单介绍几种解决网页和浏览器的兼容方法, 随着网络技术的不断发展, 浏览器和网页的不兼容问题可能会更加突出。要想从根本上解决这个问题, 还要从浏览器的内核着手。只有不同的厂商使用统一的CSS标准, 才能从根本上解决网页和浏览器的兼容问题。

参考文献

[1]李灵华, 李秀静.IE与Firefox浏览器CSS兼容性的解决方法[J].大连民族学院学报, 2012 (14) .

[2]巩恩伟.CSS在浏览器中的兼容性及使用技巧[J].电脑知识与技术, 2013 (6) .

使用CSS制作网页的几点经验 篇8

一、CSS设计网页头部的一些写法

在div+css布局中，一般都这样来整体构架的：

而对于header部分，肯定要显示网站标题，除了显示网站标题外，还可能要显示其他比较重要的对象，比如网站的导航栏：

很多人一般都这样写的，当然这样写并没有什么语法错误。但对于div来说有个原则，那就是尽少的使用div的嵌套，否则浏览器要消耗资源对嵌套的关系进行解析，影响速度，搜索引擎对嵌套的层数也可能有所限制，而且这样写带给我们的可读性也不算太高。那如何才是最优化，最科学的写法呢？

我们可以选用其他的Xhtml代码来取代上面的div

1. 首先标题的选择—我们知道在xhtml中h1-h6

是表示标题的，而header里的标题在全页来看是最重要的，我们选择h1来表示标题是顺其自然的。

2. 其次导航栏的选择—导航栏是由多个小块内

容组成，我们选择无序列表<ul><li></li></ul>来表示菜单最合适不过了！

最后以上的内容可以优化成：

二、CSS隐藏文字的几种常用方法

1. display:none：

它可以使包括容器本身在内的东西都消失，简便且有效，但它有两个耳熟能详的缺陷，那就是对搜索引擎不友好，且被屏幕阅读器所忽略。

2. text-indent:

-9999px:text-indent是首行缩进，所以对于多行文本，若单独使用它就有明显的不足，需加上white-space:nowrap;来弥补不足，但还有一个问题：物理空间仍然存在，故还需设置lin eheight:0;或使用超小字体 (在IE下有点BUG) ，最终代码如下:

3. overflow:

hidden：这是一个比较合理且我最喜欢的方法，具体代码如下:

用绝对定位将其推出可视区，不过虽然可视性不存在，但仍占据物理空间，与隐藏文字的宗旨相背，代码请看:

三、使用DIV+CSS排版几个技巧

让你使用DIV+CSS排版不是让你用换个标签然后再去按照表格的方式去排版, 而是做到内容与表现的分离。

1. float浮动

在标准浏览器中，浮动元素脱离了文档流，不占据外围容器空间，明白了这点你就会明白为什么I E和Firefox下表现的不同了。IE5.5, IE6浮动元素依然占据外围容器空间。

例如：怎么在IE下feeter正常在firefox下就跑上去了呢？^＿^清除浮动吧。

IE下当float和text-align定义的方向一样时出现双倍错误：

实际左边margin-left:20px;FF/OP:10px解决：加上display:inline;

“清除浮动”clear

表示当前框元素哪些边不应该挨着浮动框，理解了float在不同浏览器下的表现你也就知道如何去使用清除浮动了。

2. 滑动门

左右两个DIV背景分别定义一般左背景图像比较长;左背景定位：left center右背景定位：right center, 外部控制容器宽度一般小于等于两个背景和这样当内容动态变化时候右背景图像便感觉像在左背景图像上滑动，故名滑动门。

这样也可以实现：<div id="nav"><ul><li><a href="index.html"><span>首页</span></a></li></ul></div>

原理相似，注意背景图像定位。

摘要：本文主要介绍了使用css制作网页时, 设计网页头部的一些写法、CSS隐藏文字的几种常用方法和使用DIV+CSS排版的几个小技巧。