什麼是RWD響應式網頁設計?


RWD (Responsive Web Design)響應式網頁設計又稱為自適應網頁設計、回應式網頁設計、對應式網頁設計。那要響應什麼呢?自適應什麼呢?這個名詞自有它產生的道理。




 

 


RWD響應式網頁設計的誕生


目前手機及平板小尺寸裝置已超越桌機使用比率,本來只符合桌機尺寸的網站已不敷使用。為了因應此問題,RWD響應式網頁的技術因此誕生。


RWD響應式網頁設計的概念


它是一種網頁設計的技術做法,該設計可使網站在不同的裝置(從桌面電腦顯示器到手持裝置或其他行動產品)上瀏覽時對應不同解析度皆有適合的呈現,減少使用者進行縮放、平移和捲動等操作行為




 

 


RWD響應式網頁範例


天矽作品範例:微風慈善基金會



天矽作品範例:國泰生殖中心



天矽作品範例:李長榮化工集團



相關連結:什麼是RWD響應式網頁設計?



原始文章:天矽網頁設計 https://www.tsg.com.tw/blog_detail47.htm

天矽科技 發表在 痞客邦 留言(0) 人氣()

為什麼需要RWD響應式網頁設計的技術?

為了因應潮流。(等等!先別急著關閉網頁)


隨著手機與平板的使用普及,甚至比桌機的使用率還高,消費者的使用習慣促使網頁設計的技術進入新的時代,RWD響應式網頁的技術就這麼誕生了。


 



 




 

什麼是RWD響應式網頁?


能夠使網站畫面同時符合多種裝置尺寸(電腦、手機、平板),使瀏覽的畫面不會變形或是跑版的網頁技術。


 


為什麼需要RWD響應式網頁的技術?


1.利於SEO,影響搜尋排名:Google對於網站的審核一向以優良的使用者體驗為主,網頁是否有利於使用者在手機裝置能夠方便瀏覽,都已列入審核條件。
2.網站維護成本降低:尚未有響應式網頁設計技術時,網頁的撰寫方式為桌機和手機是分開的兩個網站。而響應式網頁僅有一個網站
3.因應使用者習慣:前期的網頁技術,在手機或是平版裝置不利瀏覽,觀看細節還需要用手指放大,不便的瀏覽模式會讓使用者流失。RWD技術能夠自適應裝置尺寸,呈現該尺寸適合的畫面,讓使用者容易瀏覽及操作。


 


RWD響應式網頁如今已演變成標準技術,為了能夠讓您的網站適應於每個裝置,讓使用者有更好的瀏覽體驗,RWD網頁設計的網站勢在必行。


相關連結:什麼是RWD響應式網頁設計?


 


想看實績案例,請點擊網頁設計作品


若是想要改版您的網站或是建立網站,歡迎聯繫我們



天矽科技 發表在 痞客邦 留言(0) 人氣()

網頁設計需求溝通及網站解決方案的提供


 


我想要做一個網站,但我不知道要怎麼開始。
我只有這種產品圖,怎麼製作出符合企業形象的網站?
於是,建置網站的溝通之旅就這麼開啟了。


 


如何與網頁設計公司溝通?


完成一個網站是雙方溝通討論出來的。
不管是透過電話或是郵件來詢問的,網站規劃師都會初步的與客戶接洽,簡單的了解網站建置需求。為了能夠更加快速了解客戶,一般會以客戶的產業類別作為切入點,網站規劃師整理相關產業別案例,進行網站專案整體企劃及網頁製作設計方向,並且彙整成簡報,與客戶進行面對面的討論。


 


引導客戶、提供解決方案、解決客戶網站致命的痛點
不怕你問,就怕你不問。答案都是問出來的。
透過面對面的討論,網站規劃師觀察客戶的反應及提出的問題,可以更快速了解客戶的需求,藉以引導的方式,迅速統整出網站的架構。
或許單純的言語溝通還不夠,即時的加入畫面討論,更能提升溝通效率。天矽的網站規劃師統整出的資料中,包含相關產業別案例,透過已經上線的網站,瀏覽其畫面,使討論增加更多的真實性,針對客戶需求及網站性質為客戶規劃、分析適合之網路行銷專案、定期提供客戶相關報表。 


 


