2014-07-11 分類: 網(wǎng)站建設(shè)
CSS可以為設(shè)計(jì)者的一個(gè)非常強(qiáng)大的標(biāo)記語(yǔ)言。
然而,CSS是生產(chǎn)一樣是由設(shè)計(jì)師創(chuàng)建的代碼的原則。
雖然你可能會(huì)認(rèn)為,任何人都可以寫(xiě)出的CSS,有寫(xiě)CSS和生產(chǎn)的CSS的一大區(qū)別。
確保你在正確的軌道上,這里有八個(gè)CSS的原則,每一個(gè)網(wǎng)頁(yè)設(shè)計(jì)師應(yīng)該如下。
1?;〞r(shí)間去驗(yàn)證
如果你打算花時(shí)間在css編碼,所以花時(shí)間驗(yàn)證代碼 你創(chuàng)建的。 然而,讓我吃驚的是,許多設(shè)計(jì)師跳過(guò)這個(gè)重要的步驟。驗(yàn)證你的代碼讓你清理任何問(wèn)題并確保它會(huì)為你的訪問(wèn)者的工作。
除了驗(yàn)證你的CSS文件,你也應(yīng)該驗(yàn)證您的HTML或XHTML文件。 之前驗(yàn)證這些文件,確保你有時(shí)間適當(dāng)?shù)腍TML或XHTML文檔類型聲明。聲明DOCTYPE可能看起來(lái)像一個(gè)平凡的細(xì)節(jié),但我不能指望我有挫折的設(shè)計(jì)師繼續(xù)設(shè)計(jì)有問(wèn)題的討論很多,才發(fā)現(xiàn),這是因?yàn)樗麄円呀?jīng)宣布過(guò)時(shí)的DOCTYPE(或根本沒(méi)有聲明DOCTYPE)。
2。文件(而不是在你的代碼)
無(wú)論你是工作在一個(gè)單獨(dú)的項(xiàng)目或一個(gè)團(tuán)隊(duì)的設(shè)計(jì)師,這是你創(chuàng)建的文件的工作重要。 你可以看到為什么這會(huì)在一個(gè)設(shè)計(jì)團(tuán)隊(duì)的背景是重要的,但你可能想知道為什么它會(huì)如果你工作在一個(gè)獨(dú)奏項(xiàng)目的事。 好,總有一個(gè)機(jī)會(huì),你的獨(dú)奏項(xiàng)目最終將演變成一個(gè)集體項(xiàng)目,如果發(fā)生這種情況,它很容易有文件在手比試圖走回頭路,創(chuàng)造它。 然而,即使你的項(xiàng)目仍然是一一人表演,你可以在如何有用的文件當(dāng)你決定重新審視一個(gè)項(xiàng)目后,不是看它一年驚訝。
當(dāng)談到創(chuàng)建CSS代碼文檔,大多數(shù)設(shè)計(jì)師的自然沖動(dòng)是直接加入到他們的代碼放置/*和*/之間。 喜歡這個(gè)名單的原則很多,有采用這種方法沒(méi)有什么技術(shù)上是不正確的。 然而,直接加入到你的CSS代碼注釋會(huì)增加文件的大小,從而增加加載時(shí)間,減緩了網(wǎng)站的整體性能。 如果你對(duì)寫(xiě)作頂尖的CSS代碼的嚴(yán)重,你應(yīng)該記錄你的代碼,但在一個(gè)單獨(dú)的文件。
雖然我真的相信這是更有效地在一個(gè)單獨(dú)的文件,我知道有人不同意這種做法的文件很多。 如果你拒絕在一個(gè)單獨(dú)的文件,你可以做下一個(gè)事情是使用CSS壓縮機(jī)(事實(shí)上,即使你選擇使用一個(gè)單獨(dú)的文件中的文件,你仍然可以通過(guò)使用CSS壓縮機(jī)的好處)。 可以使用這CSS壓縮機(jī)從CSS驅(qū)動(dòng)的畫(huà)廊,或是谷歌搜索找到一個(gè)替代的CSS壓縮機(jī)。
3。拒絕黑客
雖然黑客已經(jīng)成為一種可以接受的許多CSS內(nèi)的社區(qū),這并不意味著“CSS攻擊”的一個(gè)原則是,你應(yīng)該如下。 問(wèn)題采用這種設(shè)計(jì),這意味著你是有意尋找一個(gè)復(fù)雜問(wèn)題的解決方案。 雖然你可能認(rèn)為一個(gè)或兩個(gè)黑客現(xiàn)在不會(huì)傷害任何人,進(jìn)入心態(tài)的“黑客通過(guò)“你遇到的任何問(wèn)題都可能產(chǎn)生負(fù)面影響您的整體設(shè)計(jì)思路。
避免黑客是一塊,專家被分配一些時(shí)間的建議。 你可以去所有的方式到2003和看到保羅科赫(他是一個(gè)成功的開(kāi)發(fā)者和作者)已經(jīng)有一段時(shí)間的CSS Hacks的啟示警告設(shè)計(jì)師:“復(fù)雜的怪物了,就在現(xiàn)代Web開(kāi)發(fā)中心。如今,它并不表現(xiàn)為一個(gè)無(wú)限嵌套的表格,但作為一個(gè)無(wú)限復(fù)雜的CSS hack”。
4。不要濫用div
因?yàn)閐iv元素,提供一個(gè)高層次的靈活性,它可以很容易過(guò)度使用他們。 事實(shí)上,這個(gè)問(wèn)題已經(jīng)變得如此普遍,CSS設(shè)計(jì)師社區(qū)已經(jīng)建立了自己的術(shù)語(yǔ)來(lái)標(biāo)記這個(gè)問(wèn)題:divitus。 避免陷入這種狀況,之前自動(dòng)使用一個(gè)div標(biāo)簽,你應(yīng)該問(wèn)問(wèn)自己,如果有一個(gè)實(shí)際的HTML標(biāo)簽,會(huì)把工作做的你。 例如,而不是創(chuàng)建多個(gè)header div,你為什么不使用HTML標(biāo)題標(biāo)簽已經(jīng)可用,如H1和H2?
一旦你開(kāi)始考慮一下這個(gè)問(wèn)題,你會(huì)很快看到的好處,使用適當(dāng)?shù)腍TML標(biāo)簽而不是自動(dòng)創(chuàng)建一個(gè)新的部門 不僅可以減少代碼量,你必須創(chuàng)建(這將節(jié)省你的時(shí)間,同時(shí)減少你網(wǎng)站的加載時(shí)間),但它也會(huì)給你的代碼更合乎邏輯的結(jié)構(gòu)。
5。的想法放進(jìn)你的類的名稱
如果你問(wèn)一個(gè)新的或沒(méi)有經(jīng)驗(yàn)的設(shè)計(jì)師,他們?nèi)绾螞Q定叫他們的課程,他們可能會(huì)說(shuō),這真的不重要。 雖然這在技術(shù)上是正確的,這是命名CSS類非常短視的觀點(diǎn)。 雖然有設(shè)計(jì)師落入誰(shuí)不關(guān)心CSS類名的類,也有設(shè)計(jì)師認(rèn)為他們的類的名字,但他們卻采取了錯(cuò)誤的方法。
因?yàn)槲也幌胫皇谴蚰愕念^與理論的例子,讓我具體解釋一下。 假設(shè)你正在創(chuàng)建一個(gè)類來(lái)控制一個(gè)箱子在你的頁(yè)面上。 盒子將位于頁(yè)面底部,它將包含從讀者的意見(jiàn)和你會(huì)使用CSS來(lái)給它一個(gè)棕色的背景和控制填充。 而命名的。譚盒(這是許多好心的設(shè)計(jì)師會(huì)這么做),它的名字。評(píng)論框。 原因。評(píng)論框是一個(gè)更好的類名稱比。譚盒是因?yàn)槿绻銢Q定改變背景顏色為藍(lán)色的道路(或決定把箱子從頁(yè)面底部的一個(gè)不同的領(lǐng)域),它不會(huì)使你困惑或是查看網(wǎng)站的CSS其他設(shè)計(jì)師。
6。擁抱速記
而速記可以迷惑的設(shè)計(jì)師誰(shuí)是剛剛開(kāi)始自己寫(xiě)的CSS代碼,一旦你習(xí)慣了風(fēng)格的簡(jiǎn)寫(xiě),它成為一個(gè)最有效的辦法可以作為一個(gè)設(shè)計(jì)師。
有使用速記的多重效益。 一、降低你的文件的大小,這將減少你的網(wǎng)站的加載時(shí)間。 此外,它不僅使我們更容易組織你的代碼,但也使它更簡(jiǎn)單,如果將來(lái)您需要對(duì)代碼進(jìn)行更改。 作為你開(kāi)始適應(yīng)速記,你也應(yīng)該去寫(xiě)你的代碼在一行的實(shí)踐(而不是傳播出去,聲明在多線)。
7。別忘了打印機(jī)
作為一個(gè)設(shè)計(jì)師,你更傾向于技術(shù)的非主流人群的任何人。 因?yàn)槟闶且粋€(gè)少數(shù)民族生活的一部分,呼吸技術(shù),有很多你有大多數(shù)人從沒(méi)想過(guò)的習(xí)慣。 例如,你可能離開(kāi)你的方式消除盡可能在你的生活中盡可能多的“文檔”。 然而,要記住,大部分的人口仍然打印出來(lái)的東西在定期的基礎(chǔ)上是很重要的。 當(dāng)你可能標(biāo)簽項(xiàng)del.icio.us時(shí)要保存?zhèn)洳?,普通的互?lián)網(wǎng)用戶將打印相同頁(yè)。
因?yàn)槿藗冞€打印出的信息來(lái)自互聯(lián)網(wǎng),重要的是使用CSS來(lái)讓你的內(nèi)容打印。 游客會(huì)欣賞所有的工作你已經(jīng)把創(chuàng)造美麗的布局對(duì)于網(wǎng)站他們?cè)L問(wèn),但當(dāng)他們決定要打印一頁(yè)的網(wǎng)站,他們會(huì)感謝你甚至當(dāng)他們意識(shí)到他們的打印輸出只包含文本,他們希望(并沒(méi)有驚人的圖形看起來(lái)偉大在他們的電腦但會(huì)浪費(fèi)大量的墨水從打印機(jī))。 因?yàn)镃SS使得它很簡(jiǎn)單,確保內(nèi)容正確格式化打印出來(lái),沒(méi)有借口真正的設(shè)計(jì)師忽略了這一步的設(shè)計(jì)過(guò)程。
8。永遠(yuǎn)不要停止學(xué)習(xí)
你可能認(rèn)為這最后的原則聽(tīng)起來(lái)是陳詞濫調(diào),但它無(wú)疑是最重要的整個(gè)列表。 如果你致力于成為設(shè)計(jì)師,你需要確保你一直致力于擴(kuò)大你的CSS知識(shí)。 幸運(yùn)的是,這是很容易做到,如果你有愿望將致力于繼續(xù)你的CSS的教育。 而繼續(xù)教育是一項(xiàng)艱巨的任務(wù),個(gè)人在許多行業(yè),非技術(shù)性的,因?yàn)榛ヂ?lián)網(wǎng)實(shí)際上是基礎(chǔ)的CSS,量的免費(fèi)資源,你可以學(xué)習(xí)真的是無(wú)止境的。 如果你認(rèn)為我夸大,只需鍵入“CSS”到谷歌,你會(huì)看到有483000000個(gè)結(jié)果供您瀏覽。
除了從網(wǎng)上資源學(xué)習(xí)(和打印資源如果你喜歡),你可以從其他的CSS設(shè)計(jì)師學(xué)習(xí)很多。 無(wú)論你分析自己的工作,聽(tīng)聽(tīng)他們給在網(wǎng)上或面對(duì)面的情況下跟他們的建議,你可以通過(guò)相互作用和潛在的合作與其他設(shè)計(jì)師誰(shuí)是致力于在頂尖的CSS設(shè)計(jì)的原則和生產(chǎn)工作令人驚嘆的收獲很多的價(jià)值。
創(chuàng)新互聯(lián)設(shè)計(jì)文章推薦:
成都app開(kāi)發(fā)公司、app制作
四川遂寧網(wǎng)站建設(shè) 做網(wǎng)站
創(chuàng)新互聯(lián)成都微信小程序開(kāi)發(fā)公司
網(wǎng)站web服務(wù)器維護(hù),網(wǎng)站服務(wù)器搭建
本文標(biāo)題:頂尖的CSS設(shè)計(jì)的原則
URL鏈接:http://www.rwnh.cn/news/20120.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供外貿(mào)網(wǎng)站建設(shè)、用戶體驗(yàn)、做網(wǎng)站、企業(yè)建站、網(wǎng)站策劃、ChatGPT
聲明:本網(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)
猜你還喜歡下面的內(nèi)容