导航:首页 > 万维百科 > 网页版式设计的历史背景

网页版式设计的历史背景

发布时间:2020-09-08 21:14:47

1、帮忙找一篇关于网页版式设计的外文文献

一、网页版式的基本类型
骨骼型、满版型、分割型、中轴型、曲线型、倾斜型、对称型、焦点型、三角型、自由型十种。

First, the basic types of web page layout
Bone type, full version type, split type, axis type, curved, inclined, symmetric, focus type, triangular, free type ten.

1.骨骼型
网页版式的骨骼型是一种规范的、理性的分割方法,类似于报刊的版式。常见的骨骼有竖向通栏、双栏、三栏、四栏和横向的通栏、双栏、三栏和四栏等。一般以竖向分栏为多。这种版式给人以和谐、理性的美。几种分栏方式结合使用,既理性、条理,又活泼而富有弹性。

1. Skeleton type
Page layout is a standard type of bone, rational segmentation method, similar to newspaper layout. Link skeleton common vertical bar, double bar, three bars, four bars, and horizontal links column, double column, three columns and four fences. Generally multi-vertical columns. This layout gives a harmonious and rational America. Combination of several sub-column mode, both rational and coherent, but also lively and elastic.

2.满版型
页面以图像充满整版。主要以图像为诉求点,也可将部分文字压置于图像之上。视觉传达效果直观而强烈。满版型给人以舒展、大方的感觉。随着宽带的普及,这种版式在网页设计中的运用越来越多。

2. Full version type
Page full of full page of image. Mainly image to appeal to point the text can also be part of the pressure placed on the image above. Visual Communication visual effects and strong. Version type gives a full stretch, the feeling generous. With the popularity of broadband, this web design layout used in more and more.

3.分割型
把整个页面分成上下或左右两部分,分别安排图片和文案。两个部分形成对比:有图片的部分感性而具活力,文案部分则理性而平静。可以调整图片和文案所占的面积,来调节对比的强弱。例如:如果图片所占比例过大,文案使用的字体过于纤细,字距、行距、段落的安排又很疏落,则造成视觉心理的不平衡,显得生硬。倘若通过文字或图片将分割线虚化处理,就会产生自然和谐的效果。

3. Segmentation-based
The entire page is divided into two parts up and down or left and right, respectively, arranged pictures and copy. In contrast to two parts: a picture of part of the emotional and vibrant, and the text part, rational and calm. Can adjust the picture and copy the area occupied, to adjust the contrast of strength. For example: If the image is too large proportion, and the text font used is too thin, kerning, line spacing, paragraphs and very sparse arrangement, then the resulting imbalance in visual psychology, be abrupt. If text or image to partition through the virtual line treatment, would be a natural and harmonious results.

4.中轴型
沿浏览器窗口的中轴将图片或文字作水平或垂直方向的排列。水平排列的页面给人稳定、平静、含蓄的感觉。垂直排列的页面给人以舒畅的感觉。

4. Axis type
Along the axis of the browser window to image or text for horizontal or vertical arrangement. Horizontal arrangement of the page gives stable, calm, subtle feeling. Vertical arrangement of the page gives a comfortable feeling.

5.曲线型
图片、文字在页面上作曲线的分割或编排构成,产生韵律与节奏。

4. Axis type
Along the axis of the browser window to image or text for horizontal or vertical arrangement. Horizontal arrangement of the page gives stable, calm, subtle feeling. Vertical arrangement of the page gives a comfortable feeling.

二、文字的格式化

1.字号、字体、行距
字号大小可以用不同的方式来计算,例如磅(point)或像素(pixel)。因为以计算机的像素技术为基础的单位需要在打印时转换为磅,所以,建议采用磅为单位。

最适合于网页正文显示的字体大小为12磅左右,现在很多的综合性站点,由于在一个页面中需要安排的内容较多,通常采用9磅的字号。较大的字体可用于标题或其他需要强调的地方,小一些的字体可以用于页脚和辅助信息。需要注意的是,小字号容易产生整体感和精致感,但可读性较差。

网页设计者可以用字体来更充分地体现设计中要表达的情感。字体选择是一种感性、直观的行为。但是,无论选择什么字体,都要依据网页的总体设想和浏览者的需要。

