Skip to main content

News Articles Feature

The News section provides users with the latest updates from the movie industry, including announcements, award nominations, sequels, and celebrity news.

Overview

The news feature offers:
  • Article Layout: Full-width article cards with images and detailed content
  • Rich Content: Article titles, images, and multi-paragraph content
  • Internal Linking: Links to related movies and actors
  • Load More: Pagination to browse through news archives
  • Responsive Design: Mobile-friendly article display

Article Structure

Each news article follows a consistent structure:
<article class="article-post">
  <h2 class="article-title">A Role in Don't Look Up Director Adam McKay's Next Movie Could Be Yours for $25,000</h2>
  <div class="article-image-container">
    <img src="../images/news/dont_look_up.jpg">
  </div>
  <div class="article-content">
    <p class="article-paragraph">Director <a href="./actor.html" class="article-link">Adam McKay</a> is selling off personal items in an auction...</p>
    <p class="article-paragraph">The auction features an eclectic mix of items...</p>
    <p class="article-paragraph">The listing for the walk-on role in McKay's next film project states...</p>
  </div>
</article>

Article 1: Don’t Look Up Auction

A Role in Don’t Look Up Director Adam McKay’s Next Movie Could Be Yours for $25,000Director Adam McKay is auctioning personal items including movie props, comic books, and a unique walk-on role in his next film.

Article 2: Violent Night Sequel

Violent Night 2 Is Happening with Same Writers and DirectorThe successful holiday action movie gets a sequel with the original creative team returning.

Article 3: Top Gun Maverick Oscar Nomination

Top Gun: Maverick Gets Best Picture Nomination at the OscarsThe legacy sequel achieves critical acclaim with multiple Academy Award nominations.

Article Components

<h2 class="article-title">A Role in Don't Look Up Director Adam McKay's Next Movie Could Be Yours for $25,000</h2>

Internal Linking

Articles include contextual links to related content:
  • Actor Links: Connect to actor profile pages
  • Movie Links: Link to movie detail pages
  • CSS Class: All links use article-link class for consistent styling
Internal linking helps users discover related content and improves SEO.

Load More Functionality

The news section includes a “More News” button for pagination:
<div class="show-more-news-container">
  <a href="./news.html" class="more-news">
    <button class="more-news-button">More News</button>
  </a>
</div>

News Topics Covered

The platform features news about:
  • Movie Announcements: Sequels, remakes, and new releases
  • Award Shows: Oscar nominations, Golden Globes, BAFTAs
  • Director News: Behind-the-scenes stories and projects
  • Box Office: Financial performance and milestones
  • Celebrity Events: Auctions, charity work, and interviews
  • Industry Trends: Climate activism and social causes

Article Writing Best Practices

All articles follow journalistic standards with:
  • Compelling headlines
  • Strong opening paragraphs
  • Supporting details and quotes
  • Proper attribution and sources
  • Links to related content

Layout Structure

The news section uses semantic HTML for better accessibility:
<section class="news-section">
  <div class="section-header">
    <h2 class="section-header-title">
      Latest News
    </h2>
  </div>
  <div class="latest-news-container">
    <article class="article-post">
      <!-- Article content -->
    </article>
    <!-- More articles -->
  </div>
</section>
Ensure all article images have appropriate alt text for accessibility (to be added in future updates).

Responsive Design

The news layout adapts to different screen sizes:
  • Desktop: Full-width articles with side-by-side image and text
  • Tablet: Stacked layout with responsive images
  • Mobile: Single column layout optimized for reading

File Locations

  • HTML: ~/workspace/source/pages/news.html
  • Styles: ~/workspace/source/style.css
  • Images: ~/workspace/source/images/news/

Build docs developers (and LLMs) love