顯示具有 行動網站 標籤的文章。 顯示所有文章
顯示具有 行動網站 標籤的文章。 顯示所有文章

2015年7月28日 星期二

網頁設計這樣就對了!十招教你做出最棒的網站!

RWD響應式網頁的設計,已經成為現在做網站的基本條件之一。另外SDT小編再與大家分享十招網頁設計的概念,有了這些祕招,你也能做出最潮的時尚網站!



【第一招】圖大!還要更大!

source:http://www.borngroup.com/















自從響應式網站風行後,我們常常看到進入網站就是非常大的圖(或影片),使用者對於影像的接受度,遠遠超過贅述的文字,一張好的圖,除了能夠立馬就吸引到觀眾的目光,加深印象外,更直接替代掉廢話連篇。



【第二招】多媒體體驗

source:http://barstories.jackdaniels.com















運用Html5網頁技術,可以將多媒體置入網頁之中,讓使用者有耳目一新的感受,同時也加強互動的概念,但還是要特別注意效能表現,免得過多的效果反而讓網站不好用。



【第三招】視差效果設計

source:http://www.quoplus.com/














視差設計也是今年設計的一個風潮,將網頁瀏覽時的上下(或左右)移動,設計在視覺上和背景間的差距呈現,可以創造出更多的驚喜。例如上面的耳機網站中,就運用這樣的技巧在展現各種耳機顏色,質感非常棒!



【第四招】用動畫說故事

source:http://habitatweb.mx/















前面有提到多媒體的部分,而在新的html5設計上,也更多了"動畫"的呈現模式,將會動的元素,搭配網頁瀏覽時的文字內容,讓使用者在觀看時,更能一步步引導,深化腦內的印象度。



【第五招】扁平化設計

source:http://colinanddewi.com/















扁平化設計在APP的表現上早就已經是引領潮流的王道,而在網頁設計上,也有著相同趨勢,無論是 icon 、圖像、字體、按鈕,都已變化為簡潔的扁平設計,反而會讓使用者有一種質樸輕鬆的使用經驗。



【第六招】打破格子吧!

source:https://pixelgrade.com/demos/rosa/















source:http://www.world-of-swiss.com/

















以往的網頁設計,強調版面規劃完整、直線切版、將網頁內容一塊一塊的呈現在首頁上,但現在因應手機版的使用度越來越高,突破框架式的思考也才符合未來的設計概念,同時也更能展現網頁的特殊設計風格。




【第七招】運用拼貼

source:http://dynamit.com/































相對於突破框架式的設計,還是有許多網站的設計,是以拼貼的方式來表現,但這個拼貼,不代表就是非常規律的格子,反而是有設計風格的多樣化拼貼,如此更能展現網站圖像式的內容,吸引使用者目光。



【第八招】引導按鈕元件

source:http://humcreative.com/about/















進入一個網站最怕就是迷路,因此許多網站都將導航列(Navigation bar)放在最上方,明顯之處。不過現在也有設計人希望將這些引導的按鈕,置入在網頁之中,創造出更多的使用者互動與趣味。不過重點還是要記住:千萬不能讓使用者迷路阿!



【第九招】導入Google地圖

source:http://nitwinski.com/













Google map提供API可以串接,也讓自己網站可以多樣化的呈現與地圖相關的資訊。



【第十招】多層次呈現

source:http://necotrans.com/















利用多個圖層的相互疊壓,創造出獨特的設計風格,這種方式也比較適合資訊很多的網站,有效率的運用空間來對使用者說明所有內容。

SDT小編結語:

有了這十招的醍醐灌頂,對網頁設計或是需要規劃網站的人來說,應該是個很不錯的建議,不過就像所有的武功絕招一樣,學習每個技巧或觀念還是要能夠應用與消化,而不是硬把不適合的東西加入網站設計之中,這樣只會讓使用者覺得眼花撩亂。還是要仔細思考自己的網站對象是誰?誰來使用?目的為何?才能真正做出一個同時具備實用與設計感的好網站。



以上非翻譯文章,小編概念與原文作者並不一定完全相同
圖文參考資料來源:http://99designs.com/designer-blog/2015/01/16/top-web-design-trends-2015/

2012年9月6日 星期四

SDT行動商務大師,教您五分鐘完成行動網站

完成上面的這個行動網站需要多少時間?? 
一天??   三小時??

答案是:  5分鐘


在五分鐘完成專屬行動網站前,先要做幾個準備動作
(1)免費申請SDT行動商務大師(快易版)
(2)完成申請後,進入設定後台網頁,輸入帳號密碼













(3)準備好公司的簡介文字、資料、LOGO廣告圖檔等等

----------------------------------------------------------------------------------------

準備開始來做行動版網站囉!!!

