HTMLHyperText Markup Language)

最速で学ぶオンライン動画教材

プロの現役ITエンジニアがやさしく解説します

school_header_top

オンライン動画教材

基礎からわかる!HTML超入門

始めよう、HTML

【HTMLとは?】HTML(エイチティーエムエル)は、ウェブを理解する基本となる言語です。HyperText Markup Language(ハイパーテキスト マークアップ ランゲージ)の略です。HTMLが分かると、インターネットをより深く楽しめます。HTMLを理解することは、IT時代には欠かせないスキルです。

image85

HTMLはウェブをやるなら必須のスキル。ネットで勝ち抜く必要最低限の武器。image89

HTML(HyperText Markup Language)の基本を

動画音声でわかりやすく解説した教材です。

問題です。あなたには、

HTMLの、こんなお悩みありませんか?

1540_32 ソースコードを見ると頭が痛くなるimage2

1540_32 自由に編集したいけど読めない

1540_32 以前、下手にいじって壊してしまった
1540_32 市販の参考書挫折した

1540_32 そもそも基礎わかっていない

1540_32 忙しくて勉強する時間が無い

などなど・・・

あなたと同じ悩みを感じている人は大勢います。

ではHTMLの、こんな要望ありませんか?

1540_32 WordPressのHTML部分を自由にカスタマイズしたいimage3

1540_32 無料のHTMLテンプレートを独自に編集したい

1540_32 オリジナルのデザインで注目を集めたい
1540_32 周りとは一味ちがったランディングページ差をつけたい

1540_32 努力せずにプロの技術を素早くラクして簡単に習得したい

1540_32 HTML構文エラーの原因特定できるようになりたい

などなど・・・

その要望低コスト短期間で叶える方法があります。

 

あなたはまだ、HTMLソースコードをいじるのは怖いですか?

あなたの悩みを解決し、要望を叶える方法、それは・・・ 

この教材を使って学ぶことです。

オンライン専用(ダウンロード)動画教材

基礎からわかる!HTML超入門

講師 : 現役ITエンジニア 大和賢一郎

エンジニア歴17年

以下の画像をクリックすると動画(音声も出ます)が始まります。今すぐクリックしてください。

image4 

以下の端末で視聴・再生できます。(パソコン、スマートフォン、タブレット)

 

device

qr

QRコード:ケータイ・スマホからもアクセスできます。

 

この動画教材の特徴

1540_32 音声と動画で簡単わかりやすい

市販の参考書籍は文字列と静止画による解説です。そのため、実際のPC画面操作(HTMLの書き換えなど)が習得しづらいという短所があります。その点、動画と音声による解説ならば、PC画面の動きをそのまま見ながら真似するだけでHTMLが読み書きできるので、学習効率が飛躍的に向上します。

 

1540_32 HTMLに特化しているから効果的

この教材は「HTML初心者が基礎を最速で簡単に習得すること」だけに特化した専門教材です。そのため、余計な肉付けは一切ありません。必要最小限のスキルを短期間で効率的に身に付けられます。

 

1540_32 講師はベテラン指導者だから安心

講師はプロの現役ITエンジニアで、現在も第一線で活躍する実務経験17年のベテランエンジニアです。そのため、現場で培ったノウハウを豊富に持っています。教科書だけの知識や机上の空論ではなく、実際のウェブ開発に役立つ実用的なテクニックが習得できます。

 

この動画教材の内容

ステップ1からステップ4まであります。

ここからウェブのすべてが始まる

ステップ1  HTMLの基礎を習得する

(動画28分10秒)

 

HTMLをゼロから最速で学ぶ方法。それは、自分でゼロから実際に作ってみることです。この動画を見ると、HTMLファイルの新規作成から、文字の入力、リンクの設定、画像の挿入、色やサイズの変更など、HTMLの基本中の基本となるスキルをわかりやすく習得できます。また、初心者がつまづきやすい「空白スペース」や「改行」の扱いについても丁寧に解説されているので、安心して基礎力を身に付けられます。

 

htmlファイルを作る(動画3分6秒)

 HTMLファイルは、テキストファイルとして簡単に新規作成できます。特別なソフトウェアは必要ありません。最低限、メモ帳さえあれば作れてしまいます。新規作成したテキストファイルにHTMLを書き込めば、ページが出来上がります。その方法を習得できます。


 htmlタグで背景色を変える(動画4分26秒)

HTMLを使えば、ページの背景色を簡単に変更できます。一般的に、ページの背景は白であることが多いですが、サイトの内容やイメージによっては、他の色に変更したい場合もあるでしょう。その方法を習得できます。


 色を自由に変更する(動画5分12秒)

