みなさんこんにちは!

ぷぷぷのプログラミングゲーム日記へようこそ!

今回、わたしが攻略したゲームは
世の男性がきっと一度は考えたことのある夢のようなゲームです!

プログラミングに関する問題に正解するとなんと女の子が
一枚、また一枚と着ている洋服を脱いでいくという・・・

そうです!
そんなゲームが世の中にあるのですよ!

そしてわたしがそんなゲームを体験・攻略してきましたので
ぜひぜひ記事を参考にあなたも夢のような体験をしてみてくださいね!

(もちろん閲覧は自己責任です。まわりの環境にはぜひお気をつけて!)

そのゲームの名は・・・

codebabes
です!


このゲーム、ご覧いただければ分かるのですが
なんと全文英語です。

そうです海外のサイトなんです。

そしてよーくご覧いただけると分かるのですが
どうも2016年位から更新が止まっているようです。

この記事を書いた時にはまだサイトはあったのですが
もしかしたらあなたがご覧になるときには他のサイトになっているかもしれません。

もし、ご覧になったサイトがまだcodebabesだったなら
これはもう善は急げです!
なくならないうちにお早めにご利用くださいナ!


202012300001





HTML TEXT TAGS QUIZ!

やってまいりました!
コードベイブス!

ここで必要なのはメールアドレス英語力
それとプログラミングの知識です。

無料のところだけを楽しもうと
行けるところまで頑張ってみたいと思います。


メールアドレスは怖いから、あまりつかっていないような
メールアドレスを用意したほうが無難かもしれませんね。

退会する方法、ありました!
こちらをご確認ください!




このゲーム、いわゆるクイズゲームでして
一つ前の動画を見て、クイズの答えをさがすというもののようです。


その動画がだんだんとあなたのお好みの動画へと変わっていくわけですね!
なんとも楽しくなってまいりました!

しかしです。

やはりその動画を見るためにはクイズに答えなくてはいけません。
しかもそのクイズがまあ難しい!


ところがここはぷぷぷのプログラミングゲーム日記!
もちろん攻略のお手伝いをさせていただきますよ〜?
(答えをまちがえていたらすいません。言ってくれたら直したりするかもしれません。)



m-00096





ではでは第一問!



How many h1 elements sould you have on a page?

一つのページにh1要素はいくつにするべき?

  • 1

  • 2

  • 3

  • A bajillion


答えは 1 です!

The general rule is to use the h1 tag only once per page.

一般的な決まりでは、1ぺーじにつきh1タグ1個だ。 
1:14

h1タグは1つにするべきだと言っています。
そして、その中身はページの内容をまとめたうまい一言であるべきだとも言っています。

そうすることで、検索エンジンから高評価をもらい上位に表示してもらうことが
できるそうです。

h1からh6まで順番通りに使って、ハチャメチャにならないようにするべきだと
動画内で解説されています。


A bajillionは、ものすごく大きい数字という意味らしいです。




第二問です!

The following html structure is correct.

このHTML構造は正しい。

<h1> I am the Title </h1>
<h2> Well, Let's get this party started</h2>
<p>Paragruph rule </p>
<h4>H4 in the house!</h4>
<h2>H2, too hot to handle</h2>
  • TRUE

  • FALSE

この問題の答えはFALSEです!


どこがおかしいのか?

それは、<h2>が使われた後<h4>が使われています。

動画内では

They should be used in a cascading fashion, the h1 should come first, then h2, and then an h3.

これらは段階的に使う決まりだから、h1がはじめに来るべきで、そのあとh2,そのあとh3となる。
1:40
と言っているので、
h2が使われたあとはh3が来ないといけないんでしょう。

なのでh4が来ているからここはFALSEです!

<h1> I am the Title </h1>
(オレはタイトルだ!)

<h2> Well, Let's get this party started</h2>
(そうだなパーティを始めよう!)

<p>Paragruph rule </p>
(パラグラフの時代だぜ!)

<h4>H4 in the house!</h4>
(H4登場〜)

<h2>H2, too hot to handle</h2>
(H2、もう手に負えない)

とか言っているんでしょうか。
もう和訳が難しすぎてついていけません。。

What type of list is this?

これはどのタイプのリスト?



