見出し画像

デザインをコードに落とし込む時、またタグの適切な利用を意識すること

  1. Figma上のレイヤー構造を、そのままHTMLに当て嵌めるかどうか。
    ・入れ子が多い場合、適宜エンジニア側で将来的な保守性等を考えて、簡潔な構造に変更する事も考える。

  2. 1ページ内で、各要素のデザインに微妙な違い(文字の大きさや要素間の間隔など)があった場合、デザイン担当者に正しい表示内容を早い段階でコメントを書き込み確認をお願いする。

  3. セマンティックを意識して、どのようなタグが適切なのか、またCSS名も会社の規則に従った上で分かり易さを考えて命名する。
    セマンティックに沿ったタグ使用が出来ていればSEO対策にも繋がり、CSS名が適切であれば保守性や拡張性の向上に繋がる。

この記事が気に入ったらサポートをしてみませんか?