HTMLを使えば、色の指定を自由に行えます。redやblueなど、色名を英単語で指定したり、カラーコードと呼ばれる数値で指定したり、いろいろな手法が存在します。その方法を習得できます。


改行を入れる(動画4分48秒)

HTMLを使えば、ページに改行を入れられます。通常、ワードやエクセル、パワーポイントなどで改行を入れる際は、リターンキーを押すだけです。しかしHTMLページの場合は、リターンキーでの改行は無視されるので、別途、改行を意味するHTMLタグを書き込まなければなりません。その方法を習得できます。


半角スペースと全角スペースを使い分ける(動画3分46秒)

HTMLでは、半角スペースと全角スペースをどちらも使うことが可能です。しかしその挙動は大きくことなります。全角スペースは挿入した分だけ右にずれていきます。しかし半角スペースは、複数個挿入しても1個分しか反映されません。そのような特殊な動きをするスペースの使い方について習得できます。


文字の太さや色を変える(動画6分52秒)

HTMLを使えば、ページ内の文字の色や大きさを自由に変更できます。文字の大きさは数段階あり、大きくしたり小さくしたりできます。また、文字の大きさを変えてから、さらに色を変えたりもできます。なお、文字の色を変える際は、ページ背景色とのバランスを考えることが重要となります。その方法を習得できます。


 

リンクを制するものはクリックを制する

ステップ2  リンクを設定する

(動画28分34秒)

 

リンクはHTMLの中でも特に重要な機能です。たくさんのページがリンクで相互につながって広大なドキュメントを形成する、それこそがインターネットの醍醐味とも言えるでしょう。この動画を見ると、HTMLでリンクを設定する手法について、わかりやすく基礎から学ぶことができます。テキストリンクはもちろんのこと、画像リンク、リンク先ページの開き方、内部リンクと外部リンクなど、丁寧に解説されているので、安心して基礎力を身に付けられます。

 

リンクを作る(動画8分0秒)

HTMLを使えば、リンクを自由に作成できます。ページ内に任意のテキスト文字列を入力し、そのテキストをクリックしたときに別のページを開かせるようにできます。その際、リンク先のページを事前に作成しておかないと「ページが見つかりません」となるので注意しましょう。その方法を習得できます。


「トップに戻る」を作る(動画4分37秒)

HTMLを使えば、「トップに戻る」のリンクも簡単に作成できます。ページの階層が深くなると、閲覧者が今どこにいるのか分からなくなりやすいので、迷ったときはすぐトップページに戻れるように、すべてのページに「トップに戻る」のリンクを設定しておくのが望ましいでしょう。その方法を習得できます。


Googleにリンクする(動画3分47秒)

HTMLを使えば、Googleなどインターネット上に存在するウェブページへ自由にリンクできます。その際、リンクタグに設定するURLはhttpから始まるフルパスを指定する必要があります。これは、自分で作ったローカルのhtmlファイルにリンクする際と異なります。その方法を習得できます。


フォルダ内のページにリンクする(動画7分44秒)

HTMLを使えば、任意のフォルダ内に存在するhtmlファイルに対してリンクを設定できます。htmlファイルが増えてくると、その内容ごとにフォルダを分けて整理したくなります。しかしフォルダ階層が異なるページへリンクをする際は、その階層構造と関係性を把握してパスを設定しなければうまくリンクされません。その方法を習得できます。


リンク先ページの開き方を変える(動画4分26秒)

HTMLを使えば、リンクをクリックした際に表示されるページの開き方を変更できます。たとえば、リンク元のページとリンク先のページを同一ウインドウ(タブ)に指定することもできますし、新しいウインドウ(タブ)に指定することもできます。その方法を習得できます。


 

画像がなければ始まらない

ステップ3  画像を表示する

(動画25分46秒)

 

画像ファイルは、ページに彩りを与えます。写真やロゴなど、カラフルな絵が入っているページは、テキスト文字列のみのページに比べて、人目を引きやすく、アクセスを集めやすいのです。この動画を見ると、HTMLで画像ファイルを扱う方法を学べます。画像の挿入や拡大縮小はもちろんのこと、画像にリンクを設定したり、インターネット上の画像を自由に表示させたりする方法も丁寧に解説されているので、安心して基礎力を身に付けられます。

 

画像を表示する(動画4分6秒)

HTMLを使えば、任意の画像ファイルをページに表示できます。写真やロゴなど、形式(.jpg / .gif / .png)を問わず表示させることが可能です。たとえば、htmlファイルと画像ファイルを同じフォルダに置いた場合は、イメージタグで画像ファイル名を指定するだけで簡単に表示させられます。その方法を習得できます。


 フォルダ内の画像を表示させる(動画3分50秒)

