{"id":19828,"date":"2014-04-17T21:01:15","date_gmt":"2014-04-17T13:01:15","guid":{"rendered":"https:\/\/www.hongkiat.com\/blog\/?p=19828"},"modified":"2025-04-04T01:44:26","modified_gmt":"2025-04-03T17:44:26","slug":"html-tag-that-you-probably-dont-know","status":"publish","type":"post","link":"https:\/\/www.hongkiat.com\/blog\/html-tag-that-you-probably-dont-know\/","title":{"rendered":"5 HTML Elements You Should Know"},"content":{"rendered":"<p>Before, we\u2019ve gone in-depth about <a href=\"https:\/\/www.hongkiat.com\/blog\/html-css-faster-emmet\/\">HTML5 elements<\/a> and shown what they do. HTML5 brought us new elements like <code>header<\/code>, <code>footer<\/code>, <code>aside<\/code>, <code>nav<\/code>, and <code>main<\/code>. These additions made our web pages smarter because they tell computers what each part of the page is for.<\/p>\n<p>However, HTML is a big topic. If you take a look at the <a href=\"https:\/\/www.w3.org\/\" rel=\"nofollow\">W3.org<\/a> website, where all the details are kept, you\u2019ll see there\u2019s a lot to learn. With so much information, you might not have noticed some HTML elements. Here are a few you may have missed:<\/p>\n<div class=\"ref-block ref-block--post\" id=\"ref-post-1\">\n\t\t\t\t\t<a href=\"https:\/\/www.hongkiat.com\/blog\/html5-geolocation\/\" class=\"ref-block__link\" title=\"Read More: How to Get User Location with HTML5 Geolocation API\" rel=\"bookmark\"><span class=\"screen-reader-text\">How to Get User Location with HTML5 Geolocation API<\/span><\/a>\n<div class=\"ref-block__thumbnail img-thumb img-thumb--jumbo\" data-img='{ \"src\" : \"https:\/\/assets.hongkiat.com\/uploads\/thumbs\/250x160\/html5-geolocation.jpg\" }'>\n\t\t\t\t\t\t\t<noscript>\n<style>.no-js #ref-block-post-17802 .ref-block__thumbnail { background-image: url(\"https:\/\/assets.hongkiat.com\/uploads\/thumbs\/250x160\/html5-geolocation.jpg\"); }<\/style>\n<\/noscript>\n\t\t\t\t\t\t<\/div>\n<div class=\"ref-block__summary\">\n<h4 class=\"ref-title\">How to Get User Location with HTML5 Geolocation API<\/h4>\n<p class=\"ref-description\">\n\t\t\t\t\t\tIn many cases, obtaining user location would be extremely useful to establish better user experience, for example: E-commerce...\t\t\t\t\t\t<span>Read more<\/span><\/p>\n<\/div>\n<\/div>\n<h2>Understanding the Sample Element<\/h2>\n<p>The \u2018Sample Element\u2019 or <code>samp<\/code> is used to show text output from a computer, program, or script. Believe it or not, it\u2019s been around since HTML3! It\u2019s really handy for tech guides or instruction manuals.<\/p>\n<p>Look at this example where we use it to show an error message in Terminal.<\/p>\n<pre>\r\n If you type dir in Terminal, it will output &lt;samp&gt;command not found: dir&lt;\/samp&gt;. \r\n<\/pre>\n<p>This element is supported by all web browsers, including older ones like IE5. They will display it in a Monospace font, which is the same style used for the <code>code<\/code> and <code>pre<\/code> elements.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/html-tag-that-you-probably-dont-know\/samp-element.jpg\" alt=\"Example of samp element\" height=\"80\" width=\"500\"><\/figure>\n<h2>Exploring the Keyboard Input Element<\/h2>\n<p>The <code>kbd<\/code> element, also known as the Keyboard Input Element, is used to represent user input. Just like the <code>samp<\/code> element, the <code>kbd<\/code> is often seen in technical or computer-related articles.<\/p>\n<p>For instance, if you need to tell your readers to type certain characters in an application\u2019s input field, you would use the <code>kbd<\/code> element like this:<\/p>\n<pre>\r\n To confirm deletion of your account, type &lt;kbd&gt;DELETE&lt;\/kbd&gt;.\r\n<\/pre>\n<p>The <code>kbd<\/code> element can also denote actual keys on a keyboard.<\/p>\n<pre>\r\n Press &lt;kbd&gt;Enter&lt;\/kbd&gt; to create a new line.\r\n<\/pre>\n<p>When paired with the <code>samp<\/code> element, <code>kbd<\/code> can signify inputs made via the application\u2019s interface, such as buttons or menus. Here\u2019s an example:<\/p>\n<pre>\r\n Click &lt;kbd&gt;&lt;samp&gt;Agree&lt;\/samp&gt;&lt;\/kbd&gt; to proceed.\r\n<\/pre>\n<p>Although primarily for \u201cKeyboard Input,\u201d the <code>kbd<\/code> element can also be used for other types of input like voice commands. For tutorials involving voice commands with Siri, Google Voice, or Cortana, you can enclose the spoken words within a <code>kbd<\/code> tag.<\/p>\n<pre>\r\n ...the &lt;kbd&gt;Ok Google&lt;\/kbd&gt; hotword isn't region-locked and can be activated in a couple of steps.\r\n<\/pre>\n<p>By default, the <code>kbd<\/code> is displayed in Monospace just like the <code>samp<\/code> element.<\/p>\n<h3>Adding Style to Distinguish Elements<\/h3>\n<p>While these elements are beneficial for machines to understand content, they look the same to readers because they\u2019re all shown in Monospace. To differentiate them, we can style them uniquely.<\/p>\n<p>Let\u2019s say we want to make keyboard keys or app buttons stand out. We could assign them a class like <code>button-input<\/code>.<\/p>\n<p>Then we\u2019d add these CSS styles:<\/p>\n<pre>\r\n .button-input {\r\n   border: 1px solid #333;\r\n   background: linear-gradient(#aaa 0%, #555 100%);\r\n   color: #fff;\r\n   padding: 3px 8px;\r\n   border-radius: 3px;\r\n   box-shadow: 0px 2px 0px 0px #111;\r\n }\r\n<\/pre>\n<p>This styling will give them a realistic button appearance.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/html-tag-that-you-probably-dont-know\/kbd-element.jpg\" alt=\"Example of kbd element\" height=\"80\" width=\"500\"><\/figure>\n<h2>Understanding the Variable Element<\/h2>\n<p>The <code>var<\/code> element, short for Variable Element, is utilized to indicate a variable in mathematical expressions or programming contexts. This tag is particularly handy when writing tutorials that include equations:<\/p>\n<pre>\r\n &lt;code&gt;var &lt;var&gt;y&lt;\/var&gt; = Math.sqrt(16);&lt;\/code&gt;\r\n<\/pre>\n<p>In the example above, the entire equation is encapsulated in a <code>code<\/code> element because it represents a line of JavaScript code. The variable within that equation, \u2018y\u2019, is wrapped with a <code>var<\/code> element to denote it as a variable.<\/p>\n<h2>Highlighting Terms with the Defining Element<\/h2>\n<p>The <code>dfn<\/code> element, or Defining Element, is used to signify a term being defined or introduced, often seen in specialized fields or industries laden with jargon. Here\u2019s how you might use <code>dfn<\/code> to define industry-specific terminology:<\/p>\n<pre>\r\n &lt;p&gt;&lt;dfn&gt;Breadcrumbs&lt;\/dfn&gt; or &lt;dfn&gt;breadcrumb trail&lt;\/dfn&gt; are used in user interfaces to help users track their locations within programs or documents. The term is derived from the breadcrumb trail left by Hansel and Gretel in the classic fairy tale.&lt;\/p&gt;\r\n<\/pre>\n<p>Web browsers typically render the <code>dfn<\/code> element in italics, aligning with the traditional typographic practice of introducing a new or foreign term.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/html-tag-that-you-probably-dont-know\/defining-element.jpg\" alt=\"Example of dfn element\" height=\"100\" width=\"500\"><\/figure>\n<h2>The Mark Element: Highlighting Text in HTML5<\/h2>\n<p>Introduced in HTML5, the <code>mark<\/code> element is designed to highlight parts of text that should stand out to the reader. By default, it\u2019s displayed in a bright, attention-grabbing color:<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/html-tag-that-you-probably-dont-know\/mark-element.jpg\" alt=\"Example of mark element\" height=\"100\" width=\"500\"><\/figure>\n<p>Further information and examples of the <code>mark<\/code> element can be found in the W3C\u2019s documentation on <a href=\"https:\/\/www.w3.org\/TR\/html5\/text-level-semantics.html#the-mark-element\" rel=\"nofollow\">Text Level Semantics \u2013 Mark Element<\/a>.<\/p>\n<h2>Final Thoughts on Semantic HTML<\/h2>\n<p>Rather than defaulting to generic tags like <code>div<\/code> or <code>span<\/code>, it\u2019s advantageous to use more semantic elements. This practice helps machines \u2013 whether applications, search engine bots, or assistive devices \u2013 to better parse and understand the content. Hopefully, this exploration serves as a helpful guide for those looking to adopt more meaningful HTML structures.<\/p>","protected":false},"excerpt":{"rendered":"<p>Before, we\u2019ve gone in-depth about HTML5 elements and shown what they do. HTML5 brought us new elements like header, footer, aside, nav, and main. These additions made our web pages smarter because they tell computers what each part of the page is for. However, HTML is a big topic. If you take a look at&hellip;<\/p>\n","protected":false},"author":113,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[352],"tags":[506],"topic":[4520],"class_list":["entry-content","is-maxi"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v22.8 (Yoast SEO v27.3) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>5 HTML Elements You Should Know - Hongkiat<\/title>\n<meta name=\"description\" content=\"Before, we&#039;ve gone in-depth about HTML5 elements and shown what they do. HTML5 brought us new elements like header, footer, aside, nav, and main. These\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.hongkiat.com\/blog\/html-tag-that-you-probably-dont-know\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"5 HTML Elements You Should Know\" \/>\n<meta property=\"og:description\" content=\"Before, we&#039;ve gone in-depth about HTML5 elements and shown what they do. HTML5 brought us new elements like header, footer, aside, nav, and main. These\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.hongkiat.com\/blog\/html-tag-that-you-probably-dont-know\/\" \/>\n<meta property=\"og:site_name\" content=\"Hongkiat\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/hongkiatcom\" \/>\n<meta property=\"article:published_time\" content=\"2014-04-17T13:01:15+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-04-03T17:44:26+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/assets.hongkiat.com\/uploads\/html-tag-that-you-probably-dont-know\/samp-element.jpg\" \/>\n<meta name=\"author\" content=\"Thoriq Firdaus\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@tfirdaus\" \/>\n<meta name=\"twitter:site\" content=\"@hongkiat\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Thoriq Firdaus\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"4 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/html-tag-that-you-probably-dont-know\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/html-tag-that-you-probably-dont-know\\\/\"},\"author\":{\"name\":\"Thoriq Firdaus\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/person\\\/e7948c7a175d211496331e4b6ce55807\"},\"headline\":\"5 HTML Elements You Should Know\",\"datePublished\":\"2014-04-17T13:01:15+00:00\",\"dateModified\":\"2025-04-03T17:44:26+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/html-tag-that-you-probably-dont-know\\\/\"},\"wordCount\":637,\"commentCount\":1,\"publisher\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/html-tag-that-you-probably-dont-know\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/html-tag-that-you-probably-dont-know\\\/samp-element.jpg\",\"keywords\":[\"HTML\"],\"articleSection\":[\"Web Design\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/html-tag-that-you-probably-dont-know\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/html-tag-that-you-probably-dont-know\\\/\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/html-tag-that-you-probably-dont-know\\\/\",\"name\":\"5 HTML Elements You Should Know - Hongkiat\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/html-tag-that-you-probably-dont-know\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/html-tag-that-you-probably-dont-know\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/html-tag-that-you-probably-dont-know\\\/samp-element.jpg\",\"datePublished\":\"2014-04-17T13:01:15+00:00\",\"dateModified\":\"2025-04-03T17:44:26+00:00\",\"description\":\"Before, we've gone in-depth about HTML5 elements and shown what they do. HTML5 brought us new elements like header, footer, aside, nav, and main. These\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/html-tag-that-you-probably-dont-know\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/html-tag-that-you-probably-dont-know\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/html-tag-that-you-probably-dont-know\\\/#primaryimage\",\"url\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/html-tag-that-you-probably-dont-know\\\/samp-element.jpg\",\"contentUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/html-tag-that-you-probably-dont-know\\\/samp-element.jpg\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/html-tag-that-you-probably-dont-know\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"5 HTML Elements You Should Know\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/\",\"name\":\"Hongkiat\",\"description\":\"Tech and Design Tips\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\",\"name\":\"Hongkiat.com\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/wp-content\\\/uploads\\\/hkdc-logo-rect-yoast.jpg\",\"contentUrl\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/wp-content\\\/uploads\\\/hkdc-logo-rect-yoast.jpg\",\"width\":1200,\"height\":799,\"caption\":\"Hongkiat.com\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/hongkiatcom\",\"https:\\\/\\\/x.com\\\/hongkiat\",\"https:\\\/\\\/www.pinterest.com\\\/hongkiat\\\/\"]},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/person\\\/e7948c7a175d211496331e4b6ce55807\",\"name\":\"Thoriq Firdaus\",\"description\":\"Thoriq is a writer for Hongkiat.com with a passion for web design and development. He is the author of Responsive Web Design by Examples, where he covered his best approaches in developing responsive websites quickly with a framework.\",\"sameAs\":[\"https:\\\/\\\/thoriq.com\",\"https:\\\/\\\/x.com\\\/tfirdaus\"],\"jobTitle\":\"Web Developer\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/author\\\/thoriq\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"5 HTML Elements You Should Know - Hongkiat","description":"Before, we've gone in-depth about HTML5 elements and shown what they do. HTML5 brought us new elements like header, footer, aside, nav, and main. These","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.hongkiat.com\/blog\/html-tag-that-you-probably-dont-know\/","og_locale":"en_US","og_type":"article","og_title":"5 HTML Elements You Should Know","og_description":"Before, we've gone in-depth about HTML5 elements and shown what they do. HTML5 brought us new elements like header, footer, aside, nav, and main. These","og_url":"https:\/\/www.hongkiat.com\/blog\/html-tag-that-you-probably-dont-know\/","og_site_name":"Hongkiat","article_publisher":"https:\/\/www.facebook.com\/hongkiatcom","article_published_time":"2014-04-17T13:01:15+00:00","article_modified_time":"2025-04-03T17:44:26+00:00","og_image":[{"url":"https:\/\/assets.hongkiat.com\/uploads\/html-tag-that-you-probably-dont-know\/samp-element.jpg","type":"","width":"","height":""}],"author":"Thoriq Firdaus","twitter_card":"summary_large_image","twitter_creator":"@tfirdaus","twitter_site":"@hongkiat","twitter_misc":{"Written by":"Thoriq Firdaus","Est. reading time":"4 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.hongkiat.com\/blog\/html-tag-that-you-probably-dont-know\/#article","isPartOf":{"@id":"https:\/\/www.hongkiat.com\/blog\/html-tag-that-you-probably-dont-know\/"},"author":{"name":"Thoriq Firdaus","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/person\/e7948c7a175d211496331e4b6ce55807"},"headline":"5 HTML Elements You Should Know","datePublished":"2014-04-17T13:01:15+00:00","dateModified":"2025-04-03T17:44:26+00:00","mainEntityOfPage":{"@id":"https:\/\/www.hongkiat.com\/blog\/html-tag-that-you-probably-dont-know\/"},"wordCount":637,"commentCount":1,"publisher":{"@id":"https:\/\/www.hongkiat.com\/blog\/#organization"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/html-tag-that-you-probably-dont-know\/#primaryimage"},"thumbnailUrl":"https:\/\/assets.hongkiat.com\/uploads\/html-tag-that-you-probably-dont-know\/samp-element.jpg","keywords":["HTML"],"articleSection":["Web Design"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.hongkiat.com\/blog\/html-tag-that-you-probably-dont-know\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.hongkiat.com\/blog\/html-tag-that-you-probably-dont-know\/","url":"https:\/\/www.hongkiat.com\/blog\/html-tag-that-you-probably-dont-know\/","name":"5 HTML Elements You Should Know - Hongkiat","isPartOf":{"@id":"https:\/\/www.hongkiat.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.hongkiat.com\/blog\/html-tag-that-you-probably-dont-know\/#primaryimage"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/html-tag-that-you-probably-dont-know\/#primaryimage"},"thumbnailUrl":"https:\/\/assets.hongkiat.com\/uploads\/html-tag-that-you-probably-dont-know\/samp-element.jpg","datePublished":"2014-04-17T13:01:15+00:00","dateModified":"2025-04-03T17:44:26+00:00","description":"Before, we've gone in-depth about HTML5 elements and shown what they do. HTML5 brought us new elements like header, footer, aside, nav, and main. These","breadcrumb":{"@id":"https:\/\/www.hongkiat.com\/blog\/html-tag-that-you-probably-dont-know\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.hongkiat.com\/blog\/html-tag-that-you-probably-dont-know\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.hongkiat.com\/blog\/html-tag-that-you-probably-dont-know\/#primaryimage","url":"https:\/\/assets.hongkiat.com\/uploads\/html-tag-that-you-probably-dont-know\/samp-element.jpg","contentUrl":"https:\/\/assets.hongkiat.com\/uploads\/html-tag-that-you-probably-dont-know\/samp-element.jpg"},{"@type":"BreadcrumbList","@id":"https:\/\/www.hongkiat.com\/blog\/html-tag-that-you-probably-dont-know\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.hongkiat.com\/blog\/"},{"@type":"ListItem","position":2,"name":"5 HTML Elements You Should Know"}]},{"@type":"WebSite","@id":"https:\/\/www.hongkiat.com\/blog\/#website","url":"https:\/\/www.hongkiat.com\/blog\/","name":"Hongkiat","description":"Tech and Design Tips","publisher":{"@id":"https:\/\/www.hongkiat.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.hongkiat.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.hongkiat.com\/blog\/#organization","name":"Hongkiat.com","url":"https:\/\/www.hongkiat.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/www.hongkiat.com\/blog\/wp-content\/uploads\/hkdc-logo-rect-yoast.jpg","contentUrl":"https:\/\/www.hongkiat.com\/blog\/wp-content\/uploads\/hkdc-logo-rect-yoast.jpg","width":1200,"height":799,"caption":"Hongkiat.com"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/hongkiatcom","https:\/\/x.com\/hongkiat","https:\/\/www.pinterest.com\/hongkiat\/"]},{"@type":"Person","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/person\/e7948c7a175d211496331e4b6ce55807","name":"Thoriq Firdaus","description":"Thoriq is a writer for Hongkiat.com with a passion for web design and development. He is the author of Responsive Web Design by Examples, where he covered his best approaches in developing responsive websites quickly with a framework.","sameAs":["https:\/\/thoriq.com","https:\/\/x.com\/tfirdaus"],"jobTitle":"Web Developer","url":"https:\/\/www.hongkiat.com\/blog\/author\/thoriq\/"}]}},"jetpack_featured_media_url":"https:\/\/","jetpack_shortlink":"https:\/\/wp.me\/p4uxU-59O","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/19828","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/users\/113"}],"replies":[{"embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/comments?post=19828"}],"version-history":[{"count":3,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/19828\/revisions"}],"predecessor-version":[{"id":73680,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/19828\/revisions\/73680"}],"wp:attachment":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/media?parent=19828"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/categories?post=19828"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/tags?post=19828"},{"taxonomy":"topic","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/topic?post=19828"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}