门户网站网页设计的要点解析
目前,一些政府门户网站在网页设计方面还存在着诸多问题,如整体创意不足,页面布局不活,色彩搭配不当,字体运用不佳,导航设计不全,名称格式不一,域名没有统一,等等。笔者以为,政府门户网站的网页,特别是主页,起着呈现传达信息、与用户交互和提供帮助导航的重要功能,其设计应遵循以下原则:一是内容决定形式的原则,即网页设计必须服务于网站内容的呈现,要考虑浏览者获取信息的速度和舒适度。二是整体协调一致的原则。即网页设计的各个环节,包括色彩、布局、文字、图片等,要紧紧围绕既定的创意和风格展开。三是服从技术需要的原则。网页设计受技术制约的程度非常明显。如网页的宽度受限于显示器分辨率的大小;网页色彩的选取范围应在网络安全色中;网页中图片和动画的设计必须严格控制其大小和数量等等。
在明确以上设计原则的基础上,政府门户网站网页设计还应掌握以下要点。
1.整体创意与风格
网页的创意与风格是围绕主题和内容,对网页色彩、布局、动画、图片、文字等页面元素统一进行个性化设计而形成的整体视觉效果和艺术特点。当前,一些政府门户网站个性不足,趋向于模式化和同质化,中央人民政府门户网站几乎成了一些地方政府门户网站的“模板”,“千网一面”、“似曾相识”的现象严重。还有的网站网页风格不明显,主要表现在:同一页面内各种元素拼凑堆砌、零散混乱,缺少相互呼应和一致性;在页面与页面之间,特别是一级和二级页面之间,色彩、版式、文字等网页风格大相径庭,页面间联系不够紧密,没有形成统一的整站形象等。网页的创意与风格是网页设计的灵魂和统领,创意匮乏、风格平庸的网站很难吸引人的眼球。因此,加强网页的创意设计和风格塑造是提高网页设计水平的首要解决问题。
应该说,政府门户网站不应仅仅是一种政府发布信息资源和提供信息服务的工具,也应是一级政府在网络上精心打造的视觉形象,应着力反映政府的执政理念、发展策略和远景规划等深层次内容。尽管创意具有很强的主观色彩,似乎来自于灵感与顿悟,但绝非空穴来风完全不可把握。创意设计应紧紧抓住本地区的历史沿革、地域文化、民族特色等个性化特点,选取标志性的图片、有象征意义的色彩、隽永深刻的文字和恰当的布局,按照视觉规律进行艺术加工,设计出完整一致的视觉形象,并长期沿用下去,不断强化浏览者的记忆,久而久之就会深入人心,印象深刻,成为本地区独特的“网络形象代表”,这就是一个政府门户网站成功创意和风格的最终表现。
2.页面色彩与色调
对以呈现信息为主的门户网站而言,和谐的色彩色调能提高信息获取速度,比字形和字体的变化更能提高理解的准确度。当前,一些政府门户网站网页在色彩色调方面的问题主要有:色彩使用过多,造成色彩杂乱相互冲突,色彩观感矛盾,主色调不明确;文字、图片、动画等要素的色彩处理不一致,整体效果不佳,割裂了网页色彩的整体感;网页色调过于鲜艳,色彩对比过于强烈,视觉跳跃过于明显,引起浏览者视觉疲劳和注意力分散;文字颜色和背景色对比不明显,降低了阅读效率。因此,政府门户网站网页的色彩色调设计要尽量做到“稳重不夸张、大气不局促、素雅不浓烈、协调不跳跃”,其设计可分为以下步骤。
一是确定主色调。主色调是页面的主要色彩倾向。企业网站设计中非常重视主色调的作用,如:IBM的蔚蓝色、可口可乐的红色、联想集团的蓝色等,这些颜色与企业形象融为一体,已经成为企业的象征。当前,政府门户网站网页主色调的选择以红色居多,有千篇一律的感觉,其实设计者完全可以根据网站的创意、主题和使用对象,以及利用色彩想要达到的视觉和心理效果,大胆选择黄色、灰色、绿色等作为主色调。
二是确定配色方案。主色调确定后,就要合理运用色彩规律,以主色调为中心,利用色彩的明度、纯度、色相三要素的变化,适当增加其他色彩作为对比色和补色,选取辅色调、点睛色、背景色等组成配色方案,和主色调一起构成有节奏韵律、和谐统一的色彩关系(见图1)。网页配色方案要避免出现色彩单一或用色过多的现象,色彩种类最好不要超过四种。
图1 一种配色方案
三是正确使用色彩。确定好主色调和配色方案后,在色彩的使用中应注意“总体协调、局部对比”,即网页的整体色彩效果应该是和谐的,只有局部小范围的地方可以有一些强烈的色彩对比。要适当保持用色的延续性,在风格统一的基础上,为子网站或功能模块选取不同的主色调和配色方案,既要从颜色上对不同内容加以区分,使得页面富于变化,又要保持色彩的整体性和协调性。背景色一般采用素淡清雅的色彩,应避免采用花纹复杂的图片和纯
度很高的色彩,背景色与文字的色彩对比要强烈一些,便于区分背景和文字,提供舒适的视觉体验。
3.栏目布局与版式
网页布局与版式设计是运用版面设计原理,合理配置与秩序化网页视觉元素的过程,其目的是实现信息传递的清晰化、合理化、人性化,并考虑视觉形态的美化,使浏览者在获取信息的同时获得审美感受。网页布局与版式设计同传统平面媒体的版式设计非常相似,其实质就是在有限的屏幕空间内将特定的视听多媒体元素进行合理的编辑和安排。从整体上讲,一些政府门户网站网页在布局与版式方面,过于方正、刚硬和死板,缺少设计灵感和艺术美感,主要表现在:采用直线和方块元素的多,采用曲线和不规则形状元素的少;采用对称性设计的多,采用非对称性设计的少;采用常规布局的多,突破常规布局的少。布局与版式设计主要应注意以下几个方面。
一是版式线条。网页中文字、标题、图片等会在页面上组合形成各种线条和形状。正确地处理和搭配好这些线条和形状,才能增强页面的艺术魅力。直线条的艺术效果是流畅、挺拔、规矩、整齐,有轮有廓。直线和矩形在页面上的重复组合可以呈现井井有条、泾渭分明的视觉效果,一般应用于比较庄重、严肃的页面;曲线条的艺术效果是流动、活跃,具有动感。(见图2)曲线和弧形在页面上的重复组合可以呈现流畅、轻快,富有活力的视觉效果,一般用于表现青春、活泼的主题。政府门户网站网页设计如果能以直为主、曲直结合,就可以丰富页面的表现力和内涵,显得庄重而又不刻板,威严而又不冷漠。
图2 曲线板式的例子
二是栏目布局。网页布局有“国”字型、拐角型、标题正文型、左右框架型、上下框架
型、综合框架型、封面型、F1ash型、变化型等多种形式。(见图3)政府门户网站主页一般采用“国”字型布局,即最上面是网站标题图,接下来是网站主体内容,左右分列两小条内容,中间是主要部分,与左右一起罗列到底,最下面是网站的制作单位、联系方式、版权声明等。这是一种适合政府门户网站的常规布局,也是一种安全保守的布局,具有便于呈现大量信息、便于设计实现的优点,但使用实在过多,没有任何新鲜感,如果能在此基础上,适当加以错位或非对称的布局变化,页面会显得更灵活和生动。
图3 典型的“国”字型布局
三是页面尺寸。从页面宽度来看,基于800×600分辨率宽度来设计网页已经过时,在17寸以上宽屏显示器已经普及的今天,个别政府门户网站仍采用这一宽度,会在屏幕左右留下了较大空白,显得小气和局促,窄小的页面也不利于呈现丰富的信息,因此,网页宽度应以1024×768分辨率为设计标准。也可以此分辨率为基准,采用自适应屏幕宽度设计,在各种分辨率条件下都能取得较好的效果。从页面长度来看,我国政府门户网站主页绝大部分采用多页式结构。多页式主页应避免为使主页内容显得丰富,将二级页面的内容提到主页上来,使得页面长度超过三屏,显得过分冗长。单页式主页一般为导航型门户网站采用,因为主页呈现的信息量比较少,尤其要注意导航系统的设计,力求周全便捷,避免给用户进一步获取信息带来困难。
四是构图比例。黄金分割比例大约为0.618,可以不精确地表示为3比5(或5比8,8比13……)。黄金分割寓变化于整齐之中。过于强调整齐的形体,容易流于呆板单调;而变化过多的形体,又显得散漫杂乱。黄金分割律中,左右两边长度是不等和变化的,但又符合一定的规律,从这个角度看又是整齐的。它不仅在自然界中随处可见,在建筑、广告、工业设计中也被作为最完美的比例标准。在网页的构图中,有的政府门户网站一味采用对称和居中设计,显得过于呆板,若能有意识地运用黄金分割和视觉中心点来配置页面元素,将大大
增强页面的美感,减少构图比例失调的情况。
五是留白处理。留白是写意国画中常用的艺术手法,它能缓和画面的紧张及复杂度,唤起联想,利于组织严密和突出主题,加强对比,达到画面的均衡(见插图4)著名画家齐白石的《虾趣》就是留白处理的佳作。留白同样也适用于网站的布局设计和图片设计。在给人强烈印象的构成要素的周围留下空白,能扩大和提高视觉效果,有利于视线流动,破除沉闷感。有的政府门户网站网页页面为突出信息量,“寸土必争”,饱满拥挤,给人“堵得慌”的感觉,这就是因为留白处理不当的后果。
插图4 齐白石的《虾趣》
六是视觉流程。视觉流程是一个由总体感知、局部感知到最后印象三个感知阶段组成的心理认知过程。人的视线在一个平面上的流动具有比较固定的认知模式,即从左到右,自上而下,由左上沿着弧线向右下方自然地流动。在打开页面后,如果没有明确目的,浏览者一般会首先快速浏览整个页面,形成初步印象,然后视线会被可视性最强或感兴趣的对象所吸引,并促成点击。在网页设计中,应该遵循“阅读最省力”的原则,要注意视觉流程规律,视觉流速应合理,视线导向应明确,要有意识地引导浏览者视线按流程顺序轻松、省力、愉悦地阅读。依据此原理,在政府门户网站网页布局和版式设计中,应将重大新闻和图片栏目等重要信息,布置在页面靠左上方位置,并依栏目重要程度由上向下、由左至右排列。4.媒体设计与运用
随着网络多媒体技术的进步,图形、图像、动画、视频、声音等多媒体元素的运用,网页由静到动,由无声到有声,极大地丰富了网页的表现力。多媒体的设计运用与表现效果也成为网页设计要考虑的重要因素。当前,很多政府门户网站在标题图的设计上难以脱离“国
徽+政府名称+域名+拼音”的窠臼,有的甚至完全模仿中央人民政府门户网站依葫芦画瓢;有的网站使用类似新浪、搜狐等门户网站常见的飘浮广告条,不符合政府门户网站庄重严肃的气氛;有的网站动画和图片使用过多过滥,造成浏览者晃眼和不适,效果适得其反等,这些都是媒体设计与运用不当的结果。因此,媒体的设计与运用必须注意以下方面。
一是在声音运用方面。政府门户网站一般很少使用背景音乐,主要是因为门户网站访问频率很高,不断重复播放的背景音乐会使浏览者产生听觉疲劳。此外,网页中插入音乐文件,会影响网页打开速度。因此,除了在重大节日或重大事件中,确实需要运用音乐来烘托页面效果外,政府门户网站平时一般不应在网页中使用背景音乐。
二是在图片设计方面。图片包括图形和图像,网页设计中二者通常结合使用,在标题图、LOGO等图片中既有经过处理的图像,也有手工或软件绘制的图形。图片具有极强的信息导视作用,也能强化视觉效果、营造网页气氛以及活泼版面的作用。(见插图5)政府门户网页图片的设计和使用,要紧密围绕主题选取具有独特性和排它性的名胜古迹、风光民俗、代表人物、动植物品种等典型素材,采用富有创意的处理手法,运用协调的色彩色调,确定合适的尺寸大小,精心设定页面位置,突出表现鲜明的地区特色。此外,还应严格控制图片的容量,通常应将每个图片的容量控制在40KB以下,且每个网页的所有图片文件大小合计以不超过200KB为宜。
插图5 广东省门户网站标题图
三是在动画设计方面。动画是网页设计元素中最生动、活跃的因素,具有较强亲和力。据统计,动画对浏览者的吸引力是图片的三倍。网页动画通常采用flash格式,在政府门户网站网页设计中,其设计与运用主要应注意不要片面追求炫酷效果,而应突出和表现主题,不能和页面其它元素脱节;应动静结合,富于节奏,画面变化不能过于强烈刺激,以免引起视觉疲劳;动画数量不能太多,占用版面不能太大,以免喧宾夺主,影响信息呈现和网页打开速度。
5.文字字体与字型
对政府门户网站而言,文字占据了网页的主体部分。文字字体与字型选择应给人以清晰的视觉印象,避免页面繁杂零乱,使人易读易懂。当前,一些政府门户网站网页在字体字型
处理上的问题主要有:文字字体使用过多,颜色变化过多;文字粗细、对齐方式不一致;文字风格与页面内容不符,与主题冲突等。受网站特点的限制和视觉心理的要求,政府门户网站网页字体和字型有较为固定和规范的模式,个性化创造的空间并不大,主要应从以下几个方面来考虑。
一是文字的字体。作为政府门户网站,同一页面上使用的字体种类一般不应超过四种。鉴于浏览者电脑中可能没有特殊字体,网页字体应使用兼容的或系统默认的缺省字体,如黑体、宋体、仿宋及隶书等,如果确实需要其它非常用字体,可将字体图形化后作为图片插入网页中使用。正文文字一般选择宋体,文章标题一般选择宋体加粗或黑体。标题图中的文字字体选择比较灵活,可以是标准字体,也可以是设计的创意字体。除了加粗外,一般不宜采用斜体、加下划线等字体效果。如有港台和国外浏览者,还应建立繁体版和英文版,其字体设置应充分考虑这些浏览者的阅读习惯。
二是文字的字号及间距。在字号的选择上,政府门户网站正文文字一般采用9磅的字号。文字行距、间距通常取网页设计软件的默认值,其中正文的行距以接近字体尺寸大小为宜,文字大小与行距最合适的比例为10:12。适当的行距会引导浏览者的目光,行距过宽会影响文字阅读的延续性,行距过窄会造成文字拥挤,在阅读时发生跳行错误。同时,为适应不同用户的偏好和视力状况,网页顶部最好设有可切换字体大小的图片按钮。
三是文字的排列。由于政府门户网站功能以呈现信息为主,网页文字版式通常较为固定,一般根据文字内容多少分栏编排到固定的、适合的板块中,用板块将文字加以统一。如:双栏、三栏、甚至多栏的编排形式。网页通常使用横排文字,也有网页使用竖排的方式,或者将文字图形化后斜排列。竖向排列的文字空间感和速度感较强,在网页设计中可以根据需要少量使用。网页正文的文字排列方式包括两端对齐、居中、左对齐或右对齐、绕图排列等,但通常采用左对齐这种比较符合阅读习惯的排列形式。
四是文字的色彩。合理的文字色彩设置,能够吸引浏览者的注意,使文字更加突出醒目。对于政府门户网站而言,文字使用色彩种类不宜过多,最好不要超过三种;色彩的纯度不宜过高,文字的色彩与背景色明度对比不宜过强;文字色彩应和网页中的图片、动画等媒体的色彩协调一致,使整个页面色彩和谐统一;强调文字一般用红色,慎用绿色、蓝色等其它色彩来突出显示标题或重要信息。
6.网络导航与改版
为浏览者提供信息资源导航服务是政府门户网站的基本功能之一。在站外导航上,要及
时对导航系统的链接进行检查,去掉死链接和过时内容,添加新网址,保持导航系统的活力和有效性。为便于浏览者形象直观地定位本地区下属行政区政府门户网站,最好采用地图式导航,即点击地图相应位置即可快速进入当地政府门户网站。在站内导航上,应遵循“3次点击规则”,即在主页上没有任何一条信息需要点击次数超过3次,确保浏览者能在最短的时间内找到所需信息。
网站改版是网站建设中的一项经常性工作。当前,一些政府门户网站改版存在着更新频率过慢或过快、改版前后风格迥异等问题。网站界面长期不更新会显得陈旧和缺乏活力;更新太快则很难形成自己的风格,容易破坏浏览者原有的阅读习惯。网站界面应当在使用过程中不断完善,进行一些小的调整和修改。当网站界面已经不能满足需要时,再进行一次大的改版。改版时应当在旧版基础上进行,保留优秀设计因素和VI设计,使网站界面具有历史传承性,最好不要改头换面式地改版。
7.网站名称与域名
网站名称与域名应符合人们的思维习惯和认知规律,有助于浏览者记忆和快速定位网站。在国务院下发的有关文件中,明确要求政府门户网站英文域名后缀为“https://www.wendangku.net/doc/6b11873046.html,”,但对域名中缀没作硬性要求,各网站域名中缀均使用行政区划简称的拼音,但有的以全拼作中缀,有的以拼音缩写作中缀,这两种情况基本各占一半的比例。为防止域名重复和引起歧义,便于浏览者识记,建议统一以行政区划简称的全拼作中缀。
与域名相比,各级政府门户网站的名称更加混乱,以省这一级为例,其命名方式粗略估计有十余种以上,如××省人民政府门户网站、中国.××、××政府公众信息网、××政务网、××在线等等。建议各级政府门户网站参照中央人民政府门户网站的命名方法,统一命名为××省人民政府门户网站,有利于推进政府门户网站的标准化和规范化,形成统一严谨、层次分明的政府门户网站体系。
8.政府网站界面设计思路
政府网站是面向社会各界发布政务信息、提供网上办事服务、反映社情民意的综合性网站,也是透视政府工作和了解城市全貌的窗口。网站界面作为政府的“门面”,可以带给浏览者最直观的感受,同时也从一个侧面反映政府形象。当前,建设服务型政府网站要体现“以人为本”的服务理念,因此网站设计不管从界面风格、色彩搭配还是媒体技术的应用等等,都要以用户为中心作为出发点。从以下几点谈谈政府网站的设计思路:
一、增强用户体验设计
政府网站的用户体验(User Experience,简称UE)是指用户访问政府网站的过程中所产生的纯主观的心理感受。目前我国部分政府网站还存在受众少、用户关注度不高的情况,网站建设多是以充分实现三大功能(信息公开、网上办事、公众互动)为目标,而没有把提高用户体验摆到重要位置。随着计算机技术和互联网的发展,只有更加人性化的设计才能赢得受众,才能逐步提升政府网站的影响力和宣传力,因此设计要从传统的用户界面(interface)向用户体验(experience)转变。
二、明确网站设计风格
政府网站的界面设计要注意简洁大方、清新美观、特色鲜明。当前,一些政府门户网站个性不足,不能体现当地特色,模式化现象严重。
为设计具有风格特色的政府网站,更好的体现网站定位,展现政府的亲和力和表现力,因此在设计过程中要紧紧抓住本地区的历史沿革、地域文化、民族特色等个性特点,选取标志性的图片、象征意义的色彩,并运用相关技术手段进行艺术加工,设计出一套整体形象,久而久之,就成为形成当地特色。
插图6 首都之窗网站
如:北京市政务门户网站整体界面风格是现代中不失庄重,设计简洁美观。多处采用北京特色元素,如墨迹图章logo、故宫角楼以及北海公园等,充分体现了北京兼具有深厚的历史文化底蕴与充满活力的现代科技气息的风格特点。
三、准确运用色彩搭配
在网页中,准确运用色彩搭配也是非常重要的。它不仅可以使访问者产生最直观的视觉感受,也能同时拉近网站与访问者的距离,提高访问者理解的准确度。
政府门户网站网页的色彩色调设计要尽量做到稳重、大气、协调。首先,确定主色调。
主色调是页面的主要色彩倾向。当前,政府门户网站网页主色调以红色和蓝色居多,也有依照地方特色,根据颜色设置独特的网页色彩。其次,明确配色方案。合理运用色彩规律,以主色调为中心,利用色彩的明度、纯度、色相三要素的变化和主色调一起构成网页整体和谐统一的色彩关系。同时注意网页配色方案中色彩种类最好不要超过四种。
插图7 色彩搭配
如:杭州是我国重点的风景旅游城市和历史文化名城,页面设计以蓝绿色调构成,红色字起到突出的作用,网站整体充分体现了“上有天堂、下有苏杭”山清水秀的感觉,让人流连忘返。
四、合理布局网站界面
政府网站页面上元素主要由文字、色彩、动画、声音、脚本等构成。界面布局排版就是要有机地组织这些要素,充分清晰地表现出网站主题和信息架构,给用户良好的操作界面和视觉效果。在界面布局中需要考虑以下问题:
政府网站多采用以信息公开、在线办事、公众参与三大功能定位为划分原则,设计3栏式布局方式,结构清晰,便于用户使用和查找相关信息。根据用户浏览习惯,首先观察网页的左上部和上面部分,之后再往下阅读,再阅读右侧内容,呈现“F”型。因此,在栏目布局上也应将重要内容集中在这些关键区域,获得更多关注。
从页面宽度看,基于800×600分辨率的宽度设计网页已经过时,目前以1024×768分辨率的设计居多。也可以采用自适应屏幕宽度设计,在各种分辨率条件下都能取得较好的效果。从页面长度来看,我国政府门户网站首页绝大部分采用多页式结构。使主页内容显得丰富的同时要避免页面超过三屏,显得过分冗长。单页式首页一般为导航型门户网站采用,该页面注意导航系统的设计,将三大功能定位整合在一个页面上,通过页签切换来实现各栏目展现,力求周全便捷,避免给用户进一步获取信息带来困难。
对政府门户网站而言,文字字体与字型的选择也相当重要。字体应使用兼容的或系统默认的缺省字体,如黑体、宋体、仿宋及隶书等,如果确实需要其它非常用字体,可将字体图形化后作为图片插入网页中使用。同时还应注意留白处理,为突出不同字体的形态特征和区
分段落,留出相应的空白,空白处理对于提高视觉效果有极重要的影响,使分类集中。另外,合理的文字色彩设置,能够吸引浏览者的注意,使文字更加突出醒目,还应注意使整个页面色彩和谐统一。
除以上外,网页中文字、标题、图片等会在页面上组合形成各种线条和形状。正确地处理和搭配好这些线条和形状,也可增强页面的艺术魅力。
五、灵活应用多媒体技术
政府网站设计由最初平面、静态的网页到动态、交互的,媒体技术的应用与进步极大地丰富了网页的表现力。
Flash动画技术的应用,给政府网站注入了活力,具有较强的亲和力和吸引力。Flash 多用在网站头部banner的轮换图片或者网站中需要突出的专题及宣传标语等,既能强化视觉效果又起到活泼版面的作用,同时也应注意画面变换不要过于强烈及跳跃性过大,以免与整体界面不协调或是因动画数量过多,影响页面打开速度,降低用户在网页的停留时间。
声音的运用在政府网站较少,场景式服务导航中常会有引导性及相关介绍性的声音片段,设计同时应注意插入音乐的大小,避免音频文件过大,影响载入速度。
综上所述,以需求为导向,以用户为核心,大胆创新,勇于探索,界面设计中要充分体现“以人为本”的服务思想。
随着互联网Web2.0技术和丰富创意的发展,势必会给政府网站带来新的活力。Web2.0强调的是用户体验和集体参与,个性化的服务应用到政府网站中,变“名片型”网站为“服务型”网站,完善功能,在栏目设计的同时也应注意到后期维护及工作效率的提高,是政府网站建设的当务之急。
网站设计需求分析 一、设计目标 1.实现企业用户的信息发布与宣传; 实现地域企业信息的综合集成和搜索查询。 2.结合游戏网站积分实现企业网站扩展。 二、网站模块 1.用户注册模块:提供个人及商业企业的信息注册。 (1)个人用户:与游戏网站用户注册信息关联,以避免重复注册。需注册为商品交易用户的要进行实名认证,注册成功生成个人物品销售发布平台。 (2)企业用户:需提供营业执照等信息。在与游戏网站用户信息关联的同时,按企业性质分类,生成企业二级网站,供其发布企业信息和供求信息等。 (3)个体工商户:与企业用户相似。 2.个人用户模块:对通过实名认证加入销售平台的,初始默认为可发布5 件以内商品的交易信息。要发布更多的产品信息需要通过游戏网站换取游戏积分来获得(仅发布信息,不提供线上交易)。 3.企业信息模块:按照工业、商业、机关事业、旅游业、服务业、餐饮业等进行分类。 各类企事业单位初始默认可自定义选择5 个页面,如要发布产品销售信息默认10 件商品,更多的页面需要通过游戏网站积
分来获取。页面功能模块下述。 4.个体工商户模块:按照商业、服务业、餐饮业等进行分类。 各类个体商户初始默认可自定义选择 2 个页面,如要发布产品销售信息默认5 件商品,更多的页面需要通过游戏网站积分来获取。页面功能模块下述。 5.企业用户、个体商户二级页面管理模块企业用户默认情况最多可选择以下 5 个页面,个体商户最多可选择以下2 个页面,更过页面可通过游戏积分换取。 (1)用户主页(必选):综合显示用户所选信息; (2)企业新闻:用户可在后台发布各类即时信息; (3)企业介绍: (4)产品信息:所属企业或个体商户产品信息发布; (5)与我联系(必选):联系地址及方式等; (6)团购信息:包含产品信息、交易地址、价格及客户评价等,仅发布信息,不提供线上交易。(默认情况下企业用户发布10 条,个体商户发布5 条,更多信息需通过游戏积分换取); (7)楼层导购:超市必选信息。用于布局超市楼层二维及三维图示和导航信息; (8)旅游信息:旅游业发布适时旅游信息(默认情况下发布10 条信息,更多信息需通过游戏积分换取); 更多的页面可由网站管理员自定义设置。
第一讲网页设计概述 使学生对网站及网页有一定的认识,激发学生学习网页设计的兴趣。 【教学内容】 讲解网页设计的相关术语及网站制作的基本流程。 【教学重点】 网页设计中的若干术语。 【教学难点】 理解网页设计中的若干术语。 【教学方式】 讲授式、讨论式、案例分析式。 【教学参考】 1、《网页设计与制作》杨尚森曲宏山贾文峰等著电子工业出版社。 2、《Internet 网页工场》Wittime工作室重庆出版社。 3、《WEB网站设计》Joel Sklar著高等教育出版社。 4、《HTML网页制作教程》材义语编著铁道出版社。 【新课内容】 1.1 WWW和URL 1.1.1 Web的起源 Web是World Wide Web的简称,一般也称之为WWW或3W 1.1.2 Web的特点和结构 Web最大的特点是使用了超文本(Hypertext) WWW采用C/S(客户机/服务器)工作模式 在浏览器和服务器之间应用HTTP(Hyper Text Transfer Protocol,超文本传输协议)作为网络应用层通信协议 1.1.3 URL URL的完整格式 协议://主机名或IP地址:端口号/路径名/文件名
1.2 IE5的使用 Web浏览器是浏览Internet资源的客户端软件 在Windows环境下使用的浏览器主要有Internet Explorer、Netscape Navigator、Mosaic等 1.2.1 IE5的界面 1.2.2 IE5的使用 1.3 网页中所使用的技术 1.3.1 HTML语言和XML语言 1、HTML语言 ?HTML只使用SGML中很小一部分标记 ?HTML语言(Hyper Text Markup Language 超文本标记语言) ?HTML是纯文本的语言,其源代码可以用各种文本编辑工具进行编辑,常用的网页制作软件如FrontPage、Dreamweaver等实际上是自动生成HTML源代码的工具 2、XML语言 XML(eXtensible Markup Language) 1.3.2 动态网页 1.3.3 多媒体技术的应用 1.3.4 Web服务器端程序 1.4 制作网页的基本方法 1.4.1 制作网页的基本步骤 1、确定网页的内容 2、设计网页的组织结构 3、资料的收集与整理 4、选择网页的设计方法 1.4.2 制作网页时要注意的问题 1、网页的标题要简洁,明确。 2、在文本中要使用水平线,以分割不同部分。 3、对重点段落要强调显示。 4、网页中插入的图片要尽量的小。
第1篇公司网页设计师工作总结 公司网页设计师工作总结 公司网页设计师工作总结样本公司网页设计师工作总结样本1 根据岗位职责的要求,我的主要工作任务是 (1)负责对外宣传,具体包括工业园网站建设、二期招商画册的设计制作及参加相关展会等; (2)日常接待工作; (3)相关活动的策划及筹备; (4)担任讲解工作; (5)领导交办的其他工作。通过完成上述工作,使我认识到一个称职的招商主管应当具有良好的语言表达能力、流畅的文字写作能力、网站建设维护能力、大型活动的策划及筹备能力。目前我在网站建设、大型活动的策划方面存在不足。在网页制作的过程中我发现,根本无法适应精美网页的制作要求,于是重新学习了新的网页制作软件dreamweavermx及图形处理软件。目前我已熟悉了上述软件的常用功能并能运用其进行基本的网页制作及图形处理。为了让自己做一个称职的招商人员,我阅读了网上的部分策划案例,以便在以后的策划工作中有所帮助。 xxxx年又是一个充满激情的一年,在今后的工作中,我将努力提高自身素质,克服不足,朝着以下几个方向努力 1、学无止镜,时代的发展瞬息万变,各种学科知识日新月异。我将坚持不懈地努力学习各种招商引资知识,并用于指导实践。 2、“业精于勤而荒于嬉”,在以后的工作中不断学习业务知识,通过多看、多学、多练来不断的提高自己的各项业务技能。 3、不断锻炼自己的胆识和毅力,提高自己解决实际问题的能力,并在工作过程中慢慢克服急躁情绪,积极、热情、细致地的对待每一项工作。 公司网页设计师工作总结样本2 时间一晃而过,转眼间试用期已接近尾声。在这段试用期中可以说是有喜也有忧。和同事们工作相处中,自己慢慢转变为一个社会人,详细内容请看下文网页设计师年度个人总结。 记得初到公司时,我对公司的了解仅仅局限于公司网站的简单介绍,除此之外,便一无所知了。但是,在领导和同事们的支持和帮助下,我不仅加深了对公司的了解,而且很快就掌握和熟悉本岗位工作的要求及技巧,严格做到按时按量完成产品终端页等页面的制作,保证页面的与效果图的一致性和页面在各个浏览器中的兼容性。同时,减少页面中冗余的代码,保证页面的加载速度。 自从担任网页制作以来,虽然在工作中取得了较好的成绩,但也还存在一些不足之处。例如工作中没有充分领会领导的意图,有时会忽视公司的工作流程等等,这些都是由于工作态度和细节决定的。这些不足都需要在今后的工作中加以改进。 在今后的工作中,我将努力提高技术水平,克服不足,朝着以下两个方向努力
精品网页设计欣赏及评析 1.商业清爽型 国外现在较流行的风格,国内也有不少模范者,可是往往在色彩调配和细节方面有所欠缺。图一图二特点:利用方框构图,简介明了,图片一般大面积出现,但图片一定要结构清晰,色彩鲜明色彩方面多使用大面积浅灰度和白色,以衬托logo 和配图的色彩鲜艳,配以高明度小小色块(如导航处)。因为结构构图简单,细节方面一定要讲究,不适宜有过于复杂的logo 和点缀出现,多用简洁明快的几何图形结合。一般此类风格背景如果是彩色,都会是低纯度低亮度彩色,以反衬主题图片和logo。在大面积背景压住的情况下,图片明度越高越爽。画面应该有一个主色调。注意图二左下脚的logo,有意与背景色调相同,以免抢了视觉中心,这是很多人常犯的错误。图三注意细节图案的使用,这是大多数设计者弱点所在,细直线条与箭头、方块、园点不要乱用,每个点的存在你都要有理由。 2. 商业门户型现在的商业门户网站在几乎都是三栏,上面是logo+banner 。其实门户网站因为信息大,更新频繁,在设计时应该充分考虑可扩展性,我认为可以充分利用下拉特性,充分考虑左上位置的设计,主体争取结构明了简洁。下面我们一起来看看几个门户网站的设计。图四所示的这个网站是卡通网站,广告栏很大,但通过精心设计使之醒目而不凌乱。图片统一使用斜角,统一又不呆板。图五所示网站使用曲线与直线的结合,蓝灰色主色,画面沉静而不脏,这里的色彩难度很高,需要细心调试,色块分割,简单明了。图六所示网站主题部分简之又简,在背景上做足了功夫,轻轻的灰度变化,是现在国际流行的风格,高雅,不花,充分烘托主体。图四图五图六 3. IT 企业实用模板图七图八图九图十 4. 时尚企业网站模板图十一图十二 5. 主题型实用网站模板图十三上图所示模板其logo 和图片以及其绿色的主色调与动物园的环境和业务非常贴切。美食业务主题网站,布局合理大方,整体设计“色香味”俱全,主题鲜明,功能齐全。 6. 学校教育型模板图十四图十五 7. 儿童主题型网站模板图十六图十七图十八图十九 8. 个人个性化网站模板 以下的10个网页设计作品是ThemeForest上最受欢迎的优秀企业网站设计模板的其中一小部分。它们风格低调沉稳,几乎只使用黑白灰三种色彩,却不雷同,并且在细节上都非常讲究。ThemeForest是非常值得网页设计师关注的高品质网站,其上的几乎每一个设计模板都称得上是杰出的设计作品,值得我们认真揣摩学习。这篇文章里我将根据自己的观点对这10个设计模板的设计思路和方法做一总结,列出其中的要点,挖掘值得我们在网页设计中值得借鉴的东西,希望能够对大家有所帮助。
浅析网页界面设计——首页设计 首页设计,需开宗明义突出主题 开宗明义,无论是对于一篇文章、一场会议或一部专题片,还是对于一个网站来说,都是必不可少的。那么能为一个网站开宗明义的地方(标签)就是Title(标题)和Description(描述、副标题),而能够为Title和Description 提供进一步诠释的就是网站的首页。 展示哪些信息 页面的重要性是建立在它所呈现信息的基础之上,反过来说,页面要向用户展示哪些信息是决定其重要与否的首要指标。在网站页面中,网站标题、副标题、菜单(狭义上的导航,请参看《WEB导航设计》)、用户登录信息、关于、版权信息这几项是网站的基础信息,是一个网站身份的象征,承载着向用户表明网站立场、提供何种产品或劳务、网站自我介绍、如何联系网站的重要使命,在设计页面时,这些信息必不可少。 而网站的首页,除了需要显示以上这些基础信息之外,最重要的是还承担着网站转化率的重任,这也是所有类型的网站首页的最重要任务。如何让网站首页完成这项重要的任务呢?我的理解是把网站所提供的产品或劳务通过版式设计、文案设计、色彩设计之后,展示在首页适当的位置,并使其不受其它信息元素干扰,甚至使其它元素为它(产品或劳务)服务。 突出主题思想 知道了首页需要展示哪些信息,知道了信息之间的权重,如何把信息呈现得更符合信息本身,却不是一件容易的事,需要时间的磨练与经验的积累。就设计本身而言,是一件感性的事,不像数学公式,它缺乏严谨的理论做为指导,所以在工作中,经常出现与Boss、同事意见相左的情况。我个人的经验是在非重要信息的设计上使其具有普适性,在重要信息的设计上突出设计的主题思想,在与Boss、同事讨论时,尽量把讨论的重点放在主题思想的呈现方式与其对转化率(或市场目标)的作用之上。你可以说这是功利的设计,没错,所有的设计都是以商业利润为最终目的。 如何突出 在版式设计上,要求把信息分门别类,让用户在扫描(只为扫描而设计,请参考《Don’t Make Me Think》)页面时保证视觉流的流畅性,在短时间内(3-5秒)发现首页包函哪些区域(如菜单、广告、注册、个人信息、链接、按钮等),方便用户在第一时间内做出选择。在设计过程中,建议严格遵循四个排版的原则,即:对比、对齐、重复和亲密性(请参看《写给大家看的设计书》)。如https://www.wendangku.net/doc/6b11873046.html,、https://www.wendangku.net/doc/6b11873046.html,、https://www.wendangku.net/doc/6b11873046.html,的首页设计。
https://www.wendangku.net/doc/6b11873046.html, 网页设计中四个页面布局要点网站排版布局是整个网站页面的核心,网页的基本结构千变万化,布局也不必拘泥于固定的格式,设计师根据实际情况变化即可。不过,关于网页设计的四种布局要点还是需要知道的。 一、无边界 无边界的布局模式,只是画出了一个大致的框架图,也许你只是想说这只是框架,因为设计规划前期很多素材还并不完善。一段文字和一张图片,甚至一个图标,在你进行布局的时候,由于素材并不是立刻手到擒来,因此布局总是喜欢用一个个矩形来代表一段文字或一张图片,这本没有错,但这个做法也会让人陷入“框架陷阱”。 二、基于模块或网络 有些排版方式是建立在模块化或类似网格的结构上的,在这些设计中,每个模块都力图根据屏幕尺寸伸缩调整。实际上这并不是什么新的方式,不过响应式网页设计让它变得更加有用,它暗示了一种自适应布局模式,可以像搭积木一样,由各种模块组件创建而成。 三、垂直分割
https://www.wendangku.net/doc/6b11873046.html, 垂直分割式的布局在上一篇文章中我们也有提到过,使用垂直分割布局,原因有两个。有时候在一套设计中,的确存在两个同等重要的主体元素。网页设计的通常方法,是按照重要性给内容排序。然后重要性会体现在设计的层次和结构上。但是假如你就是要推广两样东西呢?这种方式,可以让你突出两者,并让用户迅速在其中做出选择。第二是要表现出重要的两面性。 四、几何图形 网页设计布局几乎都是由几何构成的,三角形、圆形、矩形等等,都经常被使用。加之显示屏本身就是矩形,因此在布局时最常用到的也是矩形。 在实际的网页设计过程中一定是花样百出的,绝不可能用一两种布局模式就轻松完成,多思考多改变,总不会出错。但不管如何变化设计方式,最终还是要围绕着“美观”与“用户”进行的。
网页设计年度考核个人总结 时间飞逝,来到这里已经整整一年了,在这里我对我一年以来的工作情况进行简要的总结,算是对公司也是对个人这段时间的工作的一个交代。 一、个人工作总结 我是去年2月有幸被录用的,之前我一直从事广告平面设计方面的工作,到了苏州后找的第一份工作就是页设计,不过做的时间不是很长,对这方面还算是个生手。 到了同程以后,先是担任平台设计师的工作至5月下旬,然后又调到站建设部做站设计师一直至今。在工作中,我学到了很多东西,从不懂,到有点懂,再到熟悉。这中间的过程,只有我自己最清楚。 很多时候,日常的工作是琐碎的,我们只有自己从中找到乐趣,才不会觉得枯燥;很多时候当我们做站刚有灵感的时候,会突然有其它的工作布置下来,我们只有自己调整好自己的心态,统筹安排好自己的工作,才不会手忙脚乱。 那天爸爸给我打电话的时候,我正在加班,爸爸说,怎么又在加班了,要注意身体。我告诉爸爸,不知道为什么我喜欢工作,喜欢那种充实的感觉,虽然有的时候回到家的时候真的很累,也会偶尔觉得自己活得有点辛苦,但是一旦自己真的闲下来的时候,反而觉得很不适应了。爸爸说,恭喜你,长大了,那至少说明你不是一个好逸恶劳的人。 我喜欢爸爸的评价,我是个极其热爱设计的人,有兴趣,有灵感,我知道我或许不是最好的,但是我一定是最有激情的。我真的很喜欢设计,我也不知道为什么,所以,我想证明自己,证明自己的能力和一颗真诚而执著的心。明天会怎么样,谁也不知道。至少今天我要对得起自己。 非常感谢公司给我这个成长的平台,令我在工作中能不断的学习,不断的进步,不断提升自身的素质与才能。
二、与同事相处 到了同程以后,要感谢的人真的很多 在平台上工作的时候,感谢总监一直教导我,要不断提高自己的设计能力;感谢龚琳娜从我进公司的第一天起,就耐心的教给我很多我不懂的东西;感谢刘国平和邱小东,在我刚进公司对代码丝毫不懂的情况下,对我的热心的帮助。感谢有在平台上磨练的那段时光,正是那段时间激发了我的斗志和工作热情! 到了站建设部以后,我被一种莫名的东西感动着。我们是一支年轻的队伍,部门经理也是一个80年代以后的年轻的女孩子。我们虽然年轻,但是我们并不浮躁,我们充满激情和憧憬,我们充满力量和动力。这不正是我想要的那种感觉吗为了一个同目标,我们会齐心奋力向前。我的心找到了归宿,我安定了下来。我确定:这就是我的事业,为同程,为自己,努力着!前进着! 感谢每一个人对我的帮助和支持,感谢大家那么喜欢我(哈哈~~我脸皮是不是有点厚了啊!)我会继续努力的,让我们前进的步伐越走越坚定!!! 三、与客户沟通 虽然从大学毕业的时间还不到两年,但是,可能因为我是一个不太能闲得住的人吧,从大二开始我就在学习之余将自己的另一只脚正式踏入了设计行业。 在来同程之前,我也接触过很多各种各样的客户,有蛮不讲理的,也有和蔼可亲的,不过那些都是和客户当面沟通交流的,和客户在意见上发生分歧时,大部分我可以很轻易的用我的设计专业方面的知识说服客户,甚至可以现场做出效果来改变他们的主意。 可是,来了同程之后,我才发现电话沟通真的是一门很深奥的学问。在电话这头的我,看不见电话那头客户的表情,动作,只能从电话中客户的语气来分析猜测客户此时的想法和心情。也渐渐开始明白:有些时候,不论客户再怎么纠缠,我都必须坚持某些工作上的原则, 因为一旦为一个客户开了先河,我就必须考虑到接下来该如何面对更多的
网页设计美工工作总结报告 时光匆匆,xx年马上离我们远去。回首这走来的一年,似乎去年 的圣诞歌还在耳边萦绕,实是感叹时间的飞逝,让自己的脚步显得如 此匆忙。可细细品味,却也发觉自己在不轻易间成熟了很多。不知不 觉中,充满希望的xx年就伴随着新年伊始临近。回首xx年的工作, 有硕果累累的喜悦,也有遇到困难和挫折时惆怅。 在医院我所从事的岗位是网络美工,工作主要涉及到网站的广告 设计,广告图片替换,页面策划修改;网站的页面制作,样式修改,后 期维护等不同工作。能够说凡是需要突出我们网络部及网站整体形象 的地方,就需要美工参与工作。 设计工作是痛苦并着快乐,每当面临重大的设计任务时充满了压力,开始搜集各种资料(包括文字的、图片的),接下来寻找设计灵感,沉思、焦灼,经过痛苦煎熬,终于有了满意的创意时倍感轻松。每当 经过艰苦的磨砺,自己的劳动成果得到大家的肯定时,便是工作中的 快乐!充满了快意。 下面是我过去一年来工作回顾,工作主要围绕以下内容: 1、官方网站改版。 2、激光美容网制作与设计。 3、中韩整形美容网站相关样式修改,日常维护,广告设计,内容 更新。 4、活动专题,与项目专题的设计。根据文案提供的内容来设计策 划专题活动。平均 3天/个。 二、经验总结: 作为一个网页美工除了要求网页三剑客,ps这些必会的软件之外,还要求对html用得熟练,对asp或php,以及jsp要有初步的了解。
1.表达一定的艺术效果,特别是医疗网站,视觉效果很重要。一 个成功的网站应该把网页设计得吸引人,同时又要传达设计思想和情感。网页作为一种媒体,它必须具有一定的艺术感染力,一个平淡无奇、杂乱无章或毫无美感的网页很难会有浏览者喜欢,更不说去浏览 它的内容了。 2.使页面结构清晰可读性强经常能够看到这样的页面,上面堆砌 了很多内容,却没有考虑它的空间框架,让人无法知晓那些内容才是的。没有流畅的视觉流程,这是典型的没有注意到编排清晰度、可读 性的表现。 3.实现不同的功能:在网络这条信息高速公路上,网页最主要的 功能就是一种传递信息的手段。所以,它一切内容都是为了这个目的 而服务。都要围绕这个中心实行设计。然后,要实现这个功能,网页 的美工设计和内容都必须有针对性。所谓针对性,就是指对不同类别 的网页要求采用不同的美工艺术效果。 4.网页的内容: 网页设计人员美化网页,增加网页设计的艺术感,都是为了网页 设计的内容服务的。一般来说,网页的几项基本内容:标题、网站标志、主体内容、导航、广告栏等。 5.确定网站的风格: 整形美容行业的网站或者专题,浏览用户群体,一般都是爱美人士。年龄大约在20~45岁之间,对于这类群体,页面设计得浪漫并有 艺术感。 6.确定网页之间的链接关系: 在网站的部体规划列出来后,就必须要考虑各个网页之间的关系,是星型、树形、网型还是直线链接!
浅谈Photoshop在网页布局设计中的意义与方法
摘要 当今网络已经成为人们生活的重要组成部分,由此一个新兴的专业---网页设计诞生了。部分技工学校为适应这个职业对人才的需求纷纷开设了网络工程专业。但是在培养网页设计人员的过程中一些教师由于缺乏网页设计实践经验,对Photoshop这个图象软件在网页设计中对网页元素的整合作用认识不足,没有使这个软件发挥其应有的作用。本文针对这个现象,对Photoshop在网页设计和规划中的作用和意义以及运用Photoshop进行网页规划时应注意的问题作了论述,特别是对Photoshop的切片功能和操作方法做了详细的说明,这对于初学网页设计的人员来说更具有指导意义。 关键词:网页设计Photoshop 布局 现在是IT时代,几乎没有哪一行能和网络脱离关系,因此网站的规划与建设已经成为一项专门职业。在网站规划建设中,网页布局设计是其至关重要的一环,它关系到网站能否吸引更多人的眼球,直接反映网站的点击率,而点击率正是网站的生命所在。所以网页布局设计是否美观、规范、合理越来越受到网页设计师的重视。 网页布局设计的软件很多,如Dream weaver 、FrontPage 等都可胜任,但是初学者往往是一上手就使用Dreamweaver等进行规划布局,结果使网站建设延期,下载速度降低,更糟的是合同违约,失掉客户,造成不可估量的损失。纠其原因,关键是忽视
了Photoshop 在网页规划布局中的作用。初学者知道Photoshop 是图像处理软件,但只是把它用来解决一般图像裁切、调整、优化,而忽视它在网页布局设计中的重要作用。 一、Photoshop 在网页布局设计中的作用
专题页设计技巧浅析 https://www.wendangku.net/doc/6b11873046.html,以下面的这个奥运专题为例为大家分析专题设计中常遇到的一些问题。
这个页面存在的问题很多,我们来一个个分析。 第一个问题首屏高度 分析一下常见分辨率及浏览器下高度数据: 在window XP常见分辨率1024×768下我们除掉任务栏,浏览器菜单栏以及状态栏后剩下的网页首屏高度平均值是584。Win7下是574。在window XP常见分辨率1440×900下我们除掉任务栏,浏览器菜单栏以及状态栏后剩下的网页首屏高度平均值是716。Win7下是706。综合上面表中个分辨率及浏览器下的统计数据,我们很容易画出两条首屏线,分别是580PX和710PX,对应不同的分辨率。再来看下不同分辨率用户的占比情况: 通过对大于30W台客户端用户进行测试,得到的测试数据如下:首屏高度低于等于580 的有116786 个
人,占44.64%; 首屏高度低于等于720 的有216227 个人,占82.64%; 首屏高度低于等于800 的有241420 个人,占92.27%; 首屏高度低于等于900 的有259174 个人,占99.06%; 即当首屏高度大于580时有44.64的人看不到;大于720时有82.64%的人看不到; 大于800时有92.27%的人看不到。 我们将这个数据转化成3条线直观的显示在专题页面上: 总结起来就是注意首屏高度。 建议将最主要的信息显示在580PX高度范围内让用户打开网页第一屏就可以直接看到不用向下滚动。
第二个问题:标题够显眼么? 检验一个专题头图标题是否够显眼其中的一个方法就是将网页去色,站在远处看看标题是否还看得清。我们有这个方法来检验一下这个专题: 是不是就可以看出头图文字跟背景混在一起不够清晰。
网页制作学习心得5篇 篇一:网页制作心得体会 《文文工作室网站说明书》 姓名:陈家文学号:200936627204班级:电商092 一、网站规划 本工作室主要用来做个人网站,主题是介绍自我,让更多的朋友认识我,面向我的同学和朋友以及想结交我的朋友。 二、网站总体设计 本工作室只要包括我的主页、我的简介、我的日记、我的相册、网站建议等五个板块。通过我的主页可以进入其他四个板块,其他四个板块也可以通过超链接回到我的主页去。 三、网站设计与制作(包括网页设计、图形设计、动画设计中的主要技术、方法和设计效果) 本网站的布局大多是运用CSS进行布局的,这也是老师一直强调我们的。为了增加视觉效果,个别网页还特别添加了flash效果(我的相册),还用到了视频和音乐等素材(如我的主页)。个别网页添加了表格,这样显得网页更齐整。对于美化这部分,我还特别用Photoshop对一部分图片进行了处
理,让图片和网页更好地搭配。在个别网页添加表单,可以让浏览者和网站更好地互动,交流信息。 四、学习体会 不知不觉,我已经学习《网页设计与制作》这门课程一个学期了,虽然时间有点短,但这一个学期以后我却受益匪浅,不仅让我全面的、系统的学会了页设计与制作的基础知识,还让我学会了自己动手去制作属于自己的网页,这对于我来说是很值得高兴的,能让我在以后的工作生活中更好的展现自己。 建立一个网站就像盖一幢大楼一样,它是一个系统工程,有自己特定的工作流程,你只有遵循这个步骤,按部就班地一步步来,才能设计出一个满意的网站。首先,我们要确立网站主题。网站主题就是你建立的网站所要包含的主要内容,一个网站必须要有一个明确的主题。特别是对于像我这样的个人网站,你不可能像综合网站那样做得内容大而全,包罗万象。你没有这个能力,也没这个精力。网站的主题无定则,只要是你感兴趣的,任何内容都可以,但主题要鲜明,在你的主题范围内内容做到大而全、精而深。 然后,我们要找材料。明确了网站的主题以后,你就要围绕主题开始搜集材料了。常言道:“巧妇难为无米之炊”。要想让自己的网站有血有肉,能够吸引住用户,你就要尽量搜集材料,搜集得材料越多,以后制作网站就越容易。材料既
旅游网页设计六大要素 随着互联网的兴起,各种传统行业分分加入了互联网,包括咱们的旅游行业,下面“思途CMS”为大家总结、梳理了一份关于旅游网页设计的六大核心要素,掌握之后,能够让旅游网页设计更加简单! 1.网页的主题 每一个页面都有一个核心的主题,首先分析确认这个页面的核心主题是什么,根据核心主题分析当前页面需要的内容,哪些内容是可以支撑这个页面的出题的,板块出来之后,核心内容放哪一块,其他的辅助内容又该放在哪儿?如何去衬托核心的内容,这些都是需要站在用户浏览者的角度去思考。必要时可以先画一个草图。 2、网页的色彩设计 网页的色彩设计可以根据行业及页面主题进行选择,比如旅游行业,那么大部分都是小清新类型,不凡有部分旅游企业是做红色旅游或者其他主题旅游的。所以在选择色调上面一定要围绕着自己的页面主题进行设计。
3、网页的字体设计 网页的字体设计需要考虑到用户的浏览习惯,用户的浏览习惯一般是从左上方浏览至右下方,需要着重考虑页面的核心内容及广告位上面的字体设计。例如,有些网站为了凸显广告,将核心的字体内容进行了特别的设计。 4、搜索相关资料 网站的骨架搭建起来以后,就需要进行内容的搜集各整理了。将内容添加到自己设计的页面当中,看看页面中是否还有不协调的地方没有。
5、进入实际操作附阶段 在规划出网页的版面和呈现方式后,就要进入实质性的工作了,即用各种软件,如文字编辑、图象处理、动画制作、音乐处理等来进行实际操作,最后通过网页设计软件将这些文字、图象、动画组合到页面中。 6、检查网站内容 当一切工作都已经完成后,在发布网页之前还要检查页面上的超链是否正确,图片是否正常显示,文字中是否有错别字等,以保证呈现给访问者一个完美的网页。
个人的小结 网页制作的心得体会----网页制作论文摘要通过这次个人网页的制作,我对计算机有了更深层次得到了解,也有了更浓厚的兴趣。尤其是对网页制作的过程与一些技巧手法更有了另外一番了解,对网页制作的基础知识也有了一定的掌握。通过把自己的网页上传到互联网上,对文件的保存、上传、下载以及修改等知识有了更牢靠的掌握。通过自己的努力完成了自己上传到网上的第一个作品,那种成就感是无法用语言形容的。所以我觉得这次制作网页我已经达到了自己的目的,而不是单单为了完成作业而已。这是一个完全关于自己的个人网页,既然是介绍自己,就应该让观者在浏览了之后了解自己其人,我觉得这点我已经基本上做到了。 关键字页面设计ASP和数据库 1.一般来说,个人主页的选材要小而精。如果你想制作一个包罗万象的站点,把所有您认为精彩的东西都放在上面,那么往往会事与愿违,给人的感觉是没有主题,没有特色,样样有却样样都很肤浅,因为您不可能有那么多的精力去维护它。注意:网页的最大特点就是更新快。目前最受欢迎的个人主页都是天天更新甚至几小时更新一次。 2.题材最好是你自己擅长或者喜爱的内容。比如:您对诗歌感兴趣,可以放置自己的诗词;对足球感兴趣,可以报道最新的球场战况等等。这样在制作时,才不会觉得无聊或者力不从心。 3.不要太滥或者目标太高。“太滥”是指到处可见,人人都有的题材;“目标太高”是指在这一题材上已经有非常优秀,知名度很高的站点,你要超过它是很困难的。 选定了一个好的题材,是不是可以立刻动手制作了?不,经验告诉我们,必须要先规划框架。这是很重要的一步!每个网站都是一项庞大的工程。好比造高楼,没有设计图纸,规划好结构,盲目的建造,结果往往是倒塌;也好比写文章,构思好提纲,才不至于逻辑混乱,虎头蛇尾。全面仔细规划架构好自己网站,不要急于求成。 规划一个网站,可以用树状结构先把每个页面的内容大纲列出来,尤其当你要制作一个很大的网站(有很多页面) 的时候,特别需要把这个架构规划好,也要考虑到以後可能的扩充性,免得做好以後又要一改再改整个网站的架构,十分累人,也十分费钱。 大纲列出来后,你还必须考虑每个页面之间的链接关系。是星形,树形,或是网形链接。这也是判别一个网站优劣的重要标志。链接混乱,层次不清的站点会造成浏览困难,影响内容的发挥。 为了提高浏览效率,方便资料的寻找,本站的框架基本采用“蒲公英”式,即所有的主要链接都在首页上,链接的层次不多,深度浅。 框架定下来了,然后开始一步一步有条理,有次序地做来,就胸有成竹得多,也为你的主页将来发展打下良好的基础。 下一步,你可以动手制作具体内容了,我将告诉你一些收集资料的窍门。 题材选定,框架选定,接下来就开始往主页里面填内容。我们称作资料收集 就个人主页而言,很少有人有能力完全靠自己来创作所有的内容。(一些高手能够提供自己编的软件,文章或则音乐,是我非常佩服的!) 大部分人的方法是:从报纸,杂志,光盘等媒体中把相关的资料收集整理,再加上一定的编辑后就可以了。 另外一个好的方法是从网络上收集,您只要到雅虎,搜狐等搜索引擎上查找相应的关键字,就可以找到一大堆的资料。 如果您是英语高手,您可以到国外站点上把最新的信息,资料翻译成中文,提供给大家,这叫“洋为中用”。
____________________________________________________________________________________________ 网页设计经典作品欣赏 大同小异的网页设计已经让你视觉疲劳了吧,加入不规则几何形状的网页设计也许能让你的眼睛重获新鲜感。几何元素的融入不仅让网页变得高大上,也在无形中突出了网页中的某些内容,这样的突出方式并不单薄无力,反而让网页看起来更自然。一网学,致力于网页设计培训、UI设计培训、淘宝美工培训,平面设计培训,是最好的远程设计培训学校。 没有人会对沉闷的网页产生兴趣,而几何图形恰巧能在增强视觉体验的同时营造出活跃的氛围。我们为大家找到了14个融入了几何元素的网页设计,尽情享受吧! Ondo Ondo的网站选用了较为鲜艳的色彩,再加以特别的效果,让用户在浏览时得到了一种别样的视觉感受。如果上一个案例表达了宁静的主题,那么Ondo表达的就是城市中的现代繁华。 Wildlife 这个网站中的几何元素体现在各方各面,既有设计师的设计,同时,局部也拼凑了一些包含几何元素的真实图片。我们可以看出该设计师对不规则元素十分热爱,图片本身的形状也不是传统的中规中矩,让整个页面多了一种拼贴感。
____________________________________________________________________________________________ Wixel Wixel的网站运用了几何元素,增加了现代化元素。
____________________________________________________________________________________________ Kinder Fotografie 几何元素的叠加使用使画面富有层次感,大小不一的正六边形更是增添了活力。 LIGAYA SCAFF 几何元素的作用比较多元化,随着周围坏境色彩的变化,它也能随之显现出完全不同的效果。在这个案例中,几何元素释放了它的神秘感。半透明的图片设计让网页有了重叠感,而规则的几何也不会让网页很繁复。
浅谈网页设计中的版式设计 【摘要】网页设计包含视听元素与版式设计两项内容,而网页的版式设计在整个网页设计中具有重要的作用。它决定了网页的艺术风格 和个性特征,形成了网页整体视觉印象,本文拟就网页设计的版式设计谈谈自己的看法。 【关键词】网页设计;版式设计;布局 1.概念 1.1网页设计网页设计是在Internet的发展和数字技术的发展中出现的新艺术形式。它是以Internet为载体,以网络技术和数字技术为基础,依照设计目的、遵循艺术设计规律,实现设计目的与功能,强调艺术与科学密切结合的一种艺术创造化视觉传达活动。它是网络视觉艺术的主要表现形式,也是设计艺术的重要组成部分,它具有媒体相关性、数字技术性和设计艺术性三大基本内涵。 1.2网页版式设计网页版式设计是指在有限的屏幕空间内,按照设计师的想法、意图将网页的形态要数按照一定的艺术规律进行组织和布局,使其形成整体视觉印象,最终达到有效传达信息的视觉设计。它以有效传达信息为目标,利用视觉艺术规律,将网页的文字、图像、动画、音频、视频等元素组织起来,产生感官上的美感和精神上的享受,充分体现了设计师的艺术风格。 2.网页版式设计的作用 网页版式设计是设计师理性思维与感性表达的产物。它决定了网页的艺术风格和个性特征,并以视觉配置为手段影响着网页页面之间导航的方向性,以吸引浏览者注意力,增强网页内容的表达效果。网页版式设计在整个网页的设计中占有很重要的作用。 3.网页版式设计与传统印刷版式设计的差异网页的版式设计同报纸杂志等平面媒体的版式设计有很多共同之处,但网页的排版与书籍杂志的排版又有很大差异。
印刷品都有固定的规格尺寸,网页则不然,它的尺寸是由读者来控制的。这使网页设计者不能精确控制页面上每个元素的尺寸和位置。而且,网页的组织 结构不像印刷品那样为线性组合,这给网页的版式设计带来了一定的难度。具体表现如下: (1印刷品设计者可以指定使用的纸张和油墨,而网页设计者却不能要求浏览者使用什么样的电脑或浏览器。 (2网络正处于不断发展之中,不象印刷那样基本具备了成熟的印刷标准。 (3网页设计过程中有关Web的每一件事都可能随时发生变化。 (4网页版式设计的不可控制性,即网页设计者无法控制页面在用户端的最终显示效果。 4.网页版式设计的具体要求 网页的设计首先涉及的是页面的版面编排问题。网页作为一种特殊的版面,既有文字,又有图片,还包括一些流动的窗口和流动的附加广告等,内容繁多、复杂。设计时必须根据内容的需要,将这些图片和文字按照一定的次序进行合理的编排和布局,使它们组成一个有机的整体,展现给广大的观众。使其成为与浏览者的沟通手段,让设计所蕴含的主题进入浏览者的心灵,而不仅仅是起装饰作用。 4.1网页版式设计的布局合理化布局不但要单纯、简练、清晰和精确,而且在强调艺术性的同时,更应该注重通过独特的风格和强烈的视觉冲击力,来鲜明地突出设计主题。 (1要通过网页页面结构的分割和造型空间的确立,合理安排组成网页各元素的合理位置。使页面内容和形式有机统一,要具有整体美感。 (2要考虑页面的美观和可读性,还要考虑网络浏览的特性。
要怎么做才能让我们的网站设计从缤纷多彩的专业网站设计队伍中脱颖而出,赢得业内人士与客户的共同认可呢?其实做一个网站,主要记住简洁且不失美观,就是所谓的简单实用。那么其中网站就既要专业,又要有魅力! 一,专业网站设计重在顺利浏览 网站设计与别的工作不同,不存在酒香不怕巷子深的说法,看不到的美,再美也只是零,这一点很残酷,因此,网站设计的加载速度控制异常重要。 二,专业网站设计重在超强兼容性 不要以为所有的客户都会选择和我们一样的浏览器,互联网科技这么发达,网站设计师看到的效果不一定就是客户看到的效果,专业网站设计师应该养成多浏览器检测的习惯。 三,专业网站设计重在给人留下深刻的第一眼印象 如果我们的网站设计作品在第一眼时并未能抓住浏览者的心,那么我们极有可能会失去浏览者的二次回访,甚至是继续浏览机会,所以说第一眼设计是网站设计成功的第一步。 四,专业网站设计重在色彩搭配 与主题内容相关的合理色彩搭配不仅能让人赏心悦目,更能突出网站设计师的实力与网站设计的魅力。 五,专业网站设计重在清晰实用的导航 一个好的导航设计可以帮助客户更快更好的浏览网站,也可以帮助企业更快更好的抓住客户的心,促进合作。 六,专业网站设计重在拥有可读性 一个真正好的网站应该是对人们有实质性帮助作用的网站,因此,网站设计的可读性于专业网站设计而言相当重要。 七,专业网站设计重在有新意,有亮点 想要让别人记住我们的网站就必须要在网站设计的过程中加入与众不同的设计元素,有新点,有亮点的网站才是与众不同的网站。 八,专业网站设计应该充分合理的运用多媒体元素 专业网站设计除了要充分照顾到客户的视觉感受之外还应该充分照顾到客户听觉、感觉,给人耳目一新的感觉。
网页设计分析与趋势 导语:技术的革新带动了设计行业的的迅猛发展,这使得设计师和开发者有了更广阔的的探索天地。而网页设计也越发不再那么循规蹈矩,许多团队和公司都做了很多思考和创意。所以在我们适应着现代设计潮流的同时,不妨也来看看现阶段网页设计大致的趋势和风格吧。今天这篇文章就带你领略时下热门的网页设计趋势。 1.响应式网页设计(Responsive Web Design) 现在越来越多用户都拥有多种终端:台式机,笔记本,平板电脑,手机,能够适应不同尺寸显示屏的网页是现在的潮流,甚至是未来很长一段时间的设计趋势。那么响应式网页设计就是来解决这个问题的。这种特别的开发方式能保证网页适应不同的分辨率,让网页要素重组,使其无论在垂直的平板电脑还是智能手机上,都能达到最好的视觉效果。 除了多终端的多样化,我们还可以看到我们的电脑屏幕,手机屏幕都在不断变大,而在对未来生活的预测、概念设计里,"屏幕" 这个产物更是被运用到多种新平台上。例如微软发布的"未来生活概念视频"里,厨房、室内墙壁、办公室玻璃墙面都成为了交互平台。所以我们可以发现,响应式网页设计所具备的良好的适应性和可塑性,在未来的网页设计里将占有举足轻重的位置。 2.全屏网页设计(Full Screen Design) 所谓设计不分家,近年来平面设计里"纯净""留白"等概念也被互联网设计吸取,为了更简单明了的突出主体,提供更舒适的感官感受,很多网站开始采用全屏网页设计,
利用精心挑选设计的漂亮背景,加上合理的页面布局,视觉冲击力大可很好的吸引观者注意。通常页面内的文字内容不会特别多(所出现的少量文字加上精美的排版将会变得更加吸引人),主要以图片展示为主。这个样子的网站多用于摄影团队或个人作品集展示会比较常见。虽然简单养眼,但是承载信息有限,公司部门的主页很少见这样的设计。 3.视差滚动设计(Parallax Design) 视差设计可以说是近年来网页设计中的一大突破,也备受推崇。视差滚动是让多层背景以不同速度滚动,以形成一种3D立体的运动效果,给观者带来一种独特的视觉感受。 除此以外,鼠标滚轮的流畅体验,让用户在观看此类网站时有一种控制感,简单来说这是有响应的交互体验。就好像童年看到走马灯,转动它你就能看到人物动起来,还能欣赏故事。视差滚动设计的趣味也在于此。所以无论是网站还是电商商品宣传页都经常采用视差设计,吸引眼球也很受用户喜爱。 4.扁平化设计(Flat Design) 扁平化设计可以说是去繁从简的设计美学。去掉所有装饰性的设计,可以说是对之前所推崇的拟物化设计的颠覆。我们不能妄加评论说这是好还是不好,只能说它提供了一种新的设计思维。扁平化设计是否会成为将来的趋势我们也无法回答,尽管褒贬不一,备受争议,但是就现在来说它是当下的一种潮流。 5.滚动侦测网页设计(Scrollspy)
浅析政府门户网站网页设计的要点(doc 8页)
政府门户网站网页设计的要点解析 目前,一些政府门户网站在网页设计方面还存在着诸多问题,如整体创意不足,页面布局不活,色彩搭配不当,字体运用不佳,导航设计不全,名称格式不一,域名没有统一,等等。笔者以为,政府门户网站的网页,特别是主页,起着呈现传达信息、与用户交互和提供帮助导航的重要功能,其设计应遵循以下原则:一是内容决定形式的原则,即网页设计必须服务于网站内容的呈现,要考虑浏览者获取信息的速度和舒适度。二是整体协调一致的原则。即网页设计的各个环节,包括色彩、布局、文字、图片等,要紧紧围绕既定的创意和风格展开。三是服从技术需要的原则。网页设计受技术制约的程度非常明显。如网页的宽度受限于显示器分辨率的大小;网页色彩的选取范围应在网络安全色中;网页中图片和动画的设计必须严格控制其大小和数量等等。 在明确以上设计原则的基础上,政府门户网站网页设计还应掌握以下要点。 一、整体创意与风格 网页的创意与风格是围绕主题和内容,对网页色彩、布局、动画、图片、文字等页面元素统一进行个性化设计而形成的整体视觉效果和艺术特点。当前,一些政府门户网站个性不足,趋向于模式化和同质化,中央人民政府门户网站几乎成了一些地方政府门户网站的“模板”,“千网一面”、“似曾相识”的现象严重。还有的网站网页风格不明显,主要表现在:同一页面内各种元素拼凑堆砌、零散混乱,缺少相互呼应和一致性;在页面与页面之间,特别是一级和二级页面之间,色彩、版式、文字等网页风格大相径庭,页面间联系不够紧密,没有形成统一的整站形象等。网页的创意与风格是网页设计的灵魂和统领,创意匮乏、风格平庸的网站很难吸引人的眼球。因此,加强网页的创意设计和风格塑造是提高网页设计水平的首要解决问题。 应该说,政府门户网站不应仅仅是一种政府发布信息资源和提供信息服务的工具,也应是一级政府在网络上精心打造的视觉形象,应着力反映政府的执政理念、发展策略和远景规划等深层次内容。尽管创意具有很强的主观色彩,似乎来自于灵感与顿悟,但绝非空穴来风完全不可把握。创意设计应紧紧抓住本地区的历史沿革、地域文化、民族特色等个性化特点,选取标志性的图片、有象征意义的色彩、隽永深刻的文字和恰当的布局,按照视觉规律进行艺术加工,设计出完整一致的视觉形象,并长期沿用下去,不断强化浏览者的记忆,久而久之就会深入人心,印象深刻,成为本地区独特的“网络形象代表”,这就是一个政府门户网站成功创意和风格的最终表现。 二、页面色彩与色调 对以呈现信息为主的门户网站而言,和谐的色彩色调能提高信息获取速度,比字形和字体的变化更能提高理解的准确度。当前,一些政府门户网站网