粗体字强壮有力,有男性特点,适合机械、建筑业等内容;细体字高雅细致,有女性特点,更适合服装、化妆品、食品等行业的内容。在同一页面中,字体种类少,版面雅致,有稳定感;字体种类多,则版面活跃,丰富多采。关键是如何根据页面内容来掌握这个比例关系。

从加强平台无关性的角度来考虑,正文内容最好采用缺省字体。因为浏览器是用本地机器上的字库显示页面内容的。作为网页设计者必须考虑到大多数浏览者的机器里只装有三种字体类型及一些相应的特定字体。而你指定的字体在浏览者的机器里并不一定能够找到,这给网页设计带来很大的局限。解决问题的办法是:在确有必要使用特殊字体的地方,可以将文字制成图像,然后插入页面中。

行距的变化也会对文本的可读性产生很大影响。一般情况下,接近字体尺寸的行距设置比较适合正文。行距的常规比例为10:12,即用字10点,则行距12点。这主要是出于以下考虑:适当的行距会形成一条明显的水平空白带,以引导浏览者的目光,而行距过宽会使一行文字失去较好的延续性。

除了对于可读性的影响,行距本身也是具有很强表现力的设计语言,为了加强版式的装饰效果,可以有意识地加宽或缩窄行距,体现独特的审美意趣。例如,加宽行距可以体现轻松、舒展的情绪,应用于娱乐性、抒情性的内容恰如其分。另外,通过精心安排,使宽、窄行距并存,可增强版面的空间层次与弹性,表现出独到的匠心。
行距可以用行高(line-height)属性来设置,建议以磅或默认行高的百分数为单位。例如:{line-height:20pt}、{line-height:150%}。

1. Font size, font, line spacing,
Font size can be calculated in different ways, such as pounds (point) or pixels (pixel). Because the pixels of computer technology-based units need to convert pounds in print, therefore, recommended pounds for the unit.

The most suitable body of the page shows the font size is 12 pounds, many of the comprehensive site, as a page in the content need to be more commonly used 9 pounds font size. Larger font can be used to emphasize a title or other places, smaller fonts can be used for footer and supporting information. Note that the small font size easily lead to an overall sense of feeling and refined, but less readable.

Web designers can use the font to more fully reflect the design to express emotions. Font choice is an emotional, intuitive behavior. However, no matter what font selection, the overall plan should be based on web and the needs of visitors.

Bold sturdy, with male characteristics, suitable for mechanical, construction, etc; fine characters, elegant and meticulous, a woman, it is more suitable for clothing, cosmetics and food instry content. In the same page, the font type of small, elegant layout, with a sense of stability; font variety, the layout active, varied and colorful. The key is how to grasp this page content proportional.

Strengthen the platform-independent nature from the point of view, the best use of the default font text content. Because the browser is the font on the local machine to display the page content. As a web designer must take into account the majority viewers of the machine with only three types of font types and some corresponding specific font. And you specify the font of the machine in the viewer will not necessarily find this a great web design limitations. Solution to the problem is: when it is necessary to use special fonts where the text can be made of the image, and then insert the page.

Spacing changes in the readability of the text will have a great impact. In general, close to the line spacing set the font size more suitable for the body. Conventional row spacing ratio of 10:12, 10 characters that are spaced 12.

In addition to the impact of readability, spacing itself is highly expressive language, in order to enhance the decorative effect of format, you can widen or narrow a conscious spacing reflects the unique aesthetic charm. For example, widening the spacing can be easily embodied, emotional stretch applied to entertainment, lyrical content appropriately. In addition, through careful arrangements for the wide and narrow spacing co-exist, can enhance the level and flexibility of spatial layout, showing originality of the decoration.
Line spacing can be high (line-height) attribute to set, the proposed default row height in points or percentage basis.

三、图片版式
除了文本之外,网页上最重要的设计元素莫过于图像了。一方面,图像的应用使网页更加美观、有趣;另一方面,图像本身也是传达信息的重要手段之一。与文字相比,它直观、生动,可以很容易地把那些文字无法表达的信息表达出来,易于浏览者理解和接受。

1.图像的格式
Web通常使用两种图像格式:GIF和JPEG。除此以外,还有两种适合网络传播但没有被广泛应用的图像格式:PNG和MNG。

2.图像的形式
同印刷排版一样,静态图像在网页排版中的运用不外乎四种形式:方形图、退底图、出血图以及这三种形式的结合使用。

