手機設計網頁

1、怎麼製作網站的手機版

做手機網站的方法一下幾種

1、模板站，下載手機網站模板，然後將內容和PC站點通用，這樣移動設備訪問網站時就會自動轉入到手機站的模板。

你也可以解析一個m開頭的域名作為手機站的域名，有利於搜索引擎抓取。

2、自適應網站，這種網站不需要另做手機站，因為網站的自適應，會根據你使用的設備解析度來調整網頁的排版和內容顯示。

3、H5快速建站，現在有很多服務商支持H5快速建立手機網站，只需要你把內容上傳，這些服務商就會將這個網站做出來，比較方便快捷，缺點就是免費的都有廣告，而且不支持使用自己網站的域名。

4、用代碼寫出來的手機站，這種網站就是屬於靜態網站，所有的內容都是通過代碼寫進去的，想要更改內容比較麻煩。優點就是一步到位，想要什麼效果都能達到。

5、手機直達頁，這種可以說是一個網站，也可以說是一個網頁，這種手機站比較適合推廣使用，將所有企業的推送產品放在這個頁面上，然後完美的展示出來，用戶點擊之後可以進入購買頁面或者直接進入咨詢頁面，可以更有效的提高轉化效果。

2、手機網頁應該怎樣設計?

一、選用合適的字體。

手機網頁設計成功離不開排版，排版應該獲得和圖片同樣的重視。雖然可供選擇的字體很多，設計師要考慮的方面很多，比如說，目標客戶和客戶公司的性質。為手機網站頁眉和內容選用合適的字體是必不可少的，無襯線字體和有襯線字體通常會為設計帶來良好的效果。除此之外，你還可以結合其它字體，專為孩子和女性打造網站。

二、選擇合適的配色方案。

任何手機網站的設計都離不了合適的配色方案，這對創建一個整潔干凈的網站同樣適用。堅持使用淡色和非彩色的投影對成功設計一個簡潔網站大有裨益。淺色的投影可以幫助用戶把焦點轉向網站內容。標志使用黑色和較深的投影，手機網頁中的頁眉和導航元素使用淺色背景，這些都是不錯的案例，並沒有規定在簡潔網頁設計中不能使用大膽的顏色，但是這樣的顏色要小心，剋制地使用。有時候，手機網站有必要使用深色背景色來吸引某些目標用戶。比起漸變色，有些手機網站更鍾愛純色。如果你的手機網站非得要使用紋理和漸變色，也不要用得太過火。

三、提高頁面載入速度，手機網站以簡潔為主。

一般來說，手機網站在用戶下載和瀏覽時要比PC端網站的速度慢得多，頁面東西太復雜，會耗掉用戶等待網站載入的耐心，尤其是導航欄要簡短清晰，能夠快速地指引用戶瀏覽網站的深層信息。對於網站內容來說，簡潔突出重點就好，所謂的內容越豐富越好已不適用於手機網站了。

四、避免使用彈窗。

無論是出於方便用戶聯系網站客服還是做些小廣告的目的，都要盡可能避免彈出窗口的應用，手機網站本來載入速度就慢，再添加這些窗口，必然會影響用戶體驗，阻礙用戶瀏覽網站的視線，進而佔用用戶流量，引起反感而放棄對網站的繼續訪問。

五、手機網站圖片要適配設置。

從手機上瀏覽網站必然沒有那麼方便，操作也不如PC端靈活自如，前面也說到了使用網站設計技術可以解決網站適應屏幕的問題，網站圖片也不例外，但為了用戶能將頁面使用圖片的地方看得更加清晰，可採用整站縮放的模式，而不是用戶點擊單張圖片的縮放模式，當然，手機網站能少用圖片是最好的。 六、網站操作簡單化。關於新頁面的打開方式，最好採用當前頁面顯示的方式來設計，以免新窗口造成網站資源佔用的負擔，同時對於出現網站錯誤的現象最好設置提醒，讓用戶快速找到頁面出口進行跳轉，而不是不斷地進行返回操作。

七、互動式的互動行為。

用戶在移動客戶端都喜歡進行留言，分享功能。特別是看到一篇很棒的帖子都會選擇分享到朋友圈或者空間中，讓朋友也參與裡面。例如現在比較流行的做就是做微信公眾號大咖們，往往一篇帖子都會造成幾千人的持續瀏覽、點贊或者分享內容，粉絲喜歡中這種參與行為，因為這種圈子拉動粉絲在持續發酵中，用戶慢慢都會捨不得離開。

3、手機網頁怎麼製作？

隨著智能手機越來越普遍，單純依靠PC端遠遠滿足不了用戶需求。特別是企業如何在移動端牢牢把握住用戶就可以在公司盈利和業務方面獲得飛速增長。然而，移動網站建設就變得越來越重要。搭建移動網站滿足公司業務需求，從而獲得移動端流量，就變得迫在眉睫。

