前阵子我那破站又挂了，心里那叫一个慌。折腾了一星期，最后决定把首页那个"website under construction"的页面重新弄弄。很多人觉得弄个静态页面很简单，随便找个代码粘上去就行，但真干起来才发现，细节全是坑。特别是想要那种高级感又不想花钱买模板的朋友，得自己抠细节。
我现在的思路是搞个"网站正在建设中 蓝色 主题"风格的页面。为啥选蓝色？因为蓝得稳，看着不刺眼，跟咱们这种搞技术、搞内容的调性也搭。之前我试过搞什么黑白极简，结果用户打开一看，以为服务器宕机了，全是投诉，尴尬不？蓝色不一样，它有那种"我在努力，别急"的信号感。
先说硬件准备。你别指望网上随便down个zip包就能直接用。那出来的页面要么代码乱成一锅粥，要么加载慢得怀疑人生。我这次是自己从0写起。用VS Code打开，新建个html文件。别用那些带插件的编辑器，纯手工最踏实。
第一笔要画背景。我用了#005b96这个蓝，不是那种荧光蓝，也不是那种发灰的深蓝，就是刚洗过的牛仔裤那种质感。CSS里写background-color: #005b96; 注意，别直接写颜色单词，写hex码，稳定。然后上面放个大大的loading动画，别用gif，用css3动画，省流量，还丝滑。我在上面加了一个旋转的齿轮，代表"建设中"，很直观。
这时候有人问了："那标题写啥？" 别写什么"We are coming soon"，太老土。我就写中文："网站正在建设中，请稍候"。加上小字说明："为了给您更好的体验，我们正在升级服务器和排版"。这样用户心里有底，知道不是站长跑路了，而是在干活。这里就要植入一下关键词了，比如页面描述里可以提一句，我们正在打造专属的"网站正在建设中 蓝色 主题"方案，让等待变得不那么枯燥。
接着是倒计时。这个功能看着花哨，其实核心是JS逻辑。我找了个现成的倒计时插件，改了几行代码，让它只倒计时到某个具体日期，而不是无限循环。为啥？因为无限循环显得你好像永远没完工。设个真实点的时间，比如两周后上线正式版。这给用户一种紧迫感，同时也给站长自己压力，不得不赶紧肝完。
还有个细节，联系方式。很多"建设中"页面只有个邮箱，现在谁还写信啊？直接放个二维码，引导加微信群或者关注公众号。我在页面底部加了个微信图标，旁边写着"加群蹲蹲上线通知"。这样能提前积累种子用户。这一步很关键，别让用户走了就再也找不到了。
在这个过程中，我遇到了个bug，就是移动端适配问题。以前写的代码在电脑上看挺美，手机上一看，齿轮跑偏到屏幕外面去了。后来用了媒体查询@media screen and (max-width: 768px) { ... } 强行把齿轮缩小，字体调小。这个过程挺痛苦，改了十几次，头发都掉了一把。但最后看到手机上完美居中，那种成就感，没搞过建站的人不懂。
最后总结一下，搞这个"网站正在建设中 蓝色 主题"不是为了好看，是为了留住人。别整那些虚头巴脑的，真诚最重要。告诉用户你在干嘛，什么时候好，怎么联系你。这三点到了，就算页面简陋点，大家也能谅解。
如果你也想搞个类似的页面，但懒得自己写代码，或者写了有bug，可以私信我聊聊。我这有好几个现成的模板，虽然是手敲的，但绝对干净，没广告，没后门。别去买那些几百块的模板，里面全是垃圾代码，影响SEO。真心建议，自己动手，丰衣足食。
本文关键词：网站正在建设中 蓝色
