2010-06-02 57 views
5

我正在製作一個網站的樣式表。 CSS樣式名稱應該與網站或內容有關?css的名字應該是?

我的網站是網絡development.is使用的風格,右側的名字 -

#web-development-header 

.web-development-company-london-content 

還是應該使用

#header 
.content 

是CSS樣式名稱可以幫助搜索引擎優化?

+0

NCSS是關於CSS命名約定的一篇文章:http://stackoverflow.com/questions/7927193/css-class-naming-convention/20253304#20253304 – redaxmedia 2015-07-24 20:02:11

回答

13

轉到與內容相關的名稱 - 這些將很容易維護。更長的字符串意味着更長的時間來加載頁面。而CSS樣式名稱與SEO無關。

1

選擇內容命名約定。

一個建議,使用名稱,不描述視覺輸出,因爲視覺輸出可能會改變,然後CSS類或id名稱是誤導。

例如,如果.redtext由設計師變爲藍色,那麼類名稱會有誤導性,尋找和替換的努力是很費力的。

我建議選擇名稱,如.warningtext而不是.redtext

1

雖然目前您正在倫敦爲Web開發公司構建網站,但當您想要在紐約的Web開發公司中重新使用代碼時,會發生什麼情況?或倫敦的工藝品商店呢?現在看來微不足道,因爲你正在編寫代碼,但如果你有團隊呢?最佳做法是使用對手頭頁面有意義的名稱。如果您將頁面在屏幕上,任何人都應該能夠識別主要組件:頁眉,頁腳,導航等等等等

雖然ID和班級應該是描述像Christoper奧特曼貼(.warningtext v .redtext)沒有必要讓信​​息超載(.thisTextAppearsWhenTheUserEntersTheirNameInThePhoneNumberArea有點傻),所以需要平衡一下。一般來說,我會盡量使用最低限度的描述來具體標記一個部分,以便簡化我的代碼外觀和我對速度的不健康困擾。

總之,如果你只需要正確的識別一個部分是頭部,那麼就使用頭部。如果沒有目的,則不需要引入更多信息。

1

所有其他的答案都是偉大的,但不要忘記,你還可以窩CSS,這可能會給你在你的命名約定更大的靈活性,並允許您使用短而簡單的名字:

#header {} 
    #header #left {} 
    #header #right {} 
.content {} 
    .content #left {} 
    .content #right {} 



<div id="header"> 
    <div id="left"></div> 
    <div id="right"></div> 
</div> 

<div class="content"> 
    <div id="left"></div> 
    <div id="right"></div> 
</div> 
+1

不好的例子。 Ids應該是唯一的。左和右應該是類。 – MartinF 2011-06-19 00:07:21

相關問題