作為一個(gè)小白。在公司實(shí)習(xí)的這段期間朦朦朧朧地學(xué)會(huì)了很多很多。 文件命名方面的注意問(wèn)題。文件好用英文命名,這便于后期同事的訪問(wèn)。 拿到設(shè)計(jì)圖時(shí),先打開(kāi)設(shè)計(jì)圖,看看有沒(méi)有公共部分之類的(一般是頭部nav和尾部footer),便于減少后續(xù)編寫(xiě)代碼的時(shí)間和繁瑣性。 在切取圖片之前,先按ctrl+1(photoshop的快捷鍵),這個(gè)快捷鍵可以使設(shè)計(jì)圖放大或縮小到設(shè)計(jì)圖原有的大小。這個(gè)就便于我們之后剪切出來(lái)的圖片是設(shè)計(jì)圖中正常像素(也就是設(shè)計(jì)師當(dāng)時(shí)所設(shè)計(jì)的像素)。 關(guān)于圖片切圖問(wèn)題。如果要圖片高清晰好使用jpg;不過(guò),一些特殊形狀圖片,如圓形,棱形好使用帶透明的png格式圖片。一般設(shè)計(jì)師所給的psd圖里的圖標(biāo)(微信、qq、微博等),這些一般是圓形圖片。這些的話個(gè)人建議使用第二種——帶透明的png格式圖片。 設(shè)計(jì)師所給的psd圖里面所需要的剪切的圖片,大部分都是以整數(shù)為寬高,所以剪切起來(lái)還是很方便的。但,有時(shí)如果設(shè)計(jì)師寬高少了1px(通常情況下是不可能發(fā)生的),也別多切1px。如果發(fā)現(xiàn)自己現(xiàn)在所剪切的圖片是以8或者9為位數(shù)的話。還是強(qiáng)烈建議你放大看看是不是少切了一點(diǎn)點(diǎn)(photoshop放大快捷鍵ctrl++)。 關(guān)于圖片大小問(wèn)題,如果在不同頁(yè)面看見(jiàn)相同的圖片,建議你是好用同一張,這樣可以節(jié)省內(nèi)存。 關(guān)于選區(qū)psd色系的方法。如果是文字的話,我是直接選中文字,然后查看以下信息。如圖1-1。
圖1-1
圖1-1中的紅色標(biāo)識(shí)符1代表文字的顏色、紅色標(biāo)識(shí)符2代表文字的字體、紅色標(biāo)識(shí)符3代表文字的大小、紅色標(biāo)識(shí)符4代表文字的行高、紅色標(biāo)識(shí)符5代表文字不加粗(如果是渾厚
的話即為字體需要加粗)。 關(guān)于圖片與圖片、文字與圖片、文字與文字之間的間距問(wèn)題。我一般是用選擇工具或者切片工具查看大小。之后再編寫(xiě)進(jìn)頁(yè)面里面,有時(shí)間的話,還可以展示頁(yè)面再利用電腦自帶,或者qq、微信所帶的剪切工具來(lái)與設(shè)計(jì)圖進(jìn)行像素對(duì)比。 關(guān)于html文件排版問(wèn)題。① 建議css、html、js都分開(kāi)存放。特殊情況下不能分開(kāi)的話,盡量js代碼、css代碼別和html內(nèi)容代碼混合在一起。
② html主要是編寫(xiě)頁(yè)面內(nèi)容,也就是用戶所看見(jiàn)的內(nèi)容。在實(shí)現(xiàn)設(shè)計(jì)師效果圖的基礎(chǔ)上,盡量做到代碼整潔、排版規(guī)律。這樣既便于自己發(fā)現(xiàn)錯(cuò)誤、也方便后臺(tái)同事后續(xù)工作。
我現(xiàn)在學(xué)到的基本就是這些,希望可以對(duì)你有所幫助。
網(wǎng)頁(yè)標(biāo)題:關(guān)于切圖(網(wǎng)站前端制作)的一些小常識(shí)
轉(zhuǎn)載注明:http://jinyejixie.com/news35/240735.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供建站公司、商城網(wǎng)站、外貿(mào)建站、電子商務(wù)、網(wǎng)站建設(shè)、全網(wǎng)營(yí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)