CSSのclass名で悩みたくない!よく使われてるいる名前(命名)!

CSSのclass名で悩みたくない!よく使われてるいる名前(命名)!

コーディング中にいつも悩まされる問題…それはクラス名を考える時!
ざっといつも使っている単語と他のサイトなんかでよく使われている単語をあつめました。
これで作業効率アップアップ!

ブロック名

head
header
main
hero mainと同じ意味合い。最近よく日本語サイトでも見かけるようになりました。
footer
page 詳細ページの意味。

 

よく使いそう

sub
large サイズの大。
small サイズの小。
prev
next
local
global

ブロックを囲む

inner
outer
block
group
body
grid
col
content
card
article 記事、本文。
section

 

機能名

nav
tab
heading
lead
intro
list
item
slider
banner
add
title

 

文章

caption
description 記事の説明文。
summary  descriptionよりも意味合いが低い。
note 文章の備考的な意味。
text  テキスト。他にはtxt。

 

画像

logo
thumb  サムネイル。他にはthumbnail。
img  画像。image
icon アイコン。

 

フォームとかで使いそうなもの

button
search
input
textarea
 label

 

Modifier(属性)のサンプル

–is_active
–is_disabled
–is_visible
–is_hidden
–is_opened
–is_closed

 

これでコーディング時、悩む時間を削減して作業効率アップ!を目指しましょう!

 

未経験からでもエンジニアにはなれる!

中堅の年代になり、最近よくどうやってエンジニアになったんですか?と聞かれる機会が多くなりました。私は転職組で未経験からエンジニアになりました。 そこら辺のストーリーは「未経験からWebデザイナーになった経緯を紹介」で書いているのでそちらをご覧ください。

当時はWebの技術を教えてくれるスクールがあまりなく、私はWebの勉強は独学で勉強し転職したのですが、今はスクールの数も多くなっていてオンラインで受講できるところも増えてきました。

もし私が未経験でエンジニアを目指すなら活用したいスクールを紹介してますので興味ある方はぜひ参考にしてくだいさい!

tech boostオンライン

tech boostはエンジニアに特化したキャリアサービスを展開しているBranding Engineerが運営するオンラインプログラミングスクールです。

エンジニアに特化したキャリアサービスを展開しているからこそのカリキュラムを実現しています。 また、転職サポート付きでスクール卒業後もキャリアも安心です。

オンラインスクールだからいつでもどこでも受講可能!これからプログラミングを学びたい方、エンジニアにキャリアチェンジを考えている方に、 特にオススメのサービスです。

初めてプログラミングを学ぶなら「tech boostオンライン」

CodeCamp(コードキャンプ)

オンライン・マンツーマン指導のプログラミングスクールとしてNo.1*の実績を持つサービスです。高い学習効果が評価されテレビや新聞、ビジネス誌など*多くのメディアで紹介されています。

講師は全て現役のエンジニア。未経験から確実に習得するために開発されたオリジナルカリキュラムでWebデザイン、Webサービス開発、アプリ開発などを幅広く学習することができます。

多くの受講生が、現役エンジニアの手厚いマンツーマン指導によって確実にプログラミングを習得し、キャリアアップ・転職・独立起業などの目標を実現しています。

プログラミングのオンラインスクールのCodeCamp

DMM WEBCAMP

転職を本気で考えている方向けのプログラミングスクールです。転職を保証しているため、未経験からIT業界へ転職を求めている方へおすすめです!

プログラミング未経験者でも安心のサポート体制をご用意しており、特に受講者アンケートでは『サポート体制がしっかりしていて魅力的』、『転職を保証していただいていることで安心』というレビーが多くしっかとしたサポートを提供しています。

実務に近い実践的なカリキュラムで、DMM WEBCAMPはチーム開発など、実務により近い実践的カリキュラムを導入しているため、転職先・就職後にいち早く活躍できるスキル・経験を積むことができます。

受講者満足度90%以上のプログラミングスクール【DMM WEBCAMP】

Udemy

私の周りの現役のエンジニアの人も活用しています。基礎をしっかり固めたい方や、実践向けの配信など幅広く解説している動画が豊富にアップされているので活用するのはオススメです。

習得したいスキル(プログラム言語)が明確で、年収アップのために学習している方やAI・機械学習を学んでスキルアップを目指しているエンジニアの方に支持されているます。

1講座あたり数千~数万円程度で実践的なスキルアップを経済的でオススメです。

【Web開発初心者向け!】Web開発入門完全攻略 充実の18時間コース