溝通階段雖然繁瑣,但都是為了做出您心目中「理想的網站」
天矽團隊擁有二十多年的歷史,我們不是只有”傳統”的思維,整體團隊的企業靈魂猶如野火般不停地燃燒,除了長期穩定的經營、更是有破壞式創新,翻轉網頁設計界的市場,天矽團隊更是不停的突破現有技術以及加入新的服務,永遠站在時代的尖端上。
 


想瞭解更多網頁設計內容嗎?請留下聯絡方式,我們將會盡快與您聯繫。



天矽科技 發表在 痞客邦 留言(0) 人氣()

網站製作/設計流程

在網際網路發達的時代,消費者透過網路來搜尋網站上的解決方案,網站絕對是網路行銷的重要推手,要如何製作客製化風格、專業且富有強大功能的網站呢?


網站製作/設計流程


步驟一:需求溝通、網站解決方案的提供


透過專業的業務人員與客戶面對面做需求訪談及詳細簡報,用心且仔細瞭解客戶需求,並規劃出客製化網站架構、客戶後台功能與風格導向。這個階段的溝通雖然繁瑣,卻是後續專案執行順暢度的重要步驟。


步驟二:網站視覺設計


業務人員將設計需求傳達給設計師,設計師著手進行設計。天矽會先提供首頁及次頁給客戶進行首頁風格的確認,客戶滿意該專案首頁風格後,雙方達成共識,設計師再繼續製作網站的其餘頁面。這個階段網站的雛型將會完成。


步驟三:網站程式撰寫


工程師依照客戶需求,客製化開發後台程式,將撰寫完成的程式串接前台網站,一個專業且富有強大功能的網站就此誕生。透過客製化後台可以新增、刪除、修改網站的資料內容。


步驟四:網站測試/上線準備


在網站正式上線前,我們會提供一周至兩周的時間,給客戶進行網站功能的測試,確保網站功能正常營運,該專案客服人員會同步協助網址申請與主機空間購買作業,為網站正式上線做準備。


步驟五:網站正式上線


在客戶指定的時間完成網站上線作業,客戶便可開始進行網站行銷的推廣,上線後的網站就能夠被消費者搜尋到貴公司。


網站製作的過程中,天矽團隊秉持專業且用心的態度與客戶保持密切聯繫,用耐心瞭解客戶需求以及23年的專案實務經驗製作出超乎客戶期待的網站!!


 


繼續閱讀:網頁設計需求溝通及網站解決方案的提供


 


 



天矽科技 發表在 痞客邦 留言(0) 人氣()

認識PHP網頁程式設計

如果你需要一個可以動態新增的網站,除了美美的網頁設計,還需要搭配後端的程式設計。網頁程式語言百家爭鳴,有許多的選擇,例如:PHP、Java、Python、C#...。


認識PHP網頁程式設計


如果你是第一次接觸網頁程式設計,建議你可以從PHP開始,它的優勢如下:


一、跨平台性
在Windows、Linus、Unix、MacOS的平台皆可運行,相容性佳。如未來有更換主機空間的需求,可以減少許多主機平台不相容的問題。


二、成熟的物件導向體系
擁有成熟的物件導向(OOP)體系,適用於大型專案的開發,也易於網站的維護。


三、語法簡單、社群支援
相較其他程式語言,入門容易。開發時如果遇到問題,也能找到較多的支援分享。市面上有許多知名的網站也是使用PHP程式開發,例如:facebook、淘寶網、Yahoo!。


網站上線後,維護與後續改版都會面臨程式版本的問題,如果一開始能夠選擇適用性高的程式語言,相對的能降低後顧之憂。天矽的網頁作品有很多都是PHP程式撰寫,請點連結看看我們的作品吧!


如果你有網站製作的需求,歡迎與我們聯繫



天矽科技 發表在 痞客邦 留言(0) 人氣()

網站上線前你必須要做的事(2)-申請主機空間


 


什麼是主機空間?


真正的名稱為虛擬主機(Virtual Host),一般於市面上又稱做網站空間、網頁空間、主機空間、虛擬空間、網站代管。簡而之,他們是一樣的東西。


 


主機空間與網站的關係


我們可以連上不同的網站,並且瀏覽內容。除了申請網址外,還需要申請虛擬主機,存放網站。