手機網站製作分為2種語法：

第一種是採用WML編寫適合於按鍵的傳統手機的WAP網站，

第二種是採用時下比較流行的HTML5編寫前台。

而如今隨著中國的移動互聯網發展和智能觸屏手機的普及，WAP網站已經逐漸退出歷史舞台。並在程序或者主機上寫好判斷規則，如果是PC版的瀏覽器就訪問PC版的網址，是手機瀏覽器就訪問手機站。針對不同的群體訪問不同的頁面，有利於提高網站轉化率。

WAP是無線應用協議的縮寫，一種實現行動電話與互聯網結合的應用協議標准。wap網站也就是我們通常說的手機站。 

（2）html5是W3C制定的超文本標記語言（html)的第五次修改，通過html5製作的網站可以靈活運行於PC，平板，手機等各種媒體。 

（3）wap網站只能運行於手機端，多以文字圖片為主，無特效和邏輯功能；html5的新特性可以讓網站運行各種媒介（PC、平板、手機），並可以根據媒介的不同響應調節網站結構，與js/css3，可以構造出炫酷的特效效果。

4、手機端網頁設計尺寸多少

iPhone手機網頁的設計尺寸

iPhone5尺寸是640x1136px解析度是326PPI
iPhone4和iPhone4S尺寸是640x960px解析度是326PPI
iPhone和iPodTouch第一代、第二代、第三代尺寸是320x480px解析度是163PPI

安卓網頁的設計尺寸

320dp：一個普通的手機屏幕（240X320，320×480，480X800）
480dp：一個中間平板電腦像（480×800）
600dp：7寸平板電腦（600×1024）
720dp：10寸平板電腦（720×1280，800×1280）

ipad網頁的設計尺寸

iPad第三代第四代尺寸是2048x1536px解析度是264PPI
iPad第一代第二代尺寸是1024x768px解析度是132PPI
iPad Mini尺寸是1024x768px解析度是163PPI

5、如何做好手機網頁設計

隨著互聯網科技的發展以及人們生活方式的改變，手機網站逐漸趕上PC網站，成為企業宣傳推廣以及用戶閱讀的的主要平台，因此也有越來越多的企業開始製作手機網站。不過，手機網頁設計必須遵循移動端的設計原則，而不是盲目沿用電腦網站的設計規律，畢竟兩者還是有很大區別的。

首先，移動端網頁設計都需要考慮網路的問題。雖然現在的網路普及程度高，但是大部分用戶還是利用手機流量來上網的，因此對手機網頁的訪問載入速度要求較高。如果用戶在流量網頁時遇到頁面遲滯、視覺錯位、信息不全等問題，用戶體驗就會大打折扣，因此要求網頁內容盡量簡潔明了，同時展現精準、有用、易用的菜單欄。

還有，因為手機端屏幕大小不一，如果想要保證所有人正常訪問頁面，維持內容的可讀性，那麼就需要我們在進行相關設計的時候，盡量控制文本的間距、顏色，著重突出頁面的重點內容，讓用戶更容易看到自己想看到的內容,另外，一般手機中的電話、簡訊、推送等信息是無處不在的，用戶在瀏覽網站時，注意力很容易就被這些彈出來的信息所吸引，因此網頁的圖標設計一定要高效，讓用戶在短時間內就知道網頁的導航信息是什麼、主要內容是什麼，節省用戶時間的同時，還為網站爭取了成交的機會。

手機網站布局設計方法

1、手機網站的單頁

手機網站建設的單頁這個是存在於很多企業網站的內容，單頁優化有著一定的好處，首先網站的單頁是用HTML書寫，並且完全靜態化，這個是符合搜索引擎的，有利於優化，對搜索引擎友好。

這種頁面的布局往往需要的是大氣，簡潔，直入主題。一般可以用來介紹公司以及公司的主要核心內容。

2、首頁布局

手機網站建設的首頁是一個網站的核心部分，瀏覽者首先看到的就是首頁，然後才會看到內頁，才會了解你的公司，只有首頁有吸引力，才能留住瀏覽者瀏覽你網站的內容，那麼首頁的布局就很重要了。

首頁需要突出網站的核心，展示公司的優勢，盡顯企業的特色，而且需要有主次之分，上下之分，因為瀏覽者的習慣是從上而下，從左而右瀏覽的。

3、內容頁布局

手機網站建設的內容頁就是網站的內容詳細展示頁面了，有的網站建設者沒有太多注意的問題，手機網站建設者認為內容頁根本不重要或是不是很重要，只要在後台把文章內容上傳上去讓其顯示就可以了。

