实施公共图书馆网站的响应式设计

目录

1。线框原型

1.2响应式设计和响应式线框原型

2响应式线框原型的设计和实施

2.1构建代表页面

2.2构建一个包含实际内容的页面

文本

关键字：响应设计；响应式原型；线框； CSS3媒体查询；内容管理软件

摘要：根据内容结构计划的需求，在构建公共图书馆主题数据库和网站主题中，该文章通过使用CSS，使用CSS3媒体查询来构建代表性的网站页面，并使用内容管理软件来构建交互式响应式响应式线帧原型。根据在线框架原型的内容结构和响应式布局测试，它实现了响应式视觉设计，该设计在协助内容计划，网站开发和加速网站构建方面发挥了作用。

智图分类编号：G258.2文档标识代码：文章编号：1003-1588（2019）02-0012-03

随着公共图书馆主题数据库和网站主题的数量的增加，如何合理地计划主题数据库和网站主题的内容结构是一个需要在网站开发中解决的问题。网站构建的目的是向网站用户揭示特定主题的内容，以有序的方式组织和揭示内容。用户访问网站以获取信息，并且网站的视觉设计和编程技术为网站的内容提供服务。传统的网站开发过程首先执行视觉设计，然后填写内容。内容始终处于次要状态，通常无法满足用户的需求。响应式线框原型的设计和实现方法使公共库可以在计划网站主题列之后建立交互式，不可吸引的美化响应式线框原型。使用响应式线框原型测试和调整列结构的使用使网站开发过程更多地关注主题数据库和网站主题内容的有序组织和披露，这与内容为主导的网站开发和构造思想一致，并反映了高级网站构建方法。使用响应式原型测试响应式布局，您最终可以根据测试实现主题数据库和网站主题的响应式设计。

线框原型设计和响应式设计

1。线框原型

线框请参阅网站每个页面内容的摘要，该内容可以显示信息的层次结构和所需的空间。创建线框可确保页面包含所需的所有信息。线框不包括网站的配色方案，背景或图像等。线框图是一种工具，可以使网站内容构建人员和相关人员尽快参与网络开发。线框原型可以在改善内容计划和设计中发挥作用，当用户与线框原型互动时，用户可以更好地理解上下文。

1.2响应式设计和响应式线框原型

从用户的角度来看，响应式设计是能够自动更改大小并移动网页的位置以适合显示它们的屏幕的能力。当用户使用任何设备访问网站时，用户获得的内容将相同，并且网页显示全尺寸文本，并且在没有用户缩放操作的情况下查看内容。响应式原型是内置的响应式线框，可以随着设备宽度的变化而改变各种屏幕上的设计，其显示效果与线框原型相似。区别在于布局响应迅速。响应式原型可以调整浏览器窗口，在不同设备上查看原型，并观察布局的变化。使用响应式原型同时测试网站主题的列结构和响应式布局，这在加速网站开发中发挥了作用。

2响应式线框原型的设计和实施

2.1构建代表页面

代表性网页包括主页，列表页面和内容页面。这三页可以相互链接以形成一个完整的网站。主页，即以所有列的集中式方式显示的页面。列表页面适用于特定列，即以列表形式显示列下的文档的页面。内容页面是用于显示文档[2]的特定内容的页面。三个代表网页的页面结构都可以分为标题，导航，主内容区域和页脚。其中，主页的主要内容区域分为具有相同数量的第一级列的多个区域，每个区域都包括一级列名称，链接地址，列文档列表和特定列内容的截取内容。列表页面和内容页面的主要内容区域分为两个部分，包括辅助导航。列表页面的主要内容区域分为文档列表和分页链接。文档列表包括标题，负责人，日期和其他内容。内容页面的主要内容区域是文档的详细内容，包括标题，负责人，出版时间和文本。

在构建代表性网页时，应使用简洁的语义代码分离内容和表达式，并且不使用表达元素。书面内容应在没有CSS的情况下浏览，该内容具有良好的阅读。响应式设计的内容在布局之前，并且内容采用线性设计的原理来突出关键内容。用户读取网页内容的顺序，应写入代码。如果没有布局，则需要按照用户希望显示的顺序对所有内容进行编码，也就是说，一块内容是线性安排的。

公共库应使用.0来构建三个代表页面：主页，列表页面和内容页面。列表页面的内容区域分为三种形式：文本，图片和文本图片混合。响应式设计中的媒体查询基于视口宽度。在台式计算机上，视口是浏览器窗口删除菜单，工具栏和滚动条的部分。在移动设备上，视口的宽度是屏幕的宽度。添加一个语句将页面渲染宽度设置为代码中的视口宽度可以为后续的响应布局做准备，并使用构建的代表页面作为响应式原型开发的基本页面。

2.2构建一个包含实际内容的页面

公共图书馆使用内容管理软件来构建和维护网站。内容管理软件的工作原理是将网站的动态信息及其之间的关系存储到数据库中。该程序会自动将列模板（包括HTML与目标）和文档数据（数据库中的数据）相结合，根据列规则在每个级别上生成静态页面和页面链接，以静态页面的形式发布动态信息，并完成网站的自动生成[3] [3] [3]

在设计网站之前，考虑网站内容将帮助网站建设者创建一个满足网站目​​标和用户需求的网站。在网站设计期间使用实际内容将有助于提高网站视觉设计的有效性。响应式设计的内容在布局之前。具有内容的页面是响应式设计的基础。公共库使用内容管理软件的发布功能来实现页面内容的添加和维护，然后在列表页面中自动生成标题列表和图片列表。具体过程是：将代表性页面放入内容管理软件的模板中；在内容管理软件中为网站主题计划添加一级列，并根据列表达式表格指定相应的模板；将网站内容，主要导航和辅助导航代码作为内容管理软件的文档进行管理，并使用内容管理软件完成添加，维护网站内容和导航代码的维护；使用内容管理软件在没有样式控制的情况下生成页面，包括网站主题的实际内容，并且可以相互链接，并将其用作开发响应式原型CSS的基础。