青岛网站建设公司,青岛网站制作公司-奈薇建站网
建站咨询热线:0532-8878113113165158935 
知识普及 » 如何做网站专题设计

如何做网站专题设计

奈薇网页设计 2020-07-06 10:54发表
阅读次数 1097
  好的专题设计,有创意,整体效果和谐,用户印象深刻,内容传达有效,视觉元素有延续和继承。整个页面衔接不生硬。这都需要网站设计’的详细内容'>青岛网站设计师动脑去巧妙构思和发挥,有时工期紧迫,不能做到事无巨细,我也无法全部按照自己所写这样去设计专题。

  页面特性:产品页面简洁易用,专题页面绚丽视效印象深刻。

  在青岛网站制作中,产品页面(如facebook微博twitter微吧等)的设计。注重功能,交互,设计要考虑用户长时间的浏览体验。视觉上侧重间距,布局,按钮和logo,及icon样式。注重规范和视觉识别性。样式通常简洁易用,绚丽元素少,视觉上并不强调冲击力。

  专题页面时效性有限(大多专题是有推广及活动时间限制的,过了这个时间,就很少会有人再访问该页面。),多为活动推广和吸引用户等内容,能在限定的时间的吸引最多用户才能形成有力的推广,需要强有力的视觉效果,和有趣的浏览体验,来达到吸引用户的特点。在规范和布局甚至交互上可以适当放宽要求。

  用抢眼的视觉吸引户并留下深刻印象是专题设计的首要!

  传统产品页面,简洁注重功能和图标等视觉设计。

  专题页面突出视觉效果,华丽丰富

  微博专题多为各种微博活动和推广内容设计。内容较多,在设计好头图这种主视觉的同时,大量内容和栏目的排版布局也要注意。针对专题视觉设计的特点着手,才能实际出优秀的页面。

  内容清晰,布局合理虽然是突出视觉样式的专题设计,但让用户能够关注专题内容还是基本。不能因注重头图的设计而有所怠慢,不一定要遵守栅格化的理论,但通常为了后续的制作方便我通常以5px的倍数进行间隔区分,个别情况可以例外,只要间距在视觉上保持规整即可。除了一些”PK性质”的专题模块,要注意模块栏目分布的权重,内容的主次要清晰,排布在逻辑上有关联性。

  特色模块,视觉突出一些重点突出的模块要和其他栏目模块做区别设计,做到突出而不突兀。标题栏和模块的细节也应该注重视觉效果,较产品页面而言可以做一些修饰,但不可喧宾夺主。

  为获奖模块设立单独的样式。

  标题栏的也可以根据主题设计细节

  设计专题确立UE,沟通需求。

  需求方的UE稿(产品文档)是专题设计的前提,需要设计师和需求方一起进行沟通。设计师可以在早期就对专题需求提出自己的创意和方案,再由需求方形成UE稿。设计师再根据设计稿进行设计。由于专题设计往往没有专门的交互设计支持,很多时候,UE稿只明确了该专题所要展现的内容,设计师需要自己对UE进行一些交互上的调整和优化。(要注意对UE的优化设计往往是递进式的,贯穿设计专题的整个过程,未必一蹴而就的去翻新整个专题UE)。

  专题结构大多数的专题结构可分为头图部分和内容部分,传统的专题一般只有一个主页面,复杂的则有若干的二级页面组成,视专题的规模而定。一些特别的专题则有着特殊的表现方式,包括类似用flash制作minisite,以及一些异形的特殊专题。采用何种结构要看谁能更好的服务于需求。

  特殊结构形式的专题,头图即为封面,专题的体验类似翻书

  专题尺寸微博专题通常都有较多内容,会使得页面的高度过高,(很多专题的高度都达到了3000px)。设计时需要适当的缩短栏目的间距,尽可能的减少页面高度。专题的页面的宽度和微博主站相同为950PX,采用这个宽度是为了能兼容最广泛的显示器分辨率(1024px*768px),但由于专题的设计更加注重视觉效果,而且目前的很多年轻用户(年轻用户往往是专题的核心用户)的显示器分辨率早已超过1024px很多,所以我往往会将专题的主视觉和专题内容保证在950px之下,而头图的实际设计效果会在1600px宽度时做最好的展示。

  600px是我们定义的微博专题的首屏高度,也就是大多数用户第一屏能够看到的区域。在这个区域内,我通常将头图的比例做到280px-400px左右,这样做的目的是为了在突出专题主视觉的同时也要让用户在第一屏就可以浏览到部分专题内容。(而通常产品页面的头部视觉在高度上要小很多,产品页面本身特性所决定的。)

  设计头图结构确立接下来后就开始头图的设计,优秀的头图是专题设计的灵魂。设计头图首先要考虑的是头图的设计风格,根据不同的题材,选择不同风格的视觉设计。一般我会事先在纸上或是脑中勾勒一个大概,有些专题没有具象的视觉元素那么就从专题的文字入手,如果实在不带感,可以将一些与专题相关的元素先拼凑在画布上,然后尝试各种组合,也许一会就能擦出火花。

  头图风格关于微博专题的头图设计风格大致分为:写实类,卡通插画,大标题突出等。写实类头图多需要人物出场涉及版权,所以这种实类的风格的偏少,大部分还是后两种。如果需求方对设计风格认可,我喜欢在头图的设计中放入一些自己绘制的视觉元素,尽量减少素材使用。

  写实风格头图,多由人物构成。

  卡通绘制类头图。

  大标题为主的头图。

  头图构图在某种程度上,专题头图的设计有点类似一个更大的banner,但也有着很多的不同。它需要考虑如何巧妙的与下面的内容衔接,而且尺寸更大,细节更多,构图可以变化,如果只是千篇一律的采用规则的构图,会让专题显得单调,呆板,视觉效果不好。

  圆弧形的割头图和内容区域的构图

  头图标题好的专题头图,除了有精美的视觉元素外,头图的大标题要重点强调,它通常需要设计师花费专门的精力来制作字体的变形和特效。好的字体效果其实可以成为专题的主视觉,成为最亮眼的一部分,同时也是最直接体现专题主旨的方式。

  手绘设计的头图大标题

  一般的头图设计只是专题视觉元素的体现,而有的头图本身就承载专题内容,这要视专题的内容和需求而定。即便如此还是要注意在样式上美观。

  头图本身即承载内容功能

  头图部分的设计是整个专题的重点,也是专题最需要突出的亮点,头图可以确立整个专题的基调。优秀的头图应该紧贴专题内容,美观,吸引用户停留。

  专题内容区的设计形式多样,巧妙衔接内容区与头图的衔接要巧妙,忌生硬。形式可以有很多变化,与专题整体的视觉要素结合,或可以继承头图中的视觉元素,设计出不同的样式,让内容区的展现更生动。让专题页面的视觉效果更佳的统一,整体~!

  用桌布菜单来打造餐饮专题的结合部分。

  桌布托起头图,本身也成为内容的背景。

  专题二级页和系列专题通常二级页面的头图都是复用主页,但也要适当的为每个页面增加视觉元素予以一定的区别。要注意的是增加的样式也不易过繁,因为头图的存在会显得凌乱。

  为不同的二级页面设计区别的视觉元素。

  如果需要打造系列专题,就要注意规划设计复用元素,比如相同的logo标题,和为强调系列感的统一视觉风格。以此强化用户的对系列专题的印象和认知。

  系列专题的元素logo复用以及风格统一。

  专题设计细节注意的若干点

  •良好的沟通:设计师可以提出更好的风格意见,视觉创意,然而满足需求方的推广需求才是前提,所以通过良好的沟通加深对专题需求的理解,可以更准确的把握专题需求,避免返工等问题出现。•字体的问题。受浏览器的限制的,目前微博专题的主要字号还是14和12号的宋体(设备字体)做正文基本可以保证清晰锐利,但如果用来做标题栏时候就不那么美观了。这时应该和需求方、前段的同事沟通,在不频繁更改文案的情况下尽量使用图片来制作标题栏的文字效果,达到应有的视觉效果。•前端的规范与限制,如果需要复杂的圆角和半透明页面效果,最为稳妥的方法是为设计两套适应高低级浏览器的视觉解决方案,如果条件不允许,就要看前端同事对浏览器支持的策略,总之前端实现的问题,作为设计师应该主动沟通并推动其解决。(这还包括专题上线后的跟踪反馈。)•头图要有延展性,要注意宽屏分辨率下的显示特点。•专题交互细节,为按钮翻页等交互元素设计各种状态,会有更好的体验效果。•专题自身的视觉设计的延展和统一,包括专题附属的弹层,对话框等的细节设计。•交付物的规范。专题图层众多,题设计完毕后交付前端的同事时,应该对图层进行分组。文件体积大就要删除或隐藏无用的图层。•专题设计稿提交时,尽量可能采用不同的图片,数目参差的正文,来替代设计稿中的模拟内容,这样有时够发现一些忽略的问题(如文字过多溢出,以此来进一步调整间距等),重要是可让他看上去更像是一个即将上线的真实页面,更好的展现你设计的最终面貌。有时会觉得多此一举且低效,但这能让我们显得更专业。