HTMLを使えば、任意のフォルダ内に存在する画像ファイルをページに表示できます。画像ファイルが増えてくると、画像の種別ごとにフォルダで分類して整理したくなります。その際、イメージタグではフォルダのパスを意識して指定しなければ画像は正しく表示されないので注意しましょう。その方法を習得できます。


ウェブ上に存在するロゴを表示させる(動画4分16秒)

HTMLを使えば、ウェブ上(インターネット上)に存在する画像ファイルを、自由にページ内へ取り込めます。インターネット上の画像には、画像のフルパスが存在するので、そのパスをイメージタグで指定すれば、自分のサーバに画像ファイルを置かなくてもよいのです。その方法を習得できます。


画像ファイルにリンクを設定する(動画5分50秒)

HTMLを使えば、画像ファイルにリンクを設定できます。たとえば、ある画像写真をクリックしたときに、別のページにリンクして飛ばしたりできます。または、クリックした画像を拡大表示させるなども可能です。その方法を習得できます。


画像の縦横サイズを拡大縮小する(動画7分44秒)

HTMLを使えば、ページに挿入した画像写真の縦横サイズを拡大縮小できます。元画像の縦横比率を保ったまま拡大縮小できますし、元画像の縦横比率とは異なるピクセル数で縦と横の幅を指定することもできます。その方法を習得できます。


 

あなたのページがさらなる注目を集める

ステップ4  見せ方を工夫する

(動画32分0秒)

 

 同じコンテンツでも、その見せ方によって、閲覧者に与える印象は大きく変わります。閲覧者に対して、より良い印象を与えるためには、いくつかポイントがあるのです。たとえば、重要な文言は見出しにして強調させる、文章や画像の左右配置を最適化してブラウザの横幅を有効に使う、すべてのページに最適なタイトルをつける、などです。この動画では、それらの手法が丁寧に解説されているので、安心して基礎力を身に付けられます。

 

見出しを作る(動画8分0秒)

HTMLを使えば、見出しを簡単に作れます。テキスト文字列中心のページの場合、見出しや段落を明確にHTMLで指定することで、人間の目に見やすいドキュメントとなります。それに加えて、検索エンジンがインデックスする際も「見出し=ページの概要を端的にあらわしている言葉」として認識します。そのため、見出しが適切に設定されているページのほうが、検索エンジンに表示されやすい傾向があります。その方法を習得できます。


左寄せ、中央寄せ、右寄せ、を設定する(動画8分59秒)

HTMLを使えば、文章や画像の位置を自由に変更できます。ページの左に寄せたり、右に寄せたり、中央に寄せたり、配置を変更することで、より見やすいページレイアウトを実現できます。その方法を習得できます。


タイトルをつける(動画7分27秒)

HTMLを使えば、ページにタイトルをつけることができます。そこでつけたタイトルは、ブラウザのタイトルバーに表示されます。さらに、検索エンジンでの検索結果表示において、タイトルは重要な意味を持ちます。わかりやすくて「思わずクリックしたくなる」タイトルをつければ、アクセス数は増えます。その方法を習得できます。


HTMLソースコードを読む(動画7分34秒)

HTMLを理解するためには、他人が書いたHTMLソースコードを読むことが欠かせません。インターネット上に存在するページは、ブラウザで右クリック「ソースを表示」にて、簡単にソースコードを見ることが可能です。その際、ブラウザではソースコードがどのように表示されるのか?メモ帳などで開く場合とどう違うのか?見分け方を習得できます。


 以上、充実の動画

合計 114分30秒(約2時間)

長すぎず、短すぎず、ちょうどよい時間です。忙しい人でも安心です。

 

1540_32 講師プロフィール 大和賢一郎(やまと・けんいちろう)

東京ウェブ制作 https://tokyo-webs.jp 代表。フリーランス(フリーエージェント・ノマドワーカー)のITエンジニア。専face_for_bira門はウェブ制作の技術教育。活動地域は東京(品川区在住)。1977年生。日立製作所に14年勤務後、独立。会社員時代は大手通信キャリア向けのウェブシステム設計やソフトウェア開発に従事。サーバからネットワークまでITシステムのプログラミング工程を経験した後、プロジェクトマネジメントを経て、クライアントとの価格交渉や納期調整などを担当。ビジネス・自己啓発の分野でも執筆・連載など多方面で活動中。著書多数。マスコミ出演多数。趣味はスキューバダイビング(オープンウォーターライセンス)。

 

保有資格

