Document foundations · Lesson 2 of 16

Metadata and language

title, charset, viewport and writing direction.

8 minutes2 games

The head describes the document: title names the tab, charset sets character encoding, and viewport supports mobile layout. lang identifies the language and dir the writing direction; they are independent. For an Arabic document use <html lang="ar" dir="rtl">.

HTML

<!doctype html>
<html lang="ar" dir="rtl">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta name="description" content="دروس برمجة قصيرة وتفاعلية">
  <title>تعلّم البرمجة</title>
</head>
<body><h1>أهلاً بيك</h1><p lang="en" dir="ltr">Hello, learner!</p></body>
</html>

Tool	Use
`lang`	Content language
`dir`	Writing direction
`title`	Tab title

Complete the code

Set the Arabic paragraph language and direction.

<p lang="" dir="">أهلاً</p>

Exercise

Create an Arabic RTL main containing an h1.

HTML

Learn more from

Played 0 of 2 games

HTML

Document foundations · Lesson 2 of 16

Metadata and language

title, charset, viewport and writing direction.

8 minutes2 games

HTML

<!doctype html>
<html lang="ar" dir="rtl">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta name="description" content="دروس برمجة قصيرة وتفاعلية">
  <title>تعلّم البرمجة</title>
</head>
<body><h1>أهلاً بيك</h1><p lang="en" dir="ltr">Hello, learner!</p></body>
</html>

Tool	Use
`lang`	Content language
`dir`	Writing direction
`title`	Tab title

Complete the code

Set the Arabic paragraph language and direction.

<p lang="" dir="">أهلاً</p>

Exercise

Create an Arabic RTL main containing an h1.

HTML

Learn more from

Played 0 of 2 games