有很多人可以寫網(wǎng)頁，但不是每個人都是一個好的前端工程師。要成為一名的前端工程師，你必須具備網(wǎng)站用戶體驗優(yōu)化，包括網(wǎng)頁設計和完成。
作為一名UI設計師，在將完成稿與開發(fā)連接時，需求會對設計稿和切割圖進行標記，并將標記和切割圖的文件發(fā)送給開發(fā)。這個時分就犯難了，那么多尺寸怎樣切圖呢?
如何進行網(wǎng)頁切圖?網(wǎng)站制作切圖的標準是什么?
在網(wǎng)站建立制造中我們經(jīng)常會聽到定稿后我們就好進行切圖了，那么切圖到底是一個什么樣子的工作，讓我們的前端工程師告訴您。
切圖是網(wǎng)站制造過程中的一個術(shù)語、是前端工程師必備的一個根底技藝，切圖是將設計文稿轉(zhuǎn)化為HTML的過程。
在網(wǎng)站建立制造的過程中，網(wǎng)頁切圖是指講設計好的PSD文稿轉(zhuǎn)化成html的工作，應用DIV+CSS將設計文稿以網(wǎng)頁的方式表現(xiàn)出來，網(wǎng)頁切圖的切指的是將設計文稿中的圖片依據(jù)規(guī)劃的需求，應用Photoshop的切片工具將圖像在文稿中別離出來，配合DIV+CSS完成靜態(tài)頁面的制造。
標準一，文件標準。
1. HTML, CSS,js和images都存檔在系統(tǒng)開發(fā)目錄。
2.Html文件命名為英文名，后綴為html。同時將對應的接口放入相同的目錄中，如果命名為中文，則需要重命名和HTM文件。用于后端添加和實用程序查找。
3、CSS、js的命名也是如此。
id和class應該如何命名?
這個名字是能夠隨本人喜歡來起名，所以有一些人運用英文，拼音或者亂打幾個字母。固然說這樣子是能夠的，但是會招致本人和他人在后期的修正網(wǎng)站十分費事，就因找一個標簽也要頭暈了。我個人起名字是依照層次來起，下面舉個例子：
例如頭部我運用了head這個名字，然后頭部能夠分為寄存logo和寄存導航條兩局部。這兩個局部我就會運用head_1、head_2來表示，然后在寄存logo的局部有可能分為左右一邊是logo一邊是廣告或者搜索欄，我就會起名為：head_1_left、head_1_right來表示。這樣子的css代碼有時分我們在修正也無需翻到html頁面看，直接依照款式的名字就能夠看出來了。
二、合理運用標簽有助于網(wǎng)站的收錄和SEO優(yōu)化
我們舉一個例子，有時分一個新聞內(nèi)容板塊的html里面，很多人都會直接在div中間寫上文字，然后給這一個div進行款式的控制：
新聞內(nèi)容
。固然這樣子是完整能夠完成功用，但是在搜索引擎眼中并不以為這個就是一個正文內(nèi)容而是代碼之類的，所以我們在寫這個的時分記住合理運用p標簽，如上面的新聞內(nèi)容應該寫為：
新聞內(nèi)容
。在我們合理運用標簽的時分一方面能夠讓人覺得到你是用心來做這個網(wǎng)頁的排版，更重要的是讓這個網(wǎng)站后期的優(yōu)化事半功倍。下面給大家總結(jié)一下本人覺得上要加的標簽：
h1：一個網(wǎng)頁的主題，在一個頁面里面只能呈現(xiàn)一個。權(quán)重僅次于網(wǎng)站標題，所以盡量單純把本人網(wǎng)站建立的主關(guān)鍵詞放在里面。假如關(guān)鍵詞包在一個句子里面如這篇文章的標題，我們能夠?qū)懗扇缦拢?/div>
如何進行網(wǎng)頁切圖?
網(wǎng)站建設
切圖的標準是什么?
h2-h3：在網(wǎng)頁里面普通運用到h3就足夠了，后面的h4-h6普通都不會再運用。這些兩個標簽我們需求合理布置，h2表示一個頁面里面的欄目，h3表示在這個欄目里面的子欄目或者文章。
p：p標簽為段落標簽，我們也能夠說他是內(nèi)容標簽。這個標簽里面的才是真正的內(nèi)容。
alt：搜索引擎是不會看圖片的，我們必需要為他闡明這個圖片表示的是什么，所以我們留意在每一張圖片上為他闡明。
title：這個標簽是用在a標簽里面的，普通很少人運用。但是我們要統(tǒng)籌搜索引擎的優(yōu)化所以我們必需要留意給搜索引擎一個簡單精準的闡明，例如說一篇文章標題是“說說彭健本人對網(wǎng)站排版的時分要留意的一些事情”。然后我們的代碼應該寫成
把更精準簡短可以闡明這條標題的意義寫下即可。
nane：這個標簽置信沒幾個人會留意到。這個名字標簽能夠說是直接跟搜索引擎說話的標簽。他也是用在a里面，他是通知搜索引擎，進入這個超鏈接里面是什么東西。就如上面的標題我們能夠?qū)懗桑?/div>
strong：這個是重要標簽，這個的樣子跟b標簽一樣。很多做seo而不懂代碼的人他們曉得每一篇文章要把重要的關(guān)鍵詞加粗，但是他們總是以為這個加粗是b標簽。其實這個加粗是strong標簽。我們能夠幫我們網(wǎng)頁的重要關(guān)鍵詞加上這個標簽，然后在css里面設置他跟普通的字一樣，在正常閱讀的時分并不會有什么影響，但是其實他曾經(jīng)優(yōu)化了。
上面的總結(jié)是作者自己在排版總結(jié)中的頁面布局。當我們?nèi)プ鲆粋€web前端工程師,你可以簡單地理解代碼,但當我們想做一個網(wǎng)站構(gòu)建的操作的web前端工程師,我們還必需統(tǒng)籌到程序員看到后的感受和網(wǎng)站對搜索引擎優(yōu)化的難易。更多關(guān)于濟南網(wǎng)站建設的相關(guān)內(nèi)容，請點擊網(wǎng)站：
http://m.danieladamgreen.com