テクニカルエンジニア(ネットワーク)
第二種情報処理技術者
MCP認定技術者 70-210/215
ETEC(組込みソフトウェア技術者)

 network2syu csk etec mcp_card

 

税込 11,980

オンライン(ダウンロード専用)版なので送料は無料です。

今すぐ見られる!購入後ただちに動画ファイルを閲覧ダウンロードできます。

image4

お申し込みはとても簡単です。

ご購入後、即時、ダウンロードおよび視聴が可能となります。代金決済完了後、14日以内にインフォトップユーザーマイページよりダウンロードください。※動画再生用サイトのURLとパスワードが書かれたPDFをダウンロードしていただきます。閲覧には、アイドック株式会社が提供する無料ソフト「bookend」がインストールされている必要がございます。 

今すぐ購入する(決済ページへ進む)

各種クレジット対応。分割払いOK。

credit_logo_all3 

denwa電話注文はこちら

qr

QRコード:ケータイ・スマホからもアクセスできます。 

さらに今なら、下記2つの特典が誰にでも必ず無料で付いてきます。

 

 image7【特典1】講師:大和賢一郎による個別メールサポート(購入後14日間)

教材の内容についてご不明な点、わからないところ、疑問点などございましたら、yamato@1mouke.com までご質問いただければ無料で回答いたします。購入後14日以内であれば、質問の回数は無制限です。お気軽にご利用下さい。回答は、原則24時間以内に回答いたします。ただし、質問の内容が複雑な場合は、回答にお時間をいただく場合がありますことをご了承ください。なお、教材の内容に関するご質問のみ受け付けています。教材と無関係の内容や、教材の解説範囲を超える質問については、回答できかねる場合がありますのでご了承ください。

 

 【特典2】安心の返金保証(購入後14日間)

万が一、内容にご満足いただけなかった場合は、ご購入後14日以内であれば全額返金いたします。返金をご希望されるお客様は、yamato@1mouke.com まで、お名前と、返金先の振込口座(銀行口座等)をお知らせ下さい。メール受信から3営業日(土日祝を除く平日)以内に振込みにて返金いたします。振り込み手数料は弊社が負担いたします。 なお、万が一、お客様の環境にて動画が再生できない場合も、同様に返金させていただきます。

 

これだけお得な特典がついて、

税込 11,980

オンライン(ダウンロード専用)版なので送料は無料です。

今すぐ見られる!購入後ただちに動画ファイルを閲覧ダウンロードできます。

お申し込みはとても簡単です。

ご購入後、即時、ダウンロードおよび視聴が可能となります。代金決済完了後、14日以内にインフォトップユーザーマイページよりダウンロードください。※動画再生用サイトのURLとパスワードが書かれたPDFをダウンロードしていただきます。閲覧には、アイドック株式会社が提供する無料ソフト「bookend」がインストールされている必要がございます。 

今すぐ購入する(決済ページへ進む)

各種クレジット対応。分割払いOK。

credit_logo_all3

denwa 電話注文はこちら

qr

QRコード:ケータイ・スマホからもアクセスできます。

 

【ご参考】あなたの人生を豊かにする賢いお金の使い方」とは?

1540_32 ちなみに、11,980円あれば買えるもの・・・

(例)某洋服店のパーカー2枚(生産国:中国)

image14

 洋服を身に着けるのもいいでしょう。

 でも、それ以上に、HTMLのスキル

 身に付けるのは、もっと良いでしょう。

 どちらが自己投資と呼べるでしょうか。

 将来のリターンが得られるでしょうか。

 冬服は冬しか着られませんが、

 HTMLのスキルオールシーズン(一生)使えます。

外見だけではなく、インナーマッスル(スキル)を鍛えたほうが、年収アップにつながります。

 

show 日刊スポーツ新聞に掲載されました。

nikkan

 

動画教材に関する、よくある質問FAQ

 

1540_32 再生できる端末について

 

Q. MAC(マッキントッシュ)で再生できますか?

 再生できます。念のため、ご購入前に、お手持ちの端末から当ページにアクセスして「サンプル動画を再生する」をクリックしてください。サンプル動画と製品版動画は同一フォーマットですので、サンプル動画が問題なく再生されれば、製品版動画も問題なく再生できます。

 

Q. どの種類Windowsでも再生できますか?

 再生できます。ブラウザにて再生するので、Windowsの種類に影響されません。

 

Q. iPhoneで再生できますか?

 再生できます。

 

Q. iPadで再生できますか?

 再生できます。

 

Q. Androidスマートフォンでも再生できますか?

 再生できます。

 

