修正IE6的bug的10个技巧网页设计
“Yeep”通过精心收集，向本站投稿了6篇修正IE6的bug的10个技巧网页设计，下面是小编为大家整理后的修正IE6的bug的10个技巧网页设计，仅供参考，大家一起来看看吧。
篇1：修正IE6的bug的10个技巧网页设计
我们知道，IE6可能过不了多久就会消失了，但是我们还能继续支持这个浏览器并且避免hack和有约束的CSS吗？这里是10个使用有效的HTML和CSS代码来修正IE6主要问题的方法，
1. 使用DOCTYPE
你应该在一直每个HTML文件的头部都使用DOCTYPE，并且我们推荐使用strict 版本，比如：
1
或者，对于XHTML使用:
1
你需要处理的最棘手的事情就是IE6进入quirks模式——它已经够诡异了。
2. 设置position: relative
将一个元素设置为”position:relative”可以解决很多问题，特别是你曾经遇到隐藏的或对齐诡异的盒子。显然，你需要非常小心点儿，因为绝对定位的子节点可能会因此重新定位。
3. 将浮动元素设置为display:inline
具有margin属性的浮动元素可能引起著名的IE6双倍margin问题，比如，你为一个元素指定margin-left为5px，但是IE6中实际上却表现为10px。”display:inline”将解决这个问题，尽管这不是必须的，你的CSS仍然是有效的。
4. 将一个元素设置为hasLayout
很多IE6(和IE7)的渲染问题可以通过设置元素的hasLayout来解决。 这是一个IE内部属性（IE隐藏的，更多关于haslayout的资料，可以参阅这里），用来确定相对于其他元素，内容是如何布局和定位的。如果你需要设置一个inline元素(比如一个链接)为block元素，或者是应用透明效果，设置hasLayout也可能是必须的。
最简单的设置hasLayout的方法是为CSS设置一个高度或宽度（zoom也可以用，但是zoom并不是CSS标准的一部分）。我们推荐设置实际尺寸，但是问题是这是不现实的，你可能需要使用”height:1%”。如果父元素并没有设置高度，该元素的实际高度并不受影响，而且这个时候hasLayout已经被启用。
5. 修正重复文字bug
复杂的布局可以触发在浮动元素的最后一些字符可能出现在出现在清除元素下面的bug。这里有几个解决方法，有些是完美的，但是做一些反复试验也是必须的：
确保所有的元素使用”display:inline;”
在最后一个元素上使用一个”margin-right:-3px;”
为浮动元素的最后一个条目使用一个条件注释，比如：
1
在容器的最后元素使用一个空的div(它也有必要设置宽度为90%或类似宽度。)
访问 positioniseverything.net 查看该问题的完整介绍。
6. 在可点击和悬停的元素上只使用标签
IE6只认识对a标签的CSS hover效果。
你也可以在基于JavaScript的组件内使用他们来控制，以使他们保持键盘的可操作性。是有一些可替代的选择，但是标签比其它方案更可靠。
7. 使用!important 或高级选择器来区分IE6
不使用传统Hack或在额外文件中的条件CSS的方法，写出特别针对IE6的可行的代码也还是有可能的。比如最小高度可以通过这段代码来定义：
12345
#element{min-height:20em;height:auto!important;/* 所有浏览器都理解这段代码 */height:20em;/* IE6 错误的使用这个值 /*}
IE6 不理解min-height并错误的用20em覆盖”auto”高度，但是，如果内容需要更多的空间的话，它会自动增加高度，
另外一个可选的方法是使用高级选择器，比如e.g.
123456789
#element{min-height:20em;height:20em;}/* IE6 无视下面的代码*/#element[id]{height:auto;}
8. 避免百分比单位
百分比会把IE搞糊涂的。除非你可以确切的控制每一个父元素的大小，才可能做到最佳预防。你可以通过!important在其他浏览器中继续使用百分比，比如：
1234
body{margin:2%0!important;margin:20px0;/* IE6 only */}
9. 尽早测试并不断测试
不要等到你的网站或应用完成了才测试IE6;这样的话问题可能更糟糕，而且会花更多时间来修正。如果你的网站能够在Firefox和IE6中正常运行，那么一般在其它浏览器就不会有问题。
10. 重构你的代码
经常发生的事情是，修正bug要比重新考虑一个布局问题要花更长的时间。对HTML做些小改动和一些简单的CSS常常更有效。这可能意味着你要放弃完美的代码，但是会出现较少的长期问题而且将来你会很清楚如果处理这些可能出现的问题。
译者注：虽然IE8并没有从根本上改变IE，但是它对CSS标准的支持的确有非常大的改观。但是即便如此，我们依然不能寄希望与IE8的普及，这是一件很不靠谱的事情，顽固的IE6用户未必会接受IE8。所以我们最近一年半载还是不能无视IE6。
如果你有其它比较好的可以解决IE6的bug的好方法或技巧，别忘了告诉前端观察哦～
本文出自：www.qianduan.net/?p=6190
译文来自：www.sitepoint.com
篇2：网页设计技巧
要从整体规划网站视觉设计
网站设计就像是画画或者是雕刻，一笔一划都不能错。先从整体上勾勒，比较不会出错。在视觉设计整体规划中，不但要考虑首页，还得考虑到栏目页、内页等等。
当然，首页的设计是最重要的，因为很多用户的着陆页面就是首页。
不管用户愿意不愿意，他们总是先被网站的设计风格所吸引，然后才看内容。
因此，首页的设计必须要精炼而明快，主要是符合整个的网站定位和网站主题。
结构清晰，能够让用户在第一时间内就了解网站的布局，不用费力找搜索框在哪里，就已经达到了想去的页面。网站视觉的整体设计，总基调是简单明朗，不复杂，看着舒服。
合理安排网站内容元素位置
首页布局好之后，要让内容页也搭配出这种基调来。用户从首页到内页也不过几秒钟时间，如果能够让他们有进一步的视觉冲击，那种好奇的神经就会被紧紧地牵住。
吸引人的因素，比如安排在网站内页中重要的位置，并且不予其它的因素冲突。
网站设计要留有合理的间距
在网站设计中，有种说法叫做“留白”，也就是说，在设计的时候，不能将信息安排得太多紧密，要留有合理的间距，这样容易给用户造成视觉压迫，最终因为视觉疲劳而离开。
留白能够让图文更加错落有致，让网站看起来想一个井井有条的房间。
网站设计要合理的运用图片
这里说的可以是视觉的设计，视觉设计根本就不可能离开图片，因为图片比文字更加直观，更加吸引人。图片布局需要考虑大小、尺寸、分辨率、清晰度等。要考虑到适度，图片过多容易影响整个网站加载速度。
通过视觉设计，用户能够在安全舒适的环境中浏览内容，并不会感到很大的压力，反而是放松，这正是网站设计要追求的境界。
篇3：网页设计技巧
1. 优化图片，获得更好的页面加载速度
学习如何通过选择正确的格式，来优化网页图片，并确保文件大小在可行的范围你是足够小的。虽然现在人们已经都在使用宽带，但仍然有人是拨号上网。
此外，虽然移动装置技术的普及，但移动装置却不一定支持像宽频一样的速度，图片文件的大小可能还是会延长网页的加载时间，有可能把用户赶走的。
这里有个选择适合的文件格式的技巧：如果图片是单色，那最好保存成PNG或者GIF格式;如果是连续性的色调(如照片)则最好保存成 JPG格式。
有很多的工具可以帮助你进一步优化你的图片，降低他们的文件大小。可以参考这个工具列表来帮助优化你的图片。
尽量把图片数量减到最低，并且灵活使用图片，并且尽可能地减小文件大小。如此一来，将可以大大的减少页面的读取时间和改善网页的性能。
2. 保持干净和简单(即：简洁)
一个好的网页设计不光只是看起来好看而已，还要是用户友好型的。通常来说，一个干净、简单的网页设计最终会成为一个可用性高的网页设计，因为它在与用户的交互中不会使其产生混淆。
当页面上有太多的网站功能和组件时，将会分散网站用户的注意力而失去原本浏览网站的目的。
确保每个页面元素都有其目的，然后问自己以下问题：
1.是否真的需要这个设计么? 2.这是什么组件是做什么用，它如何协助用户浏览?
3.如果我突然删除这个组件，大多数人会希望它“回来”吗 ?
4.如何把这些元素和目标、消息和网站的`宗旨互相结合?
此外，尽管它可能是一个超酷的新概念或界面设计模式，但你还是要确保对你的用户而言该设计仍然是方便和直观的。
人们习惯于通用性的交互模式、网站功能、和网络接口，如果你的设计的确很独特，确保它不是太模糊和晦涩。 要有创意，但还要保持简单。
3. 导航(条/栏)是最重要的设计
一个网站最重要的部分就是整个网站的导航。没有它，无论在哪个页面中，用户都会发生卡在这个页面离不开的状况。有了这明显的实际方向，我们将讨论一些建构网站导航时重要的点。
首先，在网站的导航结构上，投入足够的时间和很多规划是非常重要的。虽然这是常识，但仍然有很多设计师想当然地设计网站导航。
摆放位置、风格、所用技术(javascript或CSS)、可用性和网页易读性，这些是你制作导航设计时需要考虑的。
在没有CSS的状况下，你的导航设计应该也是可用的，这是基于文字基础的浏览器相容性。你可以尽量去嘲笑文字基础的浏览器，但它们在很多的移动设备上还是流行的。也许更为重要的是，对屏幕用户来说(99.99%的情况下)，没有CSS的导航功能照样可用访问。
在没有客户端技术情况下(如Javascript或Flash)，导航功能应该容易进入和使用的。用户可能因安全性或公司政策而没有开启或安装。
所以，制定一个导航系统可以放置的良好位置是必须的，例如放在一个显眼可见的地方。一个好的导航功能，只要网页载入就出现，而不需要鼠标再向下滚动。这是为什么页面要保持干净和简单的重要作用，一个复杂且非常规的设计可能会让用户困惑。
哪怕只有一瞬间，用户也必定不会纳闷：“网站导航在哪里?”
最后，对网站建立阶层结构，多层次的管理。确保它在父层与子层之间易于导航。此外，不管在哪一个网页当中，也应该能很容易到达最高层的页面(例如网站首页)。
最主要的目标就是你的网站导航，尽可能减少操作(动作)，努力而让用户到达他想要浏览的内容。
4. 明智和有条理地使用字体
虽然有成千上万的字体，但你真的能用的只是一小部分(至少要等到主要的浏览器完全支持CSS3)。 所以坚持使用网页安全字体。
如果你不喜欢网页安全字体，可以考虑利用sIFR或Cufon逐步增强的网页设计。
保持字体的一致性，确认标题和段落的内容看起来有所不同。使用空白、调整行高、字体大小和字母间距属性，使用户轻松愉快地阅读和扫描内容。
也许一个网页设计师常常犯的错误就是使用不对的字体大小。因为我们想尽可能的将内容都塞在一个网页中呈现，所以我们有时设置字体大小而让用户感觉到不舒服。
如果可能的话，尽量保持字体大小12像素以上，特别是对段落内容。虽然很多没有遇到因为字体太小而造成阅读上的困难，但是想想老人家、近视眼和其他类似视觉障碍的族群吧。
5. 理解色彩无障碍性
说完字体后，我们还需要指出使用正确颜色的重要性。例如，黑色文字在白色背景，如果使用高对比度，橙色背景上的红色文字会令你的眼睛感到紧张。
此外，使用一些对特殊形式色盲的用户友好的颜色(检查工具名为Vischeck，可以测试某些类型的色盲)。
有些色彩组合只适合运用在前景色的部分，而不适合做背景色。举个例子来说，深蓝色的文字搭配粉红色的背景与粉红色的文字搭配深蓝色的背景，都是使用两种一样的颜色，但用在不同的部分则影响了它的可读性和阅读的舒适度。
重要的是，不仅要使用良好的色彩组合，而且要把它用在页面中的合适元素上。
6. 知道如何编写代码
随著各种所见即所得的网页编辑器充斥市场，网页设计已经成为简单的1-2-3步骤就能设计好一个网站。然而，大多数网页编辑器掺杂了不必要的代码，使你的HTML结构设计不当，难以维护和更新，导致网页膨胀。
通过自己编写的网页代码，能得到简洁的代码，能够愉快方便地阅读和维护。你可以自豪地说是自己写出来的代码。
但知道如何使用所见即所得的IDE或预览功能并不会妨碍学习HTML和CSS。你要知道发生了什么事情，才能创造有效并高度优化的网页设计。
7. 不要忘记搜索引擎优化
在设计网站时，一个好的网页设计师应该永远牢记基本的SEO概念。例如，网页内容结构、用文字表示标题(即网页的标题和标志)。
此时，以前学习的如何合理编码的能力就派上用场。认识正确、语义和基于标准的HTML/CSS 后，你会很快认识到div比表格布局好得多，不仅更为准确地展现内容，而且对搜索引擎排名也有帮助。另外，知道用CSS更换背景、文字和图片也是一个好主意。
8. 理解人是没有耐性的
普通人用几秒钟就决定是否要阅读更多网页内容或到另一个网站。因此，作为一个网页设计师，要有个好方法，能在这珍贵的几秒钟鼓励用户选择前者(看更多内容)。
要知道，如果用户在网页头部看不到感兴趣的内容，没有多少人会向下滚动，去查看整个网页的内容。
所以，在网页头部很容易看到的地方放置网站上的重要元素，但也不要过度拥挤在上半部分网页，否则会吓到用户，而不会往下继续看内容。记住上半部分网页设计的卖点：视其为推销员，使人们有购买想法，即他们想在你的网站上看到什么。
9. 了解(并意识到)浏览器的兼容性
当一个网页设计师必须要知道的一件事，就是你的工作环境(浏览器)是挑剔和难以预料的。如果你的网页设计只能运行在的几种网页浏览器，那是不够的，你需要尽可能多浏览器下测试。这里有一款工具Browsershots，可以测试浏览器兼容性。
10. 使设计有灵活性和可维护性
一个好的网页设计师可以确保以后可以很容易更新或修改网站。设计一个有可塑性、易于维护的网站，是一个伟大网页设计师的标志。让你的工作尽可能从结构化转向模块化。
网页设计这个行业是动态的，而且还很“年轻”。事情往往在短暂中变化。牢记这种思想，将推动建立更加灵活的网页设计。
篇4：总结的网页设计技巧
一个网站的设计成功与否是跟用户的体验有很大的帮助的。如果你的网站设计的给人一种视觉错乱的效果，那么说明，你失败了。任何人，包括搜索引擎都非常的喜欢简单大方的页面。设计网站页面的时候应该注意哪些方面的技巧性问题。
1.色彩在网页设计中的作用
色彩是艺术表现的要素之一。在网页设计中，我们的设计师根据和谐、均衡和重点突出的原则，将不同的色彩进行组合.搭配来构成美丽的页面。
根据色彩对人们心理的影响，合理地加以运用。如果您的企业有CIS(企业形象识别系统)，我们将按照其中的VI进行色彩运用。
2.简化网页代码
搭建网页前端的时候，使用有语义的代码。用描述性的标签组织页面结构，可以提高内容对搜索引擎的可读性。这也会让修饰页面的工作变得更简单干净。
3.模块化和可修改性强
模块化不仅可以提高重用性，也能统一网站风格，还可以降低程序开发的强度。这里就涉及一些尺寸、模数、宽容度、命名规范等等知识了，不再冗述。
无论是架构还是模块或图片，都要考虑可修改性强。举个简单的例子，logo、按钮等，很多人喜欢制作图片，N个按钮就是N张图片。
如果只做3-5类按钮的背景图片，然后用在网页代码里打上文字，那么修改起来就简单了，让程序员自己改字就可以了
4.版式设计通过文字图形的空间组合，表达出和谐与美。
多页面站点页面的编排设计要求把页面之间的有机联系反映出来，特别要处理好页面之间和页面内的秩序与内容的关系。
为了达到最佳的视觉表现效果，我们将反复推敲整体布局的合理性，使浏览者有一个流畅的视觉体验。
5.避免使用Flash或者图片作导航栏
FLASH虽然有着漂亮的效果，但对于搜索引擎优化来说很不友好，因此我们建议不要用FLASH和图片作为导航。
[总结的网页设计技巧]
篇5：设计大师谈网页设计技巧
很多设计师也许一直在苦恼：要如何才能成为一个优秀的设计师呢?有没有什么设计秘籍或者设计技巧可言?个人认为，要成为一个成功的设计师，虽然没有捷径可走，但是也许却有方法可言。如果凡事不讲究方法，相信要达到目的那是相当困难的。而如果方法对路，那么你离目标就不远了。下面北极鱼就给大家分享一篇来自国外设计大师Purin的关于设计技巧的文章。希望对那些像我一样迷茫的设计师有所帮助。
下面的文章来自设计大师Purin博文的《Design Secrets for Engineers》译文，版式可能有所变动。 如果你是一个像我一样的设计师，你所设计的作品首先要美观。这一点可能会触动你的自尊心，让你以为设计者需要有一种超能力，这种能力足以把整个世界变得更加美好。 如果你是一个工程师，你可能想知道这些设计师为什么会有如此大的力量呢?这是遗传的吗?是因为设计类院校传授给了他们顶级的设计秘诀吗?再或者就是他们和魔鬼进行了交易，用他们的眼睛换得了设计灵感? 现在我带了一些好消息：工程师不需要为了提高视觉设计能力而去寻找什么灵丹妙药。我十分确信，好的设计能力如学骑自行车、弹钢琴一样，是可以后天练成的。如果你练习的足够多，你的设计能力就会越来越好。一旦你完全掌握了它，该技能就不会退化。说这些，是因为我曾经的设计能力也十分糟糕，后来我从事图形设计的朋友给了我一些建议，几年后，我可以骄傲地说我已经是一名设计专家了。今天我希望和你分享这些建议。前五个建议更适合于视觉设计，而后面的三条比较适合于交互设计。 设计空白区域
如果你和15个人挤在同一个电梯中，你肯定会感到呼吸困难……尤其当某个人放屁后。当你设计一个层或者UI界面时，不要试图把太多的元素硬塞到一个页面中，随意再增加一个元素都可能破坏整体的视觉效果。适当留一些空白，给眼睛留有呼吸的时间。我通常会在元素之间留有一些空白区域，确保元素之间不会离的太远，也不会离得太近。看看上图中的版式设计，相信大家自能分辨好坏。 把设计元素排在一条直线上
这条是所有图形设计规则的基础。除非你想再创造一副蒙娜丽莎的伟大作品，否则请把所有设计元素放在一条直线上。我们的大脑更喜欢这样的方式。这种设计风格被称为网格系统，它可以把更多的事物放在同一条直线上。幼儿园的儿童都能够做到，我们这些成年人同样可以做到。 用设计者的字体
在设计的世界里有好字体也有坏字体。好字体(像 Gotham, Trade Gothic Bold Condensed和Garamond)可以让人的眼睛愉悦，它会给你带来一种在海滩上喝清凉鸡尾酒的爽快感觉。而坏字体就像眼屎一样，令人厌恶。尽量避免使用高优先级的默认字体，像Impact、Curlz和Comic Sans。如若你必须使用一个提前置入的字体，Helvetica和Georgia这两种字体可以优先考虑这是两种经典的字体，已经过充分改进。如果你想要一种可以在Web上表现突出的设计字体，可以尝试一下 Typekit。……但请不要用WordArt。 不断从视觉上进行检验
我并不认识你，但我做饭时，我总会不时地尝一尝，以确保我放的调料用量合适。当你设计时，也要不时地检验一下。经常审视一下你的设计屏幕。看看色彩搭配、看看版式设计，请确定你首先看到的是什么?其次看到的是什么?再者呢?同样在十步以外再看一下这个设计屏幕。无论你信还是不信，设计师只要照着做就可以保持设计的正确性。它也可以帮你避免增加一些不必要的细节和按钮。 保持设计的连贯性
在你的设计中，不要用两种以上的字体和三种以上的颜色。要保持整个设计草图的一致性。在我们绘制一个元素时，首先停下来思考一下，让它和整个设计保持一致性。还有一点，我们不要试图拉伸Logo和图像。想象一下，如果某人把你的脸横向拉长了5%，这样还会好看吗? 设置优先级
我们应该分别把重要的事和不重要的事分别列出来，这样可以节约你很多精力。 使用Keynote
我喜欢使用Keynote。Keynote可以使所有元素处于同一条直线上，可以很容易地美化所有元素。如果没有这个神奇的程序，我不知道是否还在别的方法可以帮助我走到今天。除了可以使幻灯片转化成一个个小窗口外，它还可以使UI界面看起来更加流畅。可以搜索一下“Keynote mockup templates”这个关键词，你可以找到很多关于快速简易构建美观原型应用的方法。 检验UI的人性化设计
一个UI界面之所以会成功，多是因为在人们首次看到它时，它可以带来一种很舒服的感觉。在你开始设计之前，先自问一下你设计的每个元素具有什么样的人性化特点。如果这个UI重新被设计，它会带给人什么样的感受? 除这些这外，请留意其他方法。自信往往导致“你永远是正确而其他人都是错误”的想法。但仍要承认一点：你不一定永远正确。 你不可能一夜之间变成一个超级设计者，你需要经过磨炼，同时要相信自己可以做得很好。最后请再次重复一次“我也可以成为一个设计专家”最终你将梦想成真
[设计大师谈网页设计技巧]
篇6：网页设计个员工我评价
获奖记录：
在校期间多次获得国家级奖学金
工作期间多次获得优秀员工称号
自我评价：本人性格开朗，乐于助人，无论是在生活中还是在工作中，人缘都很好，我这yjbys.com样的性格有助于整个工作团队的团队凝聚力。对待工作，我一直都保持着一个比较认真的态度，我的工作能力很强，在处理问题的过程中，能力一直是很高的'，对于专业知识的掌握很好，所以能够胜任这种工作。在工作中，我一直都具备较强的责任心，创意丰富的我，相信一定能够在广告行业中发光发热。在工作中，处理问题的能力很强，丰富的工作经验，也就能够看出，我在工作中不俗的工作能力了。
【修正IE6的bug的10个技巧网页设计】相关文章：
1.网页设计论文
2.网页设计教学计划
3.网页设计教学
4.网页设计制作规范
10.网页设计理念范文
文档为doc格式
