正文

web端和移動端的區(qū)別（web端與移動端區(qū)別）

發(fā)布時(shí)間：2023-04-18 23:30:58 稿源：創(chuàng)意嶺閱讀： 107

大家好！今天讓創(chuàng)意嶺的小編來大家介紹下關(guān)于web端和移動端的區(qū)別的問題，以下是小編對此問題的歸納整理，讓我們一起來看看吧。

開始之前先推薦一個(gè)非常厲害的Ai人工智能工具，一鍵生成原創(chuàng)文章、方案、文案、工作計(jì)劃、工作報(bào)告、論文、代碼、作文、做題和對話答疑等等

只需要輸入關(guān)鍵詞，就能返回你想要的內(nèi)容，越精準(zhǔn)，寫出的就越詳細(xì)，有微信小程序端、在線網(wǎng)頁版、PC客戶端

官網(wǎng)：https://ai.de1919.com。

創(chuàng)意嶺作為行業(yè)內(nèi)優(yōu)秀的企業(yè)，服務(wù)客戶遍布全球各地，如需了解SEO相關(guān)業(yè)務(wù)請撥打電話175-8598-2043，或添加微信：1454722008

本文目錄:

1、Web前端pc和移動端的區(qū)別
2、web端和pc端有什么區(qū)別
3、在設(shè)計(jì)模式中，web端和移動端的共同之處和區(qū)別
4、web和移動端測試的區(qū)別

web端和移動端的區(qū)別（web端與移動端區(qū)別）

一、Web前端pc和移動端的區(qū)別

pc，我們需要考慮五大瀏覽器，ie6-11，firefox，chrome，safari都得兼容的吧。css還是js，以及各種框架。

mobile的網(wǎng)頁開發(fā)，我們需要考慮什么呢？

就目前來說，我們只需要考慮webkit內(nèi)核的瀏覽器和chrome，uc，qq，小米手機(jī)瀏覽器就好了

1、PC端在開發(fā)過程中考慮的是瀏覽器兼容性，移動端開發(fā)中考慮的是手機(jī)兼容性問題，做移動端開發(fā)，更多考慮的是手機(jī)分辨率的自適應(yīng)和不同手機(jī)操作系統(tǒng)的略微差異化；

2、在部分事件的處理上，移動端自然是偏向于觸屏的，另外包括移動端彈出的手機(jī)鍵盤該如何處理，這樣的問題在PC上肯定不會遇到，但在移動端，如果你沒有經(jīng)驗(yàn)，處理起來是相當(dāng)麻煩的；

3、布局上，移動端開發(fā)是要做到頁面布局自適應(yīng)的，而PC端頁面布局的比例會相對固定；

4、在動畫效果處理上，PC端要考慮IE的兼容性，通常用JS做動畫的通用性會好一些，但相比CSS3卻犧牲了較大的性能，而在手機(jī)端，如果要做一些動畫、特效等，第一選擇肯定是CSS3，既簡單，效率又高。

在實(shí)際中肯定還有其他一些不常見的問題

二、web端和pc端有什么區(qū)別

1、操作方式不同

PC端的操作方式與移動端已經(jīng)有了明顯的差別，PC端使用鼠標(biāo)操作，操作包含滑動、左擊、右擊、雙擊操作，操作相對來說單一，交互效果相對較少。

而對于手機(jī)端來說，包含手指操作點(diǎn)擊、滑動、雙擊、雙指放大、雙指縮小、五指收縮和蘋果最新的3Dtouch按壓力度，除了手指操作外還可以配合傳感器完成搖一搖、陀懸儀感應(yīng)燈操作方式，操作方式更加的豐富，通過這些豐富的操作可設(shè)計(jì)不同新穎吸引人的交互互動設(shè)計(jì)。

2、屏幕尺寸不同

PC端屏幕大，所以他的視覺范圍更廣，可設(shè)計(jì)的地方更多，設(shè)計(jì)性更強(qiáng)，相對來說容錯度更高一些有一些小的紕漏不容易被發(fā)現(xiàn)。

移動端設(shè)備相對來說屏幕較小，操作局限性大，在設(shè)計(jì)上可用空間顯得尤為珍貴，在小小的屏幕上使用粗大的手指操作也需要在設(shè)計(jì)中避免原件過小過近。

web端和移動端的區(qū)別（web端與移動端區(qū)別）

3、網(wǎng)絡(luò)環(huán)境不同

當(dāng)下不管是移動端還是PC端都離不開網(wǎng)絡(luò)，PC端設(shè)備連接網(wǎng)絡(luò)更加穩(wěn)定，而移動端可能遇到信號問題導(dǎo)致網(wǎng)絡(luò)環(huán)境不佳，出現(xiàn)網(wǎng)速差甚至斷網(wǎng)的問題，這就需要在設(shè)計(jì)中充分考慮網(wǎng)絡(luò)問題，更好的設(shè)計(jì)相應(yīng)的解決方案。

三、在設(shè)計(jì)模式中，web端和移動端的共同之處和區(qū)別

多了去了。舉幾個(gè)：

操作尺度。PC上鼠標(biāo)的操作尺度比較小，點(diǎn)擊是一件準(zhǔn)確的事情；

觸屏的操作尺度就比較大，點(diǎn)擊誤差大，所以元素必須往大了做，也不支持hover事件。

這一點(diǎn)淘寶網(wǎng)頁的PC版和手機(jī)版是個(gè)非常良好的例子。PC淘寶中有些小按鈕能放下的功能，移動版就必須另彈界面讓用戶詳細(xì)輸入。

界面布局。移動端屏幕相對窄小，一般是單列，最多也只能是雙列+響應(yīng)式。PC端屏幕寬大，布局可以靈活一些。

與Native App互動。Web App與移動App間的互動，大多數(shù)PC網(wǎng)站沒有，因?yàn)榇蠖鄶?shù)PC網(wǎng)站沒有對應(yīng)的專門程序（不過也有淘寶或QQ等例外的例子）。

例如淘寶手機(jī)版調(diào)用淘寶手機(jī)客戶端，PC版淘寶調(diào)用阿里旺旺聊天工具。

開發(fā)工具。移動端開發(fā)有一些jquery for mobile一類的庫是專用的，不用于PC端。反過來也一樣，有些PC端的工具在移動端不好用。

等等很多。其實(shí)移動端web app，很接近移動端原生的app的外觀和行為模式。比照移動原生app來理解web app就容易得多。

四、web和移動端測試的區(qū)別

一個(gè)是pc端測試一個(gè)是移動端測試