讀到 Spike 大大的「請開啟 JavaScript 以繼續搜尋」這篇文章，想起自己陸陸續續加了一些 JS 的功能，卻一直都沒有做 No-JS 的提示詞或替代方案，真是慚愧，只好趕緊來補一下作業了。

搜尋功能

問題：

  • 有顯示搜尋框，但搜尋功能失效，沒有提示訊息。

調整成：

  • 新增一頁「全文搜尋」，把所有文章的內文（文字）放在同一頁，直接用「CTRL + F」找關鍵字，點標題就能連結到原文。

留言功能

問題：

  • 有留言輸入框，但是點擊送出後訊息會直接消失，白忙一場。（超級糟糕）
  • 無法顯示留言，會顯示「載入留言中...」，永遠卡住。

調整成：

  • 新增支援原生表單留言，送出後會跳到新頁面，提示留言成功／失敗。
  • 新增一頁「留言列表」，沒開 JS 的使用者可以直接過去看到最新內容。
  • 補上無障礙功能的提示詞。

其實這個修改也會有點擔心濫用的問題，原本 API 網址是藏在 JS 檔案裡，爬蟲要自己解析才拿得到。

但是現在補上純表單的方式感覺更容易會被爬蟲抓到，可能以後真的遇到了再說吧，反正再怎麼樣也有審核功能先頂著，之後要換新的 API 網址也不是太麻煩。

其實中間還有修一個大問題，就是萬一留言失敗的時候，頁面上也會顯示成功......如果你曾經有留言過，卻遲遲沒有出現在留言簿上面的話，非常抱歉 QQ

顯示 Email

關掉 JS 之後，我才發現原來 Cloudflare 會自動幫我把 Email 替換成「[email protected]」，這是防垃圾信的功能，靠 JS 還原真實信箱。

這個可以手動關掉，但我這邊選擇留著，並且加上一行提示文字：「contact [at] trashposts [dot] com」。

Bonus

現在多了伺服器渲染的留言列表，搜尋引擎跟存檔機器人就更容易抓到內容了，也算是多了一層備份？

（不用框架就是會有很多沒考慮周全的地方呢）