第1分鐘:設定頁面呈現
進入手機瀏覽 > 主選單
網路排列:3 x 3
選單圖標:我選第2組
按下 "修改" --->非常重要,每設定完頁面,要按下修改才會儲存起來唷
























進入手機瀏覽 > 參數設定 > 基本資料設定
公司名稱:請填寫貴公司名稱
網站名稱:同上
按下 "修改" 
























進入手機瀏覽 > 頁面樣式 > 頁面底部建立
按下"新增頁面底部" (如下圖)






















設定一個名稱
內容部分寫入頁面底部需要的文字
按下儲存

























OK!!頁面設定完成
要看目前製作進度可以按下管理後台右上角的 "網站首頁"檢視


第2分鐘:完成[公司簡介]、[最新消息]
進入手機瀏覽 > 內容管理 > 公司簡介
選單名稱:公司簡介 (可自由填寫文字)
頁面標題:公司簡介 (可自由填寫文字)
頁面內容:公司簡介文字
狀態一定要改為"有效"--->重要喔
按下修改


























進入手機瀏覽 > 內容管理 > 最新消息
選單名稱:最新消息 (可自由填寫文字)
頁面標題:最新消息 (可自由填寫文字)
如果要新增訊息,按下"點選這裡管理資訊" (如下圖)
狀態改為"有效"
按下修改













































OK!![公司簡介]、[最新消息]完成


第3分鐘:完成[商品介紹]、[客服QA]
進入手機瀏覽 > 內容管理 > 產品介紹
選單名稱:商品介紹 (可自由填寫文字)
頁面標題:商品介紹 (可自由填寫文字)
如果要新增商品訊息,按下"點選這裡管理資訊" (如右圖)
狀態改為"有效"
按下修改



















客服QA也是相同操作模式
進入手機瀏覽 > 內容管理 > 問與答
只是客服QA新增一個項目時,可以填寫一個問題跟一個答案

OK!![商品介紹]、[客服Q&A]完成


第4分鐘:完成[Youtube影片]、[作品集]、[官方部落格]
進入手機瀏覽 > 功能管理 > Youtube
選單名稱:Youtube影片 (可自由填寫文字)
頁面標題:Youtube影片  (可自由填寫文字)
Youtube用戶名:使用本功能需先有Youtube帳號,將帳號填入本欄,系統就會
自動去抓公開的影片
狀態改為"有效"
按下修改



















[作品集] 相同操作模式
進入手機瀏覽 > 功能管理 > Flickr網路相簿
Flickr用戶名:使用本功能需先有Flickr帳號,將帳號填入本欄,系統就會
自動去抓公開的照片
狀態改為"有效"
按下修改

前往Flickr網站看看

[部落格] 相同操作模式
進入手機瀏覽 > 功能管理 > RSS訂閱
RSS網址:將部落格的RSS填入,系統就可以自動更新收納部落格文章
網址範例    http://sdtapp.blogspot.com/feeds/posts/default?alt=rss   
狀態改為"有效"
按下修改

OK!![Youtube影片]、[作品集]、[官方部落格]完成



第5分鐘:完成[聯絡我們]

要作聯絡我們,先要製作一下空白表單
進入手機瀏覽 > 功能管理 > 表單 > 新增表單
第一步
表單名稱:聯絡我們
製作方式:從空白表單開始建立
欄位數目:6

第二步  填入表單說明






















第三步  選擇表單問題類型 (這部分比較費時,需要多多練習)
上圖為我製作基本問題類型提供參考

















完成後我們就有一個叫做是 "聯絡我們" 的表單了
開始製作聯絡我們
進入手機瀏覽 > 內容管理 > 聯絡我們
選取表單:聯絡我們(剛剛製作完的那個表單)
使用GOOGLE地圖:是
狀態改為"有效"
按下修改


大功告成!用手機瀏覽一下SDT網站吧



SDT行動商務大師可以輕鬆建置行動網站
還有更多功能與呈現內容,快來申請快易版免費試用吧



2012年9月5日 星期三

掌握龐大商機,自己就能做行動網站!超簡單!免費試用中!

目前一般人對於"手機"或"行動裝置"上網的普遍程度,之前的文章都已經聊過非常多,本篇就不再贅述。
但在這麼多人都使用手機瀏覽網站的情況下,絕大多數的公司網站,卻都還是停留在一般的介面設計(for電腦瀏覽),若使用手機上網時,兩相比較很可能會變成這樣


這麼龐大且重要的商機,為什麼掌握住的人卻不多呢?
其實原因不外乎

1、找人做行動網站,好像很貴!
2、就算自己想做又不知道如何開始

昇鼎知道大家的需求,特別提供線上製作行動網站系統
SDT行動商務大師(快易版) 


正如同名字般 快速、簡易,輕輕鬆鬆自己就可以完成行動版網站,更重要的是現在
"免費申請試用"