Web関連

【Web制作会社に聞く】一番良いCSSってなんだ!?

0

いろいろな書き方が存在するCSS!

まずはおさらいですが、CSSとはHTMLに記載できないページのデザイン要素を書くことができるファイルのことです。

ですがこのCSS、HTML以上にコーダーによって記述方法がバラバラになりがちなのです。

結論から言いますとCSSは「設計」をしっかり行ってサイトごとにブレがなければ、どんな書き方をしてもOKだと思います。

ただし、ソースが無駄に長くなってしまったり、編集がしにくいもの、構文エラーのものはダメですが(笑)

設計さえすればどんなものを書いてもよい、とは言ってもWeb制作会社として”これが最適”というものを定めたいと思いいろいろなCSSを検証してみました!

OOCSS

OOCSS(オーオーシーエスエス)というものがあります。
なんの略かというと(Object Oriented Cascading Style Sheets!)

基本的な考え方としてはレイアウトに関わるCSSと色や大きさに関わるCSSを分けて記載するというもの。

信号というレイアウトを表すCSSと赤、青、黄を表すCSSを別々に書いて、赤の時の信号、青の時の信号、黄色の時の信号を2つのCSSで表すというものです。

さらに、その赤というCSSはポストやリンゴというレイアウトにも使うことができるので便利!
といった感じです。

ですが、デメリットとしてCSSを見ただけでどの部分のCSSなのかが分かりにくく、メンテナンスの時に担当が変わったなどの時に煩雑になりがちです。

これだと、メンテナンスにも強い弊社のフォーマットとしては微妙、、、

SMACSSとBEM

SMACSS(スマックス)というもの、BEM(ベム)というものがあります。

それぞれの略は
・Scalable and Modular Architecture for CSS
・MindBEMding
だそうです。

なんだか難しい単語が並んでいますが、SMACSSというCSSはOOCSSとは違ってベース、レイアウト、モジュール、状態、テーマという要素にCSSを分けて、メンテナンス性を高めたものです。

BEMはさらにクラス名をさらに分かりやすく、人にやさしい命名ルールにしたものです。

欠点としては定義する名前が長くなりがち。
でも人には分かりやすくメンテナンスに強そう!

これ以外にも世の中にはいろいろなCSSのフォーマットが存在していて、
どのCSSもメリットとデメリットがありますが、どの開発者も自分のCSSが一番!
って思っているでしょう(笑)

 

では何が一番良いのか!作ってしまえ!

では何が一番良いCSSなのか?と考えた時にWeb制作会社としてメンテナンス性が高くて汎用性もそれなりにあって、
検索エンジンも優しいCSSフォーマットを作ることにしました!
そして現在、誠意制作中になります。

次回のコラム(もしくはその次、、)で発表できるように進めていこうと思います!

css_15040302.jpg

関連するサービス

ホームページ制作

0

Web広告のバナーは「つかみ」のキャッチコピーで決まる!?前のページ

Web制作でも重要!顧客満足度を高めるための3つポイント次のページ

ピックアップ記事

  1. AIに求められているものは、実は意外な物だった
  2. 大手企業も注目するMaaS(Mobility as a Service)とは何か…
  3. 新しい販売形態であるDtoCについて考えてみる
  4. 新型コロナウイルスで日本の働き方改革が起こる

関連記事

  1. Web関連

    【画像が…小さい…】ファッションECに旋風を巻き起こす!ユーザー視点の新技術…

    どこのどんな商材でもオンラインで購入ができるようになった今、特にアパレ…

  2. Web関連

    使っているスマートフォンのバッテリーがすぐ無くなるのでどれが一番長持ちするか調べてみた。

    情報化社会の今、インターネットは欠かせませんね。中でもスマートフォンは…

  3. Web関連

    「リメディアル教育」はなぜ必要?大学の取り組みについて

    皆さんは「リメディアル教育」という言葉を聞いたことはありますか?❛…

  4. Web関連

    あなたは大丈夫?就職面接時に気を付けたい4つのポイント

    遂に始まりましたね、2018年度採用選考!弊社でも会社説明会に面接…

  5. Web関連

    あなたは自社サイトや情報を活用できていますか?DMPを利用したデータ活用とは

    DMP元年といわれた2013年から早二年が経ちました。ビッグデータやD…

  6. Web関連

    人が手に取るもの、触れるものは全てUIの考えが入っている?

    今回はUI(ユーザーインターフェイス)について考えていきたいと思います…

自治体向けDX推進サービス

AIさくらさん for 自治体DX

おすすめ記事

最近の記事

  1. 人間拡張×AIで非接触なデジタル化を推進する
  2. ヘルスケアはAI先生にみてもらう時代
  3. withコロナは非接触技術で生活しよう!
  4. デジタル接客+AIで非接触を推進する
  5. 遠隔診療や遠隔医療普及のポイントはAIと5G

アーカイブ

  1. Web関連

    3つの事例から考える共創マーケティングとは?
  2. Web関連

    情報設計する上で押さえるべきポイント ~重要な情報はどこに?編~
  3. Web関連

    営業担当者必見!MAツールを使って時短&顧客育成!
  4. Web関連

    死ぬまでに絶対やっておきたい!-終活データ整理編
  5. Web関連

    ホームページ制作会社が紹介するHTML5の動画のメリット
PAGE TOP