<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta name="aspect-ratio" content="4:3">
  <style>
    * { box-sizing: border-box; margin: 0; padding: 0; }
    body {
      font-family: system-ui, -apple-system, sans-serif;
      background: #f8f9fa;
      color: #1e2945;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: space-between;
      min-height: 100%;
      padding: 12px 10px;
      user-select: none;
    }

    /* Claim selector bar */
    .claim-selector {
      display: flex;
      gap: 8px;
      width: 100%;
      max-width: 440px;
      margin-bottom: 6px;
    }
    .claim-btn {
      flex: 1;
      border: 1px solid #cbd5e1;
      background: #ffffff;
      padding: 8px 10px;
      border-radius: 20px;
      font-size: 13px;
      font-weight: 600;
      color: #64748b;
      cursor: pointer;
      text-align: center;
      transition: all 0.25s ease;
      box-shadow: 0 1px 2px rgba(0,0,0,0.04);
    }
    .claim-btn.active {
      background: #0284c7;
      color: #ffffff;
      border-color: #0284c7;
      box-shadow: 0 2px 8px rgba(2,132,199,0.25);
    }

    /* Flowchart Stage */
    .flow-wrapper {
      position: relative;
      width: 100%;
      max-width: 440px;
      height: 330px;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: space-between;
    }

    /* SVG Connecting Lines */
    .flow-svg {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      pointer-events: none;
      z-index: 1;
    }
    .flow-line {
      stroke: #cbd5e1;
      stroke-width: 2.5;
      fill: none;
      transition: stroke 0.3s ease, stroke-width 0.3s ease;
    }
    .flow-line.active-blue {
      stroke: #0284c7;
      stroke-width: 3.5;
    }
    .flow-line.active-gray {
      stroke: #64748b;
      stroke-width: 3.5;
    }

    /* Flow Nodes */
    .node {
      position: relative;
      z-index: 2;
      background: #ffffff;
      border-radius: 12px;
      border: 1.5px solid #e2e8f0;
      padding: 10px 14px;
      text-align: center;
      box-shadow: 0 2px 6px rgba(0,0,0,0.04);
      transition: all 0.3s ease;
    }
    .node-title {
      font-size: 11px;
      text-transform: uppercase;
      letter-spacing: 0.5px;
      font-weight: 700;
      color: #94a3b8;
      margin-bottom: 2px;
    }
    .node-text {
      font-size: 13.5px;
      font-weight: 600;
      color: #1e2945;
      line-height: 1.25;
    }

    /* Step Highlights */
    .node.active-step {
      border-color: #0284c7;
      box-shadow: 0 0 0 3px rgba(2,132,199,0.15), 0 4px 10px rgba(0,0,0,0.06);
    }

    .step-1 { width: 92%; }
    .step-2 { width: 88%; }

    /* Step 3 Outcomes Branch */
    .branch-row {
      display: flex;
      justify-content: space-between;
      gap: 10px;
      width: 100%;
      z-index: 2;
    }
    .outcome-card {
      flex: 1;
      border-radius: 12px;
      padding: 10px 8px;
      text-align: center;
      border: 2px solid transparent;
      transition: all 0.3s ease;
      background: #ffffff;
      box-shadow: 0 2px 6px rgba(0,0,0,0.04);
    }
    .outcome-card.empirical {
      border-color: #e0f2fe;
    }
    .outcome-card.empirical.active {
      background: #f0f9ff;
      border-color: #0284c7;
      box-shadow: 0 4px 12px rgba(2,132,199,0.2);
    }
    .outcome-card.interpretation {
      border-color: #f1f5f9;
    }
    .outcome-card.interpretation.active {
      background: #f8fafc;
      border-color: #64748b;
      box-shadow: 0 4px 12px rgba(100,116,139,0.2);
    }

    .outcome-type {
      font-size: 13px;
      font-weight: 700;
      margin-bottom: 3px;
    }
    .empirical .outcome-type { color: #0284c7; }
    .interpretation .outcome-type { color: #475569; }

    .outcome-action {
      font-size: 11.5px;
      font-weight: 600;
      padding: 3px 8px;
      border-radius: 12px;
      display: inline-block;
    }
    .empirical .outcome-action {
      background: #0284c7;
      color: #ffffff;
    }
    .interpretation .outcome-action {
      background: #64748b;
      color: #ffffff;
    }

    /* Decision Pill Badges */
    .badge-pill {
      position: absolute;
      z-index: 3;
      font-size: 11px;
      font-weight: 700;
      padding: 2px 7px;
      border-radius: 10px;
      background: #ffffff;
      border: 1px solid #cbd5e1;
      color: #64748b;
      transform: translate(-50%, -50%);
    }
    .badge-pill.yes-1 { top: 31%; left: 32%; }
    .badge-pill.no-1  { top: 22%; left: 88%; }
    .badge-pill.yes-2 { top: 68%; left: 24%; }
    .badge-pill.no-2  { top: 68%; left: 74%; }

    .badge-pill.lit-blue {
      background: #0284c7;
      border-color: #0284c7;
      color: #ffffff;
    }
    .badge-pill.lit-gray {
      background: #64748b;
      border-color: #64748b;
      color: #ffffff;
    }
  </style>
</head>
<body>

  
  <div class="claim-selector">
    <button id="btnHottest" class="claim-btn active">🌡️ "Hottest Day Record"</button>
    <button id="btnUnpleasant" class="claim-btn">💭 "Most Unpleasant Day"</button>
  </div>

  
  <div class="flow-wrapper">
    
    <svg class="flow-svg" viewBox="0 0 440 330" preserveAspectRatio="none">
      
      <path id="path1to2" class="flow-line active-blue" d="M 150 62 L 150 120" />
      
      <path id="path1toNo" class="flow-line" d="M 370 62 Q 410 140 350 248" />
      
      <path id="path2toEmpirical" class="flow-line active-blue" d="M 120 182 L 120 248" />
      
      <path id="path2toInterpretation" class="flow-line" d="M 300 182 L 300 248" />
    </svg>

    
    <div id="badgeYes1" class="badge-pill badge-pill yes-1 lit-blue">Yes</div>
    <div id="badgeNo1" class="badge-pill badge-pill no-1">No</div>
    <div id="badgeYes2" class="badge-pill badge-pill yes-2 lit-blue">Yes</div>
    <div id="badgeNo2" class="badge-pill badge-pill no-2">No</div>

    
    <div id="nodeStep1" class="node step-1 active-step">
      <div class="node-title">Step 1 • Direct Test</div>
      <div class="node-text">Can it be counted, timed, or measured?</div>
    </div>

    
    <div id="nodeStep2" class="node step-2 active-step">
      <div class="node-title">Step 2 • Archive Test</div>
      <div class="node-text">Cross-referenced against official registry?</div>
    </div>

    
    <div class="branch-row">
      <div id="cardEmpirical" class="outcome-card empirical active">
        <div class="outcome-type">Empirical Fact</div>
        <div class="outcome-action">Check Record</div>
      </div>
      <div id="cardInterpretation" class="outcome-card interpretation">
        <div class="outcome-type">Interpretation</div>
        <div class="outcome-action">Analyze Criteria</div>
      </div>
    </div>
  </div>

  <script>
    const btnHottest = document.getElementById('btnHottest');
    const btnUnpleasant = document.getElementById('btnUnpleasant');

    const path1to2 = document.getElementById('path1to2');
    const path1toNo = document.getElementById('path1toNo');
    const path2toEmpirical = document.getElementById('path2toEmpirical');
    const path2toInterpretation = document.getElementById('path2toInterpretation');

    const badgeYes1 = document.getElementById('badgeYes1');
    const badgeNo1 = document.getElementById('badgeNo1');
    const badgeYes2 = document.getElementById('badgeYes2');
    const badgeNo2 = document.getElementById('badgeNo2');

    const nodeStep1 = document.getElementById('nodeStep1');
    const nodeStep2 = document.getElementById('nodeStep2');
    const cardEmpirical = document.getElementById('cardEmpirical');
    const cardInterpretation = document.getElementById('cardInterpretation');

    function setMode(mode) {
      if (mode === 'empirical') {
        btnHottest.classList.add('active');
        btnUnpleasant.classList.remove('active');

        // Nodes
        nodeStep1.className = 'node step-1 active-step';
        nodeStep2.className = 'node step-2 active-step';
        cardEmpirical.className = 'outcome-card empirical active';
        cardInterpretation.className = 'outcome-card interpretation';

        // Paths
        path1to2.className.baseVal = 'flow-line active-blue';
        path1toNo.className.baseVal = 'flow-line';
        path2toEmpirical.className.baseVal = 'flow-line active-blue';
        path2toInterpretation.className.baseVal = 'flow-line';

        // Badges
        badgeYes1.className = 'badge-pill badge-pill yes-1 lit-blue';
        badgeNo1.className = 'badge-pill badge-pill no-1';
        badgeYes2.className = 'badge-pill badge-pill yes-2 lit-blue';
        badgeNo2.className = 'badge-pill badge-pill no-2';
      } else {
        btnUnpleasant.classList.add('active');
        btnHottest.classList.remove('active');

        // Nodes
        nodeStep1.className = 'node step-1 active-step';
        nodeStep2.className = 'node step-2';
        cardEmpirical.className = 'outcome-card empirical';
        cardInterpretation.className = 'outcome-card interpretation active';

        // Paths
        path1to2.className.baseVal = 'flow-line';
        path1toNo.className.baseVal = 'flow-line active-gray';
        path2toEmpirical.className.baseVal = 'flow-line';
        path2toInterpretation.className.baseVal = 'flow-line';

        // Badges
        badgeYes1.className = 'badge-pill badge-pill yes-1';
        badgeNo1.className = 'badge-pill badge-pill no-1 lit-gray';
        badgeYes2.className = 'badge-pill badge-pill yes-2';
        badgeNo2.className = 'badge-pill badge-pill no-2';
      }
    }

    btnHottest.addEventListener('click', () => setMode('empirical'));
    btnUnpleasant.addEventListener('click', () => setMode('interpretation'));
    cardEmpirical.addEventListener('click', () => setMode('empirical'));
    cardInterpretation.addEventListener('click', () => setMode('interpretation'));
  </script>
</body>
</html>

Verifying Empirical Facts Against Authoritative Records

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta name="aspect-ratio" content="4:3">
  <style>
    * {
      box-sizing: border-box;
      margin: 0;
      padding: 0;
    }

    body {
      width: 100%;
      background: transparent;
      font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
      color: #1e2945;
      padding: 12px;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
    }

    .main-wrap {
      width: 100%;
      max-width: 620px;
      display: flex;
      flex-direction: column;
      gap: 14px;
    }

    /* Top Sentence Display */
    .sentence-box {
      background: #f8fafc;
      border: 1px solid #e2e8f0;
      border-radius: 10px;
      padding: 14px 16px;
      font-size: 15px;
      line-height: 1.5;
      text-align: center;
      color: #475569;
      box-shadow: 0 1px 3px rgba(0,0,0,0.03);
    }

    .highlight-fact {
      color: #0369a1;
      font-weight: 700;
      background: #e0f2fe;
      padding: 2px 6px;
      border-radius: 4px;
      border-bottom: 2px solid #0284c7;
      cursor: pointer;
      transition: all 0.2s ease;
    }

    .highlight-opinion {
      color: #b45309;
      font-weight: 700;
      background: #fef3c7;
      padding: 2px 6px;
      border-radius: 4px;
      border-bottom: 2px solid #d97706;
      cursor: pointer;
      transition: all 0.2s ease;
    }

    .dimmed {
      opacity: 0.35;
    }

    /* Cards Grid */
    .cards-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 12px;
    }

    @media (max-width: 440px) {
      .cards-grid {
        grid-template-columns: 1fr;
      }
    }

    .analysis-card {
      background: #ffffff;
      border-radius: 10px;
      padding: 12px 14px;
      display: flex;
      flex-direction: column;
      gap: 8px;
      cursor: pointer;
      transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
    }

    .card-fact {
      border: 2px solid #38bdf8;
      box-shadow: 0 2px 8px rgba(2, 132, 199, 0.08);
    }

    .card-fact.active {
      box-shadow: 0 0 0 3px rgba(2, 132, 199, 0.25), 0 4px 12px rgba(2, 132, 199, 0.12);
      border-color: #0284c7;
    }

    .card-opinion {
      border: 2px solid #fbbf24;
      box-shadow: 0 2px 8px rgba(217, 119, 6, 0.08);
    }

    .card-opinion.active {
      box-shadow: 0 0 0 3px rgba(217, 119, 6, 0.25), 0 4px 12px rgba(217, 119, 6, 0.12);
      border-color: #d97706;
    }

    .card-header {
      display: flex;
      align-items: center;
      gap: 8px;
      font-size: 13px;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.5px;
    }

    .badge-fact {
      color: #0284c7;
    }

    .badge-opinion {
      color: #d97706;
    }

    .phrase-quote {
      font-size: 14px;
      font-weight: 600;
      color: #1e2945;
      padding-bottom: 6px;
      border-bottom: 1px solid #f1f5f9;
    }

    .detail-row {
      display: flex;
      align-items: flex-start;
      gap: 6px;
      font-size: 13px;
      line-height: 1.4;
      color: #334155;
    }

    .status-tag {
      display: inline-flex;
      align-items: center;
      gap: 4px;
      font-size: 11px;
      font-weight: 700;
      padding: 3px 8px;
      border-radius: 12px;
      margin-top: 4px;
      align-self: flex-start;
    }

    .tag-verifiable {
      background: #e0f2fe;
      color: #0369a1;
    }

    .tag-subjective {
      background: #fef3c7;
      color: #92400e;
    }

    /* Controls / Stepper */
    .nav-bar {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      margin-top: 2px;
    }

    .filter-btn {
      background: #f1f5f9;
      border: 1px solid #cbd5e1;
      border-radius: 6px;
      padding: 6px 12px;
      font-size: 12px;
      font-weight: 600;
      color: #475569;
      cursor: pointer;
      transition: all 0.15s ease;
    }

    .filter-btn.active {
      background: #1e2945;
      border-color: #1e2945;
      color: #ffffff;
    }
  </style>
</head>
<body>
  <div class="main-wrap">
    
    <div class="sentence-box">
      The city government 
      <span id="targetFact" class="highlight-fact" onclick="selectMode('fact')">spent $12 million on new bike lanes</span>, 
      sparking an 
      <span id="targetOpinion" class="highlight-opinion" onclick="selectMode('opinion')">unreasonable budget crisis</span>.
    </div>

    
    <div class="cards-grid">
      
      <div id="cardFact" class="analysis-card card-fact active" onclick="selectMode('fact')">
        <div class="card-header badge-fact">
          <span>🏛️ Empirical Fact</span>
        </div>
        <div class="phrase-quote">
          “spent $12 million on new bike lanes”
        </div>
        <div class="detail-row">
          <span>🔍</span>
          <span><strong>Authoritative Record:</strong> Audited municipal ledger</span>
        </div>
        <div class="status-tag tag-verifiable">
          <span>✓</span> Verifiable (True / False)
        </div>
      </div>

      
      <div id="cardOpinion" class="analysis-card card-opinion active" onclick="selectMode('opinion')">
        <div class="card-header badge-opinion">
          <span>💭 Interpretation</span>
        </div>
        <div class="phrase-quote">
          “unreasonable budget crisis”
        </div>
        <div class="detail-row">
          <span>⚖️</span>
          <span><strong>Evaluative Stance:</strong> Depends on priorities</span>
        </div>
        <div class="status-tag tag-subjective">
          <span>✦</span> Value Judgment
        </div>
      </div>
    </div>

    
    <div class="nav-bar">
      <button id="btnAll" class="filter-btn active" onclick="selectMode('all')">Compare Both</button>
      <button id="btnFact" class="filter-btn" onclick="selectMode('fact')">Empirical Only</button>
      <button id="btnOpinion" class="filter-btn" onclick="selectMode('opinion')">Interpretation Only</button>
    </div>
  </div>

  <script>
    let currentMode = 'all';

    function selectMode(mode) {
      currentMode = mode;
      
      const targetFact = document.getElementById('targetFact');
      const targetOpinion = document.getElementById('targetOpinion');
      const cardFact = document.getElementById('cardFact');
      const cardOpinion = document.getElementById('cardOpinion');
      const btnAll = document.getElementById('btnAll');
      const btnFact = document.getElementById('btnFact');
      const btnOpinion = document.getElementById('btnOpinion');

      // Reset buttons
      btnAll.classList.remove('active');
      btnFact.classList.remove('active');
      btnOpinion.classList.remove('active');

      if (mode === 'all') {
        btnAll.classList.add('active');
        targetFact.classList.remove('dimmed');
        targetOpinion.classList.remove('dimmed');
        cardFact.classList.add('active');
        cardOpinion.classList.add('active');
        cardFact.style.opacity = '1';
        cardOpinion.style.opacity = '1';
      } else if (mode === 'fact') {
        btnFact.classList.add('active');
        targetFact.classList.remove('dimmed');
        targetOpinion.classList.add('dimmed');
        cardFact.classList.add('active');
        cardOpinion.classList.remove('active');
        cardFact.style.opacity = '1';
        cardOpinion.style.opacity = '0.35';
      } else if (mode === 'opinion') {
        btnOpinion.classList.add('active');
        targetFact.classList.add('dimmed');
        targetOpinion.classList.remove('dimmed');
        cardFact.classList.remove('active');
        cardOpinion.classList.add('active');
        cardFact.style.opacity = '0.35';
        cardOpinion.style.opacity = '1';
      }
    }
  </script>
</body>
</html>

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta name="aspect-ratio" content="4:3">
  <style>
    * {
      box-sizing: border-box;
      margin: 0;
      padding: 0;
    }
    body {
      background-color: #f8f9fa;
      font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
      color: #1e2945;
      padding: 16px;
      display: flex;
      flex-direction: column;
      justify-content: center;
      min-height: 100%;
    }
    .comparison-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
      gap: 16px;
      width: 100%;
      max-width: 680px;
      margin: 0 auto;
    }
    .claim-card {
      background: #ffffff;
      border-radius: 12px;
      padding: 18px 16px;
      box-shadow: 0 2px 8px rgba(30, 41, 69, 0.06), 0 1px 2px rgba(30, 41, 69, 0.04);
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      border: 1px solid #e9ecef;
    }
    .badge {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      font-size: 13px;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.5px;
      padding: 4px 10px;
      border-radius: 20px;
      width: fit-content;
      margin-bottom: 14px;
    }
    .badge-empirical {
      background-color: #e0f2fe;
      color: #0369a1;
    }
    .badge-contextual {
      background-color: #fef3c7;
      color: #b45309;
    }
    .statement-text {
      font-size: 15px;
      line-height: 1.45;
      font-weight: 500;
      color: #1e2945;
      margin-bottom: 18px;
    }
    .verification-footer {
      display: flex;
      align-items: center;
      gap: 10px;
      padding: 10px 12px;
      border-radius: 8px;
      font-size: 13px;
      font-weight: 600;
    }
    .footer-empirical {
      background-color: #f0fdf4;
      color: #15803d;
      border: 1px solid #dcfce7;
    }
    .footer-contextual {
      background-color: #fffbeb;
      color: #92400e;
      border: 1px solid #fef3c7;
    }
    .icon {
      font-size: 16px;
      line-height: 1;
      flex-shrink: 0;
    }
  </style>