(1)方形图 即图形以直线边框来规范和限制,是一种最常见、最简洁、最单纯的形态。方形图使图像内容更突出且将主体形象与环境共融,可以完整地传达主题思想,富有感染性。配置方形图的页面,给人以稳重、可信、严谨、理性、庄重和安静等感觉,但有时也显得平淡、呆板。

(2)退底图 将图像中的背景去掉,只留下主题形象。退底图形自由而突出,更具有个性,因而给人印象深刻。配置退底图的页面,轻松、活泼,动态十足,而且图文结合自然,给人以亲和感。但也容易造成凌乱和不整体的感觉。

(3)出血图 图像的一边或几个边充满页面,有向外扩张和舒展之势。一般用于传达抒情或运动信息的页面,因不受边框限制,感觉上与人更加接近,便于情感与动感的发挥。

3, picture format
In addition to the text, the Web's most important design element than images. On the one hand, the image of the application to make Web a more beautiful and interesting; the other hand, the image itself is an important means to convey information. Compared with the text, it intuitive, vivid, and can easily express those words can not express the information easy to understand and accept visitors.

1. Image Format
Web typically use two graphics formats: GIF, and JPEG. In addition, there are two for network communication, but not widely used image formats: PNG and MNG.

2. The image of the form
As with the print layout, static image in the page layout in the use of no more than four forms: a square map, base map back, bleeding map and a combination of these three forms.

(1) square map that is drawing a straight line border to regulate and limit, is the most common and most simple, most simple form. Square plan to make image content more prominent and will be the main image and Environmental Harmony, can fully convey the theme, full of infection. Square plan configuration page, gives a stable, reliable, precise, rational, and so solemn and quiet feel, but sometimes seem ll, ll.

(2) Withdrawal of the base map in the background of the image removed, leaving only the subject image. Back end of free graphics and prominent, more personalized, so impressive. Base map configuration pages back, relaxed, lively, dynamic full, and graphics combined with the natural, gives a sense of affinity. But also easy to create messy and not the overall feeling.

(3) bleeding image for full page on one or several sides, with expansion and stretch outward trend. Generally used to convey emotion or movement information page, because without border restrictions, feel and distance, to facilitate emotional and dynamic play.

以上是我的回答,真诚的希望我的解答能够帮到你!
以上是我的回答,真诚的希望我的解答能够帮到你!
以上是我的回答,真诚的希望我的解答能够帮到你!

2、版式设计发展过程

哈哈 你是不是要写论文啊
网上一般找不到的

有的需要花钱

要么就买本书

3、平面排版设计有怎样的历史?

书籍装帧是指从书籍文稿到成书出版的整个设计过程,版式设计是书籍装帧的重要一部分。版式设计是书籍视觉传达的重要手段,是一种书籍编排的重要学问;现实中,版式设计不仅是一种技能,更实现了技术与艺术的协调同意。版式设计说是现代设计者必备的基本素质之一。
最古老的版式设计首推500年前以德国人古腾堡为代表的古典版式设计,其特点是以订口为轴心左右两页相对称,内文版式有严格的限定。字距、行距有统一的尺寸标准,天头地脚内外白边均按照一定的比例关系组成的一个保护性的框子。文字油墨深浅和嵌入版心内图片的黑白关系都有严格的对应标准,古典版式设计在书籍设计史上统治欧洲数百年不变,直到今天仍然具有很大市场。
20世纪初叶,随着现代文明的产生,西欧又出现了网格设计,它是在书页上运用数学的比例关系,通过严格的计算, 把版心划分为无数统一尺寸的网格,以此来分配文字和图片的一种版面设计方法。它注重比例感、秩序感、连续感、清晰感、科学性和严肃性。40年代后半期出版了第一件用网格的印刷品,严密的文字和图片设计方案,贯穿全书统一的版面设计和对于主题朴实无华的表现,代表了新的潮流。借助网格使设计应用在功能上、逻辑上和美学上获得了发展。但是随着设计的进程,慢慢发现网格设计限制性太强,没有自由创作的空间,容易给版面带来呆板的感觉,所以不少有识之士开展研究,力求打破网格的约束使画面变得更具韵律感。
80年代后,计算机技术在设计行业中的运用使版式语言又得到了空前的发展,进入90年代后期,自由版式设计在世界范围内广泛流行并越来越受到重视。自由版式设计从字面上理解就是无任何限制的设计,它是通过版式编排的自身元素自由组合排列的设计方式。它打破古典设计与网格设计的束缚,打破版式设计所提倡的统一秩序,是当代出现的具有前卫意识的版式形式和风格。
随着社会的发展和科学技术的不断发展,人们对生活质量的要求越来越高,书籍阅读的更高体验也已经成为了当前社会发展的趋势和方向。书籍的版式设计历史也不会停留在已定的设计上停步不前,而是更加快速﹑精炼﹑简单﹑可行﹑有效的继续高速发展。越来越多越来越新颖而超脱原有概念的版式设计会不断的涌现,满足不同人群的阅读体验。

