フォルダの作成
フォルダ名やファイル名の命名ルール
半角英数の小文字のみ使用します。
記号を使用する場合は(-)ハイフンと(_)アンダーバーのみ使用可とします
- projectフォルダ名:例1)241015 例2)part1 例3)portfolio 例4)recurrent_hiroshima など
- プロジェクトフォルダの中にworkフォルダとhtmlフォルダを作成します。
- workフォルダの中にはページを作成するために使用した素材などを全て保存します。まとめて保存する事で修正や更新時に素材を探す手間を省きます。
- htmlフォルダは作業フォルダになります。htmlファイル、ページ内で使用する画像、cssファイルなどを作成して保存します。
エディタソフト準備
Dreamweaver
Dreamweaverは、Adobeが開発したウェブサイト作成ソフトウェアです。シンタックスハイライトやコード補完機能の他に、コードの挿入やエラーチェック機能も充実しており、HTML初心者でも使いやすいエディタです。
デザインだけでなく、サイトの管理やアップロードもサポートしており、多機能で使いやすさが重視されています。現在のシェア率は約20%とされていますが、CMSとの連携機能も備えており、初心者からプロフェッショナルまで幅広いユーザーに利用されています。
Visual Studio Code
Visual Studio Code (VS Code)は、Microsoftが開発した軽量で高機能なフリーのコードエディタで、多様な言語に対応しており、シンタックスハイライトやコード補完機能により、効率的にコーディングができます。豊富な拡張機能を利用できることが特徴です。
VS Codeには、WordPressやDrupalなどのCMS向けの拡張機能が多数あります。拡張機能を利用する事でCMSのファイルを直接編集したり、特定の機能を簡単に利用したりできます。現在のシェア率は約40%以上とされており、フロントエンドに限らず多くのユーザーに支持されています。