設計好的網站就像家具一樣,它需要有空間存放,而主機空間就是存放網站的地方


 


使用虛擬主機的好處


建置網站需要讓使用者瀏覽,必須建立網站伺服器(Web server)。但建立伺服器經費相當昂貴,費用包含了網路費用與電費。還需要聘請專業技術人員做日常維護,除非您的網站已具備動輒數十萬的日瀏覽量。


所以,虛擬主機設計的用意主要降低企業自行架設主機的成本,




 

 


虛擬主機怎麼申請?


你可以透過網路搜尋找到許多虛擬主機的廠商,或是交由天矽幫您代為申請,填寫聯絡表單,我們將有專人與您聯繫。





天矽科技 發表在 痞客邦 留言(0) 人氣()

網站上線前你必須要做的事(1)-申請網址


終於完成網站建置了,在網站上線前,必須幫您的網站找到住家(網站空間),並給它一個聯絡地址(申請網址)。



網址又稱網域名稱、網域、域名,可以把它解釋為網站的地址,每個網站的網址都是獨一無二的,必須透過註冊申請才可以使用。


 


網址結構如下圖:





 

什麼是次級域名?


建議命名方式簡單易懂,例如公司的英文名稱或是具代表性的詞彙等等。


 


什麼是頂級域名?


可以想成是一種對網站的分類,例如:



























頂級域名



分類



.com



公司行號



.org



非營利組織、機構、團體



.edu



學校



.gov



政府機關




 


網址命名對於SEO的影響?


想做好網站的SEO優化,從選擇一個好的網址(網域名稱)開始。



  1. 簡短易懂的網址:比較容易記憶,複製與傳播。

  2. 具備描述性:使用者看到網址能夠大致明白該網頁的內容是關於什麼。

  3. 具備關聯性:網址名稱和內容互相呼應,有助於使用者體驗的提升。




 


怎麼申請網址?


台灣負責管理網址的機構是財團法人台灣網路資訊中心(TWNIC),可以在TWNIC的網站上查詢你想要的網址是否已被申請走、被誰申請走。查詢方式請點我


但TWNIC已不受理申請,必須向TWNIC授權的註冊機構辦理,例如:


遠傳:http://rs.seed.net.tw/


網址中文:https://www.net-chinese.com.tw/nc/



天矽科技 發表在 痞客邦 留言(0) 人氣()

建置網站需求溝通及網站解決方案的提供


 


我想要做一個網站,但我不知道要怎麼開始。
我只有這種產品圖,怎麼製作出符合企業形象的網站?
於是,建置網站的溝通之旅就這麼開啟了。


 


如何與網頁設計公司溝通?


完成一個網站是雙方溝通討論出來的。
不管是透過電話或是郵件來詢問的,網站規劃師都會初步的與客戶接洽,簡單的了解網站建置需求。為了能夠更加快速了解客戶,一般會以客戶的產業類別作為切入點,網站規劃師整理相關產業別案例,進行網站專案整體企劃及網頁製作設計方向,並且彙整成簡報,與客戶進行面對面的討論。


 


引導客戶、提供解決方案、解決客戶網站致命的痛點
不怕你問,就怕你不問。答案都是問出來的。
透過面對面的討論,網站規劃師觀察客戶的反應及提出的問題,可以更快速了解客戶的需求,藉以引導的方式,迅速統整出網站的架構。
或許單純的言語溝通還不夠,即時的加入畫面討論,更能提升溝通效率。天矽的網站規劃師統整出的資料中,包含相關產業別案例,透過已經上線的網站,瀏覽其畫面,使討論增加更多的真實性,針對客戶需求及網站性質為客戶規劃、分析適合之網路行銷專案、定期提供客戶相關報表。 


 


溝通階段雖然繁瑣,但都是為了做出您心目中「理想的網站」
天矽團隊擁有二十多年的歷史,我們不是只有”傳統”的思維,整體團隊的企業靈魂猶如野火般不停地燃燒,除了長期穩定的經營、更是有破壞式創新,翻轉網頁設計界的市場,天矽團隊更是不停的突破現有技術以及加入新的服務,永遠站在時代的尖端上。
 


詳情都可以與我們聯繫



天矽科技 發表在 痞客邦 留言(0) 人氣()

