Skillversitas

HTML Quotations

HTML quotations are used to display quotes or references from other sources.

Quotation Tags

Blockquote

<blockquote>
    "HTML is the foundation of every website."
</blockquote>

Inline Quote

<p>According to <q>Tim Berners-Lee</q>, the web must be open to everyone.</p>

Abbreviation

<p>Use <abbr title="HyperText Markup Language">HTML</abbr> to create web pages.</p>

Address

<address>
    Technology University<br>
    123 Technology Street<br>
    Chicago, 12345<br>
    Phone: (021) 12345678
</address>

Citation

<cite>Learning HTML</cite> is a great book for beginners.

Case Study: Academic Article

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Academic Article</title>
    <style>
        blockquote {
            border-left: 4px solid #1e40af;
            padding-left: 1rem;
            margin: 1rem 0;
            color: #555;
            font-style: italic;
        }

        cite {
            display: block;
            margin-top: 0.5rem;
            font-style: normal;
            font-weight: bold;
        }
    </style>
</head>
<body>
    <article>
        <h1>The Importance of Technology Education</h1>

        <p>In today's digital era, understanding technology is becoming very important.</p>

        <blockquote>
            "Computational thinking is a fundamental skill that every individual must have in the 21st century."
            <cite>— Dr. Susanti, M.Kom.</cite>
        </blockquote>

        <p>According to recent research, <abbr title="Science, Technology, Engineering, and Mathematics">STEM</abbr> has become the main focus of global education.</p>

        <address>
            For more information, contact:<br>
            Informatics Engineering Department<br>
            Technology University<br>
            Email: [email protected]
        </address>
    </article>
</body>
</html>

Everyday Case Study

Case: A developer needs to display a lecturer's quote.

<h2>Lecturer Quotes</h2>

<blockquote>
    "Programming is not about writing code, but about solving problems."
    <cite>— Prof. John Smith, Ph.D.</cite>
</blockquote>

<blockquote>
    "HTML is the first language that every web developer must learn."
    <cite>— Dr. Susanti, M.Kom.</cite>
</blockquote>

Best Practices

  1. Use blockquote: For long quotes
  2. Use q: For short quotes
  3. Use cite: For the source of a quote
  4. Use abbr: For abbreviations
  5. Use address: For contact information

Summary

HTML quotations add context and references to content. Use the right tag for different types of quotations.