網頁佈局大解放!2017年10大網頁設計趨勢
網頁佈局大解放!2017年10大網頁設計趨勢

網站設計最迷人之處就是不斷變動,技術的演進讓設計師與工程師可以不停實驗創新,帶來更好、更流暢的使用體驗,以及讓人處處驚奇的感官饗宴。今年網頁又會有哪些有趣的風格將主宰我們的螢幕?我們綜合了 WebflowThe Next WebAWWWARDS 等媒體與網站設計公司的預測,整理出網頁設計十大趨勢:

網頁佈局的解放時代

過去幾年,一成不變的網頁佈局(layout)已開始令人疲乏,幸而 Flexbox 以及 CSS Grid!(Chrome、Firefox 預計於今年三月開始支援)等技術的出現,讓版面設計變得更靈活彈性,為設計師、工程師帶來更寬廣的揮灑空間,今年將可看到更多網站打破慣有的「對稱」、「秩序」守則,形形色色,層層疊疊的網頁佈局肯定精彩。不過不變的大原則是,設計的重點是要烘托「內容」,內容才是骨肉、才是人們光臨網站的主因,因此設計的尺度上也需斟酌,天馬行空之餘,別反客為主,奪走內容的風采。

色彩在跳舞

色彩作為表達個性的重要元素,在極簡風蔚為風潮時卻被剝除,不過約莫去年開始,大面積漸層色塊似有強勢回歸,Instagram、Asana、Stripe 都以飽和的漸層重塑品牌視覺主調,今年絢爛的色彩以及流動的漸層更將大行其道;此外,影像以雙色調(duotone)後製,也可能會是今年的潮流。設計師,Sarah Hutto 預言,今年將會是很「funky」的一年,期待強烈的色彩刺激人們的視覺感官。

與前兩年的明亮輕盈、以及上述張揚鮮濃的色彩對比,以相對沉著冷靜的黑色作為主色調也是愈來愈多網站的選擇,只要「輔色」(accent color)搭配得宜,黑色一點也不沉悶,反而能在一片光彩的世界裡脫穎而出。

華麗且實用的動態效果

動態效果在當代的網頁設計領域扮演舉足輕重的角色,今年也絲毫沒有退流行的跡象,反而應用會更廣泛。適當的動態效果,具有突出重點、爭取注意力的用處,今年以 SVG、CSS 創造的動態效果預料將大幅增加,滾動視差(Parallax Scrolling)也愈來愈華麗。但設計師應考量品牌或內容的內涵以及每個動態效果的意義,避免「為動而動」。

創造小驚喜的微互動

「微互動」在網頁上也會愈來愈流行,比如滑鼠移過、點擊各式網頁零件如按鈕,捲軸滑動過程中,適時出現細緻變化,也能夠有提示重點的作用。當然,就跟動態效果一樣,設計師也要拿捏「動」的意義與幅度,才不致畫蛇添足。

不失真、載入快的 SVG 大行其道

比起傳統圖片格式 JPG、PNG、GIF 以像素構成,近年興起的可縮放向量圖片 SVG 在網頁上具有更大優勢,以標記式語言(XML)組合圖形,繪製矩形、圓形、線條都是小事一樁,複雜的填充、形狀也難不倒它,也能輕而易舉製作動態效果,而且不受解析度影響,無論利用什麼螢幕、什麼裝置觀看,都不會破壞圖像品質。SVG 勝出更關鍵的是,不需 HTTP Request,能夠大幅提升網站載入速度。例如這個便是以 SVG 繪製的後背包。

巨大字體精準傳達品牌意涵

首頁以巨大的字體呈現品牌主旨,也將是今年隨處可見的風潮。不過「巨大」並不代表加寬加粗,而是以恰當的字體設計,言簡意賅、精準表達產品精神,取代冗長贅言。而字體與背景或色彩互動、或者在字體上塑造動態效果,也是可以嘗試的作法。

虛擬實境技術結合內容

虛擬實境的話題從前年延燒到今年,科技巨頭對虛擬實境的投資力道絲毫沒有減弱的跡象,特別是Facebook 未來十年將砸下 30 億美金專注虛擬實境的研發。可預見的是技術更臻成熟,也會有愈來愈多媒體或品牌運用虛擬實境科技「說故事」,為人們創造更身歷其境的感受。

為不同使用者量身打造內容

對內容網站而言,有效的把「對的內容」傳遞給「對的使用者」,是這幾年備受重視的能力。不過能夠命中核心的卻不多。因為要達到跟隨情境給予特定內容,需要考慮不同使用者的不同特徵,例如,使用者來訪網站的目的是私人之用還是為了工作?使用者是從哪裡來到網站的?使用者此刻正在做什麼?他們以前在網站上的行為又是什麼?他們使用什麼電子裝置上網?他們現在是登入狀態還是登出?

