2015年1月3日 星期六

預見2015年 10 大網頁設計趨勢

每年網頁設計都有長足的進步,很多令人驚嘆的設計幾乎天天被發表,2015年我想也只會有更厲害的設計,其中也包含了一些2014年被預測的趨勢也許在新的一年繼續被發揚光大,許多趨勢也可能會延續到2016,我們也可能在2015年看到新趨勢的出現!
當許多人都在溫故並且企圖知新,在這個換一本新日曆的時刻,來看看新的一年有甚麼網頁設計趨勢吧!

1.更長的卷軸式網頁

不難發現近年來的網頁設計趨向更長的卷軸設計,當行動裝置越受歡迎,長型卷軸網頁就更普及,取代了連結呈現的網頁,對使用者來說,卷軸網頁讓獲得資訊比起不斷點擊按鈕更加容易。首頁不再是唯一的頁面出現卷軸趨勢,當長卷軸網頁變得更加受歡迎,它的優點也會漸漸擴散到其他頁面,例如:產品頁,以更優雅的方式展示網頁內容。
iPhone 6 頁面為例,不同於Apple首頁,使用長型的捲軸業展示iPhone 6 的特色。此外這個頁面也搭配了一些滑動的動畫,讓瀏覽視覺經驗更加卓越。

2.故事性與互動性

精彩的內容是網站的關鍵,能夠透過網頁設計來表示你的內容絕對更加高招!2015的網頁設計將會更專注在如何設計同時對著使用者講故事。舉個例子,Space Needle 的網站就你在使用網頁的過程,漂亮地講了一個Space Needle 的故事,他正是符合上述長卷軸趨勢精彩範例。

Space Needle也展示了2015年的網頁設計趨勢:互動性。網頁增加互動與動畫更能夠幫助展示內容。互動與動畫被使用在網站設計上,運用得好會給網頁帶來更多特色。再看看 Impossible Bureau 的網站,充滿互動性同時兼具卷軸與滑鼠動作的不同元素(取代了以往的點擊動作)。

3.超大標題單純背景

大圖標題背景已經流行好幾年,常常在最上方出現讓訪客一眼看見,那要怎麼在一堆有超大圖片背景的網頁殺出重圍?反向操作是個不錯的選擇。開始有不少網站開始選擇設計大大的標題搭配單純的背景。我猜這不是因為他們不想跟風,而是想要讓網站的呈現速度加快(第10點會分析),而不用這麼大的圖片。The New Wave Company 的網站把這樣的設計發揮得很好,大大的標題與大中至正的設計迎接訪客,甚至在背景沒讓你看到圖片。這個作法蠻高雅的並且有別於其他用盡圖片背景的網站。
(譯者按:女生愛科技2015年選用的版型也是走這路子的呀!)

4.拿掉無用的設計元素,讓整體更乾淨清爽

有一種設計是把非必要的設計元素通通拿掉,我相信2015年我們會看到更多這樣試圖保持簡單乾淨的網站。趨勢3提到的New Wave Company 網站也是一個這樣的範例,另一個可以參考的是 Rareview Digital Agency 網站,他也沒有大背景圖出來跟你打招呼,這個團隊使用一個乾淨簡單清爽的方式呈現,沒有太多餘的設計、圖片或是一大堆的顏色。

5.固定寬與大中至正版型

近年有很多網頁會把版型寬度設定 100% 來設計,讓整個版面充滿整個瀏覽器,在這風潮成型前,固定寬與大中至正的設計才是主流,風水輪流轉,固定寬度的網站似乎又流行回來,只是這次是更潮的方式呈現,這些網站用固定寬度確保內容集中在中央取代發散兩邊的設計。
Michele Mazzucco 的網站就做得不錯,當瀏覽器寬度超過 1350PX,你會看到內容(還有背景顏色與段落)左右邊都看的見盡頭。這個設計讓整個站的內容更聚焦,並且降低寬滿版設計所帶來的複雜狀況。

6.專業高品質的客製圖像

Stock圖庫仍在設計領域占有一席之地,但如今Stock圖庫關注更專業的的高品質獨特客製與網站目的性的圖片。使用客製圖片來設計而不只是選擇圖庫裡的照片讓你的網站與眾不同,舉 Grain and Mortar 的例子,這個網站你可以看見這個趨勢,在網站開宗明義的表頭就看到特色的圖片,並且直接帶起特色,因為照片上就是一群人在 Grain and Mortar 前面的合影。這個是讓人更加對你公司印象深刻的做法,高品質的專業攝影自己辦公室的照片,而不是去圖庫找一張假的辦公室的照片。

