响应式网页设计论文

1、什么是响应式网页设计与自适应网页设计

响应式与自适应的原理是相似的，都是检测设备。 根据不同的设备采用不同的css，而且css都是采用的百分比的，而不是固定的宽度。

不同点：响应式的模板在不同的设备上看上去是不一样的，会随着设备的改变而改变展示样式， 而自适应不会，所有的设备看起来都是一套的模板，不过是长度或者图片变小了，不会根据设备采用不同的展示样式。

2、响应式网页设计到底是什么？

响应式的网站就是随着电脑屏幕的大小会自动匹配网页的大小。

3、响应式网页设计的提出

Ethan Marcotte曾经在A List Apart发表过一篇文章Responsive Web Design，文中援引了响应式建筑设计的概念：现出现了一门新兴的学科——响应式架构(responsive architecture)——提出，物理空间应该可以根据存在于其中的人的情况进行响应。结合嵌入式机器人技术以及可拉伸材料的应用，建筑师们正在尝试建造一种可以根据周围人群的情况进行弯曲、伸缩和扩展的墙体结构；还可以使用运动传感器配合气候控制系统，调整室内的温度及环境光。已经有公司在生产智能玻璃：当室内人数达到一定的阈值时，这种玻璃可以自动变为不透明，确保隐私。
将这个思路延伸到Web设计的领域，我们就得到了一个全新的概念。为什么一定要为每个用户群各自打造一套设计和开发方案？和响应式建筑相似，Web设计同样应该做到根据不同设备环境自动响应及调整。
显然，我们无法也无需使用运动传感器或是机器人技术，响应式Web设计更多需要的是抽象思维。好在，一些相关的概念已经得到了实践，比如液态布局、帮助页面重新格式化的media queries和脚本等。但是响应式Web设计不仅仅是关于屏幕分辨率自适应以及自动缩放的图片等等，它更像是一种对于设计的全新思维模式。

4、响应式网页设计和自适应网页设计的区别

惊喜设计里面有篇文章提到过，自适应网页设计也是响应式网页设计，响应式网页设计也是自适应网页设计。但是真正的细分起来，自适应只是响应式的一个子集，指网页中整体大图的自适应或者banner的自适应。

响应式设计可以一个网站兼容多个不同终端

响应式网页设计优势：流体网格的网站适合响应式网页设计。

1、灵活性强，可以适应不同分辨率的设备

2、方便快捷的解决多设备显示适应问题

自适应网页设计优势：固定断点的网站适合自适应网页设计。

1、实施起来代价更低，测试更容易

2、自适应布局可以让设计更加可控，因为它只需要考虑几种状态就可以了

虽然响应式/自适应网页设计会带来兼容各种设备工作量大、代码累赘、加载时间长的缺点，但它们能“一次设计，普遍适用”，可以根据屏幕分辨率自适应以及自动缩放图片、自动调整布局，它们不只是技术的实现，更多的是对于设计的全新思维模式。

5、动态网页设计论文！！！！！！！！

指导老师：
完成日期：
目录

一、概述 - 3 -

二、结构图 - 3 -

三、站点主题选择 - 4 -

四、模块介绍 - 4 -

（一）index - 4 -

（二）公告栏 - 5 -

（三）心马游缰 - 5 -

（四）新闻、娱乐、游戏等附属板块 - 5 -

五、总结 - 6 -

一、概述

随着互联网的不断发展和中国网络人口的日益增长，建立个人网站，不但可以刚好的展示自己，而且可以提高自己在计算机应用方面的能力。故本次作业，我选择制作个人网站。

个人在设计时考虑的多为个人的兴趣喜好，而不注重商业的展示。内容以反映个人为中心，从而使个人网站真正的成为展示自己的网络名片。

在网页制作中，我借鉴了韩国个人网站的设计风格，着重于给浏览者以强烈的视觉冲击。运用了photoshop和fireworks强大的图像制作和处理能力。进行了大量的图片制作，从而给人以强烈的美感。并利用Flash进行片头动画的制作，给予浏览者一种强烈的时代动感。整个网站的架构是由Dreamwave完成的。

二、结构图

三、站点主题选择

由于网络上各种各样的信息很多，别人可以轻易的各大知名网站上了解自己想要的信息。所以，我的关注的便是怎样让自己的网站更具有个性魅力，使个人擅长的信息更全面的反映于浏览者。以上便是我个人站点主题选择的指导思想。

站点的主体内容由个人日常生活和大学各种作业两部分组成。从学习和生活两大方面全方位展示自己丰富多彩的大学生活。

在主要内容之外，还设有娱乐、游戏、新闻三个模块。这部分内容将我个人浏览网页所收集到的奇闻趣事反映给大家。（此部分未开通）

四、模块介绍

（一）index

使用Flash动画进入主页，给人一种耳目一新之感。开始的两个隧道引入，表明引领浏览者进入本人的内心世界，随之而来的是以红色为主色调的动画，给人一种热情好客的感觉，不断变换的网站内容更是起到了提示和概述的作用。

（二）公告栏

公告栏是我个人正在或将要发生重大事情的提示栏。内容与报纸的头版头条有异曲同工之妙。公告栏标题是由一面大鼓作为引导，用以寓意此部分内容重要之处。在黄底红字的衬托之下更显示其应受到的关注程度之高。

（三）心马游缰

心马游缰是个人心灵的自我倾诉之所，将自己日常生活的感悟写下来与浏览者交流。这部分也总结了自己的得与失，沉淀了自己的情绪。

在主页上有该部分的文章列表，浏览者点击之后将跳转到每篇文章相对独立的网页中。而每一个相对独立的网页以黄色为主色调，有一种流露个人思想之感。

（四）新闻、娱乐、游戏等附属板块

该板块聚集了本人在日常浏览互联网时收集到的奇闻趣事。该部分内容并不在内容的广度，而是考虑所反映内容的深度和全面性。

值得一提的是，进入该部分是通过Flash的Actionscrip语言编写。形式较为新颖。

五、总结

不知不觉网页设计的课程将要结束了，这门课程所包含内容的丰富是让我从没有想到的。在整个的学习过程中，我学习了Flash、Dreamwave、Fireworks、Html语言、IIS、网站建设的基本思想等重要内容。到现在为止，我还是很庆幸能够学到这么多的内容。

整个网站的制作是我一个人完成的。虽然整个网页的结构还有很多不足，还有一些板块没有开通，但是我的确能够感到在我制作过程中技能的提高。整个网站的不足我想是没有使用到一些动态网页的知识，使得日后网站的维护较为繁杂。希望明年可以选到动态网站的课程，从而弥补自己在动态网络语言方面的不足。

6、什么是响应式网页设计

响应式Web设计(Responsive Web design)的理念是:页面的设计与开发应当根据用户行为以及设备环境(系统平台、屏幕尺寸、屏幕定向等)进行相应的响应和调整。具体的实践方式由多方面组成，包括弹性网格和布局、图片、CSS media query的使用等。无论用户正在使用笔记本还是iPad，我们的页面都应该能够自动切换分辨率、图片尺寸及相关脚本功能等，以适应不同设备;换句话说，页面应该有能力去自动响应用户的设备环境。响应式网页设计就是一个网站能够兼容多个终端--而不是为每个终端做一个特定的版本。这样，我们就可以不必为不断到来的新设备做专门的版本设计和开发了。