這些特徵綜合起來增加了複雜性,有些媒體使用「推薦閱讀」機制或如 Facebook 以演算法為個體決定不同訊息流。而如 Fubiz 則用「Creativity Finder」,讓使用者自行設定「身分」、「區域」、「目的」三個條件,過濾最符合要求的內容給予不同使用者。

「登陸頁」重於「首頁」

登陸頁(landing page)與首頁(homepage)的差異在於,前者有個非常明確的目標,例如希望使用者註冊、訂閱電子報、甚至購買,而首頁則如自家門口,提示網站包含哪些內容或功能,作用乃為提綱挈領。前者的重要性日益彰顯,設計上要能高效率地帶領使用者完成「轉換(conversion)」目的,幾乎不會有「導航(navigation)」的成分,因為我們不希望使用者分心到其他地方,最重要、幾乎也是唯一的目的就是推進轉換。

設計的分享

如同程式領域熱烈的分享文化,近幾年有愈來愈多小公司或大企業樂於公開分享內部的設計團隊協作與工作技巧流程,不但有招募人才之效,也充分展現品牌特色、塑造設計領域的互助氛圍,Google DesignFacebookShopifyAirbnb Design 都是可以借鏡的例子。

資料來源: WebflowThe Next WebAWWWARDS

往下滑看下一篇文章
從 CDP 到 Agent,beBit TECH 如何打造懂企業、懂行銷的 AI 代理人?
從 CDP 到 Agent,beBit TECH 如何打造懂企業、懂行銷的 AI 代理人?

當眾多 AI 新創仍將焦點放在追求更強大的模型能力,或尋找下一個成功案例時,beBit TECH 已開始思考另一個層次的問題:如何打造一家能夠持續成長、且具備規模化複製能力的企業級 AI 公司。

近期,beBit TECH 完成與日本 beBit 集團的戰略分拆,不僅確立台灣為全球總部,也同步完成逾億元首輪募資,並預計不久後啟動在台 IPO 規劃。然而,真正值得市場與投資人關注的,不單是分拆或募資本身,而是這一連串布局背後所釋放的訊號—— beBit TECH 已正式跨越產品與市場驗證階段,邁向規模化擴張的新成長階段。

而產品、產業應用及海外市場,就是驅動 beBit TECH 下一階段成長的三大引擎。beBit TECH 創辦人暨執行長陳鼎文表示, 未來將聚焦三大布局,包括持續深化企業級 AI 產品、擴大跨產業應用版圖,以及拓展日本與東南亞等海外市場。首先,在產品面,將持續強化 AgentBit 智慧代理人的能力,結合 OmniSegment CDP 的數據底座與產業 Know-how,打造真正懂企業、懂行銷的 AI Agent。

beBit TECH 創辦人暨執行長陳鼎文
beBit TECH 創辦人暨執行長陳鼎文
圖/ 數位時代

產品布局:從理解數據的大腦,進化為「自主執行」的虛擬員工

陳鼎文進一步說明,近年企業紛紛導入各種 AI 或 AI Agent 應用,希望提升營運效率與員工生產力,但 AI 能否真正創造價值,關鍵並不在模型本身,而是資料品質。若企業的會員資料分散、格式不一致,甚至充滿錯誤,即使導入再先進的 AI 模型,也難以產出可靠的分析與決策。換句話說,企業唯有先建立穩固的數據底座,才能真正發揮代理式 AI 的價值。

正因如此,beBit TECH 選擇將 AgentBit 建立在 OmniSegment CDP 上,形成以 CDP 為數據底座、Agent 為執行核心的新一代企業級 AI 架構。陳鼎文形容,OmniSegment 就像一顆智慧大腦,可以完成跨通路數據整合,並進行資料清理與標準化,而 AgentBit 則是智慧代理人,它可以根據 CDP 大腦所提供的數據做出決策,自主完成受眾分群、內容生成、活動執行、成效監測與優化建議等行銷工作。

更重要的是,OmniSegment 多年來已累積眾多不同產業的實戰經驗與行銷 Know-how,使 AgentBit 不只具備內容生成的能力,更理解不同產業的會員經營模式與行銷邏輯,能依據企業情境挑選最適合的受眾、生成更精準的溝通內容,並持續優化策略。