其實一些大網站的權重流量都是靠這些內容頁撐起來的，我們每天更新文章顯示的一個界面，這個頁面的一個好的內容頁能夠給網站帶來某一特定詞的排名。

4、列表頁布局

手機網站建設的列表頁分為圖片列表和文章列表頁。圖片列表頁一般展示的是公司的案例或產品，一般圖文布局展示就可以了。文章列表頁展示的是公司的新聞或行業動態之類的文章，一般是新聞標題顯示布局就可以了。

6、怎麼製作手機網頁 如何製作一個手機html頁面

這個還用說，其實道理和PC端網站是一樣的道理。因為現在用戶慢慢轉向移動端，所以擁有一個移動網站也是很必要的。

其實自助建站自己做網站都是不成問題了，不管你懂不懂代碼，都可以做的。

首先，注冊一個凡科帳號，這是開始建站的第一步

第二，登錄帳號後，會有建站、互動、微傳單三塊，一個帳號都可以用，你選擇「網站建設」這一塊；

第三，進入後台之後，選擇自己喜歡的手機網站模板。

第四,就可以開始設計自己的網站，排版、欄目、文字、圖片等設計。第五，無論是否完全做好，先保存，再退出。第六，網站做好後，可以為網站添加需要的功能，拖拽就可以實現添加。

7、手機html網頁和電腦上的html網頁在製作上有什麼區別

1.導航設計

手機端頁面導航應當包括用戶必要的內容，刪除屏幕上不必要的鏈接，假如鏈接的詳細頁面內容不是用戶想要的，用戶不會點擊，也就沒必要設置。其中建立導航功能鍵的時候，其中以回到首頁、回到上一頁這兩個最為重要。

2.網站名稱或logo的設計

手機網頁的頂部沒有標題欄或地址欄，相應地，也就沒有網站標題和圖標。所以設計頁面的時候應該讓用戶知道，他們現在所瀏覽的網站名稱或logo，這對塑造品牌也很重要。 

3.頁面排版

從用戶角度來說，他們希望閱讀所有的內容，所以我們進行內容呈現，只是用隔斷、重組、引語、線條或其他視覺方案來讓這些內容更容易訪問，使這些板塊顯得更都雅。

4.利用手機的天生優勢

手機有著許多傳統電腦所沒有的優勢，其中最大的優勢就是移動力，因此手機版網頁應該要特別發揮這些特性，讓手機網頁具有一般網頁更多的優勢。如：

移動定位：大部分的智能設備都有導航、定位的機制，可以讓客戶主動找到企業的位置。

移動聯系：如果用使用的是行動電話，可以立即發話;或者直接跳轉到通訊工具在線聊天;

鄰近地點：如果企業有很多據點，請告訴用戶，在他附近有哪一些地點是便於他能夠抵達的。

8、怎麼製作網站的手機版？

可以去下載pageadmin建站系統或者wp系統來做，推薦pageamdin，這個支持pc和手機共享數據，或者你做成響應式網站就可以了。

9、這種手機網頁是怎樣製作的？

網站移動端製作原理：

1、域名解析一個m.xxx.com，綁定到伺服器上；

2、m.xxx.com放PC端的網站程序，資料庫直接連接PC資料庫；

3、移動模板對應PC模板，程序文件和pc一樣。只是資料庫是共用一個；

4、在PC頁面上面設置移動跳轉判斷，網上有PHP跳轉代碼；

5、你可以參考開源程序製作移動端，比如dedecms，帝國cms製作移動端，如果感覺比較麻煩了，那就直接把PC頁面重寫，頁面直接修改成響應式！

現在做網站手機站必須要做，手機上搜索越來越多。電腦站手機打開瀏覽網頁，體驗非常不好。目前手機網站製作有3種方法：

1、獨立域名手機站

這種手機站對優化排名比較好，也可以自己設計手機模板，專門買個空間放手機站程序，域名解析二級域名。　

2、自適應網站

這種網站體驗比較少，會根據屏幕大小，自動顯示不同的頁面布局。手機和電腦站用的一個模板。一個域名，對優化體驗非常好。

3、二級目錄手機站

這種比較常用的一種，電腦站域名後面加/wap，或者/m 。通過跳轉代碼，手機打開電腦站網址，自動進入手機站。內容和PC是同步的，管理也比較方法。

10、如何製作手機版網站

