htmlとcssとjsの相互関係について

htmlとcssとjsの相互関係について

ここのところ、もう一度htmlやcss、javascriptのことを学び直ししてきた結果、お互いの関係はこんなふうにまとまってきているという気がしました。

htmlとcssとjsの関係

もともと、htmlはwebの構造文だし、cssは装飾だったりしたのだけど、javascriptでも装飾やアニメーションもできたからjsの立ち位置とcssの立ち位置って好きなほうを使えばいいんじゃね?という感じがしてました。好みや慣れの問題くらいにしかならないのかな、と。

けど、cssでやれることが増えるにしたがって、jsでやるべきことの区別がハッキリと分かれてきたように思います。やれることはいっぱいあるけれど、やるべきことをやれることを区別しようって感じ。cssでやれる装飾はできるだけcssに振っちゃって、jsはhtmlやcssのそれぞれの不足分を補うようなイメージです。

htmlはあくまで構造文であること

それぞれの役割がハッキリと区別されるということは、htmlでゴリ押しのレイアウトなんてするべきじゃない。昔みたいにゴリ押しテーブルレイアウトなんてもってのほかです。<table>は表作成のためのタグだからちゃんと表を作るときに使って、<ul>や<ol>はちゃんとリストを作るときに使う。

当たり前のことだけど、そういったhtmlのタグが持つ個々の役割を確認してhtmlは作られるべきということでしょう。なんならcssやjsをオフにしても意味がわかるくらい構造が整っている必要があると思いました。

CSSで装飾

文字装飾やページ装飾をするhtmlタグもあるけれど、そういうのは一切使わない。装飾はcssの役目だから、デコりたければcssを使いまくる。幸いcssでやれることできることはずっと前にくらべてかなり増えてます。画像使わなくてもcssだけの装飾でほとんどのことができるようになりました。対応ブラウザもIE10以下を無視すれば、使えるものが増えますし、モバイルだけに特化すればさらに増えます。

Javascriptは補完するためのもの

とはいっても、htmlとcssだけじゃやれることに限界が来ます。それでも工夫しまくっていろいろと実装している人もいますが(そういう人たちホントすごいと思う)、できない部分はjsで補えばいいんです。アニメーションやドロワー出すとか何でもかんでもjsに任せるのではなくて、補完するためのものと考えを改めたほうがいいと思いました。

結果

そんなわけですので、今一度初心に戻ってくる。

123 views/total