2021 第 49 週網站開發好連結分享—容錯度高的 CSS 樣式技、輸入框的尺寸自動適應 JS 庫、人像隨機生成器

今個星期繼續產出四篇教學文。我發現真的把所學所得都分享出來，然後就可以幫助別人， 而且自己解釋一次也可以更了解有沒有未弄明白的地方，互相增長見聞，教學相長。一些就算我們很明顯之道的事情，說出來還是可以有人受惠。例如 .new 域名的使用，貼文後我同事馬上打電話給我說這招式非常實用，另外我把其中一個我在 Python 班的 API 範例分享，也能帶出不同的使用情景。

看來我要再多分享一下我的 Python 班例子，例如搜尋澳門日報標題尋找關鍵字、列出今日 AAStocks 頭版新聞、找出距離下次公眾假多少日、使用 Pandas 讀取網站表格數據及處理維基百科表格數據等。又或者開個系列寫 iPhone 捷徑應用例子分享。

→ CSS 樣式 / 容錯度高的 CSS 樣式技巧
https://ishadeed.com/article/defensive-css/

很實用的 20 個 CSS 技巧，幫助構建容錯度高的樣式，例如白色字配搭圖片背景，萬一圖片不能載入，預設白色背景底就會使文字也不可讀。

→ 工具 / 輸入框的尺寸自動適應
https://stretchy.verou.me/

Lea Verou 大神的又一工具，輸入框的尺寸自動適應工具。她之前已推出不少實用工具，例如語法上色 (Syntax Highlighter) 的 Prism、無障礙顏色對比的 Contrast Ratio、及 CSS3 背景圖案庫等。

→ 工具 / 人像隨機生成器
https://loremfaces.com/

就像 Lorem Ipsum 的 佔位文字生成器般，但這是生成一個虛構的人像。

→ 工具 / rclone — 專為雲端儲存服務而設的檔案複製 rsync
https://github.com/rclone/rclone

像 rsync 般使用的雲端儲存服務複製工具

→ 教學 / 製作界面動畫教學
https://tilda.education/en/web-animation-course

一個詳細的界面動畫教學。可惜不是 CSS 導向，而是設計軟件導向。但可以掌握有哪些動畫技巧，再自行應用於網站項目上。

→ 工作 / 七年遙距工作的感想
https://tylercipriani.com/blog/2021/12/01/lessons-from-seven-years-of-remote-work/

Writing is thinking, and you’ll find your thinking is sharper if you start with pen-and-paper first.

贊同。寫作就是思考。而且寫作從紙筆開始。

→ 表情符號 / Emoji 表情符號的現實大小
https://javier.xyz/emoji-to-scale/

很有趣的比較，將各種表情符號按現實高度排列，

→ 表情符號 / 大家最常用的表情符號統計
https://home.unicode.org/emoji/emoji-frequency/

2019: 😂 ❤️ 😍 🤣 😊 🙏 💕 😭 😘 👍
2021: 😂 ❤️ 🤣 👍 😭 🙏 😘 🥰 😍 😊

—2021 week 49, 麥誠。

我是麥誠軒（Makzan)，除了正職外，平常我要麼辦本地賽與辦世界賽，要麼任教編程與網站開發的在職培訓。現正轉型將面授培訓內容寫成電子書、網上教材等，至今撰寫了 7 本書， 2 個視頻教學課程。

如果我的文章有價值，請訂閱贊助我持續創作分享。

訂閱贊助：https://liker.land/thomasmak/civic