基于HTML的红色文化网站设计开发

卫辰浩

摘 要：红色文化是新中国建立以来所特有的历史文化，它是新中国建立并走上富强之路的一段历史缩影。我们不仅仅要了解并学习这段文化，同时也要用我们自己的方式将这段文化传承下去，利用网站技术将其保存从而达到我们的目的。文章基于HTML对红色文化网站进行了设计开发，以期对红色文化的传承做出贡献。

关键词：红色文化;网站开发;HTML

0 引言

陕西省铜川市照金镇是中国陕甘边革命根据地的中心，1933年春季，这片土地上诞生了中国长江以北的第一个革命根据地，它横跨耀州区、淳化、旬邑、宜君4个自治市和县区，面积数万平方公里。这片土地为西北地区进行文艺复兴和革命发展奠定了坚实基础。

照金陕甘边革命根据地是中国共产党于西北地区设立的第一个中国青年山区革命根据地，唤起了千万中国各族人民在中国共产党的正确领导下开展新一次土地革命的深刻觉悟，激励着中国西北地区的人们争取自我解放的顽强勇气与信心，它又是中國红军进一步发展和壮大、走向伟大胜利的战场[1]。不仅如此，该地区还拥有“革命纪念馆”“照金纪念碑”“薛家寨景区”“香山景区”等文化旅游景点。

笔者的实地调研发现，虽然照金红色小镇拥有“日照锦衣，遍地似金”的含义与特有的历史文化和美丽景色，但是前往参观学习的游客并不多。因此笔者决定将“互联网”技术与历史红色文化结合起来向更多的人展示照金小镇的风采。

1 网站需求分析

要设计制作一个展示网站，首先要从用户的角度出发，了解用户的需求。所以建设前期做出以下具体规划：

（1）根据现有的资源了解学习照金地区红色文化的发展趋势。

（2）制作调查问卷了解红色文化最薄弱的地方，制作相关的改进方案。

（3）联系志愿者试用网站，并根据实际情况进行改进，确保有效性、实用性。

（4）与其他类似的平台进行对比，扬长避短。

2 网站设计

在做好前期的准备工作后，正式开始进行网页的开发规划。基于HTML的展示网站开发，首先选用主流的开发软件Dreamweaver进行开发，运用“DIV+CSS”，JavaScript技术在Windows操作系统下进行网站的规划处理。

更多地使用了基础的标记技术，总体规划使用DIV方法以首页为例展示构造框架如具体下：

//该DIV显示顶部网站图片标题。

//该DIV显示布局导航条。

//该DIV采用嵌套DIV技术“main”与“top”“daohang”等级一致将“left”“middle”“right”嵌套其中精准布局显示[2]。

//该DIV“left1”“left2”作为left中的嵌套将两篇内容显示便于排版操作。

//该结束标记为DIV“middle”的结束标记将上述其三嵌套。“middle”“right”DIV原理同“left”一致。

//该DIV显示网站下方结尾内容。

2.1 网站规划

网站主要展示的是陕西铜川照金地区的特色，网站集文化、旅游、购物、住宿、交通、观景于一体。

网站设立了交通指南、革命纪念馆介绍、本地特产推广、酒店住宿信息、自然景色5个模块。内容丰富使得用户的体验更加完善。网站首页有各个模块的缩影，方便用户快速浏览信息，更快地找到自己所需要的内容，从而大大节省了时间，也便于用户快速了解本站信息[3]。

交通指南模块的主要功能是提供交通信息，其中包含了位置信息，专门设立地图模块方便用户查看所属位置，以及浏览照金地区的所有地图信息，后期技术成熟会加入定位信息。景点信息模块为用户提供最新的路况信息，方便自驾游的旅客及时调整规划路线，以免遇到道路施工但是地图未显示的情况。地图下方模块主要为用户提供最佳参考路线，包含自驾游与乘车游两种路线信息。景点特色模块为用户提供特色旅游景点，方便用户规划参考。

革命纪念馆为用户提供陕甘边革命根据地照金纪念馆的详细信息，便于用户了解纪念馆与周边革命红色景点与照金革命历史。目前页面主要推广3个模块：“照进纪念馆”“照金纪念碑”与“照金战斗旧址”的历史资料。

本地特产页面主要为用户介绍当地的农副周边产品与本地特产，可以为用户直接提供购买链接，解决了特产购买困难、景区产品贵、当地产品没有销路的问题，也为当地农产品提供了发展的平台。

酒店住宿页面为用户提供并筛选出照金附近的几家酒店，标明了价钱，方便用户挑选，也为正在规划旅游的用户提供了真实并有价值的参考。在酒店介绍末尾提供了预订酒店的链接，更方便了用户的操作。

自然景色页面为用户提供美景图片信息，每次出去旅游天气总是“阴晴不定”，刚准备欣赏美景，天气却“忽然转阴”。这个页面为用户解决了这个问题，在最好的天气记录最美的风景，也为没有来过照金旅游的朋友提供了观景平台。

2.2 地图功能实现

网站运用JavaScript技术主要展示地图信息，主要代码如下：

//创建展示地图主要代码

//使用创建好的“ditu.html”导入新建容器向用户展示地图引用代码

//新建放置地图容器

//设置容器参数大小样式

//将地图函数创建并初始化：

functioninitMap（）{

createMap（）;//创建地图

setMapEvent（）;//设置地图事件

addMapControl（）;//向地图添加控件

addMarker（）;//将marker添加至地图中

}

//创建地图函数：

functioncreateMap（）{

var map = new BMap.Map（“dituContent”）;//在地图容器中新建一个地图

var point = new BMap.Point（108.647159，35.062788）;//定义一个中心点坐标此处定位至网站显示默认位置“照金纪念馆”

map.centerAndZoom（point，17）;//将坐标显示在地图容器中

window.map = map;//将map变量存储在全局

}

3 结语

本文主要探讨了红色文化网站的设计制作，通过本系统的设计与实现，能够系统地学习到网站开发的相关步骤和方法技巧，以及主要基于HTML技术，在Windows系统的环境下实现展示网站的各项功能，如新闻、特产内容查看以及地图功能的使用等多项功能，并在此基础上将网站的各项设计与实现整合起来，实现一个完整的网站应用。

该宣传网站的实现，拉近了我们与红色文化的距离。网站各项功能便于操作，内容可視化较为完善，红色网站的设计制作，不仅提升了专业知识，还真正弘扬了我们的爱国主义精神，传承红色基因，体现当代青年大学生的政治思想和情操。

[参考文献]

[1]王凯旋.陕甘边照金革命根据地研究[D].延安：延安大学，2014.

[2]高葵，付晓翠，李蔚妍.基于CSS+Div的盒模型网页精确布局方法研究[J].电脑知识与技术，2020（27）：191-193，204.

[3]李伟.计算机网站建设的规划设计及其实现[J].电脑编程技巧与维护，2020（12）：164-166.

（编辑 王雪芬）