透過視覺設計提升網頁轉換率的3件事

身為設計師設計出華麗而吸引人的網頁相信不是一件困難的事情,但網站最重要的任務是與使用者做雙向溝通,進而提升網頁轉換率。如何透過視覺設計提升網頁的轉換率呢?我們可以這麼做:


透過視覺設計提升網頁轉換率的3件事


一、清楚瞭解客戶製作網站的想法與目的


除了網站規劃師與客戶,設計師也要清楚瞭解客戶製作網站的目的與想法,瞭解需求能幫助設計師製作出貼近客戶期望的設計。


二、利用視覺設計傳遞正確資訊


以一個期望透過網站提升產品銷售數的購物平台來說,在設計規劃上,我們必須正確傳達這個網站可以買到什麼樣的商品,如何購買並確保整個購物流程是順暢無阻的。


三、人性化的操作設計


現今透過行動裝置拜訪網站的人已經超越電腦了,在設計上加入行動裝置也能輕易瀏覽與操作的規劃,讓使用者透過行動裝置也能無負擔的瀏覽網頁。


總結以上,在網頁視覺設計時,設計師必需先瞭解客戶建立網站的目的,透過視覺正確傳達網站資訊以及人性化的操作來提升使用者與網站的黏著度和轉換率。


 


延伸閱讀《您的網站吸引力夠嗎?如何提升頁面轉換率》


 



天矽科技 發表在 痞客邦 留言(0) 人氣()

網站改版好時機:Flash將於2020年停止更新,HTML5時代全面來臨!
部落格:網站改版好時機:Flash將於2020年停止更新,HTML5時代全面來臨!

 


Flash技術曾經是網頁動態呈現的好幫手,但舊時的效能及諸多的安全漏洞,使很多瀏覽器宣布停止支援Flash。iOS設備更是從來沒有支援過Flash。

重大消息一:


Adobe宣布2020年停止更新Flash:
Flash的開發商,Adobe指出因HTML 5、WebGL等網路標準成熟,使得瀏覽器整合外掛程式功能,將讓Flash在2020年底退場,不再更新、發行Flash Player。


 


重大消息二:


各家瀏覽器們將在2020年停止支援Flash:
Google、IE、Edge、Safari……,早已陸續釋出停止支援的訊息,但在2020年12月底將會正式停止支援Flash。停止支援Flash後,若是您的網頁有使用Flash技術,那麼打開後會是一片空白喔~


其實Flash的退場早已實施了好幾年,只是我們沒有注意。例如youtube播放由Flash播放器,改為預設播放HTML5播放器。亞馬遜也不再接受Flash廣告……等。


 




 

Flash被瀏覽器停止支援之後,會發生什麼事呢?


目前Chrome瀏覽器是以跳出提示訊息,使用者使用手動的方式開啟Flash效果,但在2020年12月底正式停止支援後,網站無法正常啟動Flash效果,使用者會無法正常瀏覽網站喔~(可能畫面會一片空白)


 


如何解決Flash看不到的問題?


天矽科技網頁設計團隊會依據客戶舊版網站的狀況提供兩種方向:


1.網站改版-適用於大量使用Flash製作的網站。


優點:



  1. 全面網站改版,使用最新的語法編寫網站,有助於SEO(自然搜尋)排名

  2. 更新企業形象

  3. 規劃更貼近使用者的操作模式


缺點:



  1. 費用較高

  2. 耗時較長


2.部分改版-適用於局部使用Flash製作的網站。


優點:



  1. 使用圖檔替代,或是CSS、jQuery的動畫效果取代。

  2. 費用較低

  3. 耗時較少


缺點:



  1. 樣式老舊,操作方式過時

  2. 不利於SEO自然排名

  3. 不適用小尺寸裝置


網站改版實績案例:



 


天矽科技設計團隊建議


隨著時間,技術不停的更替,而這次又逢疫情影響,不妨轉戰新市場,透過網路展開新的事業版圖。


天矽協助過許多客戶以不影響原網站資料架構,以及不影響網站排名的情況進行網站改版,如果你有以上的需求,免費諮詢 02-89904080線上免費諮詢


 



天矽科技 發表在 痞客邦 留言(1) 人氣()

undefined

範例:網站用隱私權條款 (Privacy Policy)