Q. 再生に必要なソフトウェアはありますか?

 動画の再生はブラウザのみ必要です。それ以外のソフトウェアをインストールする必要はありません。なお、動画再生用サイトのURLとパスワードが書かれたPDFをダウンロードしていただきますが、そのPDFの閲覧には、アイドック株式会社が提供する無料ソフト「bookend」がインストールされている必要がございます。 

 

Q. 動画再生用の推奨ブラウザは何ですか?

 Google Chrome(グーグル・クロム)の最新版、または、Firefox(ファイア・フォックス)の最新版を推奨しております。

 

Q. 推奨ブラウザの最新版はどこから入手できますか?

下記リンクからダウンロードできます。

Google Chrome(グーグル・クロム)https://www.google.co.jp/chrome/

Firefox(ファイア・フォックス)https://www.mozilla.org/ja/firefox/

 

Q. 動画を見るのにインターネット回線は必要ですか?

 必要です。動画はインターネット経由でオンラインにて再生していただきます。よって、インターネットに接続された端末にてご視聴ください。

 

Q. 万が一、再生できない場合はどうなりますか?

 まずは再生できない原因を特定します。ブラウザがインストールされていない、または、ブラウザのバージョンが古い、などが考えられます。または、お使いの端末がインターネット回線に接続されていない場合も、再生できません。モバイル端末の場合、電波状態が悪い(通信速度が遅い)場所では再生できない(再生が途切れる)可能性があります。どうしても解決しない場合は、全額返金させていただきます。

 

Q. 再生回数に制限はありますか?

 動画の再生回数に制限はありません。何度でも無制限で繰り返し再生してご覧いただけます。

 

Q. 再生期限はありますか?

 動画の再生期限はありません。一度購入されたお客様は、無期限で動画をご覧いただけます。

 

1540_32 メールサポートについて

 

Q. 購入後のメールサポートなどはありますか?

 あります。特典として無料で付いてきます。

 

Q. メールサポートは有料ですか?

 無料です。特典として無料で付いてきます。

 

Q. 特典が付くのはいつまでですか?

 現在のところ特に期限は設けておりません。しかし予告なしに終了する場合がありますのでご了承ください。特典をご希望されるお客様は、お早めのお申し込みをお願いいたします。

 

Q. メールサポートは何回まで使えますか?

 有効期間内であれば回数は無制限で使えます。

 

Q. メールサポートの回答はどれくらいで返信が来ますか?

 原則、24時間以内に回答いたします。ただし、質問の内容が複雑な場合は、回答にお時間をいただく場合がありますことをご了承ください。

 

Q. メールサポートではどのようなフォローが受けられますか?

 動画教材内で解説している内容について「わからないところ」を具体的に質問していただければ、回答いたします。

 

Q. メールサポートではどんな質問をしてもいいのですか?

 教材の内容に関するご質問のみ受け付けています。教材と無関係の内容や、教材の解説範囲を超える質問については、回答できかねる場合がありますのでご了承ください。

 

1540_32 教材の解説範囲について

 

Q. HTML5には対応していますか?

 HTML5には対応しておりません。HTML5はHTMLの仕様を拡張した高機能(高レベル)版とお考えください。今回は基礎編ですので、HTMLの基本機能のみの説明となり、HTML5の領域までは踏み込んでおりません。

 

Q. HTML5の学習には役立ちますか?

 役立ちます。HTMLはHTML5のベーシックな基礎となります。よって、HTMLをしっかり理解することが、将来的にHTML5を学習する上でも役に立ちます。

 

Q. PC初心者なのですが難しくないですか?

 難しくありません。この動画教材は、PC初心者に向けて開発された教材です。よって、安心してご覧いただけます。

 

Q. CSS(スタイルシート)は学べますか?

 学べません。この教材はHTMLの基礎を習得するのに特化した教材です。そのためCSSに関する解説は収録されておりません。CSSの習得については、別途、CSSに特化した動画教材をリリース予定ですので、詳細は追って当サイトにてお知らせいたします。

 

1540_32 お支払い方法について

 

Q. クレジットカード払いには対応していますか?

 対応しています。

 

Q. 分割払いには対応していますか?

 対応しています。

 

Q. 返金には対応していますか?

 対応しております。万が一、動画が再生できない場合は、全額返金いたします。また、動画が再生できる場合でも、内容にご満足いただけなかった場合は、ご購入後14日以内であれば全額返金いたします。返金をご希望されるお客様は、yamato@1mouke.com まで、お名前と、返金先の振込口座(銀行口座等)をお知らせ下さい。メール受信から3営業日(土日祝を除く平日)以内に振込みにて返金いたします。振り込み手数料は弊社が負担いたします。 

 

特定商取引法の表記