小巧屋儿童图书馆的设计与实现
:小巧屋儿童图书馆是针对十岁以下儿童的专业图书馆。小巧屋儿童图书馆网站的开发设计，就是在馆内宣传引导的需求下而产生的。本网站是以CSS及HTML5为开发工具,运用JavaScript及Photoshop为辅助工具，增加动态效果，优化图片，使整个画面富有生机。本网站是借助于网络这种传播媒介，及时更新图书信息、活动信息、公告信息，吸引更多儿童阅读，引导儿童正确阅读为目的。网站内容主要包含关于我们、注册登录、图书分类、推荐图书、最新动态、服务指南等六个板块，能够实现读者自主查询，对馆内资源的大体了解，提高阅读效率及阅读质量，并突破时间和地域的限制，大大缩短检索图书时间，给人们极大的方便。首页是读者们浏览网站见到的第一个网页。关于我们设计了本馆介绍和联系我们二个内容，是对图书馆网站的介绍及联系方式。推荐图书有新书上架，读者推荐，经典图书，热门作者组成，有较高的参考价值。图书分类是将图书按照年龄，出版时间等进行分类，这样读者通过分类图书有方向的找出想要的书籍。最新动态包含活动中心，公示公告，新闻，介绍了图书馆里举办的活动，重要的通知公告，以及国内外重要的新闻，读者根据自己的兴趣报名参加活动，遇到的通知可以及时获取，在阅读新闻时扩大知识面。服务指南则是其中最为人性化的设计，主要讲述入馆须知，办证借阅指南等，能让读者清楚理解办事的流程，也能稳定图书馆秩序。
目 录
一、引言 1
二、需求分析 1
三、开发工具 1
四、主体设计 1
（一）网站开发流程 1
1.功能结构图 1
2.界面设计 2
3.首页 div 结构和层样式 3
（二）基本功能 5
1.首页 5
2.注册登录 6
3.关于我们 7
4.图书分类 8
5.推荐图书 9
6.最新动态 10
7.服务指南 11
8.三级子页 12
（三）JavaScript特效 13
1.图片走动 13
2.图片下拉 14
五、总结 15
参考文献 17
一、引言
近年来，建设网站越来越成为
*好棒文|www.hbsrm.com +Q: ￥351916072$
一种流行趋势。一方面，不断运用中的互联网技术越加成熟，出现大量建站工具，建立网站已不是难题，另一方面，人与人的交流更加趋向于网络化。人们需要网络,使工作生活更加的完美。而图书馆因为工程浩大，本身数量较少，去图书馆的人数也不是很多，快节奏的生活，使得人们缺少时间来图书馆学习，即使来到图书馆，需要了解书籍的位置，在众多书籍中，翻阅多本书籍，知道是否是自己所需要的，这些不仅浪费时间，还会消磨人们阅读的耐心。通过建立图书馆的网站，就能很好的避免这些尴尬。人们通过网站可以了解到书店的日常运作，包括服务指南，地理位置等，可以得知网站内的最新消息，包括最新新闻，活动详情，店内公告等，也可以对图书进行类别筛选，包含图书分类，新书上架，推荐书籍，热门作者等。正是运用这些功能，图书馆更能发挥所长，为人民做贡献，图书馆资源的利用率才能上升，人们也能省时省力。达到双赢的最佳效果。
本网站运用的是Dreamweaver为开发工具，通过HTML,CSS等建设网站。开发者的需求在很大程度上得到满足，使用界面清晰得当，容易上手，适合建站的入门使用。
二、需求分析
信息高速发展的今天，图书馆数量急速增加，图书也是丰富多彩，昔日传统的图书馆已不适应传播的速度及知识的产生，如果利用互联网网络，情况则大不相同，这样知识的传播速度及范围都将有质的改变。设计的网上图书馆正是通过计算机的这一特点，使读者可以随时随地的连接一台电脑就可以浏览图书馆的众多信息，从而服务读者，同时也能将图书馆的资源利用到底。
通过对市场的环境观察发现，图书馆无论在数量还是在规模上，都呈现上升的趋势，但是针对儿童的图书馆还是很少，而从家长越来越关注孩子的学习的现象来看，家长对儿童图书馆的态度很是关注，还有现在人们的生活工作很大，抽出时间陪孩子去图书馆的机会也就变得很少，建立儿童图书馆就能缓解这些矛盾，既通过网站吸引读者，了解图书馆的存在，又能突破时间和空间的阻碍，随时随地的，想来就来。
根据读者的需求，网站主要想要实现以下目的：（1）通过网页展示，吸引更多的人关注图书馆，增加儿童阅读的宣传（2）加强服务，给读者提供便利（3）使图书资源能得到充分利用（4）图书馆内更新的信息发布出去，读者能及时获取信息（5）根据网页中的推荐及分类功能，想要找的书籍能很快定位到。
三、开发工具
图书馆的功能模块主要包含关于我们，推荐图书，图书分类，最新动态，服务指南，根据模块的相关内容，主要目的为了宣传，则图书馆更适合做成静态网站。
整个网页在设计过程中用到Dreamweaver和Photoshop二大软件，Dreamweaver是现在广泛使用的开发工具，深受开发者的喜爱。在编辑代码的同时，就能展示出网页界面，减少代码与浏览器之间反复切换的麻烦；无论在HTML还是CSS界面，编辑代码，只要打出代码的首字母，相应的提示列表会出现在选择框，减少编辑时间与写错代码的失误。Photoshop是处理图片的多媒体软件，在网站设计中的Log及图片都是经过它的处理，图片更加鲜明，使网页整体表现得和谐。
除此之外，网站还得力于JavaScript和记事本的协助。记事本在设计中用作修改或是查看源码，提高了编写代码的效率。JavaScript的效果也很显著，在应用开发Web中，增加动态的效果，在HTML中通过嵌入JavaScript脚本，实现自身的功能。
四、主体设计
（一）网站开发流程
1.功能结构图
为了更好地服务于民，图书馆网站分为首页，关于我们，推荐书籍，图书分类，最新动态，服务指南六个功能模块，其详细的功能结构图如图41所示：
图41功能结构图
2.界面设计
网站的首页框架影响着各个子页之间的布局，所以要谨慎设计。本图书馆网站采用的是DIV+CSS的布局方式来设计整个首页的框架，首页大体框架如图42示：
首页的布局中，logo，导航，横幅和版权是固定位置，其他中间的内容分为左右二栏，左边以列表形式展开，将公示公告放置在最上端，可以让读者及时获取店内通知，右边放置图书相关内容，有新书上架，读者推荐，热门作者三个部分，让读者能挑选出新款，热门的书籍，获取新鲜的知识。整个界面构图简单整齐，给人大方清晰的感觉。子页框架如43所示：
Logo
导航
横幅
公示公告
新书上架
友情链接
读者推荐
联系我们
热门作者
版权
图42 首页框架图
子页的布局延续了首页中固定的位置，即logo，导航和版权不变，只有横幅改变和中间内容的形式上做出修改。通过点击设计好的二级导航，右边内容能展示不同内容。这样的设计，使读者容易查询。
Logo
导航
横幅
二级导航
图书内容
版权
图43 子页框架图
3.首页 div 的结构和层样式
首页采用层层相套的布局模式，具体 div 结构如图44 所示：
图 44 首页div结构图
div代码如下：
层样式如下：
4. 子页 div 的结构和层样式
首页采用层层相套的布局模式，具体 div 结构如图45 所示：
图 45 子页div 结构图
div代码如下：
目 录
一、引言 1
二、需求分析 1
三、开发工具 1
四、主体设计 1
（一）网站开发流程 1
1.功能结构图 1
2.界面设计 2
3.首页 div 结构和层样式 3
（二）基本功能 5
1.首页 5
2.注册登录 6
3.关于我们 7
4.图书分类 8
5.推荐图书 9
6.最新动态 10
7.服务指南 11
8.三级子页 12
（三）JavaScript特效 13
1.图片走动 13
2.图片下拉 14
五、总结 15
参考文献 17
一、引言
近年来，建设网站越来越成为
*好棒文|www.hbsrm.com +Q: ￥351916072$
一种流行趋势。一方面，不断运用中的互联网技术越加成熟，出现大量建站工具，建立网站已不是难题，另一方面，人与人的交流更加趋向于网络化。人们需要网络,使工作生活更加的完美。而图书馆因为工程浩大，本身数量较少，去图书馆的人数也不是很多，快节奏的生活，使得人们缺少时间来图书馆学习，即使来到图书馆，需要了解书籍的位置，在众多书籍中，翻阅多本书籍，知道是否是自己所需要的，这些不仅浪费时间，还会消磨人们阅读的耐心。通过建立图书馆的网站，就能很好的避免这些尴尬。人们通过网站可以了解到书店的日常运作，包括服务指南，地理位置等，可以得知网站内的最新消息，包括最新新闻，活动详情，店内公告等，也可以对图书进行类别筛选，包含图书分类，新书上架，推荐书籍，热门作者等。正是运用这些功能，图书馆更能发挥所长，为人民做贡献，图书馆资源的利用率才能上升，人们也能省时省力。达到双赢的最佳效果。
本网站运用的是Dreamweaver为开发工具，通过HTML,CSS等建设网站。开发者的需求在很大程度上得到满足，使用界面清晰得当，容易上手，适合建站的入门使用。
二、需求分析
信息高速发展的今天，图书馆数量急速增加，图书也是丰富多彩，昔日传统的图书馆已不适应传播的速度及知识的产生，如果利用互联网网络，情况则大不相同，这样知识的传播速度及范围都将有质的改变。设计的网上图书馆正是通过计算机的这一特点，使读者可以随时随地的连接一台电脑就可以浏览图书馆的众多信息，从而服务读者，同时也能将图书馆的资源利用到底。
通过对市场的环境观察发现，图书馆无论在数量还是在规模上，都呈现上升的趋势，但是针对儿童的图书馆还是很少，而从家长越来越关注孩子的学习的现象来看，家长对儿童图书馆的态度很是关注，还有现在人们的生活工作很大，抽出时间陪孩子去图书馆的机会也就变得很少，建立儿童图书馆就能缓解这些矛盾，既通过网站吸引读者，了解图书馆的存在，又能突破时间和空间的阻碍，随时随地的，想来就来。
根据读者的需求，网站主要想要实现以下目的：（1）通过网页展示，吸引更多的人关注图书馆，增加儿童阅读的宣传（2）加强服务，给读者提供便利（3）使图书资源能得到充分利用（4）图书馆内更新的信息发布出去，读者能及时获取信息（5）根据网页中的推荐及分类功能，想要找的书籍能很快定位到。
三、开发工具
图书馆的功能模块主要包含关于我们，推荐图书，图书分类，最新动态，服务指南，根据模块的相关内容，主要目的为了宣传，则图书馆更适合做成静态网站。
整个网页在设计过程中用到Dreamweaver和Photoshop二大软件，Dreamweaver是现在广泛使用的开发工具，深受开发者的喜爱。在编辑代码的同时，就能展示出网页界面，减少代码与浏览器之间反复切换的麻烦；无论在HTML还是CSS界面，编辑代码，只要打出代码的首字母，相应的提示列表会出现在选择框，减少编辑时间与写错代码的失误。Photoshop是处理图片的多媒体软件，在网站设计中的Log及图片都是经过它的处理，图片更加鲜明，使网页整体表现得和谐。
除此之外，网站还得力于JavaScript和记事本的协助。记事本在设计中用作修改或是查看源码，提高了编写代码的效率。JavaScript的效果也很显著，在应用开发Web中，增加动态的效果，在HTML中通过嵌入JavaScript脚本，实现自身的功能。
四、主体设计
（一）网站开发流程
1.功能结构图
为了更好地服务于民，图书馆网站分为首页，关于我们，推荐书籍，图书分类，最新动态，服务指南六个功能模块，其详细的功能结构图如图41所示：
图41功能结构图
2.界面设计
网站的首页框架影响着各个子页之间的布局，所以要谨慎设计。本图书馆网站采用的是DIV+CSS的布局方式来设计整个首页的框架，首页大体框架如图42示：
首页的布局中，logo，导航，横幅和版权是固定位置，其他中间的内容分为左右二栏，左边以列表形式展开，将公示公告放置在最上端，可以让读者及时获取店内通知，右边放置图书相关内容，有新书上架，读者推荐，热门作者三个部分，让读者能挑选出新款，热门的书籍，获取新鲜的知识。整个界面构图简单整齐，给人大方清晰的感觉。子页框架如43所示：
Logo
导航
横幅
公示公告
新书上架
友情链接
读者推荐
联系我们
热门作者
版权
图42 首页框架图
子页的布局延续了首页中固定的位置，即logo，导航和版权不变，只有横幅改变和中间内容的形式上做出修改。通过点击设计好的二级导航，右边内容能展示不同内容。这样的设计，使读者容易查询。
Logo
导航
横幅
二级导航
图书内容
版权
图43 子页框架图
3.首页 div 的结构和层样式
首页采用层层相套的布局模式，具体 div 结构如图44 所示：
图 44 首页div结构图
div代码如下：
层样式如下：
4. 子页 div 的结构和层样式
首页采用层层相套的布局模式，具体 div 结构如图45 所示：
图 45 子页div 结构图
div代码如下：
版权保护: 本文由 hbsrm.com编辑，转载请保留链接: www.hbsrm.com/jsj/xxaq/680.html