如何做网站专题设计相关标签:设计网页网站推广网页设计企业网站建设
相关热点推荐
细节决定成败与web用
告诉你怎么做个旅行社网
用户期望什么时候在哪里
视觉层次感提升网页设计
如何创建内容丰富的企业
2019年的网页设计流
网站建设经验谈
优化过程中如何快速收录
网站发布软文更容易被收
更新网站,提高网站权重
网上购物网站的用户体验
网站建设的误区
巧妙性设计之UI按钮设
如何做到网站的最佳优化
行业网站的设计心得
企业网站建设优化如何凸
企业网站应用
2009年4月2日,G
优质的内容才是提高网站
响应式网页你了解吗?
企业网站建设各阶段的注
H5和HTML5是一回
网站用户体验是网站发展
发布的高权重文章被转载
网站建设的基本原则
如何维护SEO效果
进一步掌握网页设计艺术
网页设计配色应用实例剖
网站建设中的12大误区
交互设计的8项黄金法则
谈谈什么是优秀的网站设
网页设计中的功能与美化
网站策划的具体内容
HTML中不同的权重标
青岛网站制作支持旧IE
一个好的网站应该同时具
系统化学习SEO技术的
百度每个月的收录时间分
关于网站排名的基本原则
微型博客,专业领域个人
奈薇建站网青岛网站建设公司/青岛网站制作公司,专业提供"气质"型网站建设及精美网站制作服务,同时欢迎各地网站建设公司、网站制作公司代理我们的奈薇建站系统共同发展

热点地区:青岛网站建设价格 青岛即墨网站制作公司 开发区信息港 山东在线门户
  • 备案号
  • 鲁ICP备13010283号
建站咨询热线0532-88781131 15166683288 13963906391
版权所有© BangJianZhan.Com & Nev.Cn 青岛网站建设/网站制作公司
青岛雨后网络科技有限公司 - 青岛市市北区福州北路90号,景泰尚都6层
已经为您服务了
162个月 22