目次
受講生の属性
このスクールで受講される方の属性は大きく分けて３タイプあります。
1)業務上必要なwebスキルを学びにいらっしゃる方
2)Web業界に転職をするため未経験からwebを学びにいらっしゃる方
3)他のwebスクールを受講させた後受講希望される方
AkrosAcademyは３の方が多いという特徴があります。
あるスクールでhtml＋cssを学ばれた受講生
7月に受講開始された方で、あるスクールにてhtmlとcssのコースを習得されたと言う方がいます。
習得度を確認するために体験カウンセリングにて下記の画像の様なテキストをお渡しし、正しい文書構造でhtmlを描いていただく様お願いしました。
Apple Appleは、iPhone、iPad、Mac、Apple Watch、iOS、OS X、watchOSといったイノベーションで世界をリードしています。製品の情報も、購入も、サポートも、すべてAppleのウェブサイトでどうぞ。 --- Mac 新しいMacBook、iMac、Mac Pro、ほかにもいろいろ。Macの世界の魅力を紹介します。製品の情報も、購入も、サポートも、すべてAppleのウェブサイトでどうぞ。 --- MacBook 驚くほど薄くて軽い新しいMacBookは、目を奪う12インチRetinaディスプレイ、新設計のキーボード、新しい感圧タッチトラックパッドを搭載しています。 --- MacBook Air 新しいMacBook Airは、第5世代のIntel Coreプロセッサと一日中使い続けられるバッテリーを搭載。でも、圧倒的な薄さと軽さはそのままです。 --- MacBook Pro 最新世代のIntelプロセッサ、まったく新しいグラフィックス、より速くなったフラッシュストレージ。MacBook Proのパワーとパフォーマンスがさらに進化します。 --- iPad iPad ProとiPad mini 4が登場したiPadの世界を紹介します。製品の情報も、購入も、サポートも、すべてAppleのウェブサイトでどうぞ。 --- iPad Pro iPad Pro。薄く。軽く。壮大 --- iPad Air 2 iPad Air 2。軽いボディ。ヘビーなパワー。 --- iPad mini 4 手放せない性能。手放す必要がない薄さと軽さ。 --- iPhone iPhone 6sは、これまでで最もパワフルなテクノロジーと最も直感的なオペレーティングシステムを搭載しています。そのiPhoneの魅力をご紹介します。 --- iPhone 6s 唯一変わったのは、そのすべて。 --- iPhone 6 シルバーまたはスペースグレイから選べます --- iPhone 6+ ピクセル密度がなんと4倍のRetinaディスプレイです。 --- Copyright © 2016 Apple Inc. All rights reserved.
彼女はあるスクールでしっかりhtmlを習得されていました。完璧な構文でエラーはありませんでした。それがこちらです。
<h1>Apple</h1> <p>Appleは、iPhone、iPad、Mac、Apple Watch、iOS、OS X、watchOSといったイノベーションで世界をリードしています。製品の情報も、購入も、サポートも、すべてAppleのウェブサイトでどうぞ。</p> <hr/> <h2>Mac</h2> <p>新しいMacBook、iMac、Mac Pro、ほかにもいろいろ。Macの世界の魅力を紹介します。製品の情報も、購入も、サポートも、すべてAppleのウェブサイトでどうぞ。</p> <hr/> <h3>MacBook</h3> <p>驚くほど薄くて軽い新しいMacBookは、目を奪う12インチRetinaディスプレイ、新設計のキーボード、新しい感圧タッチトラックパッドを搭載しています。</p> <hr/> <h3>MacBook Air</h3> <p>新しいMacBook Airは、第5世代のIntel Coreプロセッサと一日中使い続けられるバッテリーを搭載。でも、圧倒的な薄さと軽さはそのままです。</p> <hr/> <h3>MacBook Pro</h3> <p>最新世代のIntelプロセッサ、まったく新しいグラフィックス、より速くなったフラッシュストレージ。MacBook Proのパワーとパフォーマンスがさらに進化します。</p> <hr/> <h2>iPad</h2> <p>iPad ProとiPad mini 4が登場したiPadの世界を紹介します。製品の情報も、購入も、サポートも、すべてAppleのウェブサイトでどうぞ。</p> <hr/> <h3>iPad Pro</h3> <p>iPad Pro。薄く。軽く。壮大</p> <hr/> <h3>iPad Air 2</h3> <p>iPad Air 2。軽いボディ。ヘビーなパワー。</p> <hr/> <h3>iPad mini 4</h3> <p>手放せない性能。手放す必要がない薄さと軽さ。</p> <hr/> <h2>iPhone</h2> <p>iPhone 6sは、これまでで最もパワフルなテクノロジーと最も直感的なオペレーティングシステムを搭載しています。そのiPhoneの魅力をご紹介します。</p> <hr/> <h3>iPhone 6s</h3> <p>唯一変わったのは、そのすべて。</p> <hr/> <h3>iPhone 6</h3> <p>シルバーまたはスペースグレイから選べます</p> <hr/> <h3>iPhone 6+</h3> <p>ピクセル密度がなんと4倍のRetinaディスプレイです。</p> <hr/> <footer>Copyright © 2016 Apple Inc. All rights reserved.</footer>
ただしこのhtmlだとgoogleがこのページをインデックスすることができません。よってこのヴァージョンのhtmlを書いている限りwebページが検索上位に表示される事はありません。
なぜならこのhtmlは1998年にgoogleが開発される前の時代の構文だからです。
検索エンジンに理解されるhtmlとは
インターネットが、人力でインデックスされていたYahoo!の人力検索エンジンからGoogleに代表されるクローラーと呼ばれる検索エンジンがインデックスする世界に様変わりしてhtmlはgoogleのアルゴリズムに理解してもらえる様に書かなければならなくなりました。
そこで登場したのがhtml5です。
html5ではheader, main, article, aside, section, footer, figureなど意味のあるタグで構成されています。googleのアルゴリスムはそのタグを見てそのコンテンツが何のコンテンツであるのか理解し、検索結果に反映します。
htmlの文書型宣言
また、彼女が書いたこのhtmlには文書型宣言もありませんでした。htmlにはヴァージョンに応じて文書型宣言を書く必要があります。
上記のhtmlであればhtml4以前の文書型宣言を書く必要があるのです。
古いヴァージョンのhtmlだと理解させることも、誤ったインデックスを検索エンジンにさせないために必要な事です。何故ならhtmlタグはhtml4, xhtml1, html5で同じタグで意味が変わった物があるからです。
セマンティックコーディング
xhtml1.0の時代から徐々にhtml内にUI要素を付加しない様になってきました。
さらにhtml5になってからは完全にhtmlの文書構造とUIを切り離し、UIはcssを使って表現する様になりました。
例えばhrは水平線を表すhtml4時代のタグです。これはhtml5では廃止され水平線はcssで表現する様になりました。
W3Cで勧告されたwebコードを書こう
W3C（ワールド・ワイド・ウェブ・コンソーシアム）はwebを標準化する世界組織です。
このW3CがPCやタッチデバイスの現行ブラウザで対応済みのスキルを勧告しています。現在、W3Cによって勧告されているhtmlのヴァージョンはhtml5.2です。
使用するhtmlのヴァージョンは新しすぎてもいけません。新しすぎると現行のデバイス全てで正しい表示がされないからです。
かと言って古いヴァージョンのhtmlで書かれているサイトは現行ヴァージョンのiOSやAndroid、MacOSやwindowのブラウザで正しく表示する事ができません。
古いコードを学んでいませんか？
もしあなたが他のスクールでwebクラスを修了したなら自分の書いたコードを見てください。
そのhtmlにはheader, main, article, aside, section, footer, figureと言ったタグが書かれているでしょうか？もしそれらのタグを探す事ができなかったらhtml5.2でhtmlとcssを学び直す事をお勧めします。
何故ならそれらのタグのないhtmlコードはgoogleのアルゴリズムに正しくインデックスしてもらえないからです。
貴方のhtmlを添削いたします
前掲のサンプルテキストをコピー＆ペーストしてhtmlの構文を組み立ててください。無料体験カウンセリングでお持ちいただければ添削します。
