🚀 Shopify Editions Winter 2024 發表會 | Google SEO Made Easy | 爾文設計觀點

附上全方位 SEO 免費自學指南 – 從新手到專家的學習資源

🎄 Shopify Editions | Winter 2024 影片列表

很少有跟蘋果發表會那般令人期待，Apple 第一，而 Shopify 第二

前往瀏覽

🎄 Google 推出 SEO Made Easy

‍🍔 Google 官方最近推出的 SEO Made Easy 的 YouTube 影片系列，有個很酷的功能，就是不只是以往的中英翻譯字幕而已，還可以直接「中文人聲發音」，顯然是用 AI 打造，可以去玩玩看。點擊影片中下方的「齒輪圖示」設定 > 音軌 > 中文

🍟 另外附上 Google 搜尋新手教學 (繁體中文)，本來就是中文發音

🍺 以上都滿適合 SEO 新手初入門中午配飯邊吃邊輕鬆看看的影片系列

全方位 SEO 免費自學指南

爾文設計觀點 Design Concept

‍🍔 Web UX 優化案例探討：網頁中，當側邊欄選項過多時，該如何呈現與設計互動？Ahrefs 的排版可以參考看看。

🥃 電腦版網頁：右側邊欄使用 Scroll 的方式包含超出版面的內容，除了將其固定位置作為目錄容易讓人找到標題尋找資訊，並用視覺刻意顯示 Scrollbar 的存在提示使用者可以上下瀏覽。

另外，你有沒有發現此側邊欄還與瀏覽器的 Scrollbar 保持相當的距離？這樣的好處是提升使用體驗，讓使用者在上下瀏覽網頁時比較容易去「選擇」側邊欄內還是整個網頁的畫面，若靠太近，則容易「滑錯」

🥃 手機版網頁：直接將右側欄位整改為常見的方式：右上角的漢堡選單，點擊即可展開查看。但這令人誤以為漢堡選單是整個網站的導覽選單，而非此頁面的內容導覽。

🍟 如果是你，你會如何優化此頁面的排版與使用體驗呢？歡迎隨時分想你的點子

🍟 這邊提供我的想法：對於手機版網頁的導航設計，優化方向會是改用下拉式選單並放置在頁面內容的標題正上方，而非放在最頂端的導覽列的漢堡選單。這樣做的好處是，它較能明確地表示此下拉選單為此頁面的內容導覽，同時還能保留導覽列的空間用於其他功能。

💎 爾文精選文章

Shopify

• Shopify 台灣金流、電子發票、物流與超商取貨解決方案
• 用兩個月打造 Shopify 客製化網站設計
• Shopify 網站設計流程與時間規劃
• 如何客製化 Shopify 網頁設計排版
• PageFly 初入門：快速建立 Shopify 網頁

SEO

• 全方位 SEO 自學指南 – 從新手到專家的學習資源
• Shopify SEO App 推薦：Yoast SEO 實戰教學

WordPress

• WordPress 外掛推薦精選
• WordPress 網站設計流程與時間規劃

Web Design

• 如何製作與優化網頁圖片 SEO？
• 資深網頁設計師常用的 Figma Plugin 推薦
• 爾文網頁設計作品 Shopify x WordPress

Web Server

• Cloudways 主機介紹與實戰筆記｜架設 WordPress 網站

若你有 Shopify 電商網站或 WordPress 品牌形象、部落格設計與建站的需求，可以前往填寫表單預約諮詢。Irvinglab 爾文實驗室是一家深度經驗的網頁設計公司，專注打造 Shopify 和 WordPress 網站以及提供 SEO 優化與內容規劃的服務。若想進一步了解服務內容，可以加入 Irvinglab 爾文實驗室的 Line@ 官方帳號 留下訊息給我們。