</head>
<body>
  <div class="comparison-grid">
    
    <div class="claim-card">
      <div>
        <div class="badge badge-empirical">
          <span>●</span> Empirical Claim
        </div>
        <p class="statement-text">
          "The Mars Curiosity Rover landed in Gale Crater on August 6, 2012."
        </p>
      </div>
      <div class="verification-footer footer-empirical">
        <span class="icon">✓</span>
        <span>Verifiable via NASA Mission Logs</span>
      </div>
    </div>

    
    <div class="claim-card">
      <div>
        <div class="badge badge-contextual">
          <span>●</span> Contextual Claim
        </div>
        <p class="statement-text">
          "Curiosity's landing was the greatest achievement in modern space exploration."
        </p>
      </div>
      <div class="verification-footer footer-contextual">
        <span class="icon">⚖</span>
        <span>Requires Value Judgment</span>
      </div>
    </div>
  </div>
</body>
</html>

Evaluating Why an Author Chose a Particular Structure

Comparing Text Structures Across Texts on the Same Topic

Identifying Hybrid Texts That Combine Multiple Genres

How Text Purpose Shapes Organisation and Language Choices

Recognising How Texts Reflect Their Historical and Cultural Contexts

Identifying Social and Cultural Values Embedded in Texts

Distinguishing Stated From Implied Purpose

