APP下载

基于Web前端开发的广告传播平台设计

2019-09-10刘涛武壮壮张文彬

新教育论坛 2019年8期
关键词:新媒体

刘涛 武壮壮 张文彬

摘要:商品经济的发展带动了广告行业的发展,目前随着互联网的发展和普及,广告的传播方式也发生了很大的变化,以新媒体为主的广告行业凭借其互动性强,传播速度快,传播范围广等特点发展迅速.本文主要介绍依靠Web前端技术设计的广告传播平台的具体开发过程.

关键词:新媒体;广告传播;Web前端技术

新媒体借助互联网在电脑和手机终端上可以轻松传递,Web网站形式的广告传播方式可以实时动态传递信息,借助互联网这一媒介可以进行实时的修改,用户也可以实时分享[1]。本文介绍如何自我实现快速搭建一个简单的Web前端平台。

一、平台搭建的技术

Web前端开发离不开代码编辑软件,简单罗列几种编辑软件DreamWeaver、MicrosoftVisualStudio、Visual Studio Code、记事本等[2-3],DreamWeaver是Macromedia公司于1997年发布的,是一种视觉化的代码编辑软件,能实现HTML、CSS、JavaScript 等多种设计语言的编写,其优点在于设计过程中可以实时观察设计结果,以便于及时的修改和更正;Visual Studio Code是微软公司发布的一款开源免费轻量级的代码编辑软件,具备智能补全代码功能,支持语法亮高自动匹配括号等功能,适合多种软件开发,当然也方便前端设计开发。打开主界面可以看到资源管理器、搜索、Git、调试、分屏显示等按钮,当按下 F1键 或按下 Ctrl+Shift+P组合键打开的命令面板后就可以在命令框里执行Visual Studio Code的任何一条命令。而且可以在这个软件中自行添加一些需要的插件,因为Visual Studio Code这款代码编辑软件的插件库特别丰富[4]。

二、平台的具体搭建过程

(一)元素的添加

本文设计的平台中需要展示图片和文字信息,常见的展示类型如下

用户在平台上能观察到的信息是上面图片展示的内容,用具体的HTML代码表示为:<p>首页</p><p>水果</p><p>生活用品</p><p>衣服</p><p>蔬菜</p>,這里p标签就是表达文字的一种基本元素,其目的就是把p标签里面包含的内容通过计算机能正确翻译表达出来。

平台上的图片内容是通过<img>元素表达出来的,<img>标签定义HTML页面中的图像。

(二)元素的布局

Html代码只是简单的把元素表示出来,所以还需要惠CSS代码来为HTML元素布局,从而使得整体界面更美观。

需要用CSS代码来为元素固定位置,实际设计过程中往往把HTML元素中的P标签和img标签存放在div标签中,也就是盒子模型”,这样通过CSS代码来为每一个存放P标签或者img标签的div元素设计一下高度,宽度,背景颜色,以及位置关系,使得整体界面更加和谐。

(三)布局的优化以及简单的交互

元素位置固定好之后就可以在浏览器上进行本机测试,此过程是为了观察元素能不能在浏览器上正确显示,另一方面也为了观察元素的位置是否有偏差,是否影响正常的展示,因为实际设计过程往往因为浏览器的不同,或者终端类型不同导致元素的位置和大小不能实现良好的自适应,只有在不断的调整优化之后才能达到最佳状态[5]。

(四)整体优化

整个平台的设计基本完成,然后就要通过一次次的调试来优化整个程序,首先需要优化代码长度,这样直接的意义就是减少了服务器的容量,其实更重要的是为了提升搜索引擎的处理速度,加快代码的编译过程,这样用户在使用过程中才会减少等待的时间。

三、平台的部署

(一)域名的选择

域名类似于人的身份证,其功能就是在数据传输交换过程中给计算机的一个电子方位,选择便于读易于记的名字,也就意味着域名最好和平台名字相匹配,便于用户的记忆,从而便于日后的再次浏览,其次就是要注意以下域名具有行业、地理位置,以及品牌相关的词语,可以根据自己搭建的平台来选择相适应的域名,最后一点,为了保证自己平台的安全性,选择域名时一定要到正规大型网站注册购买,防止平台信息丢失或者泄露。

(二)服务器的选择

服务器,是用来提供计算服务的设备。本文谈论的平台因为需要处理的内容较少而且需要存储的空间较小,所以可以选择虚拟主机来存放平台站点内容,虚拟主机是使用特殊的软硬件技术,把一台计算机主机分成一台台"虚拟"的主机,每一台虚拟主机都具有独立的域名和IP地址。

四、总结

互联网时代是个信息时代,想要更好的与时代接轨就要把握时代带给我们的机会,利用好信息互联网这个资源,Web前端技术作为依靠互联网发展的新媒体行业的一个分支技术之一,在今后的生产生活中将会起到不可忽视的作用。

参考文献:

[1]王婷婷.新媒体发展对线上广告传播的影响分析[J].传播力研究,2018,2(28):176.

[2]邓威.基于HTML5的Web界面设计模式初探[J].电脑知识与技术,2018,14(33):184-186.

[3]何杰惠.基于Web前端开发的即时通信文件传输研究[J].微型电脑应用,2018,34(11):88-91+106.

[4]李爱红.浅谈Dream weaver CS6中网页布局的三种方式[J].电脑知识与技术,2018,14(22):288-289.

[5]Patrick Gallucci,崔建海.Visual Studio 2005的智能感应代码段[J].程序员,2006(07):103-106+10.

猜你喜欢

新媒体
融媒体时代提升电视新闻传播的舆论影响力
新形势下精品图书的内容策划与艺术设计创新
报纸副刊的传播意义与运营策略研究
真我与偶像:新媒体语境下的明星与粉丝
新媒体语境下新华网国际传播问题与对策分析
政府危机公关中的新媒体传播机制透析
新媒体背景下党报的转型探析
对农广播节目的媒体融合之路
新媒体语境下高校思想政治教育话语研究综述
全媒体时代地市党报媒体融合的四个着力点