7.仿 APP 飛出滑入選單
響應式網頁(Responsive Web Design)已經大行其道好一陣子了,直到最近,更多設計強調他們在不同裝置看起來都一樣優,無論是桌機、手機還是平版裝置。RWD已經走向在每一種裝置都能夠游刃有餘的境界了。這個改變讓我們開始看到甚麼元素應該怎麼在不同裝置呈現出一個網站。

24 waysRawnet 為例,這兩個也是把這個趨勢呈現,用像是 APP操作方式的選單貫穿整個網站,而不只是因為裝置不同改變。這兩個網站無論是從左邊或右邊滑出垂直選單(而非典型在頁面上方),像是飛出滑入的選單動作是網頁APP與RWD通吃的技術。
(譯者按:女生愛科技的選單也是被藏起來der~)

8.隱藏主選單

像是剛剛談到許多飛出滑入的選單,我期待看到當拜訪更多網站時後看到他們將網站的選單藏起來,隱藏的選單,再訪客需要使用的移動或點擊的時候選單再出現。這個響應式的技術已經開始在各網站出沒,而不只是應用在小螢幕瀏覽狀態。Brain Hoff Design 的新網站就是很好的範例,他使用漢堡 icon 在頁面頂端隱藏了選單直到客倌點擊icon,這個行為模式已經在 web apps出現在手機、行動裝置等被使用數年,甚至許多apps 也是採取這樣的模式。他使用這個方法讓無論寬度多大的瀏覽都能保持畫面乾淨。

9.超大的字型呈現

2014年超大字型已經開始出沒在許多網站中,我也不覺的短期內這個風潮會有甚麼大改變,2015年,網頁表頭的大字只會更大吧!我指得是大到像在地上看到飛機那樣。(哈哈~不是真的這麼大,但你懂的。)
Tiny Giant 的網站用了超大字型呈現在他的網站,這要錯過他想闡述的理念都很難,大的字型可能會在 2015年大行其道,提升與讀者溝通的效力,因為這是馬上抓到我們眼球的方式。Tiny Giant的網站在這方面真的發揮淋漓盡致。
(譯者按:女生愛科技也是使用這個樣的設計喔!整個挑到一個很 in 的版型XD)

10.呈現與速度
有些設計趨勢是為了讓下載速度更快,減少頻寬,本文提到許多趨勢其本意也是為了滿足減少網頁的承載,在各種裝置與較慢的網路都能快速呈現的需求,許多網頁設計或網站開發人員都非常注意網站的重量與使用者如何與網站互動。RWD讓這些問題得以被關照,在龜速的網路與行動裝置讓設計者與開發者花更多心血在減少網站與資料重量,如何以最快的速度呈現無論是在甚麼樣的網路速度,留心使用者的使用狀況像是他們的網路傳輸狀態。更快速完美呈現,不需要花太多時間等候無疑是2015年要發表的網站需要考量的重大決策。
你覺得還有甚麼是2015年網頁設計趨勢?歡迎在下面留言區(The Next Web 原文)一起討論吧!

圖文來源:TNW-10 Web design trends you can expect to see in 2015

2015年1月2日 星期五

行銷人一定要懂的5個指標

「並非所有的事情都可以被計算,也不是每一個數字都有意義。」--愛因斯坦
這句愛因斯坦經典名言幾乎道盡了數位行銷所面臨的重要挑戰。網路為行銷人造成各種改變,其中之一是有更多管道直接接觸到潛在客戶,但也帶來很多挑戰,最重要的是怎麼了解網路活動是否真的能夠刺激銷售?
推特、貼文、上傳影片還算容易,但你的付出是否真正有效,使行銷人與事業不斷前進才有意思。怎麼說呢?有些看似充滿意義的指標也許會讓你困惑,我們很容易可以去測量有多少(Twitter)跟隨者,有多少人對Facebook 貼文按讚,但往往這些數據可能又不能真正告訴你什麼。

