本文講的是響應(yīng)式設(shè)計(jì)的真正挑戰(zhàn)：RSS，

web 世界豐富多彩，去看看服務(wù)器日志吧。那里充斥著爬蟲(chóng)機(jī)器人以及運(yùn)行著各種操作系統(tǒng)，有著各種屏幕尺寸的移動(dòng)設(shè)備和用戶(hù)代理。你很容易會(huì)因?yàn)樽约菏褂?web 的習(xí)慣而忽略了大多數(shù)普通用戶(hù)的體驗(yàn)。

比如我發(fā)現(xiàn)自己的網(wǎng)站有部分流量來(lái)自訂閱了 Atom Feed 的閱讀器。出于好奇，我決定看看用 Atom 閱讀器看我的文章是什么樣子。結(jié)果并不怎么好看。feed 的問(wèn)題揭示了更深層次的可用性問(wèn)題，而其解決方案還可以應(yīng)用到更通用的 web 設(shè)計(jì)上。

在繼續(xù)讀下去之前你可能想要親自試一試。如果你維護(hù)著 RSS 或 Atom Feed 服務(wù)，可以放到各種閱讀器中看看是什么樣子的。而訪問(wèn)過(guò)我網(wǎng)站的閱讀器有：Newsbeuter, Newsflow, Sismics reader, Tiny Tiny RSS, Feedly, Feedbin, Akregator, Feed Wrangler, NewsBlur, FeedHQ, Feed Spot, Livedoor reader, Miniflux, Liferea, Readerrr 以及 Mozilla reader。

你會(huì)先注意到這些閱讀器會(huì)刪除 JavaScript 和 CSS 但是保留了圖片。有時(shí)候它們會(huì)使用自定義的 CSS，甚至干脆不用 CSS。通過(guò)控制 CSS 閱讀器軟件可以提供流式排版以及各種可選的主題，比如深夜模式。你可能很久沒(méi)有留意自己網(wǎng)站不用 CSS 時(shí)的樣子，看過(guò)之后可能就覺(jué)得有必要去重新練習(xí)一下標(biāo)記語(yǔ)言了。

下面幾個(gè)建議可以讓你的網(wǎng)站對(duì)大家更友好。

• Font-Awesome 在需要平穩(wěn)退化的時(shí)候并沒(méi)有那么出色?？梢赞D(zhuǎn)而使用沒(méi)有 CSS 也能完美縮放的 SVG 圖像。實(shí)際上用img?標(biāo)簽加載 SVG 的時(shí)候可以加上?alt?屬性，可以提供給無(wú)圖形和非可視的用戶(hù)代理。使用內(nèi)聯(lián) (inline) 高度和寬度這樣 SVG 在沒(méi)有 CSS 的情況下也可以保證正確的大小。這里有替換 Font-Awesome 成 SVG 的詳細(xì)說(shuō)明。
• 手動(dòng)為多媒體標(biāo)簽添加臨時(shí)替代方案。比如我的博文中的?<video>?標(biāo)簽在 feed 閱讀器上顯示得非常糟糕。一些閱讀器干脆把它刪掉了！還有些閱讀器把視頻框的尺寸搞得非常巨大卻沒(méi)法播放。在沒(méi)法播放視頻的場(chǎng)景下，最好的解決方案是給出視頻的鏈接，方便使用其他程序下載或播放。所以我會(huì)把視頻文件的鏈接放到?<noscript>?標(biāo)簽里。我還刪掉了標(biāo)記語(yǔ)言 (HTML) 中的?<video>?標(biāo)簽，轉(zhuǎn)而用 JavaScript 在頁(yè)面加載之后加上這些標(biāo)簽。我沒(méi)法保證這個(gè)元素在沒(méi)有 JavaScript 的場(chǎng)景下的行為。
• 不要在標(biāo)記語(yǔ)言和元數(shù)據(jù)中重復(fù)使用標(biāo)題和其他數(shù)據(jù)。與 HTML 的隨意風(fēng)格不同，feed 格式有指定的地方來(lái)指定文章的作者，摘要和時(shí)間。帶時(shí)間戳的頁(yè)眉頁(yè)腳，標(biāo)題甚至 email 聯(lián)系方式都沒(méi)有必要放到 Atom Feed 中。
• 選擇合適尺寸的光柵圖像。我在一些博文中使用 CSS 壓縮了較大的圖片以達(dá)到更好的展示效果。如果沒(méi)有 CSS 這些圖片就會(huì)非常巨大看上去很不妙（更不用提傳輸速度也會(huì)差一點(diǎn)）。
• 留心 Atom 中?summary?和?content?的區(qū)別。一些靜態(tài)網(wǎng)站生成器（呃，比如?Hakyll）會(huì)把整個(gè)正文都丟到summary（摘要） 里面去。

這次嘗試讓我見(jiàn)識(shí)到了用戶(hù)代理的作用。全功能瀏覽器和基于文本的瀏覽器或者閱讀器之間并沒(méi)有本質(zhì)的區(qū)別。用戶(hù)在瀏覽網(wǎng)站時(shí)未必會(huì)全部啟用 JavaScript，CSS 以及圖像，而一些簡(jiǎn)單的調(diào)整就能讓大家更容易欣賞你的網(wǎng)站。

原文發(fā)布時(shí)間為：2016年09月19日
本文來(lái)自云棲社區(qū)合作伙伴掘金，了解相關(guān)信息可以關(guān)注掘金網(wǎng)站。

總結(jié)

以上是生活随笔為你收集整理的响应式设计的真正挑战：RSS的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。