2025-07-06 07:51 AM 0 988
幾天前我展示了兩款免 JavaScript 的刪除確認設計,讀者 Dante Lee 主張勾 Checkbox 並不算好設計,它一樣需要額外移動滑鼠加點選,還會讓人想起被迫違背自由意志勾選「我同意」的不愉快回憶 (我他X的根本不想同意啊)。 想想,這說法確實有幾分道理,於是我厚著臉皮交流,索取到一個...
2025-07-02 10:20 PM 0 1,329
為了防止使用操作網頁時誤刪或不小心觸發一些不可逆動作,系統規格通常要求刪除前請使用者再次確認。 傳統設計會偏向彈出 Modal 視窗,強迫使用者在【確認/刪除】或【取消】間擇一執行: 圖片來源 我不是很愛這種設計方式,理由使用者在點完【刪除】圖示/按鈕後,畫面會轉換成 Modal 對話框在中央的顯...
2025-05-26 08:55 PM 1 3,762
有在管理對外網站的朋友,應該都有發現網站憑證的有效期限愈來愈短! 早年申請一次 SSL/TLS 憑證可以用兩年,不知何時起變成只能用一年,每年都要重新申請更新。 那麼,再告訴大家一個他 X 的好消息,CA/Browser Forum (CA/B 論壇) 於上個月做出最新決議,SSL/TLS 憑證最長...
2025-05-13 08:31 PM 0 1,836
被問到如何在單一 HTML 網頁做出多頁切換效果。 情境是一個只有兩三頁的超迷你網站,一切從簡,想改用單一 HTML 檔打死,但要有點選導覽頁籤切換不同頁面的效果,還必須能用瀏覽器的上一頁下一頁鈕跳轉。 這個需求技術難度不高,只用上古時代的 HTML/JavaScript 規格也能搞定。(查了一下,...
2025-02-22 09:45 AM 0 1,060
最近有個需求:手上有現成圖片(例如:投影片截圖、廣告 DM) 想快速轉成網頁,圖片上的特定項目希望加上超連結,點下去要能開啟指定網頁。 把整張圖當設計稿切版拆圖塊轉成 HTML 網頁當然是最完美的做法,但如果求快求簡單,則古老的 HTML <map> 元素 是個解法,在圖檔上方宣告幾何形...
2025-01-22 10:40 PM 0 1,810
YouTube 支援在網頁內嵌 IFrame,讓你可在自家網頁直接播放 YouTube 影片,我的部落格文章有時也會用。 最近幫忙查了一起案例,某些 YouTube 影片無法在某些網頁內嵌播放,必須單獨在 YouTube 開啟才能看。只有某些影片不能播,而且相同的網頁可能放在 A 網站 OK,放在...
2024-06-07 11:31 PM 0 5,244
使用者反映:有張電腦上看起來色彩正常的 JPG 檔,上傳到網站後,照片偏亮且鮮豔到浮誇,詢問程式是否在上傳過程修圖? 聽完心想,我寫的檔案上傳向來都是Garbage In Garbage Out原封不動搬資料,何德何能還會修圖(連該用什麼演算法我都沒概念),莫非 ChatGPT 已開始要接管地球了?...
2024-04-21 09:59 PM 2 2,064
朋友分享了一篇網路文章,題材我有興趣,但讀來帶有痛苦感,像是馬拉松最後階段,得靠意志力才能撐下去不棄賽,但我明明是在讀第一段呀。 做了民調,原來不只我有這種感覺。嚴格來說,文章用字還算淺白通順,到底什麼原因讓它散發著「別讀了,快放棄吧,這些文字不是你能駕御的」的暗示? (以上非原文章,是用廢文產生...
2024-01-10 10:07 PM 5 3,100
再來聊聊「依據背景色切換黑字或白字,確保文字明顯容易閱讀」這檔事。 過去我都用 Github Copilot 教我的186 魔術數字公式:complementary = (r * 0.299 + g * 0.587 + b * 0.114) > 186 ? '#000000' : '#ffff...
2024-01-03 10:28 PM 5 2,603
寫網頁介面時,有時我會想用多種顏色表示不同類別資料,此時如何挑選一組彼此差異明顯的顏色,差異大到即使同框出現也不致混淆,這批顏色該如何搭配組合是個學問。 面對這個常見的小需求,我 Google 到不錯的建議 - List of 20 Simple, Distinct Colors,為了繪製捷運路線圖...
2023-10-08 03:54 PM 2 4,162
上回提過 Azure 有提供 OpenAI Service,與 OpenAI API 相比,具有 SLA 保證、多區域備援、AD 整合、虛擬網路整合、更符合企業規範... 等特色。而對個人用戶,若手上有 Azure 免費額度(例如:Visual Studio Enterprise 訂閱 150 US...
2022-12-26 09:32 PM 0 10,871
同事報案,某表單有個連絡電話欄位,Edge/Chrome 的自動填表功能會提示上回填的電話號碼,但使用者選擇帶入上次填寫電話,瀏覽器卻把另一個代理人欄位連帶改成上次填寫的姓名,使用者沒注意到,上傳了錯誤的內容。 我知道瀏覽器有自動填表的功能,最常遇到是在填馬拉松報名資料時但沒細究過,這次看來得花點時...
2022-07-22 10:10 PM 0 5,128
IE 時代即將劃上句點,客戶端近期已開始改用 Edge,甚至連 PDF 也改為預設用 Edge 開啟 (註:依之前的經驗,某些 PDF 文件用 Edge/Chrome 開啟會有字型問題,有時仍得依賴 Acrobat Reader)。 IE Only 網頁經過拉皮翻修,多能順利在 Edge 檢視,但過...
2022-06-03 10:04 AM 0 10,361
FB 是當今網路行銷不可或缺的社群媒體。大家應該有注意到,在 FB 分享網頁有些網站 URL 會產生包含圖片、標題及摘要說明的精美預覽區塊[1],有些則只有單調的網站名稱及標題[2]: 二者的差別在於網頁有沒有加入 Open Graph Tag (「開放社交關係圖」標籤),就是網頁 HTML 要加...
2022-05-17 10:40 PM 2 5,840
免費字型檔圖示 Font-Awesome 是我的主力圖示來源,至今已到 6.1.1 版,授權方案也有些改變。前幾天 Google Material 圖示一文提到 Font-Awesome 6 分為 Free、Pro、Pro Max 三種方案,當時的認知是只有 Free 可免費用於個人或中低量用途(每...
2022-05-13 10:06 PM 2 3,753
前陣子驚喜發現 Google 有一套 Material 風格字型檔案圖示,數量超過 2500 個,開放原始碼,採 Apach V2 授權可免費用於個人及商業用途,還有友善的查詢介面: 使用方法跟 Font Awesome 一樣簡單,用 LINK 參照 CSS,在 HTML 插入 <span ...