Evaluating Whether an Author Achieved Their Purpose

Tracing How Authors Develop and Shape Meaning

Analysing How Quotations and Sources Are Used to Support Claims

Understanding Text Structures and Purposes

Analyzing Author, Purpose, and Point of View in Historical Sources

Analyzing Point of View, Bias, and Purpose in Historical Sources

Detecting Loaded Language and Emotional Appeals in Sources

Analyzing Inclusion and Avoidance of Facts in Accounts

Distinguishing Facts, Opinions, and Reasoned Judgments

Evaluating an Author's Claim and Supporting Reasoning

Identifying Propaganda Techniques in Historical Broadsides

Assessing Reasoned Judgments in Editorial and Policy Writing

Comparing Opposing Perspectives on the Same Historical Event

Evaluating Author Credibility in Digital Social Studies Texts

social-studies

Author Point of View, Bias, and Fact vs. Opinion (Grades 6–8)

What Is an Author's Point of View in Informational Text?

Identifying Loaded Language in Historical Texts

Spotting Fact Inclusion and Omission in Historical Texts

Reading Information Presented Visually: Charts, Graphs, and Maps

Integrating Maps With Historical Text

Integrating Photographs With Historical Narratives

Distinguishing Fact From Opinion in Historical Texts

Identifying Reasoned Judgment in History Texts

