⑴ 网页常见布局
在版式设计当中，主要有以下几种排版形式： 重心型、中轴型、分割型（分上下分割和左右分割）、倾斜型、骨骼型、满版型、曲线型、对称型、三角形、四角型和自由型 。这几种形式会比较常出现在网页设计当中，所以我们一一来分析以下几种排版方式。
1、重心型
重心型版式的网页容易让浏览者产生视觉焦点，界面效果强烈且突出。重心型又可以分以下三种形式。
A、直接以独立而轮廓分明的形象占据版面中心。
ivanovoiskozh俄罗斯企业网站
B、向心：视觉元素向版面中心聚拢的运动。
bdsalads食物食品网站
C、离心：犹如将石子投入水中，产生一圈圈向外扩散的弧线运动。
Twomari炸鸡食品美食网站
2、中轴型
中轴型的网页设计，是将图形做水平或垂直方向的排列，文案以上下或左右配置。水平排列的版面会给人稳定、安静、和平与含蓄之感。垂直排列的版面给人强烈的动感。垂直排列的这种排版方式比较常出现。
INSPOT激发你的品牌 韩国设计公司网站
3、分割型
分割型主要可以分成 上下分割和左右分割 。相比较，左右分割型的网站会比较常见。
A、上下分割
上下分割，顾名思义，就是把整个版面分为上下两个部分。可以在上半部或下半部配置图片，另一部分则配置文案。配置有图片的部分感性而有活力，而文案部分则理性而静止。上下部分配置的图片可以是一幅或多幅。
Sojournal时尚家居企业网站
B、左右分割
左右分割，就把整个版面分割为左右两个部分，分别在左或右配置文案。当左右两部分形成强弱对比时，则造成视觉心理的不平衡。这仅仅是视觉习惯上的问题，也自然不如上下分割的视觉流程自然。不过，倘若将分割线虚化处理，或用文字进行左右重复或穿插，左右图文则变得自然和谐。
AVEDA美容美发时尚网站
4、倾斜型
倾斜型的网站比较少见，这样的网站偏个性化一些，多在一些设计公司或是运动品牌的网站中出现。版面的主体形象做倾斜设计，造成版面强烈的动感和不稳定因素，这种设计比较引人注目。
2016CHUNGNAM韩国体育网站
5、骨骼型
骨骼型比较在传统网站当中比较常见，它是一种规范的界面分割方法。常见的骨骼有竖向通栏、双栏、三栏、四栏和横向通栏、双栏、三栏和四栏等。一般以竖向分栏为多。说到这个，就可以想到栅格系统，实际上这两者是差不多意思的。
骨骼型的网站会给人以严谨、和谐、理性的美。每一个区块经过相互混合后的版式，既理性、条理，又活泼而具弹性。
ZUI框架
6、满版型
满版型的网站近几年也越来越多见，通常是版面以图象充满整版，主要以图象为诉求，视觉传达直观而强烈。文字的配置压置在上下、左右或中部的图象上。满版型给人以大方、舒展的感觉。
水族馆度假村俱乐部
7、曲线型
图片或文字在版面结构上作曲线的编排构成，产生节奏和韵律。
Transfer Window
8、对称型
对称的版式给人稳定、庄重理性的感觉。对称有绝对对称和相对对称。一般多采用相对对称。以避免过于严谨。对称一般以左右对称居多。
DeLaneau （万花筒效果，心脏受不住的勿点），这个网站是绝对对称，比较少见，这样的网站看久了会比较单调。
9、三角形
在圆形、四方形、三角形等基本形态中，正三角形(金字塔形)是最具安全稳定因素的形态，而圆形和倒三角形则给人以动感和不稳定感。
Asahi Refining黄金产品网站
10、四角型
四角型指在版面四角以及连接四角的对角线结构上编排的图形。这种结构的版面，给人以严谨，规范的感觉。
NOROO PAINT企业网站
11、自由型
自由行结构是无规律的、随意的编排构成，有活泼、轻快之感。
Happymaker in 高野山
以上简单给大家分析讲解了常见的几种版式形式，每种版式设计并非以一种表现形态出现，比如四角型的网站可能会结合对称性的出现或是中轴型，所以大家在分析一个网站的时候不要以单一的一种视角去分析。因为一个网站的设计可能同时存在好几种版式形式。
不同的排版可以给人不同的视觉感受，好的排版会给整个网站“锦上添花”。版式也没有绝对的好坏，只有适合和不适合。希望今天给大家分享的内容可以帮助到大家。
⑵ 网站版式除了响应式还有什么版式
一般就是传统模式和响应式吧。
区别比较明显，就是当你缩小屏幕时，响应式网站的内容会自动调节，更方便查看。还有一些大型商业网站，他们能达到PC、移动端的统一，但不是响应式网站，而是因为他们针对不同端体分别建设了网站，这时候可以发现在电脑上查看该企业信息的网址与手机端查看的网址是不一样的。不同的后台管理起来比较麻烦，比较适合大型企业。
使用建站宝盒j建造的H5响应式网站，网页相当简约、大方却，功能强大。
⑶ 网页效果图的网页布局分类
网页布局大致可分为：骨骼型、满版型、分割型、对称型、倾斜型、焦点型、三角型、自由型。下面分别论述。详例请参照图片册。
（1）骨骼型描述：网页中骨骼型是一种规范、严谨的分割方式，也是最为普通和最为常见的一种形式，类似报刊的版式。常见的网页骨骼有竖向通栏、双栏、三栏、四栏和横向通栏、双栏、三栏和四栏等。通常以竖向分栏居多。这种版式给人以和谐、理性的美。
（2）满版描述：满版型页面以图像充满整版。主要以图像为诉求点，可将部分文字置于图像之上。视觉传达效果直观而突出。给人以生动大方人感觉。满版型版式被各种网站所采用，以学校、娱乐、体育、艺术、儿童以及个性化网页，其中以韩国网站居多。
（3）分割型描述：分割型版式指把整个页面分成上下或左右两部分，分别安排图片或文字内容。两部分形成对比，使图片部分感性而具表现力，文字部分则理性而具说服力。可以调整图片和文字所占的面积比例，来调节对比强弱。如果图片比例过大，文字字体过于纤细，段落疏松，会造成视觉心理的不平衡，显得生硬。
（4）中轴或对称型描述：中轴型版式是将图片和文字沿浏览器窗口的中间轴心位置作水平或垂直方向排列的一种设计方式。沿中轴水平方向排列的页面可以给人稳定、平静、含蓄的感觉，沿中轴垂直方向排列的页面可以给人以舒畅的感觉。采用这种版式设计的网页比较适合做网站的首页。
（5）焦点型描述：焦点型的网页版式通过对浏览者视线人诱导，可以使页面产生强烈的视觉效果，如集聚感或膨胀感等。中心焦点型是将图片或文字置于页面的视觉中心。向心焦点型是视觉元素引导浏览者人视线向页面中心聚拢。离心焦点型是视觉元素引导浏览者的视线向外辐射。焦点型版式为各类网站使用，以体育、娱乐、动画网站为多。
（6）倾斜或曲线型描述：倾斜型页面主题形象或多幅图片、文字作倾斜编排，形成不稳定感或强烈的动感，引人注目。此类网站版式为各类网站所采用。曲线型网站图片、文字在页面上作曲线的分割或编排构成，产生韵律与节奏。此类网站版式为各类网站所采用。
（7）三角型描述：三角型版式是指见面各视觉元素呈三角形或多角形排列。正三角形最具稳定性，倒三角形则可产生动感。侧三角形构成一种均衡版式，既安定又有动感。三角形版式为各类网站所采用。
（8）自由型描述：自由型版式人页面具有活泼、轻快人气氛。自由型版式也可应用于多种网站。如网络、娱乐、体育、个人、商务等。
以上介绍的版式基本类型并不是固定不变的，在实际设计中，设计师可以根据网页所要传达的主题内容来灵活地变化版式。在设计前要认真分析网站的定位，在设计中要灵活把握版式结构，才能更好地达到设计目的。
⑷ 网页设计的几种风格
扁平化风格网站 强调字体 整体页面响应式 个性化交互式手绘插画 色彩对比 低面建模多边形风格 动态网页 banner设计原则 1.突出产品及特征，采用有吸引力的宣传用语。 2.图片和文案要突出重点，相互补充。 3.板式合理，主次分明。 4.色彩搭配协调，营造爽眼的视觉效果。 网站界面设计原则 1.以用户为中心 用户为第一位，重点满足用户需求。既要考虑用户共性，也要考虑用户差异性。不同类型的网站，访问的用户层次也不一样，年龄，行业，关注点不同。 2.主题突出，技术与艺术结合 “美”与“功能”都是为了突出主题而存在。主题及主要功能。 3.整体性原则内容与形式设计上的整体性。为了用户更准确抓住主题。 4.内容与形式统一 内容是“设计的灵魂”，内容决定形式，形式反作用于内容。这里的形式是指结构，风格，设计语言。设计的内容则是题材，主题，形象等要素的组合。 网页版式设计 版式设计的目的就是合理布局和设计网页版面，高效的传递视觉信息，充分吸引浏览者。 网页版设计选择:一版面设计需要符合人的视觉习惯。 二避免浏览者产生疲劳感。 三强化页面的主从关系。 四安排合理的视觉流程。 1.版面设计需要符合人的视觉习惯 视线的移动规律: 规律一人的人眼的视线沿着水平方向运动比沿着垂直方向运动快，而且不易疲劳 规律二，而是现在变化习惯于从左到右，从上到下和顺时间方向运动， 规律三当视线沿着基部水平也不垂直的斜线方向移动时在水平方向上，下约45度的范围内视线从左到右移动。在垂直方向左右约45度范围内是显示从上到下移动。1.主从对象对比突出主体对象2.弱化主体对象周围内容 合理安排视觉流程 视觉流程：视线随页面各构成元素在空间上沿一定轨迹运动的过程，浏览者的视觉流程是有一定规律的。 视觉流程分类: 1.单向视觉流程 2.曲线视觉流程 3.导向视觉流程 4.重心视觉流程 5.反复视觉流程 6.散点视觉流程1.单向视觉流程视线在页面中随构成要素形成的单一方向顺序运动。 规律:由大到小，由主到次由左到右，由上到下 分类:横向视觉流程，纵向视觉流程形象视觉流程。1.单向视觉流程 视线在页面中随构成要素形成的单一方向顺序运动。 规律:由大到小，由主到次由左到右，由上到下 分类:横向视觉流程，纵向视觉流程形象视觉流程。 2.曲线视觉流程 曲线视觉流程是个构成要素，沿着曲线而运动变化的视线流动过程，它比单向视觉流程更具节奏，韵律和曲线美。 3.导向视觉流程 导向试卷流程是通过诱导元素，主动引导浏览者的视线，按照一定的方向顺序运动，将页面各构成元素依顺序串联起来，形成一个有机的整体依据诱导元素的不同可分为，线形导向，形象导向，指示导向。⑸ 网站风格有哪些
01极简风
"越少，越经典“这是不少设计大师遵循的设计风格。
“好的设计是尽可能少的设计”这条原则也同样适用于网页设计中。
极简设计的好处就在于它能最大化节约用户的时间成本。
02无边框风
这里的边框是指任何类型的装饰性容器。
通过去掉装饰性的容器，加强基本内容的设计感。
提升图片质量和排版布局，从而改变整体因无装饰性容器的视觉表现。
03插画风
除了使用大量图片作为背景或主体元素外，
图形插画的运用也是一种很好的方式。
网页Banner可以运用插画来表达网站主题，
同时加上插画图标的点缀，
使网页看起来清新有趣，
加强网站本身的独特性。
04黑板风
虽然黑板风格不是一个常见的风格，
但是其经典的使用方式和延伸效果
同样可以作为网页设计风格的一项选择。
最常见的运用方式就是将黑板作为背景元素，
同时黑板本身的装饰效果使网站呈现非常时尚。
许多经典的美食网站设计都采用了这种风格，
除了使用黑板以外，
将现实场景中的桌面运用到背景中也格外出彩。
05扁平风
扁平化设计可以说是时下最常用的网页设计风格了，
它弱化了材质、渐变、阴影，
去除了冗余信息的图形元素、排版。
这种风格设计可以使画面显得更加平滑，
提升了网站内容信息的视觉层级，
更加方便用户快速寻找自己需要的内容。
同时扁平化的界面能更好实现不同尺寸的转化。
这也是现在互联网公司较常采用的一种风格。
063D风格
这里所说的3D风格不是纯粹的使人感到身在其中的3D坏境，
而是那些运用少量3D效果使整个网页显得更加灵动，
通过扁平化的基础上，添加一些生动的非扁平元素，
给网站带来了原本缺乏的纵深感，同时提升主体视觉吸引力。
07纵向分割
习惯了一栏式的设计，
将屏幕一分为二甚至是多栏式的网页设计方式
受到了众多用户的喜爱，
在网页设计中使用新鲜的分屏式设计
可以方便呈现不同的信息，创造对比。
同时划分有效区域，方便用户进行快速选择和视觉聚焦。
08超级头版
以往的网页设计中，轮播幻灯片的效果使用充斥着各种网站，
虽然这种设计方式在许多首页上仍然适用名，
但却正在失去吸引力，取而代之的是采用的核心区域元素，
也就是主题的主题图或者说是超级头版，
在首页上使用尺寸超大、迷人的精美Banner，
而这个超级头版汇聚了对产品的精华总结，
从而将网站最重要的内容展示给用户。
09照片与白字搭配
严格意义上，这不算一种设计风格，
但是这种方法可以帮助我们快速制作出色的Banner或者网站，
通过对照片进行一些色彩叠加，同时搭配白色文案，
从而形成对比，使文字更加清晰易于传达。
你可以把它像公式一样记在脑子里，
碰到合适的机会就可以使用。
⑹ 网页布局结构有哪些
网页布局结构：
1、骨骼型结构。
即类似于人体的骨骼结构。分为上中下，内容部分分为两、三栏的设计。
2、对称型结构。
对称型结构就是网站有一个对称轴，称左右或者上下对称。这种网页在阅读上很明明确给出用户重要和次要区域的划分，根据于都习惯往往在比较大的位置上安排主要内容。
3、满版型的结构。
其实这种网页结构随着现在显示器尺寸的增大和分辨率的提高逐渐再做一个过度，即以前的整个图片满版到后面的背景满版，到现在的局部满版。这种版式给人的感受是内容紧凑，气氛表达充分，适合温馨和暖性思维的表达。
4、焦点型。
这类网页多见于围绕一个中心点，真个页面围绕中心，多见于销售类网站或者品牌产品网站。其特点是中心明确，表达信息集中，传达信息清楚。
5、分割型。
把整个页面分成上下或左右两部分，分别安排图片和文案。两个部分形成对比：有图片的部分感性而具活力，文案部分则理性而平静。可以调整图片和文案所占的面积，来调节对比的强弱。例如：如果图片所占比例过大，文案使用的字体过于纤细，字距、行距、段落的安排又很疏落，则造成视觉心理的不平衡，显得生硬。倘若通过文字或图片将分割线虚化处理，就会产生自然和谐的效果。
6、中轴型。
沿浏览器窗口的中轴将图片或文字作水平或垂直方向的排列。水平排列的页面给人稳定、平静、含蓄的感觉。垂直排列的页面给人以舒畅的感觉。
网页结构即网页内容的布局。创建网页结构实际上就是对网页内容的布局进行规划，网页结构的创建是页面优化的重要环节之一，会直接影响页面的用户体验及相关性，而且还在一定程度上影响网站的整体结构及页面被收录的数量。