高效排版技巧:如何優(yōu)雅地在推文中展示100張圖片
掌握這些排版技巧,讓你的推文在視覺上脫穎而出!本文介紹多種布局和圖片展示方法,包括布局+圖片、滑動布局+圖片和svg輪播組件+圖片,幫助你在推文中高效展示大量圖片,提升用戶體驗。適合新媒體運營者和設計師閱讀,讓內容更加吸引人。
朋友們大家早上好啊。
最近有朋友問三兒:領導想要在推文中放很多很多圖,應該怎么排版。
如果只是將圖片簡單堆砌在文章后面,文章會顯得冗長,排版單一也不好看。
這個時候我們可以使用布局或圖片相關的svg組件。
一張一張放圖片,內容展示少,用戶讀取的信息也少,而布局可以靈活排列,可一行兩列、三列、四列、甚至是五列效果如下??
# 如何添加布局
在編輯器頁面樣式展示區(qū)中的上方找到【布局】??【基礎布局】,根據各自的需求,選擇一行x列的布局選項。
選擇好布局后,在布局框中添加圖片即可。
但如果我們就這樣簡單放置圖片肯定是不行的,三兒給圖片加個背景,問題就會立馬顯露出來。
大家看到了吧,放置圖片后邊框內還有多余的空白,圖片與圖片之間緊密相連不夠好看。
# 如何解決
給布局添加邊框,設置邊距、給插入圖片設置【無縫】消除多余的空白。
*注:【邊框】樣式中默認是【無邊框】所以需要我們手動選擇相應的邊框樣式;
【邊距】分為【內邊距】和【外邊距】邊距可以靈活設置【上下左右】
設置好后就能得到如下效果??。
【布局+圖片】的優(yōu)劣
優(yōu):展示較多圖片,操作簡單
劣:展示圖片數量有限,一旦一列x圖,這個x的內容超多3張,圖片大小將顯著變小
推薦指數:☆☆☆
適用范圍:2-3圖的展示
若我們想要插入圖片數量不限,尺寸還要足夠的大,我們有辦法實現嗎?當然可以,如下??
右滑查看更多海報
# 如何添加滑動布局
在編輯器頁面樣式展示區(qū)的上方找到【布局】??【滑動布局】
選中【滑動布局】點擊【編輯】進入滑動布局編輯頁面,根據需求可設置【豎向】或【橫向】滑動。
點擊【滑動布局】進入編輯頁面,插入一行單列布局,上傳圖片,設置布局格式,點擊【完成】即可。
*注:格式設置方式與【布局+圖片】相同,都需要注意清楚去除圖片縫隙,以及設置圖片邊框、邊距
【滑動布局+圖片】的優(yōu)劣
優(yōu):圖片無數量限制,展示圖片尺寸大、信息多
劣:展示形式單一,不夠新穎讀者容易審美疲勞
推薦指數:☆☆☆☆
適用范圍:大于3張圖片的展示
想要讓人眼前一亮又要插入多張圖片,那么svg輪播組件一定不可錯過,效果如下??
svg組件 頂圖固定底圖橫向滾動播放 ID:224
svg組件 橫向圖片停頓式放大輪播 ID:253
svg組件 抽拉式多圖左右自動輪播 ID:219
svg組件 橫向停頓式圖片輪播 ID:166
svg組件 多圖彈動輪播(橫向/帶特效) ID:94
# 如何使用輪播svg組件
通過135編輯器頁面進入svg編輯器頁面,搜索關鍵詞【輪播】便可得到輪播相關的svg組件,根據每個組件具體要求上傳輪播素材。
*注意:帶有svg效果的文章不可以直接【復制】【粘貼】到微信公眾號后臺,會導致效果無法實現。
正確操作是微信公眾號授權給135編輯器后,使用【保存同步】到微信后臺,這樣可以確保svg效果完美呈現。
【輪播svg組件】的優(yōu)劣
優(yōu):圖片展示效果新穎、展示圖片數量多、可玩性高、代碼0基礎也能輕松上手
劣:對圖片有一定的要求如大小、圖片格式、數量(有些效果只能雙數圖片)
推薦指數:☆☆☆☆☆
適用范圍:創(chuàng)意圖片展示、多圖展示

以上就是今天的全部內容啦
跟著三兒學更多有趣好玩的
排版技巧
大家還有什么
想看想學的
記得在評論區(qū)留言
三兒都會看到哦
我是愛你們的三兒~
·END·
文章排版由135編輯器提供技術支持
■ ■ ■ ■
立即登錄













