2023-02-09 分類: 網(wǎng)站建設(shè)
百度智能小程序是百度在2018年新開發(fā)的重點(diǎn)項(xiàng)目,在2019年百度將投入更多到百度智能小程序里,有望一舉超越微信小程序和支付寶小程序。如果等百度智能小程序火爆全國再去做肯定是晚了,所以從現(xiàn)在開始就要開始動手,勇敢吃螃蟹的人才能獲得好的紅利!
在以前的文章里,我們講過百度智能小程序是什么、怎樣做好百度智能小程序體驗(yàn)設(shè)計、百度智能小程序接入自然搜索的步驟,今天我們就來講講百度智能小程序應(yīng)該如何布局。
頁面布局
基礎(chǔ)布局
iPhone 6手機(jī)作為主流機(jī)型,他的尺寸為寬度750px,我們可以以iPhone 6手機(jī)為標(biāo)準(zhǔn)模板輸出視覺方案。
在布局百度智能小程序的信息時,必須要為信息和內(nèi)容區(qū)域留出至少左右邊距離34px(17pt),以獲得更美觀的界面和可讀性。
正確案例
內(nèi)容頁面的左右邊距應(yīng)留出至少34px(17pt)的距離。
錯誤案例
邊距過寬,不適合閱讀和美觀度。
錯誤案例
邊距過窄,不適合閱讀和美觀度。
透明框架布局適配
1. 小程序框架
開發(fā)者如果要使用百度智能小程序的原生的頂部導(dǎo)航欄,只需要在頂部導(dǎo)航欄下方進(jìn)行布局頁面即可,不用其他的操作。
百度App v11.1及以上版本的百度智能小程序,還可以自定義頂部的導(dǎo)航欄,使頂部導(dǎo)航欄只保留框架控制的功能區(qū),這種功能也叫做透明框架,后文也會提到。
圖1是默認(rèn)框架。
圖2是透明框架。
在透明框架的情況下,頁面布局從屏幕頂部開始。
百度智能小程序的透明框架的安全區(qū) = 屏幕 -(系統(tǒng)狀態(tài)欄(1) + 框架控制功能區(qū)(2)),大家根據(jù)圖片看即可。
正確案例
頁面的元素以及功能都在安全區(qū)內(nèi)展現(xiàn)。
錯誤案例
頁面元素和功能超出安全區(qū),用戶看著會感覺少了一部分或者很別扭。
2. 小游戲框架
由于小游戲框架沒有系統(tǒng)狀態(tài)欄,布局時只需要考慮避讓框架控制功能區(qū)。
左圖:豎屏小游戲框架的安全區(qū) = 屏幕 - 框架控制功能區(qū)(1);
右圖:橫屏小游戲框架的安全區(qū) = 屏幕 - 框架控制功能區(qū)(1)。
正確案例
頁面元素全都在安全區(qū)內(nèi)展現(xiàn)。
錯誤案例
頁面元素超出安全區(qū),用戶在使用的時候會少看到很多東西,影響用戶體驗(yàn)。
本篇是系列文章,請點(diǎn)擊查看接下來的文章:
百度智能小程序應(yīng)該如何布局更美觀?小程序布局方法(2)
百度智能小程序應(yīng)該如何布局更美觀?小程序布局方法(3)
百度智能小程序應(yīng)該如何布局更美觀?小程序布局方法(4)
百度智能小程序應(yīng)該如何布局更美觀?小程序布局方法(5)
網(wǎng)站名稱:百度智能小程序應(yīng)該如何布局更美觀?小程序布局方法(1)
文章轉(zhuǎn)載:http://m.rwnh.cn/news28/236278.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供做網(wǎng)站、靜態(tài)網(wǎng)站、網(wǎng)站策劃、品牌網(wǎng)站制作、微信公眾號、搜索引擎優(yōu)化
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)
猜你還喜歡下面的內(nèi)容