Analyzing the Relationship Between a Primary and Secondary Source

Using Multiple Sources to Build a Coherent Understanding

Perspective and Source Analysis in History

Identifying Subjective Opinions and Value Judgments

Identifying Reasoned Judgments Supported by Scientific Research

Detecting Unsubstantiated Speculation and Unsupported Conjectures

Categorizing Epistemic Claims in Contemporary Science Journalism

Epistemic Rigor: Facts, Opinions, Reasoned Judgments, and Speculation

Using Text Evidence to Support Your Point in Discussion

Using Evidence to Respond to Spoken Claims

What Is Text Evidence? Direct Quotes and Paraphrased Support

Finding the Right Evidence for Your Response

Integrating Quotes Smoothly Into Your Writing

Citing Text Evidence in Written Responses

Using Multiple Pieces of Evidence to Support a Point

Distinguishing Strong Evidence From Weak Evidence

Using Text Evidence to Support Your Responses

Understanding Author's Claims vs. Author's Evidence

Using Personal Anecdotes to Support Your Position

Defending an Author's Claim With Additional Evidence

Challenging an Author's Claim With Counter-Evidence

Evaluating Whether Evidence Actually Supports the Claim

Evaluating Authors' Claims and Evidence

What Are Key Ideas in a Complex Text?

