端網(wǎng)頁(yè)設(shè)計(jì)
提問(wèn)問(wèn)題
列表
-
設(shè)計(jì)手機(jī)網(wǎng)站時(shí),一般寬度設(shè)計(jì)為多少像素?
查看答案>>
-
已經(jīng)做好的pc版網(wǎng)頁(yè),如何轉(zhuǎn)成手機(jī)端的?
查看答案>>
-
手機(jī)html網(wǎng)頁(yè)和電腦上的html網(wǎng)頁(yè)在制作上有什么區(qū)別
查看答案>>
-
手機(jī)端網(wǎng)頁(yè)設(shè)計(jì)尺寸多少
查看答案>>
-
手機(jī)網(wǎng)頁(yè)設(shè)計(jì)多大好?
查看答案>>
設(shè)計(jì)手機(jī)網(wǎng)站時(shí),一般寬度設(shè)計(jì)為多少像素?
手機(jī)網(wǎng)站最好是用百分比全屏自適用的方式做,那樣不管手機(jī)是什么分辨率都可以使用。一般android系統(tǒng)設(shè)計(jì)的時(shí)候可以使用320x480的分辨率進(jìn)行設(shè)計(jì)。蘋(píng)果手機(jī)使用:640x960分辨率進(jìn)行設(shè)計(jì)。屏幕大小由寬度和高度兩個(gè)因素決定,但是在布局手機(jī)客戶(hù)端的過(guò)程中,最關(guān)心的是寬度值。寬度確定后,高度可以由滾動(dòng)或者翻頁(yè)來(lái)顯示所有內(nèi)容;文字可以在適當(dāng)?shù)奈恢谜坌校粯?biāo)題欄可以伸縮適配屏幕寬度等等。但并不是不考慮高度,圖標(biāo)、文字、特殊的組件不僅需要考慮寬度,也需要考慮整個(gè)屏幕的布局是否與之適配。由于不可能對(duì)所有的客戶(hù)端進(jìn)行單獨(dú)的開(kāi)發(fā),因此,需要對(duì)手機(jī)屏幕的大小的歸類(lèi)。同時(shí),在設(shè)計(jì)中也不會(huì)真的只考慮屏幕大小一個(gè)因素,屏幕大小和操作系統(tǒng)、手機(jī)類(lèi)型等還是存在很大的相關(guān)性的。
已經(jīng)做好的pc版網(wǎng)頁(yè),如何轉(zhuǎn)成手機(jī)端的?
可以使用手機(jī)最高分辨率,設(shè)備默認(rèn)分辨率,或者自己指定210dpi等等參數(shù)。其次就是布局的響應(yīng)式問(wèn)題,這就是你基本技術(shù)的一次改變,可能會(huì)復(fù)雜一些了。這需要慢慢修改。例如如果將虛擬網(wǎng)頁(yè)頁(yè)面布局劃分為5列,當(dāng)實(shí)際屏幕的像素?cái)?shù)在500以下時(shí)你可能每行只顯示3列,然后另外兩列則變成了插入的第二行了?;蛘邎D片都應(yīng)該有一些通用的自動(dòng)適應(yīng)外邊容器的寬度和高度的css?;蛘卟煌直媛氏碌牟煌瑯I(yè)務(wù)部分(用class區(qū)分)字體的字體的自動(dòng)變大。這樣才能保證(上述列寬自動(dòng)調(diào)整之類(lèi)的)自動(dòng)排版下的頁(yè)面顯示的內(nèi)容比較清晰易讀、留白比較合理。這個(gè)層次需要進(jìn)行統(tǒng)一的設(shè)計(jì)。
手機(jī)html網(wǎng)頁(yè)和電腦上的html網(wǎng)頁(yè)在制作上有什么區(qū)別
在工具上,手機(jī)版網(wǎng)頁(yè)和電腦版網(wǎng)頁(yè)沒(méi)有什么區(qū)別,可以根據(jù)自己的喜好。我是喜歡用Dreamweaver的,而且Dreamweaver cs6有個(gè)多屏預(yù)覽的功能,可以很方便的預(yù)覽手機(jī)、平板、PC端的效果。不過(guò)Dreamweaver 挺大的,還有很多比較快比較好的編輯器,比如EditPlus,這還是看個(gè)人的習(xí)慣和喜好了。推薦一個(gè)編輯器sublime text,我自己覺(jué)得超好用。在代碼方面的話(huà):首先得加上這樣的一行。設(shè)置寬度、高度、是否能夠縮放。<meta name="viewport" content="width=device-width,inital-scale=1.0,minimum-scale=0.5,maximum-scale=2.0,user-scalable=no">然后,主要是要考慮適配。比較好的是做到自適應(yīng)。這個(gè)可以搜一下,我記得月光博客里面就有篇很詳細(xì)的。其次,可以用@media only screen and(min-device-width : 320px) and(max-device-width : 480px){ }來(lái)對(duì)不同像素的屏幕寫(xiě)不同的樣式??梢钥聪轮醯牡卿涰?yè)面,用的就是@media。再然后要考慮的是用戶(hù)體驗(yàn)。簡(jiǎn)單的拿個(gè)鏈接來(lái)說(shuō),在PC端因?yàn)橛惺髽?biāo),很容易點(diǎn)到??墒鞘謾C(jī)端就不一樣,就幾個(gè)字的鏈接很難點(diǎn)到,所以就要擴(kuò)大點(diǎn)的面積。這就是為什么會(huì)出現(xiàn)電腦版的網(wǎng)頁(yè)和手機(jī)版網(wǎng)頁(yè)。其實(shí)做手機(jī)版的網(wǎng)頁(yè)有個(gè)好處就是可以大量的使用HTML5和CSS3,這樣能做出很多效果。對(duì)于這些的話(huà),看附件里面的學(xué)習(xí)方法有幫助的很抱歉,回答者上傳的附件已失效
手機(jī)端網(wǎng)頁(yè)設(shè)計(jì)尺寸多少
iPhone手機(jī)網(wǎng)頁(yè)的設(shè)計(jì)尺寸iPhone5尺寸是640x1136px分辨率是326PPIiPhone4和iPhone4S尺寸是640x960px分辨率是326PPIiPhone和iPodTouch第一代、第二代、第三代尺寸是320x480px分辨率是163PPI安卓網(wǎng)頁(yè)的設(shè)計(jì)尺寸320dp:一個(gè)普通的手機(jī)屏幕(240X320,320×480,480X800)480dp:一個(gè)中間平板電腦像(480×800)600dp:7寸平板電腦(600×1024)720dp:10寸平板電腦(720×1280,800×1280)ipad網(wǎng)頁(yè)的設(shè)計(jì)尺寸iPad第三代第四代尺寸是2048x1536px分辨率是264PPIiPad第一代第二代尺寸是1024x768px分辨率是132PPIiPad Mini尺寸是1024x768px分辨率是163PPI
手機(jī)網(wǎng)頁(yè)設(shè)計(jì)多大好?
wap頁(yè)面設(shè)計(jì)一般都是寬度自適應(yīng)的,最窄以兼容320px為標(biāo)準(zhǔn),最寬1280px為標(biāo)準(zhǔn),一般的智能手機(jī)寬度都是320,480,640這些,其中iPhone就不用說(shuō)了吧,必須是480px,其他三星啊,htc啊什么的,各類(lèi)分辨率都有,基本不會(huì)比480低,但是之前剛開(kāi)始的一些智能手機(jī)大部分都是320,所有要兼容320哦~~~
熱門(mén)問(wèn)答
- 模版還是模板
- 免費(fèi)建站
- 淘寶網(wǎng)頁(yè)是哪個(gè)公司做的
- 免費(fèi)制作企業(yè)
- 簡(jiǎn)單個(gè)人網(wǎng)站模板
- 制作網(wǎng)站的的網(wǎng)站
- 怎么學(xué)網(wǎng)頁(yè)設(shè)計(jì)
- html模板文件
- 手機(jī)網(wǎng)站的優(yōu)化
- 什么是排版設(shè)計(jì)
- 廣告公司網(wǎng)站制作
- 網(wǎng)站優(yōu)化是什么
- 怎么用手機(jī)制作簡(jiǎn)歷
- 武漢建設(shè)網(wǎng)站
- 網(wǎng)站建設(shè)公司怎么樣
- seo優(yōu)化培訓(xùn)
- 網(wǎng)站的建設(shè)哪家好
- 制作簡(jiǎn)歷圖片
- 什么是網(wǎng)絡(luò)推廣優(yōu)化
- 網(wǎng)頁(yè)制作學(xué)那些