网页设计时出现的问题
当前位置:贝知网>知识分享>平面设计>网页设计时出现的问题
网页设计时出现的问题
时间:2022-12-18 平面设计

网页设计时出现的问题

网页设计时出现的问题

随着技术的进步,时间对于人们来说越来越宝贵,为了一个20M的网页在浏览器前静静坐上1分钟等待加载,那大多数用户都会有关掉它的冲动。下面介绍网页设计时出现的问题,希望对您有帮助。

一、字体大小存在问题

这类问题往往存在多种表现形式,包括字体不足12号使得用户无法看清甚至点不到后退按钮。很多网页的上的字体都是正常大小,对我们来说刚好,但是父母来说网页上的字就会偏小了。

解决办法:一般中文的字体大小是12px或者14px。随着显示器分辨率不断提高,12px的文字在大于1440*900的显示器里看起来会显得比较小,阅读起来不是很容易,所以现在网页设计里面用12px的已经比较少了,特别是文章正文部分,普遍都会用14px。

对于font-family,一般来说14px及以下大小的文字,应当设置为宋体,当然也可以设置为微软雅黑。不过在XP下默认是没有雅黑字体的,所以在css里面可以这样设置字体:font-family:"Microsoft Yahei",simSun,Arial;把几个字体用逗号隔开,如果系统没有第一种字体,就用第二种,如果没有第二种就用第三种,以此类推。对于大于14px的文字,特别是大于16px的文字,宋体看起来就比较丑陋了,所以建议是用黑体或者微软雅黑,看起来回舒服一些。

二、过度使用GIF、动画与音效

在某些情况下,GIF动画非常有趣;动画能够让访问者获得更好的使用体验;音效可能也有助于提升感受。但这些都只是点缀,切记不可画蛇添足。GIF动画过多会造成一种庸俗而幼稚的氛围,而大家对于音效以及音乐的取向也有所不同。有时,我们精心设计,却难以实现效果。

解决办法:千万别让费尽心力添加的动画与音效成了刺眼又刺耳的垃圾元素。使用GIF动画最好能免则免

三、超大的导航菜单

大型的导航菜单,对于包含大量不同子页面的网站而言,似乎是一个很好的解决方案,然而实际情况并非如此。我们常见的网站设计错误就是在边栏及子菜单中塞进长长的清单,超大的导航菜单对于绝大多数的普通用户而言,看起来更像是迷宫。这看似满足了全部用户的需求,实则会分散用户注意力,并让用户觉得不那么爽。如果导航、侧栏与底栏无法协同工作,那么网站内容再好也将没有意义。

解决办法:信息分类整合其实是就是为了应对这种情况而存在的,将网站的导航内容规划为不同的大分类,有了层级,用户更容易筛选;又或者你可以将导航设计成为更为有趣的图文式链接,让它看起来不那么枯燥,也不失为一个可取的方案。永远不要低估在屏幕上留白的重要性,因为其是创造平衡美感的重要基础。

四、乏味无趣的加载页面

随着技术的进步,时间对于人们来说越来越宝贵,为了一个20M的网页在浏览器前静静坐上1分钟等待加载,那大多数用户都会有关掉它的冲动,因为我们会在这个过程中无数次怀疑这个页面是不是卡住了。如今的网站加载需要的是速度和效率,这符合当前的真实用户需求。给用户提供即时的位置、时间和响应对一个优秀的产品来说很重要。

解决办法:如果你的网站在加载速度上有问题,首先应该加载页面中较轻的元素,以及整个框架,然后使用加载器将较大和较重的元素逐步填充进去。这样一来,用户就不会觉得页面卡在那儿,而是在逐步加载了。

缓冲应该尽量避免,如果它必须存在,那就应该有趣一点。加载页面可以是一个加载进度条,一个为浪费用户等待时间的道歉或者是配有文案的简单动画。

响应式网站建设中的常见问题

屏幕尺寸多,很难做到一次编码,到处运行

目前,主流的大家用来访问网页的设备有:计算机(废话),iPad,Android Pad(例如三星的),智能手机。那么做一个网站,必须到这些设备上去测试和运行。普通的网站作坊很少有人会愿意花这么多的精力去测试一个网站。

视觉设计要求高、细节多

因为不能使用绝对定位,那么在设计的时候需要考虑可读性以及区域面积以及在不同的设备下的行为。这对一般的设计师来说简直是一场灾难。所以很少有出众的响应式网站出现。

前端实现难、跨技术合作

响应式设计出的稿子,当然还需要响应式的实现。响应式的基础就是HTML5, CSS3。小的建站公司,一般是没有钱去聘用精通HTML5和CSS3技术的高手的。最多是让程序员在写代码之前看2天书,然后就赶鸭子上架。这就导致了即使设计师设计出了很棒的模板,但是在实现了之后,怎么看怎么不舒服。

成本大

因为响应式设计需要对多个界面兼容、功能调试,导致整个制作过程需要UI设计师和前端工程师要不断磨合制作。而测试人员也要在不同的设备下对网站进行测试。我们做过调查。如果创建一个普通网站的成本是1,那么创建一个响应式模板的成本大概在2.5左右。由于小的建站公司的报价普遍比较低,利润空间肯定不支持他们把网站做成响应式的。

结论

总的来说,响应式网站设计比传统的网站设计复杂的多。它需要更多的人员参与到网站制作中来。它给美工、前端和后台开发团队之间的协作模式带来很多挑战。因此,响应式网站的建设成本往往是传统网站的2-3倍。

