相對于網站(zhàn)設計(jì)師(shī)與前端工程師(shī)分工合作(zuò),有(yǒu)些(xiē)前端還(hái)是喜歡獨挑大(dà)梁,因為(wèi)有(yǒu)些(xiē)設計(jì)師(shī)的設計(jì)習慣可(kě)能無法很(hěn)好地轉化成代碼,這樣會(huì)使得(de)前端工程師(shī)很(hěn)難與網站(zhàn)設計(jì)師(shī)共同完成一個(gè)項目。那(nà)麽我們應該如何解決這個(gè)問題呢?網站(zhàn)建設會(huì)給出一些(xiē)建議,可(kě)以讓前端工程師(shī)和(hé)網站(zhàn)設計(jì)師(shī)很(hěn)輕松的完成一個(gè)項目,提高(gāo)工作(zuò)進度。
1、前端工程師(shī)盡量早一些(xiē)熟悉項目
網頁設計(jì)師(shī)和(hé)前端工程師(shī)之間(jiān)一個(gè)比較大(dà)的問題便是他們經常在設計(jì)初稿完成之前各做(zuò)各的,個(gè)人(rén)完成項目。當然,這不是一個(gè)正确的工作(zuò)方式,雖然一開(kāi)始網站(zhàn)設計(jì)是由設計(jì)師(shī)來(lái)進行(xíng)的,但(dàn)是,前端工程師(shī)在這段時(shí)間(jiān)也應該和(hé)設計(jì)師(shī)套路如何組裝項目,畢竟兩個(gè)人(rén)關注的點也會(huì)不同,前端可(kě)能更加注重可(kě)用性和(hé)網站(zhàn)的整體(tǐ)功能,設計(jì)師(shī)會(huì)更加關注顔色、字體(tǐ)和(hé)圖像。
網站(zhàn)設計(jì)師(shī)和(hé)前端工程師(shī)在這段時(shí)間(jiān)盡可(kě)能多(duō)的交流,網站(zhàn)切換成代碼的可(kě)行(xíng)性;設計(jì)的作(zuò)品是否符合網絡允許的樣式。
2、文件清晰
網站(zhàn)設計(jì)人(rén)員經常做(zuò)的一件事便是準備和(hé)打包文件,那(nà)這個(gè)時(shí)候我們有(yǒu)沒有(yǒu)注意到這個(gè)細節,每次打包的文件都是以未标題1、未标題2幾十幾百個(gè)的壓縮在一起,把這樣子的文件提供給工程師(shī),工程師(shī)不僅要浪費時(shí)間(jiān)去尋找想要的文件還(hái)容易出錯。因此,無論我們使用哪種軟件,都應該适當的命名每個(gè)圖層。樣式、顔色、樣本和(hé)布局也應該在整個(gè)設計(jì)流程中保持一緻。
這樣,每一個(gè)項目,我們都以和(hé)這個(gè)項目相同的方式命名文件和(hé)樣式,以相同的方法來(lái)進行(xíng)分組和(hé)打包,這樣會(huì)為(wèi)這個(gè)項目省去大(dà)量的時(shí)間(jiān)。
3、使用浏覽器(qì)字體(tǐ)
通(tōng)常設計(jì)師(shī)會(huì)有(yǒu)喜歡的字體(tǐ)并以此來(lái)作(zuò)為(wèi)自己的默認字體(tǐ),但(dàn)是一般用戶是沒有(yǒu)這些(xiē)字體(tǐ)的,對于數(shù)字項目,請(qǐng)盡量選擇使用“浏覽器(qì)字體(tǐ)排版”。這樣會(huì)省很(hěn)多(duō)麻煩事,原因很(hěn)簡單,嵌入字體(tǐ)可(kě)能會(huì)很(hěn)棘手,此外,使用浏覽器(qì)自帶字體(tǐ)可(kě)以免費并且不會(huì)産生(shēng)額外的項目成本。做(zuò)這些(xiē)的時(shí)候,圖标也可(kě)以這樣考慮,直接使用CSS樣式的圖标而不是導入一堆圖像文件。
4、盡量壓縮一下圖像
當我們在討(tǎo)論圖像大(dà)小(xiǎo)的時(shí)候,在确保圖像清晰的前提下盡可(kě)能多(duō)的壓縮圖片大(dà)小(xiǎo),前端在需要什麽圖片的時(shí)候,設計(jì)師(shī)也可(kě)以提前問好然後打包給工程師(shī)。
這可(kě)以縮短(duǎn)工作(zuò)時(shí)間(jiān)并且圖片占的空(kōng)間(jiān)比較小(xiǎo),網站(zhàn)上(shàng)浏覽圖片加載速度也會(huì)比較快。 當然也不要問完前端需要哪張圖片然後全都自己搞,還(hái)需要詢問前端如何保存、命名和(hé)用哪種格式來(lái)進行(xíng)壓縮以獲得(de)更好的結果。
5、考慮環境
再設計(jì)網站(zhàn)或是移動應用程序時(shí),需要考慮許多(duō)設備的大(dà)小(xiǎo)和(hé)寬高(gāo)比。那(nà)麽作(zuò)為(wèi)一個(gè)網頁設計(jì)師(shī),您便需要知道(dào)畫(huà)布大(dà)小(xiǎo)、邊距、填充等,以創建實際可(kě)用的模闆。 在開(kāi)始繪圖之前,也請(qǐng)詢問一下前端工程師(shī),以确保在開(kāi)始之前了解設計(jì)環境的外觀。
6、了解一些(xiē)開(kāi)發基礎知識
當您與前端工程師(shī)交談并提出問題時(shí),您需要深入挖掘。如果您的設計(jì)庫中還(hái)沒有(yǒu)這些(xiē)技(jì)能,請(qǐng)學習一些(xiē)開(kāi)發基礎知識。
從事數(shù)字項目的網站(zhàn)設計(jì)師(shī)應該學習一下開(kāi)發基礎知識: HTML和(hé)CSS(您應該能夠更改字體(tǐ)大(dà)小(xiǎo)或顔色,并了解兩者是不同的)常見用戶模式(針對用戶與內(nèi)容的交互方式而設計(jì)) 可(kě)訪問性标準(因此您的設計(jì)将适用于更多(duō)用戶) 需要使用哪些(xiē)類型的元素作(zuò)為(wèi)圖像,哪些(xiē)元素可(kě)以使用純CSS創建。
網站(zhàn)設計(jì)趨勢在于您可(kě)能永遠不會(huì)編寫代碼,但(dàn)學習開(kāi)發基礎知識會(huì)使您成為(wèi)更好的網站(zhàn)設計(jì)者,因為(wèi)您了解工具種類和(hé)工作(zuò)流程。