#1 ドットインストールの「はじめてのHTML」がはじめてにしては難すぎて刺激的!(個人的感想)

この記事は約6分で読めます。

こんにちは!ネタナビの個人日記です。2021年4月29日から新たな目標を立てて頑張っていこうかと。1日目はドットインストールでHTMLを学習。設定した目標は↓↓です。

1日目にやった内容は以下。

ドットインストールの登録
HTML/CSSの学習環境を整えよう [Windows版]
はじめてのHTML

3つを約3時間でこなしました。結論から言いますとはじめてのHTMLが初心者には難しすぎて、「これまじではじめてのHTMLですか!?」というレベル。とにかく個人的意見ですが、「ここまで上がってこいよ」的なコンテンツレベルで凹みながら、食らいついてやっていく感じでした。ついていくのがやっとで刺激的で最高でした。

まずドットインストールは無登録でき、動画で受講するコンテンツ。動画を見ながら実践していく形式なので、マルチモニターがおすすめです。レッスンもHTML、CSS、一部入門講座は無料、その他はプレミア会員で見れます。プレミア会員も月額1080円(税込)なのでプログラミングスクールと比べるとかなり安価。

ひとまず会員登録を3分ほどで済ませ、HTML/CSSの学習環境を整えよう [Windows版]は受講。1~2分の動画×5回でわかりやすく、スイスイ進むので飽きないです。

続いてはじめてのHTMLへ。これも1~2分×全14回でHTML/CSSの学習環境を整えよう [Windows版]が簡単だったので、「楽勝っしょ」と踏ん反り返っていたらいきなり実践。

政策課題は↓↓で、コードを入力していくのですが基礎がないので超苦戦。いきなりレベルが上がります(個人的感想)。ワードプレスで記事は普段から書いているので、ある程度のタグはわかりますが、入力に慣れていないので時間がかかるかかる。コードを入力しながら、動画を全14回見終えたときには、3時間くらいかかってました(汗)

見ながら書いたコードはこちら。2時間位かかりましたm(_ _)m

<!DOCTYPE html>
<html lang="ja"
<head>
  <meta charset="utf-8">
  <title>太郎のポートフォリオサイト</title>
  <link rel="icon" href="favicon.ico">
  <meta name="description" content="太郎のポートフォリオサイトです。">
</head>
<body>
  <header>
    <img src="img/taro.png"with="120"height="120"alt="太郎のアイコンです">
    <h1>山田太郎</h1>
    <p>UL/UXデザイナー見習いです</p>
    <ul>
      <li>
        <a href="https://dotinstall.com" target="_blank">
          <img src="img/blog.png"width="20" height="20" alt="ブログサイトへのリンク画像です"> 
        </a>
      </li>
      <li>
        <a href="https://dotinstall.com" target="_blank">
          <img src="img/photos.png"width="20" height="20" alt="写真へのリンク画像です"> 
        </a>
      </li>
    </ul>
  </header>

  <section>
    <h1>works</h1>
   
    <section>
      <img src="img/work1.png"width="400" height="260" alt="勇者ゲームの紹介画像">>
       <h1>勇者ゲーム</h1>
       <p>楽しいアプリです。楽しいアプリです。楽しいアプリです。楽しいアプリです。楽しいアプリです。楽しいアプリです。楽しいアプリです。楽しいアプリです。楽しいアプリです。楽しいアプリです。楽しいアプリです。楽しいアプリです。楽しいアプリです。楽しいアプリです。</p>
    </section> 
   
    <section>
      <img src="img/work2.png"width="400" height="260" alt="宝探しゲームの紹介画像">>
      <h1>宝探しゲーム</h1>
      <p>楽しいアプリです。楽しいアプリです。楽しいアプリです。楽しいアプリです。楽しいアプリです。楽しいアプリです。楽しいアプリです。楽しいアプリです。楽しいアプリです。楽しいアプリです。楽しいアプリです。楽しいアプリです。楽しいアプリです。楽しいアプリです。</p>
    </section>
   
    <section>
      <img src="img/work3.png"width="400" height="260" alt="神経衰弱の紹介画像">>
      <h1>神経衰弱</h1>
      <p>楽しいアプリです。楽しいアプリです。楽しいアプリです。楽しいアプリです。楽しいアプリです。楽しいアプリです。楽しいアプリです。楽しいアプリです。楽しいアプリです。楽しいアプリです。楽しいアプリです。楽しいアプリです。楽しいアプリです。楽しいアプリです。</p>
    </section>
    
  </section>

 <!-- 作品紹介-- -->

  <footer>
    <p>(c) dotinstall.com</p>
  </footer>
</body>
</html>

ワードプレスだと速攻で終わることがコードにするとこんなにも時間がかかり、大変なのかと…ワードプレスに感謝せねば。あとプログラミングは英語が出来たほうがいいと認識。出てくるタグや単語の意味が所々わからないっす。自分の英語スキルの低さに泣けてくる…

そんなかんじで初日の勉強を終えました。刺激的な1日で楽しかったので明日も反復練習しつつ、2日目のCSSを頑張ろうと思います。

管理人ブログ
スポンサーリンク
ネタナビをフォローする
ネタナビ|みんなの知りたいを載せたい!

コメント

タイトルとURLをコピーしました