程序員(yuán)這(zhè)樣高(gāo)效制作網站

　　相對(duì)于網站設計師與前端工程師分(fēn)工合作，有些前端還(hái)是喜歡獨挑大(dà)梁，因爲有些設計師的(de)設計習(xí)慣可(kě)能無法很好地轉化(huà)成代碼，這(zhè)樣會使得(de)前端工程師很難與網站設計師共同完成一個(gè)項目。那麽我們應該如何解決這(zhè)個(gè)問題呢(ne)?網站建設會給出一些建議(yì)，可(kě)以讓前端工程師和(hé)網站設計師很輕松的(de)完成一個(gè)項目，提高(gāo)工作進度。

　　1、前端工程師盡量早一些熟悉項目

　　網頁設計師和(hé)前端工程師之間一個(gè)比較大(dà)的(de)問題便是他(tā)們經常在設計初稿完成之前各做(zuò)各的(de)，個(gè)人(rén)完成項目。當然，這(zhè)不是一個(gè)正确的(de)工作方式，雖然一開始網站設計是由設計師來(lái)進行的(de)，但是，前端工程師在這(zhè)段時(shí)間也(yě)應該和(hé)設計師套路如何組裝項目，畢竟兩個(gè)人(rén)關注的(de)點也(yě)會不同，前端可(kě)能更加注重可(kě)用(yòng)性和(hé)網站的(de)整體功能，設計師會更加關注顔色、字體和(hé)圖像。

　　網站設計師和(hé)前端工程師在這(zhè)段時(shí)間盡可(kě)能多(duō)的(de)交流，網站切換成代碼的(de)可(kě)行性;設計的(de)作品是否符合網絡允許的(de)樣式。

　　2、文件清晰

　　網站設計人(rén)員(yuán)經常做(zuò)的(de)一件事便是準備和(hé)打包文件，那這(zhè)個(gè)時(shí)候我們有沒有注意到這(zhè)個(gè)細節，每次打包的(de)文件都是以未标題1、未标題2幾十幾百個(gè)的(de)壓縮在一起，把這(zhè)樣子的(de)文件提供給工程師，工程師不僅要浪費時(shí)間去尋找想要的(de)文件還(hái)容易出錯。因此，無論我們使用(yòng)哪種軟件，都應該适當的(de)命名每個(gè)圖層。樣式、顔色、樣本和(hé)布局也(yě)應該在整個(gè)設計流程中保持一緻。

　　這(zhè)樣，每一個(gè)項目，我們都以和(hé)這(zhè)個(gè)項目相同的(de)方式命名文件和(hé)樣式，以相同的(de)方法來(lái)進行分(fēn)組和(hé)打包，這(zhè)樣會爲這(zhè)個(gè)項目省去大(dà)量的(de)時(shí)間。

　　3、使用(yòng)浏覽器字體

　　通(tōng)常設計師會有喜歡的(de)字體并以此來(lái)作爲自己的(de)默認字體，但是一般用(yòng)戶是沒有這(zhè)些字體的(de)，對(duì)于數字項目，請盡量選擇使用(yòng)“浏覽器字體排版”。這(zhè)樣會省很多(duō)麻煩事，原因很簡單，嵌入字體可(kě)能會很棘手，此外，使用(yòng)浏覽器自帶字體可(kě)以免費并且不會産生額外的(de)項目成本。做(zuò)這(zhè)些的(de)時(shí)候，圖标也(yě)可(kě)以這(zhè)樣考慮，直接使用(yòng)CSS樣式的(de)圖标而不是導入一堆圖像文件。

　　4、盡量壓縮一下(xià)圖像

　　當我們在討(tǎo)論圖像大(dà)小的(de)時(shí)候，在确保圖像清晰的(de)前提下(xià)盡可(kě)能多(duō)的(de)壓縮圖片大(dà)小，前端在需要什(shén)麽圖片的(de)時(shí)候，設計師也(yě)可(kě)以提前問好然後打包給工程師。

　　這(zhè)可(kě)以縮短工作時(shí)間并且圖片占的(de)空間比較小，網站上浏覽圖片加載速度也(yě)會比較快(kuài)。 當然也(yě)不要問完前端需要哪張圖片然後全都自己搞，還(hái)需要詢問前端如何保存、命名和(hé)用(yòng)哪種格式來(lái)進行壓縮以獲得(de)更好的(de)結果。

　　5、考慮環境

　　再設計網站或是移動應用(yòng)程序時(shí)，需要考慮許多(duō)設備的(de)大(dà)小和(hé)寬高(gāo)比。那麽作爲一個(gè)網頁設計師，您便需要知道畫(huà)布大(dà)小、邊距、填充等，以創建實際可(kě)用(yòng)的(de)模闆。 在開始繪圖之前，也(yě)請詢問一下(xià)前端工程師，以确保在開始之前了(le)解設計環境的(de)外觀。

　　6、了(le)解一些開發基礎知識

　　當您與前端工程師交談并提出問題時(shí)，您需要深入挖掘。如果您的(de)設計庫中還(hái)沒有這(zhè)些技能，請學習(xí)一些開發基礎知識。

　　從事數字項目的(de)網站設計師應該學習(xí)一下(xià)開發基礎知識： HTML和(hé)CSS(您應該能夠更改字體大(dà)小或顔色，并了(le)解兩者是不同的(de))常見用(yòng)戶模式(針對(duì)用(yòng)戶與内容的(de)交互方式而設計) 可(kě)訪問性标準(因此您的(de)設計将适用(yòng)于更多(duō)用(yòng)戶) 需要使用(yòng)哪些類型的(de)元素作爲圖像，哪些元素可(kě)以使用(yòng)純CSS創建。

　　網站設計趨勢在于您可(kě)能永遠(yuǎn)不會編寫代碼，但學習(xí)開發基礎知識會使您成爲更好的(de)網站設計者，因爲您了(le)解工具種類和(hé)工作流程。