こんにちは。たわらです。
残すところふたっぱさんでの実習も本日含めて2回となりました。
あっという間すぎます…
今は、サイトのコーディングに入っています。
そこで、コーディングの際必ず必要になってくる「idとclass」について、
名前を考えるのに時間をとられたくない!!と思ったので、
よく使われているものを集めてみました。
そのまえに注意したいこと
●使用しないほうがいいと思われるもの
1.色を使ったもの:red、blue、white など
2.サイズを表したもの:300w、500h など
3.左右:left、right
上記のものは、どれもデザインを変えると変更しなければなりません。
絶対に変えない!!ということであれば良いと思いますが、
もし変更する可能性があるのであれば避けて、違うものを考えた方が良さそうです。
left、right に関しては、私自身、2カラムのときなんかに使ったりします。
おおよそ変えないであろう部分や、大枠で左右に分けるときにはいいかもしれません。
4.idとclassを同じにする
たとえば、下記のような例です。
<div id=”news”>
<div class=”news”>news01</div>
<div class=”news”>news02</div>
<div class=”news”>news03</div>
</div>
問題なくCSSでも反映はされるようですが、
・ややこしくて分かりにくい
・何か問題がでる “可能性” はある
のでおすすめはできない、という意見が多いようです。
【一覧】よく使われるidとclass
●全体的につかえそうなもの
・wrap
・wrapper
・page
・pagetop
・all
・allContents
・body
・carrier
・top-wrapper
・frame
・all-frame
・container
●上の方に使えそうなもの
・head
・header
・headerArea
・headline
●ナビにつかえそうなもの
・nav
・navi
・navigation
・navbar
・gnav
・gnavi
・g-navi
・globalnav
・headerNav
・footerNav
・globalnavigation
・globalHeader
・mainNavigation
・topNav
●パンくずリストに使えそうなもの
・topicpath
・topic-path
・pan
・pankuzu
●メニュー・サイドにつかえそうなもの
・side
・side-container
・sidebar
・sidemenu
・localMenu
・sub
・sub-menu
・aside
・menu
・division
・mainmenu
・fields
●本文やメイン使えそうなもの
・area
・topic
・summary
・pickup
・column
・wrapperContent
・contentColumn
・content-block
・base
・main
・mainbox
・mainContent
・center
・content
・contents
●下の方に使えそうなもの
・copy
・copyright
・foot
・footer
・footnavi
・footerArea
・footerbar
・globalfooter
みなさんもぜひ参考にしてみてください!!
たわら