雄安(ān)響應式設計無疑是當前網頁設計領域當中，不可(kě)忽略的必要組成部分(fēn)。而響應式網頁中的圖片顯示又是老生常談的問題，許多(duō)争論集中在響應式網站的圖片應當怎麽展示。繼續延伸開來，那麽網站建設中的圖片庫應當如何設計呢(ne)?

　　相比于單個圖片，圖庫的展示無疑更加複雜，牽涉到的變量更多(duō)，所以實現起來也更加麻煩費神。接下來，我們來看看如果要設計響應式的圖片庫，有哪些值得注意的基本規則和技(jì )巧。

　　1、輪播幻燈片:盡量隐藏導航

　　在桌面端上導航的存在可(kě)能(néng)沒什麽，但是在移動端上查看的時候，導航還是盡量隐藏起來，需要的時候再顯現。而諸如左右切換的按鈕和标明浏覽位置的圓 點，好是在光标移動上去之後再顯示，這樣的設計不僅可(kě)以避免用(yòng)戶分(fēn)心，而且能(néng)避免内容和導航元素之間的沖突，降低整體(tǐ)設計的混亂感。

　　2、避免使用(yòng)大量肖像類圖片

　　如果你設計的圖片庫是類似網格布局的話，你可(kě)能(néng)會盡量挑選和橫向的圖片，或者方形的圖像。這樣的設計在兼容桌面端設計的同時，還可(kě)以讓用(yòng)戶在小(xiǎo)屏幕 上更好地查看。人像類的圖片在手機上适合縱向屏幕上浏覽，如果橫過來的話，圖片會顯得特别小(xiǎo)，浏覽會相當不方便。橫向是佳的，如果不行的話，使用(yòng)方形的 圖片會是很(hěn)好的兼容性方案。一個響應式的圖片庫的設計需要考慮多(duō)種因素，請務(wù)必牢記用(yòng)戶的不同浏覽場景。

　　3、在移動端上支持手勢操作(zuò)

　　觸摸屏上使用(yòng)收拾操作(zuò)幾乎是用(yòng)戶的本能(néng)了。所以，在設計響應式圖片庫的時候，滑動操作(zuò)等手勢操作(zuò)賦予用(yòng)戶更多(duō)的權力，讓體(tǐ)驗更加逼真。在移動設備上使用(yòng)箭頭導航太過于乏味、老舊，手勢交互更加自然也更符合真實的交互體(tǐ)驗。

　　4、在移動端上禁用(yòng)lightbox效果

　　Lightbox效果大概是桌面端網頁上常見的圖片浏覽模式，圖片以彈出框的形式呈現出來，能(néng)随着屏幕尺寸和鼠标操作(zuò)來縮放。在産品展示的頁面當 中，這種圖片浏覽模式的使用(yòng)尤其廣泛和頻繁，但是在移動端上的時候，它可(kě)能(néng)會引起大量的用(yòng)戶體(tǐ)驗上的問題:蓋住其他(tā)的交互控件、無法退出、尺寸不合适等等。