隨著智能手機的普及，手機網站的使用率和重要性也日益彰顯，2015年最新數據顯示，目前在所有的網站中,同時具有PC及移動端的網站佔了52%,首次超過了純PC端網站的43%,下面給我們就說一下手機網站的一般製作流程，它包含七個方面的知識，讓你避免走一些製作手機網頁的彎路。閱讀完成以下知識點，你就能對手機網頁的製作和設計有大概的了解，然後有針對性地學相應知識。
1.手機網頁的標記語言
WML ：
因為WML大部分針對早期和低端的手機，現在已經逐步被其他的技術取代了，現在學習手機網頁設計製作完全可以忽略WML。
XHTML：
未來智能手機的市場份額會越來越大，考慮到這點，現在進行手機網頁設計製作時，我們會用到更加熟悉的標記語言Xhtml。現在大部分智能手機的瀏覽器都能正確處理Xhtml，它會識別兩種類型的Html。
①Xhtml：基礎的，和桌面瀏覽器相同的Xhtml
②Xhtml-MP：針對智能手機的Xhtml
這兩種類型的不同之處，Xhtml-MP包含比較少的要素和相對寬松的限制，能適合手機平台的渲染，現在很多手機網頁設計製作直接用Xhtml，也沒什麼大問題。
2.手機類型
手機市場上既有非常高端的iPhone手機和谷歌的Android手機，也有諾基亞一些單色點陣顯示的低端機。這些低端機在瀏覽手機網頁時有很多的限制，如屏幕解析度、渲染Xhtml的性能等，因此如果你的手機網頁是針對這部分用戶，最好還是用WML。
另一方面，類似於iPhone和Nexus One這種高端智能機，擁有可以和桌面瀏覽器相媲美的渲染網頁的性能。對這部分用戶而言，良好的用戶體驗是很重要的，受限於手機的傳輸速度，如果直接用一般的電腦上瀏覽的網頁來代替手機網頁，對手機網頁的目標客戶來說，並非明智之舉
3.手機網頁的目標群體
任何網站設計網頁時都應該明白自己的目標群體，以便向他們傳輸最合適的信息。這點在進行手機網頁設計製作時更為重要。因為你不僅要知道你的目標群體，還要知道他們瀏覽手機網頁時的情景。瀏覽傳統的網站，訪客會坐在桌上，有著大解析度的屏幕。手機網頁的訪客則有可能是在排隊、等交車、坐在地鐵等。
手機網頁的目標群體，谷歌的開發者將看手機網頁人群分為三大類，這對我們進行手
機網頁的設計和製作，很有參考意義。
4.根據具體需要提供網站內容
一個很常見的誤區是很多網頁開發者認為只需要簡單的設置，就可以將一個傳統的網頁變成可以適應手機瀏覽的網頁，他們認為只需要在CSS樣式表將media=」screen」變成media=」handheld」就能使網頁神奇般地適用於手機。這是錯誤的想法。
雖然針對手機用戶變更網頁的CSS可以過濾一部分的內容，或者一些CMS網頁也提供了相應的轉換插件。但這些方案並不完善。
W3c定義了「一個網站」的概念，意思是手機網頁不一定要提供和傳統網站完全一樣的內容和設計，而是要根據手機的性能、帶寬等方面的不同提供一些差異化服務。
根據這個定義，一些傳統網頁的內容和功能不能在手機上實現是很合理的。不同手機
能處理的內容和功能也都是不一樣的。所以也可以根據這些手機進行相應的網頁製作。
5.選擇域名
為手機網頁選擇什麼域名取決於你的目標群體是如何進入網站的。這里有三種域名可
供選擇：
A：為手機網頁使用獨立域名
B:為手機網頁使用子域名
C：為手機網頁注冊mobi的頂級域名
D：判斷客戶端，並自動顯示對應內容
6.為手機網頁驗證標記語言
電腦的網頁瀏覽器對錯誤比較寬容，一些html標記的忘記書寫或者沒有正確嵌套在電腦瀏覽器都會正確顯示，當然容錯率高意味著消耗更高的cpu和內存。
手機瀏覽器的性能還無法和電腦相提並論，所以手機瀏覽器對手機網頁的錯誤要嚴格一些。所以在設計和製作手機網頁時，你必須不斷進行檢查、驗證和糾錯。驗證手機網頁和驗證一般傳統的網頁沒什麼區別，如果你使用Xhtml編寫，可以使用相同的工具。W3C驗證器可以驗證一些簡單的錯誤，當然這里有一個更適合驗證手機網頁的版本。
7.為手機網頁不斷測試
當通過了手機網頁的驗證之後，就要針對幾種不同的手機進行各種測試了。用電腦的
瀏覽器雖然可以進行模擬測試，但是並不完善。這種方式通過的手機網頁不能適用於某些手機。
有些手機文件尺寸的限制可能會很小，所以你製作的手機網頁在這些設備上甚至無法顯示。另外瀏覽器支持的文件類型也會不同，支持的圖像格式也會不同。測試時候手機網頁當然不可能擁有所有手機，所以製作網頁時可以使用一些替代手段。