关于手机版网页设计的问题

随着手机屏幕尺寸越来越大,迫使手机网站的交互设计不得更加适应用户体验。之前的小屏幕手机的交互方式需要调整。要根据人们的拇指操作区域来设计。36%的用户会双手环抱手机,用其中一只手的拇指操控屏幕。15%的用户会用双手握持手机并用两手的拇指操控屏幕,其中90%的用户操作时习惯屏幕竖着,而10%的用户偏向于横屏操作。那么手机网站设计怎样才能适应越来越大的手机屏幕?

之前的大屏手机在涉及到用户界面交互设计时,几乎没有切实有效的用户交互体验设计,貌似只有手写笔。但是大多数人也没怎么用过。建晨手机网站的交互设计几乎是空白。本文说说手机网页设计需要注意哪些问题?

手机网页设计的色彩运用

手机网页与pc端网页的色彩搭配要协调统一。如果只用一种色彩,可以有明暗、饱和度上的差别,有层次感。如果选用两种色彩,最好使用有对比度的颜色搭配,更有视觉效果。

手机网页设计的工具有哪些

手机网站的工具可以与pc端网站建设使用相同的工具dreamweaver类的软件,但随着三站合一趋势发展,PC网站、手机网站和微信网站可以使用同一个建站系统,手机网站也就不需要独立开发。

虽然手机网站已经非常普及,但在手机网站的用户体验设计、交互设计上还有更大的发展空间,虽然近些年很多手机网站界面有很大进步,但是界面的使用还是会出现千奇百怪的问题,所以这也手机网页设计不成熟的地方。

网页制作中的常见问题

软件的选取

显而易见,无论学习从事任何项目,选择合适的工具合适的入门方法都特别重要。同样,各式各样的网页制作软件比比皆是,风靡市场,有人需要做出特别精致的网络页面,使得操作多重,繁杂不易懂;而有人却只纯粹想要制作一个网页,简简单单,清晰了然,不需要浪费太多精力,不需要特别高端的技术等多种制作形式,所以因人而异选择一种合适制作者的软件尤为重要。这一问题是制作一个好的网页界面的前期必备基础。

网页风格的凸显塑造

通常情况下,人们对任何事物好坏的评判,这一事物给人的第一印象都相当重要,之后对这一事物所有的态度和看法大都与第一印象有很大关联,喜恶爱憎通常因为第一印象便在心里对这一事物有了一个大致的轮廓。因此,先把内容抛在一边,使用者有心思浏览下去才是关键,没有吸引力,内容再好再充实也难以被读者阅读吸收。这就显得网页风格的塑造对于网络本身而言,占据了“门面担当”的地位,必须要有吸引使用者眼球的魅力。

色彩的搭配

颜色构成生活的格调,颜色丰富了人类的视角。色彩搭配的好坏程度常常能够改变一个人的心情,抑郁明快的心情除了由感情决定外,满眼充斥的各式各样的色泽也对心情的好坏有引导作用。乍一眼看去,某一界面或污浊或清丽都能够一目了然,不同的视觉感受造就不一样的心理环境,继而搭配不协调就会造成一定的心理落差,整个网页颜色基调太多就会杂乱无章,主次混淆,甚至造成喧宾夺主等问题,因而对于色彩的了解和搭配也成为制作网页的必须具备的素养。

图文的设计

暂且不说制作者所制作网页的内容如何,首先制作出的效果给浏览者造成一个什么样的浏览心情就尤其重要。以何种方式插图,以何种方式填字,以什么样的兼容方式使二者契合都是最基本的知识,如何合理运用图文的兼并,才使得网页更加完美亮丽,成为网页制作的支撑所在。图文的合理利用,不仅只是内容的充实,美观得体也是操作必须的制作项目。这两者的设计工作掌握运行的好,做到图文兼并适宜,才能做到赏心悦目。图文设计作为一项必备的专业技能,要想制作一个完整的网页界面,制作时必须做到内容突出,点缀装饰图案不能喧宾夺主,主次难分。

网页的分辨率问题

首先明确分辨率的定义。分辨率就是指某一个平面中画面的细致程度。准确来说,即为一个平面图中,无论横向还是纵向,构成图像的点的数量,这是一个衡量网页细节细致程度的参数,不言而喻,构成图面的点的数量越多,画面越清晰有感;反之则会模糊不易辨别。制作者若对分辨率的调整不加以重心,必然满足不了浏览者对于清晰度的要求,适当的清晰度能够使得浏览者根据需求获得自己所需要的资料,不会因放大或者缩小使画面严重失真,造成浏览有盲区。总之,无论过高还是过低,都满足不了使用者需要,因此,网页制作过程中,对于分辨率的设置,必须掌握一个“度”的问题。

文件命名和链接设置

网页制作少不了各式各样图片和文字的介入,这就要求制作者必须了解所编辑内容的格式,进而根据内容格式进行正确的命名,否则经常会造成网页打不开,无法浏览的情况。究其原因,通常情况,无外乎文件命名不当,图片打开格式不当,所使用的打开方式不支持编辑内容等。所以明确文件格式,以正确格式命名或是存储尤为重要。链接的一大目的是简化了在本网页键入的麻烦,直接通过链接就能够浏览其他界面的关联内容,为网页界面腾出更大空间,一个界面就可以包含更多可读性的资料。