Telling Main Ideas From Supporting Details

Following How Details Add Up to Key Ideas

Judging Which Details Support Key Ideas

Examining Details That Complicate Key Ideas

Distinguishing Major From Minor Supporting Details

Checking Whether Details Are Credible

Identifying Contradictory and Redundant Details

How Images and Visuals Support or Challenge Text

Identifying and Evaluating Details in Complex Texts

Summarizing Information From Charts and Graphs Presented Orally

Paraphrasing Quantitative Information From Charts and Graphs

Integrating Flowcharts and Diagrams With Science Text

Integrating Data Tables With Science Explanations

Distinguishing Facts From Speculation in Science Texts

Identifying Reasoned Judgment Based on Research Findings

Comparing Experiments With Text Accounts

Comparing Simulations With Text Accounts

Comparing Video and Multimedia With Science Text

Visuals, Evaluation, and Comparison in Science Texts

Defending Claims in Literary Analysis

Defending Claims in Informational Text Responses

Challenging Claims in Persuasive and Argumentative Texts

Building a Counterargument With Text Evidence

Adjusting Your Response When New Evidence Emerges

Responding to Multiple Authors' Claims With Evidence

Application: Writing a Full Evidence-Based Response

Defending and Challenging Claims Across Text Types

Summarizing Key Ideas in Informational Texts

