ぼくの、大失敗談をお読みいただけた方は、 基本が大事だという事が、多少なりとも理解いただけたかと思います。
そこで今回は、じゃッHTMLってどう書くの？から、ご説明したいと思います...。
まず、その前にエディターソフトがありますよね！と記載すると、それなんですか？
といわれそうなので、ドリームウィーバーやホームページビルダーなど、特にWindowsでは、一般的なソフトですね...。
がしかし、上記のソフトは有料なんですよね...。
HTMLを記載したことの無い人が、いきなり有料ソフトを購入するのは、少し冒険ですね...。
そこで、今回は最後にエディターソフトも紹介しますが、その前に、Windowsに付属のメモ帳で行ってみましょう～！！
それでは、とりあえず私が作った楽天市場のページより
雪が降っていますねッ...。
コチラのページを開いていただき、Ctrl+Uのキーを押して頂くと、ページのソースを見ることが出来ます。
このソースではXHTMLで記載してありますが、今回はエディターソフトの説明なので、このソースコードを簡略化したHTML5のコードを記載いたしました。
上記のソースコードをコピーをして、メモ帳に貼り付けてみてください...。
そして名前を付けて「test.html」でデスクトップ上に保存！
その際に、ファイルの種類は、すべてのファイル、保存ボタンの左側、文字コードはUTF-8を選択して下さい。
文字コードは、現段階では分からなくても大丈夫です...。
保存が出来たら、今度はデスクトップにできたアイコンをダブルクリックしてみると、クリスマス特集の、一部が表示されるかと思います。
今回は、あくまでもエディターソフトの説明ですので、もっとも簡単なHTMLを記載していますので、
表示はクリスマス特集と異なります...。
クリスマス特集の様なデザインで表示させたい場合は、CSSとjQueryも、お勉強いたしませんと不可能です。
しかしながら、基礎からゆっくりでも続けてお勉強できれば、半年もしないで、クリスマス特集の様なページ作成も可能かと思います。
という事で、Windowsに付属のメモ帳でもエディターソフトとして使えるという事が、理解できたかと思います。
初めのうちは、これでも十分に無料で練習可能です！
出来そうだな～ッ、続けられそうだぁ～と思ったら、
下記に紹介するエディターソフトを使ってみるのもよいかと思います。
ドリームウィーバー
https://www.adobe.com/jp/products/dreamweaver.html
ホームページビルダー
https://www.justmyshop.com/products/hpb/
Visual Studio Code
https://code.visualstudio.com/
サクラエディタ
http://sakura-editor.sourceforge.net/
秀丸エディタ
http://hide.maruo.co.jp/software/hidemaru.html
私が使用しているエディターソフトは、ドリームウィーバーになりますが、有料版であれば、コレを一番おすすめ致します。
ホームページビルダーは、比較的安価で以前使用しておりましたが、 ソースコードを一から記載する場合には、あまりおすすめ出来ません！勝手にmetaタグなど、記載されてしまうことが多々ごでいましたので、SEOを考えますと、そのあたりを自由に記載できないのは残念です。 また、ドリームウィーバーは高価で高機能ですが、個人的には、機能の3割くらいしか使用していない感じです。
ですので、初めての方であれば、無料のVisual Studio Code・サクラエディタ・秀丸エディタなどを使ってみるのも、十分ありかと思います。
Visual Studio Codeは、見た目がカッコイイと思いますが、使用したことが無いので、何とも判断いたしかねます。
サクラエディタ・秀丸エディタにつきましては、ぼくが、ホームページ作成を始めた頃からある、無料ソフトで比較的、信頼性が高いソフトだと思います。
それでは、コレでHTMLを記載できる環境が、ある程度、準備できたかと思いますので、最後にドットインストールの「はじめてのHTML」のリンクを記載しておきます。
とりあえず、今回はここまで...。
お仕事のご依頼は下記より...、それではまた次回...。
