Case 15 | WSJ.com

原網站WSJ store:https://store.wsj.com/shop/apac/wsjssas21/?trackingCode=aaqwghul&cid=WSJ_RD_ALL_ACQ_NA

很清爽的排版,圖片和文字內容都不多。不過因為是WSJ的Subscribe界面,主要功能也是專注於用戶訂閱WSJ,所以這個密度的內容是比較ok的

清爽的綠色條紋圖片視覺上看著舒適。黑色和灰色的且有字種區別的文字內容比較清晰,紫紅色(#9C2C6F)作為CTA text color穩重也清晰

Imitate process:

  1. 最上方的“THE WALL STREAT JOURNAL"是圖片,直接右點鼠標copy image即可
  2. 綠色的背景圖片同理可得

字體細節可以通過inspect得到,建議各位新手設計師們可以稍微了解CSS,對於更好的理解設計的代碼實現以及inspect好的設計網站時有很大作用

full imitate design

🍺思考:

  1. Subscribe頁面圖片和文字內容盡可能簡要,除了黑灰色的字體顏色,頁面主要顏色不超過2個
  2. 近來很多網站都用灰色做網頁背景,這樣白色可以用於box上