2021-11-01 作って学ぶコーディング学習サイト ★code-step(引用) コーディング練習 コーディング練習サイトの素材を利用させてもらう マークアップ・文書構造は、見本を利用しないでゼロから書き起こす 基本的には、モバイルファーストの記述を目指す FlexboxとGridを適時使い分ける Codestep code-step.com 作って学ぶコーディング学習サイト 演習するときの手順 カンプからワイヤフレームを描き起こす id名・クラス名を決めておく 文書構造を作成し文法チェックを行う CSSは、リセット→外ブロック→内ブロックの順で記述する プレビューは、外ブロックが指定できてからにする 無料コーディング練習所 webdesigner-go.com </>Markup ysd-lab.jp 初学者の、最初にコーディングする例として最適 PC版のみ作成 最も利用するツール Hover inspector like in Zeplin , Figma ページ内のサイズを表示するツール Page RulerColorZillaHeadingsMapPerfectPixel by WellDoneCode (pixel perfect) ピクセル単位の精度でWebサイトを開発するのに役立ちます