Cures for Bieber Fever
  • Testosterone
  • Peyote
  • Ryan Gosling's Abs
  • Whiskey
  • Hugh Jackman

  • <ul>

  • <ol>

  • <span>

  • None of the above




答えは、<ul>です!


There are two types of list tags avaliable in HTML.
Unordered lists and ordered lists.
Unordered lists are for shit where the order is not important, usually using bullet points,
while ordered lists use numbered.
They can be as long as short as you want.
you create unordered lists with the <ul> tag and ordered lists with the <ol> tag.

HTMLで使えるリストタグは二つある。
順序なしのリスト順序ありのリストだ。

順序なしのリストは順番をアホみたいに無視してくる。普通は黒丸を使う。
一方、順序ありは数字を使う。

キミがお望みのとおりに、どちらも短くなっている。
順序なしのリストはUnordered List → <ul>
順序ありのリストはOrdered List → <ol>
2:02

かなり長いところを抜き出しましたが、この部分が答えのヒントです。
リストの中でも黒丸を使うのは順序なしのリスト、それは<ul>と短くして使います。

なので、<ul>が答えになります!



Cures for Bieber Fever
ビーバーの熱を冷ます方法

・Testosterone
テストステロン(男性ホルモン)

・Peyote
ペヨーテ(麻薬の一種だそうです)

・Ryan Gosling's Abs
ライアン・ゴスリングの腹筋

・Whiskey
ウイスキー

・Hugh Jackman
ヒュー・ジャックマン(俳優さんです)

というわけでろくな治療法はリストにありませんでした!


Which header element do web crawlers, like Google's, really like?

どのヘッダー要素がウェブクローラー、Googleのようなもの、は本当に好きか?

  • <h3>

  • <h2>

  • <h1>

  • <4h>



答えは、<h1> になります!

Web crawlers consider the h1 to be the most important text on a page.

ウェブクローラは、h1がページ内で一番大事なテキストだと考える。
1:21
web crawlerは、ウェブクローラー、ウェブをはう人という意味なので、
ホームページの内容を理解して検索エンジンに載せる人の意味で
使われているんだと思います。

検索エンジンに乗ると色んな人が見に来るのでここはやっぱり大事なところということですね!

<4h>というタグは見たことないです。
多分、HTMLでは使わないんじゃないかと思います。



Is this nested list correct(inception list is not a real thing, don't go around saying that)?

この入れ子になったリストは正しいか(インセプションリストは本当じゃないんだ、誰かに言いふらさないでくれ)?




<ol>
    <li>Star Wars</li>
    <li>Hairy Backs</li>
    <li>Mustaches
       <ul>
         <li>Handlebar</li>
         <li>Creepy</li>
         <li>For Riding
             <ul>
                 <li>Best King</li>
             </ul>
         </li>
       </ul>
    </li>
</ol>

  • TRUE

  • FALSE



答えは、TRUEです!


0011--00232

動画の2:53頃の映像です。

コレを見れば何をいいたいかがわかるでしょう!

この問題、この解説の丸写しなんです!

なので、正解はtrue!マルということです。

問題文の"inception list is not a real thing..."のあたり、
翻訳がさっぱりで大変苦しみました。

一応なんですが


0011--00043



この画像から、レオナルド・ディカプリオが絡んでいることがわかります。

そこで、"inception レオナルドディカプリオ"で調べると、



"インセプション"という映画があるのがわかります。

このwikiを読むと、どうも階層が重要なカギを握っているらしいです。

問題が入れ子になったリストについてですから、

入れ子が深くなる = 階層が深くなる

ということでこの映画"インセプション"を連想するんじゃないか...
でも、実際には "inception list" という言葉はない、かあんまり有名じゃないので
そのあと、"don't go around saying that"と口止めしているんじゃないかと思うんです。


かなり突っ込んだ内容ですが、多分コレなんじゃないかと思っています!

その他、違った見方あるかた、どうぞご教授ください〜






というわけで、HTMLコースの二問目でした!

まいどまいど、問題が込み入っていて
これは全問正解するのも大変なんじゃないかと思います。

でも、このcodebabesは間違っても何かペナルティがあるわけでもなく
ただ先に進めないだけなので、
なんどもいろんな選択肢を試していれば
いつか必ず正解にたどり着きます。

なので、あきらめないで!

もしあきらめてしまったら、次回の記事をお待ちください〜



and5-00012