[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"site-config":3,"topic:html-accessibility-aria-screen-readers":6,"blog-categories":89,"course-tree":114},{"data":4},{"google_site_verification":5,"ga4_measurement_id":5,"site_name":5,"default_og_image":5,"twitter_handle":5},null,{"data":7},{"id":8,"title":9,"slug":10,"content":11,"course":12,"subcategory":15,"author":18,"reading_time_minutes":24,"cornerstone":25,"schema_type":26,"faq_json":5,"video_url":5,"canonical_url":27,"meta_title":28,"meta_description":29,"og_image":5,"toc_json":30,"code_examples":58,"quiz":5,"exercises":71,"published_at":5,"updated_at":80,"prev":81,"next":85},67,"HTML Accessibility (ARIA, Screen Readers)","html-accessibility-aria-screen-readers","\u003Ch2 id=\"html-accessibility-aria-screen-readers\">HTML Accessibility (ARIA, Screen Readers)\u003C\u002Fh2>\u003Cp>Web accessibility means building pages that everyone can use, including people who rely on screen readers, keyboard-only navigation, switch devices, or other assistive technology. It isn't an optional extra &mdash; in many countries it's a legal requirement (like the ADA in the US or the EN 301 549 standard in the EU), and it also improves usability for every visitor, not just those with disabilities.\u003C\u002Fp>\u003Ch3 id=\"start-with-semantic-html\">Start with Semantic HTML\u003C\u002Fh3>\u003Cp>The single biggest accessibility win is simply using the correct native HTML element for the job &mdash; a real \u003Ccode>&lt;button&gt;\u003C\u002Fcode> instead of a styled \u003Ccode>&lt;div&gt;\u003C\u002Fcode>, a real \u003Ccode>&lt;nav&gt;\u003C\u002Fcode> instead of a generic wrapper. Native elements already come with built-in keyboard support, focus handling, and screen-reader announcements for free.\u003C\u002Fp>\u003Ch3 id=\"what-is-aria\">What is ARIA?\u003C\u002Fh3>\u003Cp>ARIA (Accessible Rich Internet Applications) is a set of extra HTML attributes that describe roles, states, and properties to assistive technology, used to fill gaps when semantic HTML alone isn't enough &mdash; for example, in complex custom widgets like tab panels, modals, or autocomplete menus. The golden rule of ARIA is: \"No ARIA is better than bad ARIA\" &mdash; always prefer a native element first.\u003C\u002Fp>\u003Ch3 id=\"common-aria-attributes\">Common ARIA Attributes\u003C\u002Fh3>\u003Cul>\n\u003Cli>\u003Cstrong>role\u003C\u002Fstrong> &mdash; defines what a custom element behaves as (e.g. \u003Ccode>role=\"button\"\u003C\u002Fcode>, \u003Ccode>role=\"dialog\"\u003C\u002Fcode>).\u003C\u002Fli>\n\u003Cli>\u003Cstrong>aria-label\u003C\u002Fstrong> &mdash; provides an accessible name when there's no visible text label.\u003C\u002Fli>\n\u003Cli>\u003Cstrong>aria-hidden=\"true\"\u003C\u002Fstrong> &mdash; hides purely decorative content from screen readers.\u003C\u002Fli>\n\u003Cli>\u003Cstrong>aria-expanded\u003C\u002Fstrong> &mdash; tells screen readers whether a collapsible section is open or closed.\u003C\u002Fli>\n\u003Cli>\u003Cstrong>aria-live\u003C\u002Fstrong> &mdash; announces dynamic content updates (like a form error or a live chat message) without the user needing to navigate to them.\u003C\u002Fli>\n\u003C\u002Ful>\u003Ch3 id=\"keyboard-navigation\">Keyboard Navigation\u003C\u002Fh3>\u003Cp>Every interactive element must be reachable and operable using only the Tab, Shift+Tab, Enter, and Space keys, since many users cannot use a mouse at all. Custom interactive components built with \u003Ccode>&lt;div&gt;\u003C\u002Fcode> elements need \u003Ccode>tabindex\u003C\u002Fcode> and manual keyboard event handling to behave correctly.\u003C\u002Fp>\u003Ch3 id=\"images-forms-and-color-contrast\">Images, Forms and Color Contrast\u003C\u002Fh3>\u003Cp>Always give meaningful images an \u003Ccode>alt\u003C\u002Fcode> attribute describing their content, and mark purely decorative images with \u003Ccode>alt=\"\"\u003C\u002Fcode>. Every form input needs an associated \u003Ccode>&lt;label&gt;\u003C\u002Fcode>. Text and background colors should meet WCAG's minimum contrast ratio so low-vision users can read content comfortably.\u003C\u002Fp>\u003Ch3 id=\"testing-accessibility\">Testing Accessibility\u003C\u002Fh3>\u003Cp>Common techniques include navigating a page using only the keyboard, testing with a real screen reader (VoiceOver on Mac, NVDA on Windows), and running automated audit tools like Lighthouse or axe DevTools to catch common issues quickly.\u003C\u002Fp>\u003Cdiv class=\"try-it-yourself language-html\">\u003Cpre>\u003Ccode>&lt;!-- A custom accordion button using ARIA to communicate its expanded state --&gt;\n&lt;button aria-expanded='false' aria-controls='panel1' id='accordionBtn'&gt;\n  What is included in the plan?\n&lt;\u002Fbutton&gt;\n&lt;div id='panel1' role='region' hidden&gt;\n  &lt;p&gt;The plan includes hosting, support, and monthly backups.&lt;\u002Fp&gt;\n&lt;\u002Fdiv&gt;\u003C\u002Fcode>\u003C\u002Fpre>\u003C\u002Fdiv>\u003Cdiv class=\"try-it-yourself language-javascript\">\u003Cpre>\u003Ccode>\u002F\u002F Toggling the accordion and keeping ARIA state in sync\nconst btn = document.getElementById('accordionBtn');\nconst panel = document.getElementById('panel1');\n\nbtn.addEventListener('click', () =&gt; {\n  const isExpanded = btn.getAttribute('aria-expanded') === 'true';\n  btn.setAttribute('aria-expanded', String(!isExpanded));\n  panel.hidden = isExpanded;\n});\u003C\u002Fcode>\u003C\u002Fpre>\u003C\u002Fdiv>\u003Cdiv class=\"try-it-yourself language-html\">\u003Cpre>\u003Ccode>&lt;!-- Accessible form field example --&gt;\n&lt;label for='email'&gt;Email address&lt;\u002Flabel&gt;\n&lt;input type='email' id='email' name='email' required aria-describedby='emailHelp'&gt;\n&lt;small id='emailHelp'&gt;We'll never share your email with anyone else.&lt;\u002Fsmall&gt;\u003C\u002Fcode>\u003C\u002Fpre>\u003C\u002Fdiv>",{"name":13,"slug":14},"HTML","html-tutorial",{"name":16,"slug":17},"Accessibility & Best Practices (High-Demand  Skill) �","accessibility-best-practices-high-demand-skill",{"slug":19,"display_name":20,"job_title":5,"short_bio":5,"expertise_tags":21,"headshot":5,"long_bio":5,"credentials":5,"twitter_url":5,"linkedin_url":5,"github_url":5,"personal_website_url":5,"other_sameas_urls":5,"topics":22,"posts":23},"badar-khalil","Badar Khalil",[],[],[],2,false,"Article","https:\u002F\u002Fwpfsharp.com\u002Ftopics\u002Fhtml-accessibility-aria-screen-readers","HTML Accessibility: ARIA & Screen Reader Guide","Learn HTML accessibility fundamentals — semantic elements, ARIA roles and attributes, keyboard navigation, and screen reader support with code examples.",[31],{"id":10,"text":9,"level":24,"children":32},[33,38,42,46,50,54],{"id":34,"text":35,"level":36,"children":37},"start-with-semantic-html","Start with Semantic HTML",3,[],{"id":39,"text":40,"level":36,"children":41},"what-is-aria","What is ARIA?",[],{"id":43,"text":44,"level":36,"children":45},"common-aria-attributes","Common ARIA Attributes",[],{"id":47,"text":48,"level":36,"children":49},"keyboard-navigation","Keyboard Navigation",[],{"id":51,"text":52,"level":36,"children":53},"images-forms-and-color-contrast","Images, Forms and Color Contrast",[],{"id":55,"text":56,"level":36,"children":57},"testing-accessibility","Testing Accessibility",[],[59,64,68],{"id":60,"language":61,"code":62,"is_editable":63},146,"html","\u003C!-- A custom accordion button using ARIA to communicate its expanded state -->\n\u003Cbutton aria-expanded='false' aria-controls='panel1' id='accordionBtn'>\n  What is included in the plan?\n\u003C\u002Fbutton>\n\u003Cdiv id='panel1' role='region' hidden>\n  \u003Cp>The plan includes hosting, support, and monthly backups.\u003C\u002Fp>\n\u003C\u002Fdiv>",true,{"id":65,"language":66,"code":67,"is_editable":63},147,"javascript","\u002F\u002F Toggling the accordion and keeping ARIA state in sync\nconst btn = document.getElementById('accordionBtn');\nconst panel = document.getElementById('panel1');\n\nbtn.addEventListener('click', () => {\n  const isExpanded = btn.getAttribute('aria-expanded') === 'true';\n  btn.setAttribute('aria-expanded', String(!isExpanded));\n  panel.hidden = isExpanded;\n});",{"id":69,"language":61,"code":70,"is_editable":63},148,"\u003C!-- Accessible form field example -->\n\u003Clabel for='email'>Email address\u003C\u002Flabel>\n\u003Cinput type='email' id='email' name='email' required aria-describedby='emailHelp'>\n\u003Csmall id='emailHelp'>We'll never share your email with anyone else.\u003C\u002Fsmall>",[72],{"id":73,"title":74,"slug":75,"prompt":76,"starter_code":77,"expected_output":78,"language":61,"order_index":79},65,"Fix the Inaccessible Button","fix-the-inaccessible-button","The code below uses a \u003Cdiv> styled to look like a button, but it can't be focused or activated with a keyboard, and has no accessible name. Rewrite it to be fully accessible.","\u003Cdiv class='btn' onclick='submitForm()'>Submit\u003C\u002Fdiv>","\u003Cbutton type='button' onclick='submitForm()'>Submit\u003C\u002Fbutton> — a real \u003Cbutton> element, which is focusable, keyboard-operable, and announced correctly by screen readers by default.",1,"2026-09-27T18:57:07+00:00",{"id":82,"slug":83,"title":84},66,"html-server-sent-events-sse","HTML Server-Sent Events (SSE)",{"id":86,"slug":87,"title":88},68,"writing-semantic-and-seo-friendly-html","Writing Semantic & SEO-Friendly HTML",{"data":90},[91,96,99,104,109],{"name":92,"slug":93,"description":94,"post_count":24,"subcategories":95},"CSS","css","Learn CSS with practical tutorials and examples covering layouts, Flexbox, Grid, responsive design, typography, positioning, animations, and more.",[],{"name":13,"slug":61,"description":97,"post_count":24,"subcategories":98},"Learn HTML with practical tutorials and examples for beginners. Explore HTML tags, elements, attributes, links, images, forms, semantic HTML, and more with clear explanations and real code examples.",[],{"name":100,"slug":101,"description":102,"post_count":79,"subcategories":103},"WPF","wpf","Learn WPF with practical tutorials and examples covering XAML, windows, controls, layouts, data binding, MVVM, commands, styles, templates, debugging, and modern WPF UI development.",[],{"name":105,"slug":106,"description":107,"post_count":79,"subcategories":108},"Python","python","Learn Python with practical tutorials covering strings, lists, functions, exceptions, files, packages, virtual environments, modules, classes, and beginner programming concepts.",[],{"name":110,"slug":111,"description":112,"post_count":79,"subcategories":113},"Java","java","Learn Java with practical tutorials and examples for beginners. Explore Java syntax, variables, data types, classes, objects, methods, inheritance, exceptions, collections, and more with clear explanations and real code examples.",[],{"data":115},[116],{"id":79,"name":13,"slug":14,"icon":5,"icon_url":5,"short_description":117,"meta_title":118,"meta_description":119,"og_image":120,"locale":121,"subcategories":122},"Welcome to our HTML Tutorial for Beginners, a complete guide designed to help you learn HTML from the ground up.\n\nHTML, which stands for HyperText Markup Language, is the standard language used to structure content on the web. Whether you want to become a web developer, build your own website, or continue learning CSS and JavaScript, understanding HTML is an essential first step.\n\nThis HTML course takes you through the fundamentals step by step, using simple explanations and practical examples. ","HTML Tutorial for Beginners - Learn HTML Step by Step","Learn HTML from scratch with our beginner-friendly HTML tutorial. Understand HTML tags, elements, forms, tables, links, images, semantic HTML and more with practical examples.","https:\u002F\u002Fwpfsharp.com\u002Fstorage\u002Fcourses\u002Fog\u002F01M2GK0XN45C0B937NF9XFAD4S.webp","en",[123,148,184,208,284,318,332,360,380,388],{"id":79,"name":124,"slug":125,"order_index":79,"topics":126},"HTML Fundamentals & Setup","html-fundamentals-setup",[127,130,133,136,140,144],{"id":79,"title":128,"slug":129,"order_index":79,"cornerstone":25,"reading_time_minutes":79},"HTML Introduction & History","html-introduction-and-history",{"id":24,"title":131,"slug":132,"order_index":79,"cornerstone":25,"reading_time_minutes":24},"HTML Editors & Environment Setup","html-editors-and-environment-setup",{"id":36,"title":134,"slug":135,"order_index":36,"cornerstone":25,"reading_time_minutes":24},"HTML Basic Syntax & Document Structure","html-basic-syntax-document-structure",{"id":137,"title":138,"slug":139,"order_index":137,"cornerstone":25,"reading_time_minutes":24},4,"HTML Elements & Tags Explained","html-elements-tags-explained",{"id":141,"title":142,"slug":143,"order_index":141,"cornerstone":25,"reading_time_minutes":24},5,"HTML Attributes (Global & Standard)","html-attributes-global-standard",{"id":145,"title":146,"slug":147,"order_index":145,"cornerstone":25,"reading_time_minutes":24},6,"Understanding the DOCTYPE & HTML5 Boilerplate","understanding-doctype-html5-boilerplate",{"id":24,"name":149,"slug":150,"order_index":24,"topics":151},"Text & Content Basics","text-content-basics",[152,156,160,164,168,172,176,180],{"id":153,"title":154,"slug":155,"order_index":153,"cornerstone":25,"reading_time_minutes":24},7,"HTML Headings (H1–H6) & SEO Best Practices","html-headings-h1-h6-seo-best-practices",{"id":157,"title":158,"slug":159,"order_index":157,"cornerstone":25,"reading_time_minutes":24},8,"HTML Paragraphs & Line Breaks","html-paragraphs-line-breaks",{"id":161,"title":162,"slug":163,"order_index":161,"cornerstone":25,"reading_time_minutes":79},9,"HTML Text Formatting (Bold, Italic, Mark, etc.)","html-text-formatting-bold-italic-mark",{"id":165,"title":166,"slug":167,"order_index":165,"cornerstone":25,"reading_time_minutes":24},10,"HTML Styles (Inline CSS Basics)","html-styles-inline-css-basics",{"id":169,"title":170,"slug":171,"order_index":169,"cornerstone":25,"reading_time_minutes":24},11,"HTML Quotations & Citations (blockquote, q, cite)","html-quotations-citations-blockquote-q-cite",{"id":173,"title":174,"slug":175,"order_index":173,"cornerstone":25,"reading_time_minutes":24},12,"HTML Comments (Best Practices)","html-comments-best-practices",{"id":177,"title":178,"slug":179,"order_index":177,"cornerstone":25,"reading_time_minutes":24},13,"HTML Colors (Names, HEX, RGB, HSL)","html-colors-names-hex-rgb-hsl",{"id":181,"title":182,"slug":183,"order_index":181,"cornerstone":25,"reading_time_minutes":24},14,"HTML & CSS Integration (Inline, Internal, External)","html-css-integration-inline-internal-external",{"id":36,"name":185,"slug":186,"order_index":36,"topics":187},"Links, Media & Navigation","links-media-navigation",[188,192,196,200,204],{"id":189,"title":190,"slug":191,"order_index":189,"cornerstone":25,"reading_time_minutes":24},15,"HTML Links (Anchor Tags & Hyperlinks)","html-links-anchor-tags-hyperlinks",{"id":193,"title":194,"slug":195,"order_index":193,"cornerstone":25,"reading_time_minutes":24},16,"HTML Images (Alt Text, Lazy Loading, Formats)","html-images-alt-text-lazy-loading-formats",{"id":197,"title":198,"slug":199,"order_index":197,"cornerstone":25,"reading_time_minutes":79},17,"HTML Favicon Setup","html-favicon-setup",{"id":201,"title":202,"slug":203,"order_index":201,"cornerstone":25,"reading_time_minutes":24},18,"HTML Page Title & Meta Tags (SEO Essentials)","html-page-title-meta-tags-seo-essentials",{"id":205,"title":206,"slug":207,"order_index":205,"cornerstone":25,"reading_time_minutes":24},19,"HTML File Paths (Absolute vs Relative)","html-file-paths-absolute-vs-relative",{"id":137,"name":209,"slug":210,"order_index":137,"topics":211},"Structuring Content","structuring-content",[212,217,222,227,232,236,240,244,248,252,256,260,264,268,272,276,280],{"id":213,"title":214,"slug":215,"order_index":216,"cornerstone":25,"reading_time_minutes":24},24,"HTML Tables Explained: Rows, Columns & Merging Cells","html-tables-rows-columns-merging-cells",20,{"id":218,"title":219,"slug":220,"order_index":221,"cornerstone":25,"reading_time_minutes":24},25,"HTML Lists: Ordered, Unordered & Description Lists","html-lists-ordered-unordered-description",21,{"id":223,"title":224,"slug":225,"order_index":226,"cornerstone":25,"reading_time_minutes":24},26,"HTML Block vs Inline Elements Explained","html-block-vs-inline-elements",22,{"id":228,"title":229,"slug":230,"order_index":231,"cornerstone":25,"reading_time_minutes":79},27,"HTML Div & Span: Generic Containers Explained","html-div-and-span-containers",23,{"id":233,"title":234,"slug":235,"order_index":213,"cornerstone":25,"reading_time_minutes":24},28,"HTML Classes vs ID: Selectors Explained","html-classes-vs-id-selectors-explained",{"id":237,"title":238,"slug":239,"order_index":218,"cornerstone":25,"reading_time_minutes":79},29,"HTML Iframes: Embedding External Content","html-iframes-embedding-content",{"id":241,"title":242,"slug":243,"order_index":223,"cornerstone":25,"reading_time_minutes":24},30,"HTML Head Element Deep Dive","html-head-element-deep-dive",{"id":245,"title":246,"slug":247,"order_index":228,"cornerstone":25,"reading_time_minutes":24},31,"HTML Layout Techniques: Header, Nav & Footer","html-layout-techniques-header-nav-footer",{"id":249,"title":250,"slug":251,"order_index":233,"cornerstone":25,"reading_time_minutes":24},32,"Responsive HTML Design: Mobile-First Approach","responsive-html-design-mobile-first-approach",{"id":253,"title":254,"slug":255,"order_index":237,"cornerstone":25,"reading_time_minutes":36},74,"HTML Semantic Elements (article, section, aside, nav)","html-semantic-elements-article-section-aside-nav",{"id":257,"title":258,"slug":259,"order_index":241,"cornerstone":25,"reading_time_minutes":24},75,"HTML Style Guide & Coding Conventions","html-style-guide-coding-conventions",{"id":261,"title":262,"slug":263,"order_index":245,"cornerstone":25,"reading_time_minutes":24},76,"HTML Entities & Special Characters","html-entities-special-characters",{"id":265,"title":266,"slug":267,"order_index":249,"cornerstone":25,"reading_time_minutes":79},77,"HTML Symbols","html-symbols",{"id":269,"title":270,"slug":271,"order_index":269,"cornerstone":25,"reading_time_minutes":79},33,"HTML Emojis 😀: How to Use Them in Web Pages","html-emojis-trending-guide",{"id":273,"title":274,"slug":275,"order_index":273,"cornerstone":25,"reading_time_minutes":24},34,"HTML Character Sets: UTF-8 & Encoding Explained","html-character-sets-utf-8-encoding",{"id":277,"title":278,"slug":279,"order_index":277,"cornerstone":25,"reading_time_minutes":79},35,"HTML URL Encoding Explained","html-url-encoding-explained",{"id":281,"title":282,"slug":283,"order_index":281,"cornerstone":25,"reading_time_minutes":79},36,"HTML vs XHTML: Key Differences","html-vs-xhtml-key-differences",{"id":153,"name":285,"slug":286,"order_index":141,"topics":287},"Forms & User Input","forms-user-input",[288,293,298,303,308,313],{"id":289,"title":290,"slug":291,"order_index":292,"cornerstone":25,"reading_time_minutes":24},49,"HTML Forms Introduction","html-forms-introduction",37,{"id":294,"title":295,"slug":296,"order_index":297,"cornerstone":25,"reading_time_minutes":79},50,"HTML Form Attributes (action, method, etc.)","html-form-attributes-action-method",38,{"id":299,"title":300,"slug":301,"order_index":302,"cornerstone":25,"reading_time_minutes":79},51,"HTML Form Elements (input, select, textarea, button)","html-form-elements-input-select-textarea-button",39,{"id":304,"title":305,"slug":306,"order_index":307,"cornerstone":25,"reading_time_minutes":24},52,"HTML Input Types (Modern Types: email, date, color, range)","html-input-types-modern-email-date-color-range",40,{"id":309,"title":310,"slug":311,"order_index":312,"cornerstone":25,"reading_time_minutes":24},53,"HTML Input Attributes (required, placeholder, pattern)","html-input-attributes-required-placeholder-pattern",41,{"id":314,"title":315,"slug":316,"order_index":317,"cornerstone":25,"reading_time_minutes":24},54,"HTML Form Validation (Client-Side)","html-form-validation-client-side",42,{"id":157,"name":319,"slug":320,"order_index":145,"topics":321},"Graphics & Visuals","graphics-visuals",[322,327],{"id":323,"title":324,"slug":325,"order_index":326,"cornerstone":25,"reading_time_minutes":36},55,"HTML Canvas (2D Drawing API) 🔥","html-canvas-2d-drawing-api",43,{"id":328,"title":329,"slug":330,"order_index":331,"cornerstone":25,"reading_time_minutes":36},56,"HTML SVG (Scalable Vector Graphics)","html-svg-scalable-vector-graphics",44,{"id":161,"name":333,"slug":334,"order_index":153,"topics":335},"Multimedia","multimedia",[336,341,346,351,356],{"id":337,"title":338,"slug":339,"order_index":340,"cornerstone":25,"reading_time_minutes":24},57,"HTML Media Overview","html-media-overview",45,{"id":342,"title":343,"slug":344,"order_index":345,"cornerstone":25,"reading_time_minutes":24},58,"HTML Video Embedding (Native Player)","html-video-embedding-native-player",46,{"id":347,"title":348,"slug":349,"order_index":350,"cornerstone":25,"reading_time_minutes":24},59,"HTML Audio Embedding","html-audio-embedding",47,{"id":352,"title":353,"slug":354,"order_index":355,"cornerstone":25,"reading_time_minutes":24},60,"HTML Plug-ins (Object & Embed Tags)","html-plugins-object-embed-tags",48,{"id":357,"title":358,"slug":359,"order_index":289,"cornerstone":25,"reading_time_minutes":24},61,"Embedding YouTube Videos in HTML","embedding-youtube-videos-in-html",{"id":165,"name":361,"slug":362,"order_index":157,"topics":363},"HTML5 Web APIs (Advanced\u002FTrending)","html5-web-apis-advancedtrending",[364,368,372,376,379],{"id":365,"title":366,"slug":367,"order_index":294,"cornerstone":25,"reading_time_minutes":24},62,"HTML Geolocation API","html-geolocation-api",{"id":369,"title":370,"slug":371,"order_index":299,"cornerstone":25,"reading_time_minutes":24},63,"HTML Drag & Drop API","html-drag-and-drop-api",{"id":373,"title":374,"slug":375,"order_index":304,"cornerstone":25,"reading_time_minutes":24},64,"HTML Web Storage (localStorage & sessionStorage)","html-web-storage-localstorage-sessionstorage",{"id":73,"title":377,"slug":378,"order_index":309,"cornerstone":25,"reading_time_minutes":24},"HTML Web Workers (Background Processing)","html-web-workers-background-processing",{"id":82,"title":84,"slug":83,"order_index":314,"cornerstone":25,"reading_time_minutes":24},{"id":169,"name":16,"slug":17,"order_index":161,"topics":381},[382,383,384],{"id":8,"title":9,"slug":10,"order_index":323,"cornerstone":25,"reading_time_minutes":24},{"id":86,"title":88,"slug":87,"order_index":328,"cornerstone":25,"reading_time_minutes":24},{"id":385,"title":386,"slug":387,"order_index":337,"cornerstone":25,"reading_time_minutes":24},69,"HTML Performance Optimization Basics","html-performance-optimization-basics",{"id":173,"name":389,"slug":390,"order_index":165,"topics":391},"Reference & Practice","reference-practice",[392,396,400,404,408,412,416,420],{"id":393,"title":394,"slug":395,"order_index":79,"cornerstone":25,"reading_time_minutes":24},70,"HTML Tag List (Full Reference)","html-tag-list-full-reference",{"id":397,"title":398,"slug":399,"order_index":24,"cornerstone":25,"reading_time_minutes":24},71,"HTML Global Attributes Reference","html-global-attributes-reference",{"id":401,"title":402,"slug":403,"order_index":36,"cornerstone":25,"reading_time_minutes":24},72,"HTML Events Reference","html-events-reference",{"id":405,"title":406,"slug":407,"order_index":137,"cornerstone":25,"reading_time_minutes":24},73,"HTML Browser Support & Compatibility","html-browser-support-compatibility",{"id":409,"title":410,"slug":411,"order_index":141,"cornerstone":25,"reading_time_minutes":24},78,"HTML Doctypes Reference","html-doctypes-reference",{"id":413,"title":414,"slug":415,"order_index":145,"cornerstone":25,"reading_time_minutes":24},79,"HTTP Methods & Messages (Basics for Forms\u002FAPIs)","http-methods-messages-basics",{"id":417,"title":418,"slug":419,"order_index":153,"cornerstone":25,"reading_time_minutes":36},80,"HTML Interview Preparation (Top Q&A)","html-interview-preparation-top-qa",{"id":421,"title":422,"slug":423,"order_index":157,"cornerstone":25,"reading_time_minutes":79},81,"HTML Quiz & Practice Exercises","html-quiz-practice-exercises"]