---
id: 61695c4aad56f95497c19583
title: ステップ 3
challengeType: 0
dashedName: step-3
---

# --description--

`title` 要素はページに関する追加情報を検索エンジンに提供するということを覚えておきましょう。 また、その `title` 要素の内容が次の 2 箇所に表示されます。

* ページが開いているときに、タイトルバーに表示されます。
* ページにカーソルを合わせたときに、ブラウザーのタブに表示されます。 そのタブがアクティブでない場合でも、タブにカーソルを合わせると、`title` のテキストが表示されます。

`head` 要素内に `title` 要素をネストし、テキストを `Colored Markers` としてください。

# --hints--

`title` の開始タグが 1 つ必要です。

```js
assert(code.match(/<title\s*>/i));
```

`title` の終了タグが 1 つ必要です。

```js
assert(code.match(/<\/title\s*>/i));
```

プロジェクトには `Colored Markers` というタイトルが必要です。

```js
const title = document.querySelector('title');
assert.equal(title?.text?.trim()?.toLowerCase(), 'colored markers')
```

タイトルテキストについて、大文字小文字の区別とスペルに気をつけましょう。

```js
const title = document.querySelector('title');
assert.equal(title?.text?.trim(), 'Colored Markers');
```

# --seed--

## --seed-contents--

```html
<!DOCTYPE html>
<html lang="en">
--fcc-editable-region--
  <head>
  </head>
--fcc-editable-region--
  <body>
  </body>
</html>
```