4、不同历史时期版式设计特点

试题答案:D 试题解析:试题分析:本题考查西周宗汉制;战国时思想领域的百家争鸣;唐代的国家富强;宋代的理学兴起。秦代实行郡县制、西汉武帝时“罢黜百家”、明末思想领域提倡“经世致用”、鸦片战争后林则徐为首的思想家推动新思潮萌发。 考点:中国古代的各朝制度的特点点评:此题实际上考查的是古代的政治制度发展演变的情况。服饰反映时代的背景,各朝代特点也能通过服饰上反映出来。古代各朝的政治制度特别是中枢权力机构演变的情况是考试的重点。

5、如何做好网页的版式设计

网站的栏目策划是在网站制作过程中容易忽视的一个细节,因为在网站制作的过程中都比较重视页面的设计和网站实现的功能,其实网站的栏目策划在网站制作过程中起着决定性的作用,是用户的一个导航索链,有的栏目设置精妙,就可以把用户带入到另一个页面,让用户在网站中停留,使用户更加了解企业。所以,网站栏目也是一个核心要点,下面沃然建站总结了一些关于网站栏目策划的小建议,
1、 网站栏目策划的重点是导航:
在网站策划中要注意导航条的位置要明显且统一,有一些网站是无法做到,这个会给用户带来易进不易出的一个环绕,从而导致用户直接关闭网站,跳出率就会增长。

2、 网站栏目结构要层级分明,条理清晰:
打开一个网站,有的是有很多内容的,有各式各样的产品,而栏目就是方便用户找到所需内容的一个重要导航,所以嘉陵道小程序制作公司建议要做到层次分明、条理清晰,网站栏目最好不要超过三层,不要让用户层层剥茧似的找到所需内容,同时对推广也是有影响的。

3、网站栏目命名要清晰、易懂:
中国文字博大精深,有些企业喜欢别出心裁的取一些栏目名,创意确实很好,但是想要知道名称意思并不是自己为主,这样容易产生反效果,如果你能创造通俗易懂,又有创意的那就更好了。

4、网站栏目在网站建设中布局要合理:
嘉陵道小程序制作公司提醒栏目不是随便放着就可以了,也需要配合网站建设中网页设计的整体搭配,做到二者兼得是最佳的状态。

6、网页中的版式设计有哪些重要作用?

1、方便网民阅览,尤其对一些企业的网站,更是方便客户对商品的了解。
2、展示网站的主要内容,就像商店一样,把重要的信息放在最显眼的位置。

7、版式设计的发展历史四个阶段是哪4个

在枯荣

8、急求版式设计的发展史。

平面广告的发展离不开设计艺术的发展,而设计水平的提高,总是伴随着社会的进步和人类理性的成长的。

工艺美术运动的领袖人物是英国艺术家、诗人威廉.莫里斯(William Morris ,1834-1896),他提倡合理地服从于材料性质和生产工艺、生产技术和设计艺术的区分,认为“美就是价值,就是功能”。莫里斯有句名言:“不要在你家里放一件虽然你认为有用,但你认为并不美的东西。”其含义自然是指功能与美的统一。

莫里斯设计的代表作品,这个运动产生伊始,出现了一个重要的促进因素,即1888年在伦敦成立的工艺美术展览协会(The Arts & Crafts Exhibition Society).这个协会成立以来,连续不断地举行了一系列设计展览,在英国提供了一个了解优良设计和高雅设计品的机会,从而促进了工艺美术运动的发展。