為方便網站及您的使用,讓網站宣告更言之有物、符合法規具準確可靠性;


此份隱私權聲明是以政府規範為基準,進行調整並移除不適合一般企業使用之項目。


 


您可以加上自己網站的名稱,並調整內容讓其更符合您的網站,使用在網站宣告上。


我們天矽科技網頁設計也會注意法條的更新,如有變更會再調整範本,讓一切盡善盡美。




 

 


隱私權保護政策建議包含以下大綱:
 


一、 隱私權保護政策的適用範圍
請說明該網站隱私權保護政策的適用範圍。
 


二、 個人資料的蒐集、處理及利用方式
請說明該網站針對個人資料的蒐集、處理及利用方式。
 


三、 資料之保護


請說明該網站針對取得資料的安全維護措施,如防止個人資料被竊取、竄改、毀損、滅失或洩漏,採取技術上及組織上之必 要措施。
 


四、 網站對外的相關連結
請說明對外連結網站不適用本網站的隱私權保護政策,必須參考該連結網站中的隱私權保護政策。
 


五、 與第三人共用個人資料之政策


六、 Cookie 之使用
請說明該網站使用Cookie技術來儲存或追蹤使用者的資料的情況。
 


七、 隱私權保護政策之修正
請說明該網站針對隱私權保護政策之修正措施。
 




 



 

範例:網站用隱私權條款 (Privacy Policy)


 










非常歡迎您光臨「○○網站」 (以下簡稱本網站),為了讓您能夠安心的使用本網站的各項服務與資訊,特此向您說明本網站的隱私權保護政策,以保障您的權益,請您詳閱下列內容:


 


一、 隱私權保護政策的適用範圍



  • 隱私權保護政策內容,包括本網站如何處理在您使用網站服務時收集到的個人識別資料。

  • 隱私權保護政策不適用於本網站以外的相關連結網站,也不適用於非本網站所委託或參與管理的人員。


 


二、 個人資料的蒐集、處理及利用方式



  • 當您蒞臨本網站或參與本網站活動時,我們將視活動性質請您提供必要的個人資料,並在該特定目的範圍內處理及利用您的個人資料。

  • 本網站蒐集足以識別使用者身分的個人資料、消費與交易資料,或日後經您同意而提供之其他個人資料,都僅供本網站於其內部、依照蒐集之目的進行處理和利用、或為完成提供服務或履行合約義務之必要、或依照相關法令規定或有權政府機關之命令或要求,否則 本網站不會將足以識別使用者身分的個人資料提供給第三人(包括境內及境外)、或移作蒐集目的以外之使用。


 


三、 資料之保護



  • 本網站主機均設有防火牆、防毒系統等相關的各項資訊安全設備及必要的安全防護措施,加以保護網站及您的個人資料採用嚴格的保護措施,只由經過授權的人員才能接觸您的個人資料,相關處理人員皆簽有保密合約,如有違反保密義務者,將會受到相關的法律處分。

  • 如因業務需要有必要委託本網站相關單位提供服務時,本網站亦會嚴格要求其遵守保密義務,並且採取必要檢查程序以確定其將確實遵守。


 


四、 網站對外的相關連結


本網站的網頁提供其他網站的網路連結,您也可經由本網站所提供的連結,點選進入其他網站。但該連結網站不適用本網站的隱私權保護政策,您必須參考該連結網站中的隱私權保護政策。


 


五、 與第三人共用個人資料之政策


本網站絕不會提供、交換、出租或出售任何您的個人資料給其他個人、團體、私人企業或公務機關,但有法律依據或合約義務者,不在此限。


前項但書之情形包括不限於:



  • 經由您同意。

  • 法律明文規定。

  • 為維護國家安全或增進公共利益。

  • 為免除您生命、身體、自由或財產上之危險。

  • 當您在本網站的行為,違反本網站的服務條款或可能損害或妨礙本網站權益或導致任何人遭受損害時,經本網站揭露您的個人資料是為了辨識、聯絡或採取法律行動所必要者。

  • 有利於您的權益。

  • 本網站委託廠商協助蒐集、處理或利用您的個人資料時,將對委外廠商或個人善盡監督管理之責。


 


