Recall & Review
beginner
What is the purpose of the
<!DOCTYPE html> declaration in an HTML page?It tells the browser that the document is an HTML5 document, helping it to render the page correctly.
Click to reveal answer
beginner
What does the
<title> tag do in an HTML page?It sets the text shown in the browser tab or window title, helping users identify the page.
Click to reveal answer
beginner
Which tag contains the main visible content of a web page?
The
<body> tag contains all the content that users see on the page.Click to reveal answer
intermediate
Why is it important to include the
lang attribute in the <html> tag?It helps browsers and assistive technologies understand the language of the page, improving accessibility.
Click to reveal answer
intermediate
What is the role of the
<meta charset="UTF-8"> tag in the HTML head?It sets the character encoding to UTF-8, ensuring that most characters and symbols display correctly.
Click to reveal answer
Which tag is used to define the main content visible on a web page?
✗ Incorrect
The tag contains all the visible content of the page.
What does the
<title> tag affect?✗ Incorrect
The tag sets the text shown in the browser tab or window title.</div></div></div><div class="task-card "><div class="task-instruction text-pre-wrap">Why do we include <code><!DOCTYPE html></code> at the start of an HTML file?</div><div class="task-options"><div class="task-option "><span class="task-option-key">A</span><span class="text-pre-wrap">To tell the browser to use HTML5 standards</span></div><div class="task-option "><span class="task-option-key">B</span><span class="text-pre-wrap">To add a comment</span></div><div class="task-option "><span class="task-option-key">C</span><span class="text-pre-wrap">To link a stylesheet</span></div><div class="task-option "><span class="task-option-key">D</span><span class="text-pre-wrap">To set the page title</span></div></div><div class="feedback-box incorrect d-none"><div class="feedback-title">✗ Incorrect</div><div class="feedback-text">The DOCTYPE declaration tells the browser to use HTML5 rules for rendering.</div></div></div><div class="task-card "><div class="task-instruction text-pre-wrap">What is the purpose of the <code>lang</code> attribute in the <code><html></code> tag?</div><div class="task-options"><div class="task-option "><span class="task-option-key">A</span><span class="text-pre-wrap">To specify the language of the page content</span></div><div class="task-option "><span class="task-option-key">B</span><span class="text-pre-wrap">To set the font size</span></div><div class="task-option "><span class="task-option-key">C</span><span class="text-pre-wrap">To add a background image</span></div><div class="task-option "><span class="task-option-key">D</span><span class="text-pre-wrap">To link JavaScript files</span></div></div><div class="feedback-box incorrect d-none"><div class="feedback-title">✗ Incorrect</div><div class="feedback-text">The lang attribute helps browsers and screen readers know the page language.</div></div></div><div class="task-card "><div class="task-instruction text-pre-wrap">Which tag is used to set the character encoding for the page?</div><div class="task-options"><div class="task-option "><span class="task-option-key">A</span><span class="text-pre-wrap"><body></span></div><div class="task-option "><span class="task-option-key">B</span><span class="text-pre-wrap"><meta charset="UTF-8"></span></div><div class="task-option "><span class="task-option-key">C</span><span class="text-pre-wrap"><title></span></div><div class="task-option "><span class="task-option-key">D</span><span class="text-pre-wrap"><header></span></div></div><div class="feedback-box incorrect d-none"><div class="feedback-title">✗ Incorrect</div><div class="feedback-text">The meta charset tag defines the character encoding, usually UTF-8.</div></div></div></div><div class="recall-section "><div class="recall-prompt-card"><div class="recall-prompt-text">Describe the basic structure of a first HTML page and explain the purpose of each main tag.</div><textarea class="recall-prompt-textarea" id="prompt-rp1" placeholder="Type your answer here..."></textarea><div class="recall-prompt-actions"><button class="recall-check-btn">Check Answer</button><button class="recall-hint-btn">💡 Hint</button></div><div class="recall-prompt-hint d-none">Think about what the browser needs to know first and what content is visible.</div><div class="recall-prompt-feedback d-none "><div class="recall-prompt-feedback-title"></div><div class="recall-prompt-feedback-text">You got <!-- -->/<!-- -->6<!-- --> concepts.<ul class="expected-elements-list"></ul></div></div></div><div class="recall-prompt-card"><div class="recall-prompt-text">Why is accessibility important in your first HTML page, and how can you improve it?</div><textarea class="recall-prompt-textarea" id="prompt-rp2" placeholder="Type your answer here..."></textarea><div class="recall-prompt-actions"><button class="recall-check-btn">Check Answer</button><button class="recall-hint-btn">💡 Hint</button></div><div class="recall-prompt-hint d-none">Consider how screen readers and browsers understand your page.</div><div class="recall-prompt-feedback d-none "><div class="recall-prompt-feedback-title"></div><div class="recall-prompt-feedback-text">You got <!-- -->/<!-- -->4<!-- --> concepts.<ul class="expected-elements-list"></ul></div></div></div></div></div></article></div></div></main><div style="position:fixed;bottom:24px;right:24px;z-index:50"><button style="background:rgba(255,255,255,0.95);border:1px solid rgba(108,99,255,0.18);border-radius:10px;padding:10px 16px;color:#5f56fe;font-size:14px;cursor:pointer;display:flex;align-items:center;gap:7px;backdrop-filter:blur(12px);box-shadow:0 2px 12px rgba(0,0,0,0.08), 0 0 0 1px rgba(108,99,255,0.06);transition:all 0.2s"><span style="font-size:14px">⚑</span>Report Issue</button></div></div> <script src="/_next/static/chunks/webpack-fd24bd8e19d2841a.js" async=""></script><script>(self.__next_f=self.__next_f||[]).push([0]);self.__next_f.push([2,null])</script><script>self.__next_f.push([1,"1:HL[\"/_next/static/css/b133bdac07c7940e.css\",\"style\"]\n2:HL[\"/_next/static/css/837a603cb1a59856.css\",\"style\"]\n3:HL[\"/_next/static/css/725c7861d1898ba8.css\",\"style\"]\n4:HL[\"/_next/static/css/caf3ca742c7945f9.css\",\"style\"]\n"])</script><script>self.__next_f.push([1,"5:I[95751,[],\"\"]\n8:I[39275,[],\"\"]\ne:I[61343,[],\"\"]\nf:I[84080,[\"8726\",\"static/chunks/8726-583188341cbc1496.js\",\"3185\",\"static/chunks/app/layout-7a1373330f6a4c98.js\"],\"\"]\n10:I[88726,[\"8726\",\"static/chunks/8726-583188341cbc1496.js\",\"3185\",\"static/chunks/app/layout-7a1373330f6a4c98.js\"],\"Toaster\"]\n11:I[20154,[\"8422\",\"static/chunks/66ec4792-a0fc378024be0c7b.js\",\"6648\",\"static/chunks/6648-fff0cf0e0a1f8d25.js\",\"9160\",\"static/chunks/app/not-found-c4181ddc3e64e5f3.js\"],\"default\"]\n12:I[70548,[\"8726\",\"static/chunks/8726-583188341cbc1496.js\",\"3185\",\"static/chunks/app/layout-7a1373330f6a4c98.js\"],\"default\"]\n14:I[76130,[],\"\"]\n9:[\"lang\",\"en\",\"d\"]\na:[\"subject\",\"html\",\"d\"]\nb:[\"part\",\"part-1\",\"d\"]\nc:[\"pattern\",\"html-first-html-page\",\"d\"]\nd:[\"mode\",\"review\",\"oc\"]\n15:[]\n"])</script><script>self.__next_f.push([1,"0:[[[\"$\",\"link\",\"0\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/b133bdac07c7940e.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\"}]],[\"$\",\"$L5\",null,{\"buildId\":\"hN8t5By7h5nzsrdSose07\",\"assetPrefix\":\"\",\"initialCanonicalUrl\":\"/en/codefly/learn/html/part-1/html-first-html-page/review\",\"initialTree\":[\"\",{\"children\":[[\"lang\",\"en\",\"d\"],{\"children\":[\"codefly\",{\"children\":[\"learn\",{\"children\":[[\"subject\",\"html\",\"d\"],{\"children\":[[\"part\",\"part-1\",\"d\"],{\"children\":[[\"pattern\",\"html-first-html-page\",\"d\"],{\"children\":[[\"mode\",\"review\",\"oc\"],{\"children\":[\"__PAGE__\",{}]}]}]}]}]}]}]}]},\"$undefined\",\"$undefined\",true],\"initialSeedData\":[\"\",{\"children\":[[\"lang\",\"en\",\"d\"],{\"children\":[\"codefly\",{\"children\":[\"learn\",{\"children\":[[\"subject\",\"html\",\"d\"],{\"children\":[[\"part\",\"part-1\",\"d\"],{\"children\":[[\"pattern\",\"html-first-html-page\",\"d\"],{\"children\":[[\"mode\",\"review\",\"oc\"],{\"children\":[\"__PAGE__\",{},[[\"$L6\",\"$L7\"],null],null]},[\"$\",\"$L8\",null,{\"parallelRouterKey\":\"children\",\"segmentPath\":[\"children\",\"$9\",\"children\",\"codefly\",\"children\",\"learn\",\"children\",\"$a\",\"children\",\"$b\",\"children\",\"$c\",\"children\",\"$d\",\"children\"],\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$Le\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":\"$undefined\",\"notFoundStyles\":\"$undefined\",\"styles\":[[\"$\",\"link\",\"0\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/837a603cb1a59856.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\"}],[\"$\",\"link\",\"1\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/725c7861d1898ba8.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\"}],[\"$\",\"link\",\"2\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/caf3ca742c7945f9.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\"}]]}],null]},[\"$\",\"$L8\",null,{\"parallelRouterKey\":\"children\",\"segmentPath\":[\"children\",\"$9\",\"children\",\"codefly\",\"children\",\"learn\",\"children\",\"$a\",\"children\",\"$b\",\"children\",\"$c\",\"children\"],\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$Le\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":\"$undefined\",\"notFoundStyles\":\"$undefined\",\"styles\":null}],null]},[\"$\",\"$L8\",null,{\"parallelRouterKey\":\"children\",\"segmentPath\":[\"children\",\"$9\",\"children\",\"codefly\",\"children\",\"learn\",\"children\",\"$a\",\"children\",\"$b\",\"children\"],\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$Le\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":\"$undefined\",\"notFoundStyles\":\"$undefined\",\"styles\":null}],null]},[\"$\",\"$L8\",null,{\"parallelRouterKey\":\"children\",\"segmentPath\":[\"children\",\"$9\",\"children\",\"codefly\",\"children\",\"learn\",\"children\",\"$a\",\"children\"],\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$Le\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":\"$undefined\",\"notFoundStyles\":\"$undefined\",\"styles\":null}],null]},[\"$\",\"$L8\",null,{\"parallelRouterKey\":\"children\",\"segmentPath\":[\"children\",\"$9\",\"children\",\"codefly\",\"children\",\"learn\",\"children\"],\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$Le\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":\"$undefined\",\"notFoundStyles\":\"$undefined\",\"styles\":null}],null]},[\"$\",\"$L8\",null,{\"parallelRouterKey\":\"children\",\"segmentPath\":[\"children\",\"$9\",\"children\",\"codefly\",\"children\"],\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$Le\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":\"$undefined\",\"notFoundStyles\":\"$undefined\",\"styles\":null}],null]},[\"$\",\"$L8\",null,{\"parallelRouterKey\":\"children\",\"segmentPath\":[\"children\",\"$9\",\"children\"],\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$Le\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":\"$undefined\",\"notFoundStyles\":\"$undefined\",\"styles\":null}],null]},[[\"$\",\"html\",null,{\"lang\":\"en\",\"children\":[[\"$\",\"head\",null,{\"children\":[[\"$\",\"meta\",null,{\"name\":\"theme-color\",\"content\":\"#5f56fe\"}],[\"$\",\"meta\",null,{\"name\":\"msapplication-TileColor\",\"content\":\"#5f56fe\"}],[\"$\",\"$Lf\",null,{\"src\":\"https://www.googletagmanager.com/gtag/js?id=G-N2NY2DMMDW\",\"strategy\":\"afterInteractive\"}],[\"$\",\"$Lf\",null,{\"id\":\"google-analytics\",\"strategy\":\"afterInteractive\",\"children\":\"\\n window.dataLayer = window.dataLayer || [];\\n function gtag(){dataLayer.push(arguments);}\\n gtag('js', new Date());\\n gtag('config', 'G-N2NY2DMMDW', {\\n page_path: window.location.pathname,\\n });\\n \"}],[\"$\",\"script\",null,{\"async\":true,\"src\":\"https://www.googletagmanager.com/gtag/js?id=AW-17928224938\"}],[\"$\",\"$Lf\",null,{\"children\":\"\\n window.dataLayer = window.dataLayer || [];\\n function gtag() {\\n dataLayer.push(arguments);\\n }\\n gtag('js', new Date());\\n gtag('config', 'AW-17928224938');\\n \"}],[\"$\",\"script\",null,{\"data-grow-initializer\":\"\",\"suppressHydrationWarning\":true,\"dangerouslySetInnerHTML\":{\"__html\":\"!(function(){window.growMe||((window.growMe=function(e){window.growMe._.push(e);}),(window.growMe._=[]));var e=document.createElement(\\\"script\\\");(e.type=\\\"text/javascript\\\"),(e.src=\\\"https://faves.grow.me/main.js\\\"),(e.defer=!0),e.setAttribute(\\\"data-grow-faves-site-id\\\",\\\"U2l0ZTo0MGIxZDBlZC0wNzdlLTQ0NjgtOThmOC1kNDYyZGMwM2IwMWY=\\\");var t=document.getElementsByTagName(\\\"script\\\")[0];t.parentNode.insertBefore(e,t);})();\"}}],[\"$\",\"$Lf\",null,{\"src\":\"//scripts.scriptwrapper.com/tags/40b1d0ed-077e-4468-98f8-d462dc03b01f.js\",\"strategy\":\"afterInteractive\",\"data-noptimize\":\"1\",\"data-cfasync\":\"false\"}],[\"$\",\"script\",null,{\"type\":\"application/ld+json\",\"suppressHydrationWarning\":true,\"dangerouslySetInnerHTML\":{\"__html\":\"{\\\"@context\\\":\\\"https://schema.org\\\",\\\"@type\\\":\\\"WebApplication\\\",\\\"name\\\":\\\"Leyaa.ai\\\",\\\"description\\\":\\\"Leyaa.ai builds learning intelligence that understands how you learn - guiding what to study, how to practice, and when to move forward.\\\",\\\"url\\\":\\\"https://leyaa.ai\\\",\\\"applicationCategory\\\":\\\"EducationalApplication\\\",\\\"operatingSystem\\\":\\\"Web\\\",\\\"offers\\\":{\\\"@type\\\":\\\"Offer\\\",\\\"price\\\":\\\"0\\\",\\\"priceCurrency\\\":\\\"USD\\\"},\\\"creator\\\":{\\\"@type\\\":\\\"Organization\\\",\\\"name\\\":\\\"Leyaa.ai\\\"}}\"}}],[\"$\",\"link\",null,{\"href\":\"https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/css/bootstrap.min.css\",\"rel\":\"stylesheet\",\"integrity\":\"sha384-sRIl4kxILFvY47J16cr9ZwB07vP4J8+LH7qKQnuqkuIAvNWLzeN8tE5YBujZqJLB\",\"crossOrigin\":\"anonymous\"}],[\"$\",\"$Lf\",null,{\"id\":\"clarity-script\",\"strategy\":\"afterInteractive\",\"dangerouslySetInnerHTML\":{\"__html\":\"\\n (function(c,l,a,r,i,t,y){\\n c[a]=c[a]||function(){(c[a].q=c[a].q||[]).push(arguments)};\\n t=l.createElement(r);t.async=1;t.src=\\\"https://www.clarity.ms/tag/\\\"+i;\\n y=l.getElementsByTagName(r)[0];y.parentNode.insertBefore(t,y);\\n })(window, document, \\\"clarity\\\", \\\"script\\\", \\\"w4gxh6rdmh\\\");\\n \"}}]]}],[\"$\",\"body\",null,{\"children\":[[\"$\",\"$L10\",null,{\"containerStyle\":{\"top\":70}}],[\"$\",\"div\",null,{\"className\":\"bg-grid\"}],[\"$\",\"$L8\",null,{\"parallelRouterKey\":\"children\",\"segmentPath\":[\"children\"],\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$Le\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":[\"$\",\"$L11\",null,{}],\"notFoundStyles\":[[\"$\",\"link\",\"0\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/250d3fff07338fa3.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\"}]],\"styles\":null}],[\"$\",\"$L12\",null,{}],\" \"]}]]}],null],null],\"couldBeIntercepted\":false,\"initialHead\":[false,\"$L13\"],\"globalErrorComponent\":\"$14\",\"missingSlots\":\"$W15\"}]]\n"])</script><script>self.__next_f.push([1,"17:I[51766,[\"8422\",\"static/chunks/66ec4792-a0fc378024be0c7b.js\",\"522\",\"static/chunks/94730671-fd9628eddbd5107b.js\",\"7240\",\"static/chunks/53c13509-506edbde2b5b3f55.js\",\"7699\",\"static/chunks/8e1d74a4-a085c2fbc868135a.js\",\"5706\",\"static/chunks/9c4e2130-11ecd4bfc78e4568.js\",\"1779\",\"static/chunks/0e762574-6b3bda54d2fd2e14.js\",\"6648\",\"static/chunks/6648-fff0cf0e0a1f8d25.js\",\"3463\",\"static/chunks/3463-09ee572e3d7819a2.js\",\"4889\",\"static/chunks/4889-956a916919971629.js\",\"9985\",\"static/chunks/9985-b39235669d2563e2.js\",\"7627\",\"static/chunks/7627-224bb765a4decf1d.js\",\"7652\",\"static/chunks/7652-412e201fe52797ee.js\",\"8935\",\"static/chunks/8935-c1c159349bf7da40.js\",\"9663\",\"static/chunks/9663-fdcd080af3916e3e.js\",\"7029\",\"static/chunks/app/%5Blang%5D/codefly/learn/%5Bsubject%5D/%5Bpart%5D/%5Bpattern%5D/%5B%5B...mode%5D%5D/page-1fc9c577a9450e06.js\"],\"default\"]\n16:T427,{\"@context\":\"https://schema.org\",\"@type\":\"LearningResource\",\"name\":\"First HTML page - Cheat Sheet \u0026 Quick Revision\",\"description\":\"Quick revision of First HTML page. Key points, syntax summary, common mistakes, and flashcards for fast recall. Perfect for exam and interview prep.\",\"url\":\"https://leyaa.ai/codefly/learn/html/part-1/html-first-html-page/review\",\"learningResourceType\":\"Tutorial\",\"programmingLanguage\":\"HTML\",\"inLanguage\":\"en\",\"isAccessibleForFree\":true,\"teaches\":\"First HTML page - Cheat Sheet \u0026 Quick Revision\",\"provider\":{\"@type\":\"Organization\",\"url\":\"https://leyaa.ai\"},\"educationalLevel\":\"Beginner to Advanced\",\"breadcrumb\":{\"@type\":\"BreadcrumbList\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https://leyaa.ai\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"First HTML page - Cheat Sheet \u0026 Quick Revision\",\"item\":\"https://leyaa.ai/codefly/learn/html/part-1/html-first-html-page\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Quick Review\",\"item\":\"https://leyaa.ai/codefly/learn/html/part-1/html-first-html-page/review\"}]}}"])</script><script>self.__next_f.push([1,"7:[[[\"$\",\"script\",\"0\",{\"type\":\"application/ld+json\",\"dangerouslySetInnerHTML\":{\"__html\":\"$16\"}}]],[\"$\",\"$L17\",null,{\"subject\":\"html\",\"dbSubject\":\"html\",\"part\":\"part-1\",\"pattern\":\"html_first_html_page\",\"modeSlug\":\"review\",\"lang\":\"en\",\"internalLinks\":[{\"code\":\"LMC\",\"slug\":\"\",\"label\":\"📖 Learn\",\"href\":\"/codefly/learn/html/part-1/html-first-html-page\",\"active\":false},{\"code\":\"LMCWHY\",\"slug\":\"why\",\"label\":\"💡 Why Learn This\",\"href\":\"/codefly/learn/html/part-1/html-first-html-page/why\",\"active\":false},{\"code\":\"DLM\",\"slug\":\"deep\",\"label\":\"💡 Deep Learn Mode\",\"href\":\"/codefly/learn/html/part-1/html-first-html-page/deep\",\"active\":false},{\"code\":\"TMC\",\"slug\":\"try\",\"label\":\"✏️ Try It\",\"href\":\"/codefly/learn/html/part-1/html-first-html-page/try\",\"active\":false},{\"code\":\"VMC\",\"slug\":\"visualize\",\"label\":\"👁 Visualize\",\"href\":\"/codefly/learn/html/part-1/html-first-html-page/visualize\",\"active\":false},{\"code\":\"TCM\",\"slug\":\"complexity\",\"label\":\"⏱ Complexity\",\"href\":\"/codefly/learn/html/part-1/html-first-html-page/complexity\",\"active\":false},{\"code\":\"CMC\",\"slug\":\"challenge\",\"label\":\"🏆 Challenge\",\"href\":\"/codefly/learn/html/part-1/html-first-html-page/challenge\",\"active\":false},{\"code\":\"PMC\",\"slug\":\"project\",\"label\":\"📁 Project\",\"href\":\"/codefly/learn/html/part-1/html-first-html-page/project\",\"active\":false},{\"code\":\"RMC\",\"slug\":\"review\",\"label\":\"🧠 Quick Review\",\"href\":\"/codefly/learn/html/part-1/html-first-html-page/review\",\"active\":true}],\"isLoggedIn\":false,\"seoH1\":\"First HTML page - Cheat Sheet \u0026 Quick Revision\",\"contentData\":{\"pattern_id\":\"html_first_html_page\",\"metadata\":{\"slot_map\":{\"LMCWHY\":\"LMCWHY\",\"LMC\":\"LMC\",\"TMC\":\"TMC\",\"CMC\":\"CMC\",\"RMC\":\"RMC\",\"VMC\":\"BRM\",\"TCM\":\"WPM\",\"PMC\":\"PMC\",\"DLM\":\"DLM\"}},\"modes\":{\"RMC\":{\"concept\":\"First HTML page\",\"mode\":\"RMC_v4.2\",\"language\":\"html\",\"content_type\":\"Web Development\",\"flashcards\":[{\"id\":\"f1\",\"front\":\"What is the purpose of the \u003ccode\u003e\u0026lt;!DOCTYPE html\u0026gt;\u003c/code\u003e declaration in an HTML page?\",\"back\":\"It tells the browser that the document is an HTML5 document, helping it to render the page correctly.\",\"difficulty\":\"beginner\",\"tags\":[\"html\",\"doctype\"]},{\"id\":\"f2\",\"front\":\"What does the \u003ccode\u003e\u0026lt;title\u0026gt;\u003c/code\u003e tag do in an HTML page?\",\"back\":\"It sets the text shown in the browser tab or window title, helping users identify the page.\",\"difficulty\":\"beginner\",\"tags\":[\"html\",\"title\"]},{\"id\":\"f3\",\"front\":\"Which tag contains the main visible content of a web page?\",\"back\":\"The \u003ccode\u003e\u0026lt;body\u0026gt;\u003c/code\u003e tag contains all the content that users see on the page.\",\"difficulty\":\"beginner\",\"tags\":[\"html\",\"body\"]},{\"id\":\"f4\",\"front\":\"Why is it important to include the \u003ccode\u003elang\u003c/code\u003e attribute in the \u003ccode\u003e\u0026lt;html\u0026gt;\u003c/code\u003e tag?\",\"back\":\"It helps browsers and assistive technologies understand the language of the page, improving accessibility.\",\"difficulty\":\"intermediate\",\"tags\":[\"html\",\"accessibility\"]},{\"id\":\"f5\",\"front\":\"What is the role of the \u003ccode\u003e\u0026lt;meta charset=\u0026quot;UTF-8\u0026quot;\u0026gt;\u003c/code\u003e tag in the HTML head?\",\"back\":\"It sets the character encoding to UTF-8, ensuring that most characters and symbols display correctly.\",\"difficulty\":\"intermediate\",\"tags\":[\"html\",\"meta\",\"charset\"]}],\"micro_quiz\":[{\"id\":\"mq1\",\"question\":\"Which tag is used to define the main content visible on a web page?\",\"options\":{\"A\":\"\u003chead\u003e\",\"B\":\"\u003chtml\u003e\",\"C\":\"\u003ctitle\u003e\",\"D\":\"\u003cbody\u003e\"},\"correct_answer\":[\"D\"],\"explanation\":\"The \u003cbody\u003e tag contains all the visible content of the page.\"},{\"id\":\"mq2\",\"question\":\"What does the \u003ccode\u003e\u0026lt;title\u0026gt;\u003c/code\u003e tag affect?\",\"options\":{\"A\":\"The page background color\",\"B\":\"The main heading on the page\",\"C\":\"The text shown in the browser tab\",\"D\":\"The font style of the page\"},\"correct_answer\":[\"C\"],\"explanation\":\"The \u003ctitle\u003e tag sets the text shown in the browser tab or window title.\"},{\"id\":\"mq3\",\"question\":\"Why do we include \u003ccode\u003e\u0026lt;!DOCTYPE html\u0026gt;\u003c/code\u003e at the start of an HTML file?\",\"options\":{\"A\":\"To tell the browser to use HTML5 standards\",\"B\":\"To add a comment\",\"C\":\"To link a stylesheet\",\"D\":\"To set the page title\"},\"correct_answer\":[\"A\"],\"explanation\":\"The DOCTYPE declaration tells the browser to use HTML5 rules for rendering.\"},{\"id\":\"mq4\",\"question\":\"What is the purpose of the \u003ccode\u003elang\u003c/code\u003e attribute in the \u003ccode\u003e\u0026lt;html\u0026gt;\u003c/code\u003e tag?\",\"options\":{\"A\":\"To specify the language of the page content\",\"B\":\"To set the font size\",\"C\":\"To add a background image\",\"D\":\"To link JavaScript files\"},\"correct_answer\":[\"A\"],\"explanation\":\"The lang attribute helps browsers and screen readers know the page language.\"},{\"id\":\"mq5\",\"question\":\"Which tag is used to set the character encoding for the page?\",\"options\":{\"A\":\"\u003cbody\u003e\",\"B\":\"\u003cmeta charset=\\\"UTF-8\\\"\u003e\",\"C\":\"\u003ctitle\u003e\",\"D\":\"\u003cheader\u003e\"},\"correct_answer\":[\"B\"],\"explanation\":\"The meta charset tag defines the character encoding, usually UTF-8.\"}],\"recall_prompts\":[{\"id\":\"rp1\",\"prompt\":\"Describe the basic structure of a first HTML page and explain the purpose of each main tag.\",\"expected_elements\":[\"\u003c!DOCTYPE html\u003e\",\"\u003chtml lang=\\\"en\\\"\u003e\",\"\u003chead\u003e\",\"\u003cmeta charset=\\\"UTF-8\\\"\u003e\",\"\u003ctitle\u003e\",\"\u003cbody\u003e\"],\"hint\":\"Think about what the browser needs to know first and what content is visible.\"},{\"id\":\"rp2\",\"prompt\":\"Why is accessibility important in your first HTML page, and how can you improve it?\",\"expected_elements\":[\"lang attribute\",\"semantic tags\",\"clear structure\",\"meta charset\"],\"hint\":\"Consider how screen readers and browsers understand your page.\"}],\"spaced_repetition\":{\"initial_interval_hours\":24,\"multiplier\":2.5,\"max_interval_days\":30},\"metadata\":{\"version\":\"4.2\",\"content_type\":\"markup\",\"total_flashcards\":5,\"total_quiz\":5,\"estimated_time_minutes\":5}}},\"subject\":\"html\",\"title\":\"First HTML page\"},\"syllabusData\":{\"subject\":\"html\",\"part\":\"part-1\",\"difficulty\":\"beginner\",\"metadata\":{\"total_topics\":7,\"total_patterns\":43,\"patterns_with_content\":43,\"created_at\":\"2026-02-28T20:17:17.741100Z\",\"version\":\"4.2\",\"upload_tool\":\"upload_to_mongo.py v2.0\"},\"part_title\":\"Core Structure \u0026 Content\",\"subjectTitle\":\"HTML\",\"topics\":[{\"topic_id\":\"html_p1_t1\",\"title\":\"HTML Basics \u0026 Web Fundamentals\",\"order\":1,\"pattern_count\":7,\"patterns\":[{\"pattern_id\":\"html_what_is_html\",\"title\":\"What is HTML\",\"order\":1,\"has_content\":true},{\"pattern_id\":\"html_role_of_html_in_web_development\",\"title\":\"Role of HTML in web development\",\"order\":2,\"has_content\":true},{\"pattern_id\":\"html_how_browsers_read_html\",\"title\":\"How browsers read HTML\",\"order\":3,\"has_content\":true},{\"pattern_id\":\"html_html_document_structure\",\"title\":\"HTML document structure\",\"order\":4,\"has_content\":true},{\"pattern_id\":\"html_doctype_declaration\",\"title\":\"DOCTYPE declaration\",\"order\":5,\"has_content\":true},{\"pattern_id\":\"html_head_and_body_sections\",\"title\":\"Head and body sections\",\"order\":6,\"has_content\":true},{\"pattern_id\":\"html_first_html_page\",\"title\":\"First HTML page\",\"order\":7,\"has_content\":true}]},{\"topic_id\":\"html_p1_t2\",\"title\":\"HTML Elements \u0026 Tags\",\"order\":2,\"pattern_count\":7,\"patterns\":[{\"pattern_id\":\"html_what_is_an_html_element\",\"title\":\"What is an HTML element\",\"order\":1,\"has_content\":true},{\"pattern_id\":\"html_opening_and_closing_tags\",\"title\":\"Opening and closing tags\",\"order\":2,\"has_content\":true},{\"pattern_id\":\"html_selfclosing_tags\",\"title\":\"Self-closing tags\",\"order\":3,\"has_content\":true},{\"pattern_id\":\"html_nested_elements\",\"title\":\"Nested elements\",\"order\":4,\"has_content\":true},{\"pattern_id\":\"html_blocklevel_elements\",\"title\":\"Block-level elements\",\"order\":5,\"has_content\":true},{\"pattern_id\":\"html_inline_elements\",\"title\":\"Inline elements\",\"order\":6,\"has_content\":true},{\"pattern_id\":\"html_common_html_mistakes\",\"title\":\"Common HTML mistakes\",\"order\":7,\"has_content\":true}]},{\"topic_id\":\"html_p1_t3\",\"title\":\"Text Content \u0026 Formatting\",\"order\":3,\"pattern_count\":7,\"patterns\":[{\"pattern_id\":\"html_headings_h1h6\",\"title\":\"Headings (h1–h6)\",\"order\":1,\"has_content\":true},{\"pattern_id\":\"html_paragraphs\",\"title\":\"Paragraphs\",\"order\":2,\"has_content\":true},{\"pattern_id\":\"html_line_breaks_and_horizontal_rules\",\"title\":\"Line breaks and horizontal rules\",\"order\":3,\"has_content\":true},{\"pattern_id\":\"html_bold_and_italic_text\",\"title\":\"Bold and italic text\",\"order\":4,\"has_content\":true},{\"pattern_id\":\"html_strong_vs_b_tag\",\"title\":\"Strong vs b tag\",\"order\":5,\"has_content\":true},{\"pattern_id\":\"html_em_vs_i_tag\",\"title\":\"Em vs i tag\",\"order\":6,\"has_content\":true},{\"pattern_id\":\"html_preformatted_text\",\"title\":\"Preformatted text\",\"order\":7,\"has_content\":true}]},{\"topic_id\":\"html_p1_t4\",\"title\":\"Links \u0026 Navigation\",\"order\":4,\"pattern_count\":6,\"patterns\":[{\"pattern_id\":\"html_anchor_tag_basics\",\"title\":\"Anchor tag basics\",\"order\":1,\"has_content\":true},{\"pattern_id\":\"html_absolute_vs_relative_urls\",\"title\":\"Absolute vs relative URLs\",\"order\":2,\"has_content\":true},{\"pattern_id\":\"html_opening_links_in_new_tab\",\"title\":\"Opening links in new tab\",\"order\":3,\"has_content\":true},{\"pattern_id\":\"html_linking_to_sections_using_ids\",\"title\":\"Linking to sections using IDs\",\"order\":4,\"has_content\":true},{\"pattern_id\":\"html_email_and_phone_links\",\"title\":\"Email and phone links\",\"order\":5,\"has_content\":true},{\"pattern_id\":\"html_navigation_structure_basics\",\"title\":\"Navigation structure basics\",\"order\":6,\"has_content\":true}]},{\"topic_id\":\"html_p1_t5\",\"title\":\"Images \u0026 Media\",\"order\":5,\"pattern_count\":6,\"patterns\":[{\"pattern_id\":\"html_image_tag_usage\",\"title\":\"Image tag usage\",\"order\":1,\"has_content\":true},{\"pattern_id\":\"html_image_source_and_alt_attribute\",\"title\":\"Image source and alt attribute\",\"order\":2,\"has_content\":true},{\"pattern_id\":\"html_image_sizing_basics\",\"title\":\"Image sizing basics\",\"order\":3,\"has_content\":true},{\"pattern_id\":\"html_audio_tag_basics\",\"title\":\"Audio tag basics\",\"order\":4,\"has_content\":true},{\"pattern_id\":\"html_video_tag_basics\",\"title\":\"Video tag basics\",\"order\":5,\"has_content\":true},{\"pattern_id\":\"html_media_formats_overview\",\"title\":\"Media formats overview\",\"order\":6,\"has_content\":true}]},{\"topic_id\":\"html_p1_t6\",\"title\":\"Lists\",\"order\":6,\"pattern_count\":5,\"patterns\":[{\"pattern_id\":\"html_ordered_lists\",\"title\":\"Ordered lists\",\"order\":1,\"has_content\":true},{\"pattern_id\":\"html_unordered_lists\",\"title\":\"Unordered lists\",\"order\":2,\"has_content\":true},{\"pattern_id\":\"html_nested_lists\",\"title\":\"Nested lists\",\"order\":3,\"has_content\":true},{\"pattern_id\":\"html_description_lists\",\"title\":\"Description lists\",\"order\":4,\"has_content\":true},{\"pattern_id\":\"html_list_use_cases_in_layout\",\"title\":\"List use cases in layout\",\"order\":5,\"has_content\":true}]},{\"topic_id\":\"html_p1_t7\",\"title\":\"Tables\",\"order\":7,\"pattern_count\":5,\"patterns\":[{\"pattern_id\":\"html_table_structure\",\"title\":\"Table structure\",\"order\":1,\"has_content\":true},{\"pattern_id\":\"html_table_rows_and_columns\",\"title\":\"Table rows and columns\",\"order\":2,\"has_content\":true},{\"pattern_id\":\"html_table_headers\",\"title\":\"Table headers\",\"order\":3,\"has_content\":true},{\"pattern_id\":\"html_cell_merging\",\"title\":\"Cell merging\",\"order\":4,\"has_content\":true},{\"pattern_id\":\"html_table_accessibility_basics\",\"title\":\"Table accessibility basics\",\"order\":5,\"has_content\":true}]}]},\"modeCode\":\"RMC\",\"productId\":\"codefly\"}]]\n"])</script><script>self.__next_f.push([1,"13:[[\"$\",\"meta\",\"0\",{\"name\":\"viewport\",\"content\":\"width=device-width, initial-scale=1\"}],[\"$\",\"meta\",\"1\",{\"charSet\":\"utf-8\"}],[\"$\",\"title\",\"2\",{\"children\":\"First HTML page Cheat Sheet - Quick Revision | Leyaa.ai\"}],[\"$\",\"meta\",\"3\",{\"name\":\"description\",\"content\":\"Quick revision of First HTML page. Key points, syntax summary, common mistakes, and flashcards for fast recall. Perfect for exam and interview prep.\"}],[\"$\",\"meta\",\"4\",{\"name\":\"author\",\"content\":\"Leyaa.ai\"}],[\"$\",\"link\",\"5\",{\"rel\":\"manifest\",\"href\":\"/manifest.json\",\"crossOrigin\":\"use-credentials\"}],[\"$\",\"meta\",\"6\",{\"name\":\"keywords\",\"content\":\"learning intelligence,AI learning,personalized learning,adaptive learning,study guide,exam preparation,learning platform,education technology,edtech,smart learning\"}],[\"$\",\"meta\",\"7\",{\"name\":\"creator\",\"content\":\"Leyaa.ai\"}],[\"$\",\"meta\",\"8\",{\"name\":\"publisher\",\"content\":\"Leyaa.ai\"}],[\"$\",\"meta\",\"9\",{\"name\":\"robots\",\"content\":\"index, follow\"}],[\"$\",\"meta\",\"10\",{\"name\":\"googlebot\",\"content\":\"index, follow, max-image-preview:large, max-snippet:-1\"}],[\"$\",\"meta\",\"11\",{\"name\":\"content-language\",\"content\":\"en\"}],[\"$\",\"link\",\"12\",{\"rel\":\"canonical\",\"href\":\"https://leyaa.ai/codefly/learn/html/part-1/html-first-html-page/review\"}],[\"$\",\"link\",\"13\",{\"rel\":\"alternate\",\"hrefLang\":\"en\",\"href\":\"https://leyaa.ai/codefly/learn/html/part-1/html-first-html-page/review\"}],[\"$\",\"link\",\"14\",{\"rel\":\"alternate\",\"hrefLang\":\"x-default\",\"href\":\"https://leyaa.ai/codefly/learn/html/part-1/html-first-html-page/review\"}],[\"$\",\"meta\",\"15\",{\"property\":\"og:title\",\"content\":\"First HTML page Cheat Sheet - Quick Revision | Leyaa.ai\"}],[\"$\",\"meta\",\"16\",{\"property\":\"og:description\",\"content\":\"Quick revision of First HTML page. Key points, syntax summary, common mistakes, and flashcards for fast recall. Perfect for exam and interview prep.\"}],[\"$\",\"meta\",\"17\",{\"property\":\"og:url\",\"content\":\"https://leyaa.ai/codefly/learn/html/part-1/html-first-html-page/review\"}],[\"$\",\"meta\",\"18\",{\"property\":\"og:locale\",\"content\":\"en_US\"}],[\"$\",\"meta\",\"19\",{\"property\":\"og:image\",\"content\":\"https://leyaa.ai/Assets/metaImages/leyaa-preview-image.png\"}],[\"$\",\"meta\",\"20\",{\"property\":\"og:image:width\",\"content\":\"1200\"}],[\"$\",\"meta\",\"21\",{\"property\":\"og:image:height\",\"content\":\"630\"}],[\"$\",\"meta\",\"22\",{\"property\":\"og:image:alt\",\"content\":\"First HTML page Cheat Sheet - Quick Revision\"}],[\"$\",\"meta\",\"23\",{\"property\":\"og:type\",\"content\":\"article\"}],[\"$\",\"meta\",\"24\",{\"name\":\"twitter:card\",\"content\":\"summary_large_image\"}],[\"$\",\"meta\",\"25\",{\"name\":\"twitter:site\",\"content\":\"@leyaaai\"}],[\"$\",\"meta\",\"26\",{\"name\":\"twitter:creator\",\"content\":\"@leyaaai\"}],[\"$\",\"meta\",\"27\",{\"name\":\"twitter:title\",\"content\":\"First HTML page Cheat Sheet - Quick Revision | Leyaa.ai\"}],[\"$\",\"meta\",\"28\",{\"name\":\"twitter:description\",\"content\":\"Quick revision of First HTML page. Key points, syntax summary, common mistakes, and flashcards for fast recall. Perfect for exam and interview prep.\"}],[\"$\",\"meta\",\"29\",{\"name\":\"twitter:image\",\"content\":\"https://leyaa.ai/Assets/metaImages/leyaa-preview-image.png\"}],[\"$\",\"link\",\"30\",{\"rel\":\"icon\",\"href\":\"/leyaa-logo.png\"}],[\"$\",\"link\",\"31\",{\"rel\":\"apple-touch-icon\",\"href\":\"/leyaa-logo.png\"}],[\"$\",\"meta\",\"32\",{\"name\":\"next-size-adjust\"}]]\n"])</script><script>self.__next_f.push([1,"6:null\n"])</script></body></html>