做網(wǎng)站編程的初期準(zhǔn)備工作

2021-05-22    分類(lèi): 做網(wǎng)站

做網(wǎng)頁(yè)的第一步就是從美工那邊獲取到網(wǎng)頁(yè)的模板(*.PSD文件),在網(wǎng)頁(yè)頁(yè)面的制作之前,我們需要對(duì)其進(jìn)行切片處理。
為什么要切片?可能很多人一開(kāi)始都會(huì)有這樣的疑問(wèn),網(wǎng)頁(yè)上的圖片最后要呈現(xiàn)給用戶的就是一個(gè)完整的樣子,為什么要浪費(fèi)大量時(shí)間和精力,又承擔(dān)著排版布局極容易出錯(cuò)的風(fēng)險(xiǎn)來(lái)做這項(xiàng)“無(wú)用功”?最主要的問(wèn)題是效率。大家都知道,頁(yè)面的呈現(xiàn)過(guò)程是先有客戶端(用戶瀏覽器輸入U(xiǎn)RL)向服務(wù)器遞交瀏覽申請(qǐng),然后服務(wù)器獲取URL相對(duì)應(yīng)的資源在通過(guò)網(wǎng)絡(luò)返還給客戶端。這中間就存在了一個(gè)下載資源的過(guò)程。而整張圖片或者大塊圖片的下載很顯然可能導(dǎo)致下載過(guò)程中頁(yè)面出現(xiàn)難看的條痕等影響界面友好度的問(wèn)題,而小圖片的下載效率在多年來(lái)的測(cè)試中已經(jīng)被所有網(wǎng)頁(yè)設(shè)計(jì)者認(rèn)可。除此之外,切片后的頁(yè)面能更好的對(duì)頁(yè)面元素進(jìn)行定位,你能想象用類(lèi)似坐標(biāo)定位的方法在一整張圖片上面去定位每一個(gè)頁(yè)面元素的位置是一個(gè)什么樣的工程嗎?
切片時(shí)很重要的環(huán)節(jié)。切片的時(shí)候是一個(gè)意識(shí)上對(duì)整個(gè)頁(yè)面進(jìn)行布局分析的過(guò)程,同樣的一張模板,不同的人會(huì)有不同的切法,理由很簡(jiǎn)單,因?yàn)槊總€(gè)人都有自己的布局習(xí)慣,有些人習(xí)慣table布局,有些人則擅長(zhǎng)div+css,也有人習(xí)慣介于兩者之間的布局方式(關(guān)于table和div+css的對(duì)比,暫且放下不談)。由于兩者對(duì)布局設(shè)計(jì)思想的要求完全不同,切片時(shí)就可能出現(xiàn)很多細(xì)節(jié)上的不同。由此也就能推斷,網(wǎng)頁(yè)的切片會(huì)影響整個(gè)頁(yè)面的排布,只有在切片階段仔細(xì)考慮到后期排布的問(wèn)題,才能使后面的工作有條不紊的展開(kāi)。
具體切片的方法,我在這里只是說(shuō)一下我一直以來(lái)用的方法。
1.拿到一個(gè)模板,先盡可能用最簡(jiǎn)單的一個(gè)table把它的各個(gè)板塊劃開(kāi),然后直接用PS生成一個(gè)頁(yè)面1。
2.用DW打開(kāi)生成的HTML,把圖片全部轉(zhuǎn)為背景(有技巧可以偷懶的哦,別傻傻的一個(gè)一個(gè)去換啊)
3.在用PS打開(kāi)相應(yīng)的一小塊一小塊的gif圖片進(jìn)行最終的切片并生成一個(gè)個(gè)html,復(fù)制里面的table放置到頁(yè)面1相應(yīng)的td中就能達(dá)到最終拼完頁(yè)面的效果了。

可能整個(gè)過(guò)程看來(lái)簡(jiǎn)單,但具體的操作還是需要多聯(lián)系才能真正體會(huì)到拼圖的技巧。希望這篇文章能對(duì)大家學(xué)習(xí)切片拼頁(yè)面有所幫助。也希望有更有效直接的方法能說(shuō)出來(lái)哦。

名稱欄目:做網(wǎng)站編程的初期準(zhǔn)備工作
地址分享:http://m.kartarina.com/news9/114659.html

網(wǎng)站建設(shè)、網(wǎng)絡(luò)推廣公司-創(chuàng)新互聯(lián),是專(zhuān)注品牌與效果的網(wǎng)站制作,網(wǎng)絡(luò)營(yíng)銷(xiāo)seo公司;服務(wù)項(xiàng)目有做網(wǎng)站

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來(lái)源: 創(chuàng)新互聯(lián)

微信小程序開(kāi)發(fā)
主站蜘蛛池模板: 亚洲熟妇无码一区二区三区| 亚洲AV无码男人的天堂| 无码任你躁久久久久久老妇| 国产av无码专区亚洲av果冻传媒| 亚洲中文字幕久久精品无码VA| 国产精品无码久久久久久久久久| 精品人妻系列无码天堂| 亚洲AV成人无码久久精品老人| 国产成人无码免费网站| 一本大道久久东京热无码AV| 国产精品无码久久av不卡| 一本色道无码道在线观看| 亚洲av无码成人精品国产| 无码人妻黑人中文字幕| 无码精品国产一区二区三区免费| 丰满少妇被猛烈进入无码| 日韩少妇无码喷潮系列一二三| 久久老子午夜精品无码| 国精品无码A区一区二区| 一本加勒比hezyo无码专区| 久久久久久久久免费看无码| 国产成人无码免费看片软件| 色综合久久久无码中文字幕| 中文字幕亚洲精品无码| 国产强被迫伦姧在线观看无码| 成人免费午夜无码视频| 中文字幕无码日韩欧毛| 免费A级毛片无码无遮挡内射| 无码少妇一区二区性色AV | 亚洲日韩精品无码专区网站| 亚洲精品久久无码av片俺去也| 久久精品无码一区二区WWW| 少妇人妻偷人精品无码视频新浪| 亚洲AV无码成人精品区在线观看 | a级毛片免费全部播放无码| 亚洲免费无码在线| 亚洲国产精品无码av| 亚洲性无码AV中文字幕| 亚洲精品无码av中文字幕| 国产成人无码aa精品一区| 国产精品毛片无码|