關(guān)于新版的B站網(wǎng)頁(yè)布局的改進(jìn)方案
B站的頁(yè)面布局又改版啦,讓我們剛剛都發(fā)生了哪些變化吧


對(duì)比了下新舊版本的主頁(yè)和播放頁(yè),改動(dòng)如下:
主頁(yè)
1.凸顯搜索欄顯示,并改為白底
2.右側(cè)文字icon化
3.對(duì)分類(lèi)導(dǎo)航做簡(jiǎn)化,去掉"首頁(yè)"圖標(biāo)、新增視頻量和專(zhuān)欄、活動(dòng)、小黑屋等的導(dǎo)航,并統(tǒng)一樣式(淺灰色底板)
4.推薦欄變高(約為原來(lái)的兩倍)
5.視頻卡片仿造油管,增加封面圖片圓角大小,增加up主頭像,去掉底部up主昵稱(chēng)左邊的標(biāo)志
6.右側(cè)分區(qū)導(dǎo)航小條合并成一個(gè)按鈕,點(diǎn)擊按鈕顯示抽屜式分區(qū)導(dǎo)航
7.兩側(cè)留白變小,畫(huà)面占比邊寬
播放頁(yè)
1.字號(hào)更大
2.更多圖標(biāo)標(biāo)志
3.禁止轉(zhuǎn)載提示改到標(biāo)題欄下
4.up主介紹隱藏
5.視頻tag 保留一行,其余折疊
6.默認(rèn)頁(yè)面大小下比舊版多顯示一欄評(píng)論數(shù)量
7.兩側(cè)留白變小,畫(huà)面占比邊寬



以下是我對(duì)新版的布局提出的建議:
主頁(yè)
1.全白的搜索框出現(xiàn)在一整塊的banner上很突兀,換成換成低透明度的黑框,邊緣白色描邊會(huì)好一點(diǎn)。
2.頻道分區(qū)導(dǎo)航改成圖標(biāo)在左,文字在右的樣式,把動(dòng)態(tài)、熱門(mén)、頻道和右側(cè)分區(qū)導(dǎo)航欄的樣式也同步一下

3.新版推薦欄布局不協(xié)調(diào),推薦欄改回原版或把版頭里的內(nèi)容豎向多頁(yè)折疊、向下向上折疊也可以

4.新版的視頻卡片下新增了up主頭像,有點(diǎn)打破視覺(jué)平衡,建議放進(jìn)視頻封面右上角,視頻發(fā)布時(shí)間和up主昵稱(chēng)也可以放進(jìn)視頻封面頂端
5.優(yōu)化視頻卡片之間的比例間距,增加兩側(cè)留白
播放頁(yè)
1.改回原版字號(hào)(右邊的視頻推薦字號(hào)大的都沒(méi)有留白了)
2.顯示up主介紹
3.增加兩側(cè)留白