Summarizing with Accurate Vocabulary After Reading

Evaluating Details in Argumentative and Persuasive Texts

Following an Author's Message Through Supporting Details

Summarizing Key Ideas With Textual Evidence

Summarizing Key Ideas in Informational and Argumentative Texts

Understanding Inference in Eighth-Grade Reading

Finding Textual Evidence to Support Inferences

Supporting Inferences With Multiple Pieces of Evidence

Distinguishing Reasonable Inferences From Overreach

Evaluating Details to Determine Key Ideas

Distinguishing Key Ideas From Minor Details

Determining Which Details Most Strongly Support Key Ideas

Tracing How Details Build to Key Ideas

Inferring and Determining Key Ideas in Complex Texts

Responding to Texts with New Words

Using Vocabulary to Comprehend Complex Literary Texts

Using Vocabulary to Comprehend Complex Informational Texts

Using Academic Vocabulary Accurately in Your Own Writing

Using Academic Vocabulary in Reports

Using Academic Vocabulary in Argumentative Writing

Using Academic Vocabulary in Text-Based Responses

What Does It Mean to Adjust Your Response?

Recognizing When New Evidence Changes Your Understanding

Revising Your Interpretation Based on New Information

Holding and Revising Hypotheses While Reading

Adjusting Your Response When Presented With Counter-Evidence

Application: Writing a Response That Shows Evolving Understanding

Revising Interpretations Based on New Evidence

Understanding Authors' Claims and How to Respond

Finding Text Evidence to Defend an Author's Claim

Finding Text Evidence to Challenge an Author's Claim

Writing a Structured Defense of an Author's Claim

Writing a Structured Challenge to an Author's Claim

Balancing Defense and Challenge in Your Responses

Defending and Challenging Authors' Claims

Caracterización y cobertura de los medios masivos tradicionales y digitales

Audiencias, segmentación y canales de difusión mediática

Recursos técnicos, códigos y participación del usuario en los medios

Organización y almacenamiento digital de fuentes

Estrategias de búsqueda y recuperación en hemerotecas y bases digitales

Criterios de selección de información mediática según el propósito comunicativo

Contrastación entre la información de los medios y la realidad comunitaria

Análisis de la intención comunicativa en discursos informativos y persuasivos

Revelación de intereses políticos e ideológicos en la prensa y la televisión

Análisis crítico de la estereotipación y la representación social en medios

Taller de investigación mediática: monitoreo y triangulación de fuentes

Medios de comunicación masiva: análisis discursivo e investigación

OGE.9.RI.7

OGE.9.RI.7

Aligned learning resources

Related diagrams