# web-operation **Repository Path**: azorachin/web-operation ## Basic Information - **Project Name**: web-operation - **Description**: No description available - **Primary Language**: Unknown - **License**: Not specified - **Default Branch**: master - **Homepage**: None - **GVP Project**: No ## Statistics - **Stars**: 0 - **Forks**: 0 - **Created**: 2020-07-08 - **Last Updated**: 2020-12-19 ## Categories & Tags **Categories**: Uncategorized **Tags**: None ## README # 网站运营报告 |网站名称 |咖啡博物馆| |--|--| |网站url|https://www.lyzj.club| |站长|音璐| |报告撰写人|音璐| ## 一. 策划 ### 1.1 策划文档与网站地图 #### 网站建设目标 随着经济的不断发展,人们的的生活质量越来越高,生活节奏越来越快的人们更需要环境优雅的咖啡馆,喝咖啡的人变多了,随之而来的“咖啡文化”也进入了我们的生活。无论在家里,办公室或者各种社交场所,人们都习惯拿着咖啡,咖啡逐渐成为时尚生活的代名词,并且也成为许多人生活中不可或缺的饮料。本网站旨在向用户科普介绍“咖啡文化”,让用户了解咖啡文化,体验咖啡文化,能找到他们喜欢的咖啡,感受到咖啡的乐趣。 #### 目标用户画像 - 有固定的工作和收入来源的人群:这部分群体一般朝九晚五,为生活奔波,咖啡成为他们生活中一种必需品,因为可以帮助他们保持更好的工作状态,本网站可以帮助他们去选择更适合自己的咖啡品类。 - 个人品味和情调且有一定自由时间的人群:这部分人群本身的生活质量很高,不用担心钱的问题,很愿意花时间花钱在提高生活品质和自身的生活满足感上,本网站可以为他们提供一些很好的小众咖啡,和各个城市的特色咖啡店。 - 咖啡爱好者:作为咖啡爱好者,他们希望能了解到关于咖啡的各种资讯和寻找到一些小众但风味好的咖啡,这些都可以在本网站中找到。 - 大学生:我认为是这是最具潜力的目标群体,因为年轻人追求时尚消费并且充满好奇心,本网站可以帮助他们了解到更多的信息 #### 网站规划 | 更新规划 | 更新内容 | |---|---| | 不更新部分 | 页面,网站标题,导航栏 | | 持续更新部分 | 导航栏分类下的文章保证两到三天更新一篇的频率,保持网站活跃度 | | 运营规划 | 运营内容 | |---|---| | 第一阶段 | 建立网站,通过上论坛、贴吧、微博等线上媒体进行宣传,在各大平台投放平面广告,提高网站知名度,吸引用户 | | 第二阶段 | 完善网站各个板块的内容,根据用户合理需求增加模块,实时更新文章,为用户提供关于咖啡的最新资讯,让用户每几次点进网站可以看到新东西 | | 第三阶段 | 增加网站盈利模式,与网站内的一些品牌合作,提供一些小众咖啡的购买途径,为用户提供优惠服务,能留住用户,也是一种变相宣传的途径,同时增加咖啡衍生品的贩卖。 | #### DVF模型 - **需求 Desirability:** 喜欢咖啡的人想尝试一些小众的或者私人制作的手冲手磨咖啡,通过本网站可以找到这些途径。 用户需要了解咖啡的种类和不同制作方式会让咖啡产生怎么样的风味,偏酸或偏苦,以及怎样能让咖啡搭配什么会变得更好喝,这些本网站都会提供相关信息。 - **可持续性Viability:** 后期与一些品牌合作,为用户提供优惠,提高用户黏性,贩卖有特色的咖啡衍生产品,吸引更多的用户,所获盈利可用来更好地建设发展网站,拓展网站内容 - **可行性Feasibility:** 本网站为科普网站,以内容为主,不需要很难的技术支持。并且咖啡文化如今已成潮流,越来越多的人生活中咖啡都不可或缺,我们可以给用户提供丰富的相关信息和服务 #### 网站地图 ![网站地图](https://images.gitee.com/uploads/images/2020/0716/014037_38e8374a_2228968.png "市场调研.png") ### 1.2 平面设计插件运用 **SiteOrigin** 1.使用Posts Grid和Bottom在[咖啡制作区](https://www.lyzj.club/index.php/make-good-coffee/)页面中构建布局,对文章类别进行筛选,用户可直观从分类中选择想看的文章,右侧设置返回首页的按钮 ![咖啡制作区](https://images.gitee.com/uploads/images/2020/0713/000356_65210fb4_2228968.png "咖啡制作区.png") 2.使用Posts Carousel和Bottom在[咖啡展览区](https://www.lyzj.club/index.php/coffee-encyclopedia/)、[咖啡品牌区](https://www.lyzj.club/index.php/coffee-brands/)、[寻找你的咖啡馆](https://www.lyzj.club/index.php/your-coffee/)、[架站记录区](https://www.lyzj.club/index.php/wordpress-study/)四个页面构建布局,在每个大分类的页面左侧将文章轮播展示,右侧设置返回首页的按钮 ![carousel](https://images.gitee.com/uploads/images/2020/0713/000826_d5a79f9f_2228968.png "carousel.png") 3.使用FooGallery插件,再用自定义html的功能将此插入,在文章结尾处制作分类画廊,方便用户浏览 ![foogallery](https://images.gitee.com/uploads/images/2020/0715/203613_53fc477f_2228968.gif "分类.gif") **Animate it!** 1.文章中的图片采用浏览到此处会放大出现的效果,起到强调的作用 ![图片效果](https://images.gitee.com/uploads/images/2020/0715/205904_a93ae81b_2228968.gif "图片效果.gif") 2.导航页面上回到首页的botton采用划过会左右轻微抖动的效果,对用户起提示作用 ![按钮效果](https://images.gitee.com/uploads/images/2020/0716/155212_527e8892_2228968.gif "按钮效果.gif") ### 1.3 平面设计 #### 网站配色、对比度与可读性 - 配色:网站主色调采取与咖啡颜色相似的深咖色系进行搭配,给人一种沉稳感和沉淀感,呼应网站的咖啡主题和博物馆标题,能让用户产生联想。整体配色为暖色调,色调统一,对比度低,整体不突兀,给人一种温暖舒适的感觉。页面和文章页这种需要呈现具体内容的页面,背景颜色选用了偏黄色的暖调的白,字体选用背景颜色的深咖色(标题采用了醒目的橘黄色),白底黑字,保证了网站内容的可读性 ![网站首页](https://images.gitee.com/uploads/images/2020/0708/235724_afb1b1aa_2228968.png "网站首页.png") ![文章页](https://images.gitee.com/uploads/images/2020/0708/235917_9ad2352b_2228968.png "文章页.png") - 背景与字体对比度:网站首页背景色为深咖色时,字体颜色为偏黄的暖白色,能迅速抓住用户眼球,页面页和文章页的背景色设置为偏黄的暖白色,字体颜色设置为深咖色,都是深色配浅色的设置,对比度强,让用户能一眼看到重要内容 ![首页](https://images.gitee.com/uploads/images/2020/0709/000023_1b336fd6_2228968.png "首页.png") - 可读性:文章可读性高,均带有出站链接和内链,充分使用了列表,小标题等元素,分段明确符合用户浏览特点,让用户一目了然,图文搭配,向用户充分展示文章内容,增强用户浏览体验。 #### 图片的使用 关于图片版权问题均在文章底部有注明,并带有超链接,图片都源自百度。原创图片也有注明为本人原创,不涉及版权问题。 说明展示: ![图片来源展示1](https://images.gitee.com/uploads/images/2020/0719/111936_7427c806_2228968.png "不涉及版权问题.png") ![图片来源展示2](https://images.gitee.com/uploads/images/2020/0719/111913_7788162d_2228968.png "图片来源展示.png") #### 图库风格及配色 - 风格:本网站是以咖啡为主题的网站,文章都围绕着咖啡的相关知识展开,需要通过图文结合来让让用户了解文章内容,所以图库多选用展示咖啡特点的图片(如拿铁、冷萃、冰美式的具体图片) - 配色:大体色调为深棕色,以咖啡本身的颜色为主 图库部分图片展示: ![冷萃](https://images.gitee.com/uploads/images/2020/0709/000549_b18e52b6_2228968.gif "冷萃咖啡.gif") ![拿铁](https://images.gitee.com/uploads/images/2020/0709/000623_a043efa5_2228968.jpeg "拿铁.jpg") ![输入图片说明](https://images.gitee.com/uploads/images/2020/0709/000914_dc84d8bc_2228968.jpeg "卡布奇诺.jpg") ### 1.4 云端架站文章 - [教你利用GITHUB EDUCATION PACK里的资源搭建WORDPRESS网站](https://www.lyzj.club/index.php/2020/07/02/wordpress-github-education-pack/) - [WORDPRESS内修改固定链接导致文章页面404的解决方法](https://www.lyzj.club/index.php/2020/07/01/wordpress-post-404-solution/) - [为你的站点添加SSL安全证书,构建更安全的HTTPS网站](https://www.lyzj.club/index.php/2020/07/11/addssl/)
## 二. 管理 ### 2.1 云端架站:https://www.lyzj.club ### 2.2 网站安全:使用Wordfence 启用Wordfence安全插件来保护我的网站。通过Wordfence监控了解我的网站安全性能不高,防火墙指数也不高,扫描能力在正常数值,应对复杂攻击的能力不高,处于蛮力保护状态,安全仍有隐患,有待加强,尝试通过升级插件的方法来提高wordfence性能 ![Wordfence](https://images.gitee.com/uploads/images/2020/0708/101122_a8b71a71_2228968.png "Wordfence3.png") ![Wordfence](https://images.gitee.com/uploads/images/2020/0708/100724_20e911b6_2228968.png "Wordfence.png") 查看数据,近7天内,我的网站的受攻击情况,可以看出平均一天内我的网站会遭受五百万次攻击 ![Wordfence](https://images.gitee.com/uploads/images/2020/0708/101140_223bcf33_2228968.png "Wordfence2.png") 整体的安全系数需要提升,若遇到强力攻击,那我的网站极大可能会崩掉,但目前看来无明显安全隐患 ### 2.3 网站性能:使用site24×7 - 我添加的监控点遍布各大洲,主要选择了首要国家的首都城市,以便更好地观察我的网站在各个地区的性能如何 - 通过数据可知,我的网站对印度的用户不太友好,可用性不像其他地区都为100%,而是99.477%,但是也没有很低,相对来说可用性不搞。在印度监测点2020年7月15日上午1:22:11有7分钟32秒的停机时间,给用户带来不好的体验 - 响应时间由图可知,本网站对国内地区的用户比较友好,响应速度最快,只有1.03s,对于国内用户来说我的网站可用性高,能带给用户良好的上网体验。但是对欧洲和东南亚用户则不太友好,巴黎、伦敦、印度、迪拜的响应时间都超过了三秒,时间较长,可能会使用户没有耐心从而退出本网站。 - 观察网站整体数据发现各大洲的监测数据都是正常的,可用性趋于100%,停机时间除却印度外都是0,对国内用户尤其友好,可以获得良好的上网体验 ![site1](https://images.gitee.com/uploads/images/2020/0716/013033_f30a0a6f_2228968.png "site1.png") ![site2](https://images.gitee.com/uploads/images/2020/0716/013044_b562ad6a_2228968.png "site2.png") ![site3](https://images.gitee.com/uploads/images/2020/0716/013056_08081964_2228968.png "site3.png") ### 2.4 网站备份 #### 通过wordpress后台导出工具导到本地的文件截图 ![后台导出1](https://images.gitee.com/uploads/images/2020/0719/112919_99ffeaa7_2228968.png "后台导出1.png") ![后台导出2](https://images.gitee.com/uploads/images/2020/0719/112938_83523132_2228968.png "后台导出2.png") #### winSCP的截图 ![WCP1](https://images.gitee.com/uploads/images/2020/0719/113621_078c0bbc_2228968.png "WCP1.png") ![WCP](https://images.gitee.com/uploads/images/2020/0719/113635_aae11c91_2228968.png "WCP.png")
## 三. 运营 ### 3.1 站长工具 ### 百度站长认证 站长工具截图: ![百度站长工具](https://images.gitee.com/uploads/images/2020/0708/021937_22863cec_2228968.png "百度站长工具.png") 在百度上搜索我的网站: ![百度搜索](https://images.gitee.com/uploads/images/2020/0715/221226_f5e3dea3_2228968.png "百度搜索.png") ### Bing站长认证 已在Bing网站站长工具中添加我的站点 ![bing站长工具](https://images.gitee.com/uploads/images/2020/0708/022208_3bb71399_2228968.png "bing站长工具.png") 但无法搜索到我的网站 ![bing搜索我的网站](https://images.gitee.com/uploads/images/2020/0708/022331_d64eca18_2228968.png "bing搜索我的网站.png") 向Bing提交我的网站sitemap和文章url,但仍然没有被收录 ![bing提交的url](https://images.gitee.com/uploads/images/2020/0708/022658_ec52da58_2228968.png "bing提交的url.png") ### 流量数据 自七月二号认证站长工具并开始对我的网站进行seo优化后,网站访问量有所上升 ![访问量](https://images.gitee.com/uploads/images/2020/0708/022744_bf5c18eb_2228968.png "访问量.png") 七月二号认证百度站长工具后,百度索引量和抓取频次呈上升趋势,点击量和展现量也有些许变化,可以看出本网站出现在百度搜索引擎上的几率在慢慢增加 ![索引量](https://images.gitee.com/uploads/images/2020/0708/022934_314857db_2228968.png "索引量.png") ![抓取频次](https://images.gitee.com/uploads/images/2020/0708/023017_208ec95b_2228968.png "抓取频次.png") ![展现量点击量](https://images.gitee.com/uploads/images/2020/0708/023040_b847dae5_2228968.png "展现量点击量.png") 认证Bing站长工具后,网站的搜索点击、搜索结果和抓取网页有些许数据,但是并没有被编入索引 ![bing数据](https://images.gitee.com/uploads/images/2020/0708/023114_485b256a_2228968.png "bing流量数据.png") 至撰写报告前,数据有所提升,但是仍然没有被编入索引 ![bing数据](https://images.gitee.com/uploads/images/2020/0716/003220_2329f5b3_2228968.png "bing数据.png") ![bing数据2](https://images.gitee.com/uploads/images/2020/0716/003234_92470f97_2228968.png "bing数据1.png") ### 3.2 seo优化 方法一:主动向搜索引擎提交网站地图。向百度站长工具和bing网站管理员都添加了sitemap链接 ![百度sitemap](https://images.gitee.com/uploads/images/2020/0715/210308_6d40795b_2228968.png "百度提交sitemap.png") ![bingsitemap](https://images.gitee.com/uploads/images/2020/0715/210323_4e131328_2228968.png "bing提交sitemap.png") 方法二:手动向搜索引擎添加自己文章的url,增加被网站收录和文章页面被搜到的几率 **bing手动链接提交** ![bing链接提交](https://images.gitee.com/uploads/images/2020/0715/214322_989e6a8e_2228968.png "bing链接提交.png") **百度手动链接提交** ![百度链接提交](https://images.gitee.com/uploads/images/2020/0715/215405_38d531b2_2228968.png "百度链接提交.png") 方法三:关键词优化。利用yoast插件,根据文章中的重点词汇和出现词的频率添加关键词和描述文本,增加被收录的机会,希望搜索引擎能通过关键词索引到我的文章 ![关键词优化](https://images.gitee.com/uploads/images/2020/0715/220254_375f6d8a_2228968.png "关键词优化.png") 方法四:在其他相关平台流量较大的文章下附上我的文章链接,更容易被人看到,给我的网站引流 **对比结果与成效(因成效是实施完上面四个方案后再统计的,所以在此统一展示)** - 原来百度智能搜索到我的网站首页,提交链接之后,百度能搜索到更多的页面和文章 ![提交链接前](https://images.gitee.com/uploads/images/2020/0715/230727_58bc7e77_2228968.png "手动提交链接前.png") ![提交链接后](https://images.gitee.com/uploads/images/2020/0715/231219_02b6ea4c_2228968.jpeg "手动提交链接后.jpg") - 优化前无法通过网址之外别的途径索引到我的网站页面,关键词优化后可以通过相关的关键词索引到我网站的相关页面,并且位于第一页,用户也可以通过其他关键词索引到我的相关文章 ![关键词优化](https://images.gitee.com/uploads/images/2020/0716/001746_e53f6ec4_2228968.png "关键词优化成效.png") - Jetpack前后数据对比:从图中可以看出,七月前网站没有任何的流量数据,七月经过上述seo优化后网站浏览量开始增加,效果显著 ![优化流量统计](https://images.gitee.com/uploads/images/2020/0716/005225_b9be46bc_2228968.png "优化流量统计.png") ### 3.3 用户研究 #### 1. 用户访谈 **提出问题** 1. 你进入到网站的第一感觉能和网站主题联系上吗 2. 你认为网站的配色符合主题吗 3. 你觉得本网站有什么可以改进的地方吗 4. 你认为页面及文章布局如何 5. 本网站的加载速度是你的预期范围之内吗 **得出结论** 100%的访谈对象认为本网站配色与主题相符,并且加载速度在预期范围之内。但用户认为 1. 因本网站的整体配色不是黑白配色,而是采取特殊颜色搭配,所以建议将文章背景颜色与页面背景颜色区分开,凸显两者的不同,帮助用户更好地区分两个页面。 2. 用户建议将每篇文章的具体文章内容与文章底部的图片来源说明区分开,分为两个模块,让布局更加清晰,制造更好的阅读体验 **改进措施** 1. 将页面的背景颜色用css定制化为白色 ![用户访谈2css](https://images.gitee.com/uploads/images/2020/0719/111038_7ed52928_2228968.png "用户访谈2css.png") ![用户访谈2](https://images.gitee.com/uploads/images/2020/0719/111018_3a500fc2_2228968.png "用户访谈2.png") ![用户访谈2改](https://images.gitee.com/uploads/images/2020/0719/111056_3d3576ad_2228968.png "用户访谈2改.png") 2. 在文章结尾与文章图片来源键添加空白区块拉开距离,并给文章来源段落增加背景颜色以便更好地区分开 ![用户访谈1](https://images.gitee.com/uploads/images/2020/0719/110930_c7c54a83_2228968.png "用户访谈1.png") ![用户访谈1改](https://images.gitee.com/uploads/images/2020/0719/110944_027b44f1_2228968.png "用户访谈1改.png") #### 2. A/B testing: **导航页面布局方案测试** - **A方案:页面右半部分为近期文章模块** - **B方案:页面右半部分设置介绍文本和Botton按钮,可点击返回首页** ![a方案](https://images.gitee.com/uploads/images/2020/0716/155658_a6974eaa_2228968.png "A方案.png") ![b方案](https://images.gitee.com/uploads/images/2020/0716/155714_758dedf2_2228968.png "B方案.png") **测试结果总结** - **A方案测试结果** :用户的关注点大部分集中在左侧的幻灯片播放文章展示上,对于近期文章这个模块不怎么关注,并表示会对近期文章的内容感到疑惑,以为会是页面分类下的文章,但是仔细一看才发现似乎其中的文章和页面分类没有什么关系。大部分测试用户都建议改模块应该出现在首页展示而不是具体的分类页面 - **B方案测试结果** :用户认为此页面的布局简洁明了,模块清晰,能迅速了解到页面的功能模块展示的内容,如果在幻灯片文章展示中没有看到感兴趣的文章后,100%的用户会通过直接点击按钮返回,不用上下滑动,简化了操作流程。但是80%的用户觉得返回首页没什么必要,他们希望能通过点击按钮继续浏览下一个分类页面。 **结论** - 综合用户意见和改进方案的可行性,我认为B方案更适合导航页面的布局目标。因为B方案明显更受用户青睐,布局清晰,功能明确,简化了操作流程,能给用户带来更好的体验,而A方案会使用户产生误解,选择的模块无法正确引导用户浏览本网站,这是很不好的设计,同时对于用户的建议因为网站主题的限制无法很好地做出改动。综上所述,决定最终的布局采用B方案 - **同时我对B方案根据用户意见做出的改进** :更改按钮链接,点击可跳转至下一导航分类页面继续浏览 ![改进后](https://images.gitee.com/uploads/images/2020/0716/160117_52dec0e0_2228968.png "改进后.png") ### 3.4 定制化 **1.安装wp super cache缓存插件** 因本网站是科普网站,大部分的用户来源应该是通过搜索关键词索引到我网站内的相关文章,希望能通过快速浏览获取到他们想要的信息,因此网站的响应速度对于能否留住用户至关重要,如果网页加载太慢,用户就会失去耐心而放弃浏览,这样无形之中就流失了很多用户,这对我的网站很不利。为了避免这个问题,我安装了wp super cache插件,提高网站加载速度,给用户更好的上网体验 - 安装插件 ![缓存插件](https://images.gitee.com/uploads/images/2020/0716/153744_5c1e5888_2228968.png "缓存插件.png") - 进行设置 ![缓存设置](https://images.gitee.com/uploads/images/2020/0716/153809_ecbf82dc_2228968.png "缓存设置.png") ![缓存设置2](https://images.gitee.com/uploads/images/2020/0716/153824_82d5608b_2228968.png "缓存设置2.png") **2.给网站在首页添加图标** 因主题布局问题,主菜单全部都显示在右侧,和banner图一起稍显拥挤,在标题上添加图标可以给菜单栏留出空间,有部分留白,让网站布局看起来更舒服。增加图标也能更加凸显本网站的特色及主题,吸引用户注意,让用户有浏览网站的兴趣。 ![增加图标](https://images.gitee.com/uploads/images/2020/0716/154115_bce7bb42_2228968.png "增加图标.png") ![增加图标2](https://images.gitee.com/uploads/images/2020/0716/154130_5c14b330_2228968.png "增加图标2.png") ## 加分项 **使用HTTPS** :[https://www.lyzj.club/](https://www.lyzj.club/)