六、 Cookie 之使用



  1. Cookies 是從網站傳送到瀏覽器,並保存在使用者電腦硬碟中的簡短資料。為了提供您最佳的服務,當您使用本網站服務時,本網站有時會在您的電腦上設定與存取 Cookies。

  2. 您可以透過設定您的個人電腦或上網設備,決定是否允許 Cookies 技術的使用,如果您選擇拒絕所有的 Cookies 時,可能會造成您使用本網站服務之不便或部分功能無法正常執行,敬請理解。

  3. 您可以在 IE 的「工具-網際網路選項」的「安全性」,或 Firefox 的「工具-選項」的「個人隱私」,或 Chrome 的「工具-選項」的「隱私權設定」中選擇修改瀏覽器對 Cookies 的接受程度(包括:接受所有Cookies、設定 Cookies 時得到通知、拒絕所有 Cookies 等)。


 


七、 隱私權保護政策之修正


本網站隱私權保護政策將因應需求隨時進行修正,修正後的條款將刊登於網站上。


 



 




原始文章:天矽網頁設計 https://www.tsg.com.tw/blog_detail.php?nid=34

天矽科技 發表在 痞客邦 留言(0) 人氣()

我學會Google SEO規則,可以提高網站排名!

提高網站排名可以透過關鍵字廣告及搜尋引擎最佳化(SEO)兩種方式,關鍵字廣告會出現在搜尋結果的最上方,有廣告的圖示標註。以Google Ads來說,當網站廣告被點擊時需要支付廣告費用。


利用搜尋引擎最佳化(SEO)來提升網站排名會顯示在自然排名的區塊,自然排名的網站點擊無須支付任何


費用,接下來就讓我們來瞭解如何提升網站的自然排名吧!



 




 

一、 傳遞資訊給搜尋引擎

藉由網路爬蟲(web crawler)將網站內容建立索引,讓搜尋引擎可以提供網站資訊給需要的使用者。網路爬蟲會讀取的內容有:

1. 網頁標題(title):請編寫長度27個字內的網頁標題,網頁標題會顯示在瀏覽器的頁籤及搜尋結果的標題。

2. 網頁描述(meta description):為每個頁面編寫網頁的描述內容,建議字數在120個字內,網頁描述會顯示在搜尋結果的內容。

3. 網頁關鍵字(meta keyword):設定3-5個關鍵字,若是能將關鍵字放進網頁描述裡,效果會更佳。

4. 使用HTML5編寫網頁:HTML5回報錯誤相較XHTML來的少,語意化的標籤內容可以幫助網路爬蟲瞭解區塊的內容,例如:header、main、footer…。

 


二、 建立行動版網站

行動裝置的盛行,來自行動裝置的流量已遠遠超過電腦流量,未來行動優先的設計勢在必行。行動版網站不是單單的將桌機版網站縮小,更多的是人本設計考量。


 

三、 加入資料傳輸安全:HTTPS協定

HTTPS協定是以SSL進行加密,目的是資料傳輸的過程中,保障資料的安全及完整性。2017年1月開始,Google聲明網站若沒有SSL安全認證,則會標示為不安全網站,這將會大大影響自然排名。

 


 

四、 經營網站

網站上線後別放著不管,我們得學會經營網站的方法,讓網站發揮價值帶來更大的效益。我們可以使用Google Search Console與GoogleBot對話,如果網站資料有更新,請利用網址審查功能,告訴GoogleBot我的網站有新增內容,網路爬蟲快來建立索引吧!

 




 


申請Google Analytics並在網站內加入gtag.js設定,定期檢視報表資訊及更新網站內容,掌握使用者動向,提高潛在客戶開發的可能性。​


 



(在網站內加入gtag.js設定)


 



(觀察瀏覽量、平均網頁停留時間、跳出率等數值,掌握使用者動象,提高潛在客戶開發的可能性。)



更多的網站製作細節,請來電聯繫(02-8990-4080填寫線上表單,天矽將有專人為您服務。


原始文章:天矽網頁設計 https://www.tsg.com.tw/blog_detail.php?nid=33


天矽科技 發表在 痞客邦 留言(0) 人氣()

Blog Stats
⚠️

成人內容提醒

本部落格內容僅限年滿十八歲者瀏覽。
若您未滿十八歲,請立即離開。

已滿十八歲者,亦請勿將內容提供給未成年人士。