以中秋節的節慶行銷活動為例,當過去行銷人員必須自行篩選受眾、撰寫文案,再依據活動成效反覆調整策略,整個促銷活動期間都要處於備戰狀態;如今,只要以自然語言輸入活動目標,AgentBit 即可串接 OmniSegment 的數據,自主完成後續工作。當行銷成效未達預期目標時,它還會持續分析結果、修正策略,直到找出轉換率更高的路徑為止,真正讓企業累積的數據,轉化為持續創造營收的智慧資產。

讓數據自己跑出營收!AgentBit 結合 CDP 乾淨數據與實戰 Know-how,只需輸入指令即
讓數據自己跑出營收!AgentBit 結合 CDP 乾淨數據與實戰 Know-how,只需輸入指令即可全自動執行行銷並自主優化成效,打造不斷線的 AI 營收引擎。
圖/ beBit TECH

市場布局:以電商護城河,打造 OMO 與金融雙成長引擎

其次,在產業應用面,beBit TECH 將持續擴大在實體零售、生活服務與金融業的市場布局。「電商是 beBit TECH 的核心基本盤,而實體零售與金融業則是我們下一波的成長引擎。」陳鼎文說。

beBit TECH 成軍初期聚焦於品牌電商,透過客戶數據平台 OmniSegment CDP 協助客戶整合並應用手中的第一方數據,提升會員價值與營收。至今,beBit TECH 已累積上百家品牌電商客戶,並在不同產業情境與應用需求中,持續驗證及優化 OmniSegment CDP 的產品能力。這些豐富的導入經驗,讓 beBit TECH 更深入掌握企業在數據應用上的實際痛點,進而推動產品與 AI 模型持續迭代成熟, 築起一條競業難以跨越的數據護城河。

有了電商戰場的成功經驗,beBit TECH 開始將目光投向線下與實體場域,運用 OmniSegment CDP 協助零售品牌打通線上與線下的會員數據,真正做到跨通路的數據即時整合,讓 OMO 經營不再只是口號。

過去一年,beBit TECH 更成功將觸角延伸至同樣擁有龐大數據的金融業,包括國際保險集團及指標金控,皆已導入 OmniSegment CDP,由系統依據客戶在不同通路的行為,即時判定其意圖並推薦最合適的金融產品。這意味著金融業也能運用電商「千人千面、即時觸及」的行銷模式,一改過去亂槍打鳥、只能照著名單一一撥電話的傳統做法。

「金融業的 AI 個人化行銷現在才剛開始,beBit TECH 能與多家指標性金融客戶合作,代表我們的數據安全和隱私合規性,已經通過了市場上最嚴格的標準,這對於未來跨足其他產業有非常大的幫助。」陳鼎文強調。

海外布局:立足台灣,加速拓展日本與東南亞市場

第三,在海外發展上,則是加速拓展日本與東南亞市場。陳鼎文表示,相較於多數台灣新創進軍日本市場,往往需要一、兩年才能站穩腳步,beBit TECH 憑藉與日本 beBit 集團的緊密合作,已經成功「逆向」打回日本市場,短短兩年多便累積超過 30 家大型企業客戶,涵蓋航空、餐飲集團等不同產業,未來日本仍將是 beBit TECH 拓展海外營收的核心關鍵。

除了日本之外,beBit TECH 也將東南亞視為下一階段的戰略要地。一方面,看好當地人口結構年輕與數位應用快速成長所帶來的商機;另一方面,隨著全球 AI 人才競爭白熱化,東南亞更是重要的人才庫,有助於 beBit TECH 持續推動產品全球化與技術迭代。

「我們希望將 beBit TECH 打造為『亞太區企業級 AI 的領導品牌』。」陳鼎文感性表示,這也是團隊確立將全球總部設在台灣的初衷。未來,beBit TECH 將持續以台灣為核心,向外輻射至日本、東南亞、甚至更廣泛的國際市場,讓世界看見來自台灣的 AI 技術實力與商業價值。

從台灣品牌電商起家,一路跨足實體、金融、日本與東南亞市場,beBit TECH 想做的不只是一套好用的 AI 工具,而是一個能讓企業把數據轉化為營收的企業級 AI 平台。當全球 AI 競爭開始從模型能力,轉向商業化與規模化,這家台灣新創正用清晰的策略布局,寫下屬於自己的下一個成長故事。

登入數位時代會員

開啟專屬自己的主題內容,

每日推播重點文章

閱讀會員專屬文章

請先登入數位時代會員

看更多獨享內容

請先登入數位時代會員

開啟收藏文章功能,

請先登入數位時代會員

開啟訂閱文章分類功能,

請先登入數位時代會員

我還不是會員, 註冊去!
追蹤我們
台達電全解讀
© 2026 Business Next Media Corp. All Rights Reserved. 本網站內容未經允許,不得轉載。
106 台北市大安區光復南路102號9樓