20世纪初,现代主义设计运动在世界范围内蓬勃兴起。这是一场真正的设计上的革命,通过这个运动,设计才第一次成为为大众服务的,为大工业化、批量化的生产服务的活动。现代主义设计兴起于欧洲大陆,20年代达到高潮,在整个欧洲发展得如火如荼。在德国,通过现代设计运动的先驱活尔特·格罗佩斯(Walter Gropius)、米斯·凡德洛(Mies Van der Rohe)等人的努力,通过他们所创立的世界上第一所设计学院——“包豪斯”的探索,使现代设计达到了惊人的高度,取得了非常重要的成果。思维上、方法上和形式上对其后的设计产生了积极深刻的影响,基本改变了过去设计的内涵和本质。由于二战的影响,现代主义设计及其代表人物移师美国,在那里得到了健康而迅速的发展,并逐渐形成了空前的国际主义风格浪潮。
这期间,在荷兰产生的“风格派”也异常活跃,其代表人物是发起者杜斯博格(Theo Van Doesburg,1883-1944),他们于1917年创刊的《风格》杂志充分表达了他们的观念。如同德国的包豪斯一样,“风格派”确立一个艺术创作和设计的明确目的,强调艺术家、设计师的合作,强调联合基础上的个人发展,强调集体和个人之间的平衡。对蒙德里安来说,形体不是表示特殊的状况和特征,而是还原于自然所具有的、自然的永恒的要素。蒙德里安的作品充分表达了他的艺术思想。

蒙德里安的作品,包豪斯的奠基人活尔特·格罗佩斯(Walter Gropius ,1883-1969)是20世纪最重要的现代设计师、设计理论家和设计教育奠基人。他的设计思想具有鲜明的民主色彩和社会主义特征。他一直希望他的设计能够为广大的劳动人民服务而不仅仅是为少数权贵服务。
格罗佩斯成立包豪斯的核心思想之一,是他认为艺术与手工艺不是对立的,而是一个活动的两个不同方面而已。因此,他希望能够通过教育改革,使它们得到良好的、和谐的结合。由于格罗佩斯的虔诚和不懈的努力,使包豪斯成了现代设计运动的发源地。

由于二战给世界各国造成了严重创伤,使远离战火的美国因为免受战争破坏得到迅速发展,战后的美国占有天时地利,成为世界上最强的资本主义大国,美国经济在战后很快达到发展的新高峰。在美国,促进设计活动发展的唯一动力是经济的活力,美国的设计水平因有庞大的市场需求所推动,一度十分发达。在物质极为匮乏的战后年代,西方人最感兴趣的不是设计的典型和华贵,而是美国式的大众物质文化。因为可口可乐一马当先打入世界市场,被人们称为“可口可乐殖民主义”.西方各国在50年代后半期开始学习和模仿美国大众文化和文化观念,连同美国设计的核心,即强调“有计划的废止制”的式样、设计方式也兼收并蓄、全盘吸收。如果我们用一个词来概括形容60年代的设计风格,那么最恰当的就应该是“波普”。“波普”设计运动是一个反现代主义设计运动,即反对自1920年以来,以德国包豪斯为中心发展起来的现代主义设计传统。这个运动思想的根源,其实还是从美国的大众文化中来的。换言之,美国的大众文化和消费文化,已经成为英国和欧洲“波普”设计运动的参考依据和灵感来源。美国设计基本沿着两个不同的路径发展。第一个是国际主义的大企业行为,它代表资本主义的、主流的发展方向。另一个发展方向是独立的设计事务所的迅速增加,并且开始进入新的设计领域:企业形象设计。

日本是世界发达国家中唯一的非西方国家,它的工业革命比西方国家迟到有100年以上,它从1953年前后开始发展自己的现代设计,到80年代已经成为世界上最重要的设计强国之一。
日本设计有两种完全不同的风格特征,一种是比较民族化的、温煦的、历史的传统设计;另一种则是国际的、超前的、发展的现代设计,这种传统与现代双轨并行的体制所获得的成功,为那些具有悠久历史传统的国家提供了非常有意义的样板。

9、版面设计为什么要首先了解主题熟悉设计背景?

版面设计要首先了解主题熟悉设计背景是因为在做版面设计的时候,包含了文字、图形、色彩的三要素搭配应用,如果你在设计版面之前不了解设计背景,也很难把要点应用于这三个基本构成元素,也很难贴近主题。

与网页版式设计的历史背景相关的知识