實際的狀況是,越容易被蒐集的數據,越難直接提供給你實際的價值。回頭參考愛因斯坦的名言,行銷人容易被各式各樣的指標所困惑,甚至被引導到錯誤的事物。如果 Google Analytics 告訴我們跳出率,有多少訪客,是不是真的對我們來說是完全意義的指標呢?答案當然不是,這些數字雖然是有用的,但未必能夠真正完全展現其背後的意義。所幸經過數年的實作,測量科學已有了大躍進,不僅有卓越的數位行銷分析專業經驗被分享,也有各種分析工具幫助你偵測與測量活動成效。到現在,還有許多小型企業、非營利組織與創業者沒有辦法雇用有經驗的數據行銷人員或是投資在貴松松的工具,如果正處於這樣的狀況,你可能不知道該從何開始數字分析,這裡就提供5個重要的數位行銷指標參考:

1.觸及人數與參與狀況
要說簡單好用,觸及人數與參與狀況是社群媒體最基本的兩個參考軸,雖然這資料取得容易,但可以從觸及人數與參與程度觀察反應是好,不清楚,不好還是根本沒參與到。雖然說好取得的資料不一定有用,但我還是認為用這兩個指標對於很多機構來觀察社群媒體帶來影響非常有用,這指標不應該被重視為最終成效依據,但是讓我們往前邁進一步,讓我們知道到底網路上的訪客想看甚麼?每一個社群媒體都有自己的具體指標,像是 Facebook Insights, Youtube 或 Twitter Analytics,但無論數據呈現多麼仔細,觸擊率與參與度都是需要特別關心的指標,你可以從這兩個元素觀察到社群媒體運作是否“健康”,你是否被看見?你的內容如何去影響社群?找一段時間-一星期或一個月-來測量應用,例如在 Facebook上找28天觀察觸及與參與率,參與率計算= 參與人數/觸及人數 x 100。

2.整體轉換率

對所有組織來說,Google Analytics 是最重要的測量工具之一,然而,大部分人常犯兩個常見的錯誤:第一,只看整體網站平均值而沒有設定目標。沒有設定目標你就無法觀察訪客是不是做了你希望他們做的事,例如:買東西,訂閱服務,下載手冊,或是成為會員。你可以觀察整體轉換率或是將受眾做區隔,識別訪客行為差異,轉換率可以讓你更專注於那些重要的事。

3.頻道轉換率
身為行銷人,你會想知道哪一個活動造成最大影響,測量來源轉換率則能幫助計算投資報酬率。為了要測量頻道轉換率,你需要對活動做追蹤,看看哪個活動成效好。Google campaign tracking tool 可以讓你輕鬆追蹤回到網站的流量,但使用的方法需要保持一致性。大小寫的差別會在報告上有所分別,即使是同要來源/媒介如:Facebook/advert. 與 facebook/advert.
這裡有一些活動追蹤小秘訣>>>歡迎參考

4.單筆銷售成本(CPA)
不管營運方式為何,一旦你開始追蹤活動,一定要讓每筆銷售的成本更容易運作。有時候也會被用來做為轉換成本,而使用轉換無收入的目標如:註冊、登入,則是獲得每個消費者你所需要花費的成本。這個簡單的方式可以讓你更快了解獲得每個客戶需要多少成本,每個客戶你可以貢獻多少收入。

5.投資報酬率(ROI)

接著 CPA 的話題,所有的企業都想知道行銷工作的投資報酬率,簡單的說:用多少費用獲得客戶,而客戶後續又貢獻了多少營收,或是用另外一種說法:ROI=淨收入/成本‧ROI通常以百分比表示,ROI越高越好,而且你也該將這個指標跟單筆銷售成本與整體轉換視為同等重要。
當開發數位量化方法,你必須要仔細考慮具體的目標,人們往往犯的最大錯誤是被數字蒙蔽,並且認為所有數字都是有用的。唯有可以促進業務價值才是對你來說真正有用的數據。

圖文來源:TNW- 5 metrics every marketer should be watching

2014年12月28日 星期日

我是女生 我愛科技

女生愛科技
之前在 Pixnet 跟好朋友一起經營女生愛科技 Blog,
想紀錄一些自己感興趣的科技觀察,
但是我的好朋友天兵跑到南半球闖蕩,自己也投入表演藝術工作,
把很長的時間把重心完全放在表演藝術行銷工作上,
總覺得積累了一些東西可以分享,
同時又覺得有更多不明白,想知道,想學習的事。

是該重新開始寫紀錄的習慣了,
把女生愛科技搬家到 Blogger 重新開始,
希望來年也可以是一個更進步的自己

我是女生,我超愛科技,
並且期待科技帶來一個更美好的世界。