• What is HTML and why is it used?

    HTML stands for HyperText Markup Language. It is the standard markup language used to create the structure of web pages. HTML defines elements like headings, paragraphs, images, links, and forms using tags.

    It is used to build the basic structure or skeleton of a website. The browser reads HTML and displays the content properly on the screen. In simple words, HTML is the foundation of every website.

  • Difference between HTML and HTML5

    HTML is the standard markup language used to create the structure of web pages, while HTML5 is the latest version of HTML with new features and improvements.

    The main difference is that HTML5 supports more advanced features compared to older HTML versions. HTML5 introduces new semantic tags like <header>, <footer>, <section>, and <article> which make the structure more meaningful. It also supports multimedia elements like <audio> and <video> without needing external plugins.

    Another difference is that HTML5 supports modern web features like local storage, improved form controls, and better support for mobile devices. Older HTML versions required external technologies for many of these features.

    In short, HTML5 is an improved and more powerful version of HTML that makes web development easier, faster, and more efficient.

  • What are semantic tags in HTML?

    Semantic tags in HTML are elements that clearly describe the meaning and purpose of the content they contain. Instead of just defining how something looks, they define what the content actually represents.

    For example, tags like <header>, <footer>, <article>, <section>, and <nav> are semantic tags because they describe the role of that part of the webpage. This makes the code more readable and understandable for developers and also helps search engines and screen readers understand the structure of the page better.

    In simple words, semantic tags improve code clarity, SEO, and accessibility by giving meaning to the content instead of just structuring it visually.

  • Why are semantic elements important for SEO?

    Semantic elements are important for SEO because they help search engines understand the structure and meaning of the content on a webpage.

    When we use semantic tags like <header>, <article>, <section>, <nav>, and <footer>, search engines can easily identify which part of the page contains important content, navigation links, or supporting information. This makes it easier for search engines to properly index the page.

    Semantic elements also improve accessibility, which indirectly helps SEO because search engines prefer websites that provide a better user experience.

    In short, semantic elements improve content structure, readability for search engines, and overall website ranking.

  • Difference between <div> and <span>

    The main difference between <div> and <span> is that <div> is a block-level element, while <span> is an inline element.

    A <div> takes up the full width available and always starts on a new line. It is mainly used to group larger sections of content like paragraphs, images, or other elements for layout and styling purposes.

    On the other hand, <span> does not start on a new line and only takes up as much width as necessary. It is mainly used to style or target a small portion of text inside another element.

    In short, <div> is used for grouping block-level content, while <span> is used for styling or grouping small inline content.

  • What is the use of <meta> tag?

    The <meta> tag is used to provide metadata about a webpage. Metadata means information about the page that is not directly visible to users but is useful for browsers and search engines.

    It is placed inside the <head> section of an HTML document. The <meta> tag is commonly used to define the character set, page description, keywords, author name, and viewport settings for responsive design.

    For example, it helps search engines understand the page content and helps browsers display the page correctly on different devices.

    In short, the <meta> tag provides important background information about a webpage that improves SEO, browser compatibility, and responsiveness.

  • Explain DOCTYPE

    DOCTYPE is a declaration that tells the browser which version of HTML the webpage is written in.

    It is written at the very top of the HTML document, before the <html> tag. The main purpose of DOCTYPE is to instruct the browser to render the page in standard mode instead of quirks mode.

    For example, in HTML5 we use:

    <!DOCTYPE html>

    This tells the browser that the document follows HTML5 standards.

    If DOCTYPE is not declared properly, the browser may use quirks mode, which can cause layout and styling issues.

    In short, DOCTYPE ensures that the webpage is rendered correctly according to the specified HTML version.

  • What is the difference between inline and block elements?

    • Block elements take the full width available, start on a new line, and can contain other block or inline elements. Examples: <div>, <p>, <h1>.
    • Inline elements take only the space they need, do not start on a new line, and are used inside block elements. Examples: <span>, <a>, <strong>.

    In short: block = new line, full width; inline = same line, only needed width.

  • What are attributes in HTML?

    Attributes in HTML are additional information added to an HTML element to define its properties or behavior.

    They are written inside the opening tag in the form name="value".

    Example:

    <a href="<https://example.com>" target="_blank">Visit Site</a>

    Here:

    • href is an attribute that specifies the link URL.
    • target is an attribute that specifies where to open the link.

    In short, attributes provide extra details to HTML elements to control their behavior or appearance.

  • What is the use of alt attribute?

    The alt attribute is used with the <img> tag to provide alternative text for an image.

    Its main purposes are:

    1. Accessibility: Screen readers use it to describe the image for visually impaired users.
    2. Fallback: If the image cannot load, the alt text is displayed instead.
    3. SEO: Search engines read alt text to understand the content of images.

    Example:

    <img src="logo.png" alt="Company Logo">

    In short, the alt attribute improves accessibility, user experience, and search engine optimization.

  • Difference between id and class

    Difference between id and class in HTML:

    • id
      • Unique identifier for a single element on the page.
      • Can be used only once per page.
      • Example: <div id="header">
    • class
      • Can be used on multiple elements to group them for styling or scripting.
      • Example: <p class="text">

    In short: id = unique element, class = group of elements.

  • What is accessibility in HTML?

    Accessibility in HTML means designing web pages so that all users, including people with disabilities, can access and use the content easily.

    It involves:

    • Using semantic HTML like <header>, <nav>, <main>, <footer>.
    • Adding alt text for images.
    • Using labels for form elements.
    • Ensuring keyboard navigation works.

    In short, accessibility ensures that websites are usable by everyone and provide a better user experience for all users.

  • What is ARIA?

    ARIA stands for Accessible Rich Internet Applications.

    It is a set of special attributes in HTML that help make web content and web applications more accessible, especially for people using screen readers or assistive technologies.

    ARIA attributes provide extra information about elements, such as their role, state, or properties, which might not be clear from standard HTML.

    Example:

    <button aria-label="Close Menu">X</button>

    Here, aria-label tells screen readers that this button’s purpose is to “Close Menu,” even though the visible text is just “X.”

    In short: ARIA improves accessibility by giving assistive technologies more context about how elements behave or what they mean.

  • Difference between <strong> and <b>

  • Difference between <em> and <i>

  • What is iframe?

  • How does browser render HTML?

  • What is the use of <link> tag?

  • What is the use of <script> tag?

  • Difference between async and defer