UNIT 3 • FREE

Read All About It

Build a styled online newspaper featuring stories from your Tribal community, using HTML structure and CSS layout including the power of position: absolute to overlay text on images.

⏱️ 7 Stages
📰 Beginner
🎯 45–60 min per stage
🗞️ HTML + CSS

What You'll Learn

In Units 1 and 2, you built structured HTML pages and styled them with CSS. Now you'll combine both skills to create a fully designed online newspaper: a bold masthead, a large hero image with overlaid text, and three article cards side by side. The biggest new concept: CSS positioning, which lets you place elements exactly where you want them on the page.

By the end of this unit, you'll be able to say "I can..."

  • Build a newspaper masthead with a title, date, and issue number
  • Use position: relative and position: absolute to layer content
  • Overlay styled text on top of a hero image
  • Arrange article cards side by side with Flexbox
  • Style images consistently with object-fit: cover
  • Write newspaper-style HTML using semantic elements like <article>
  • Tell a story about my Tribal community through writing and design

What You'll Build

A styled online newspaper with a bold masthead header, a large hero image with a semi-transparent text overlay, and three article cards arranged side by side, each with an image, headline, and a story about your Tribal nation or community.

The 7 Stages

Start Stage 1 →

← Back to All Units

Sources

All cultural and media content in this unit is grounded in reputable sources. We prioritize Native-owned news outlets and journalism organizations, because the best model for a Native newspaper unit is real Indigenous journalism. If you are an educator or student who wants to explore further, each source below is a trustworthy starting point.

Educational Standards

This unit aligns with national computer science and technology standards as well as state-level media arts, ELA, and social studies standards. Select your state below to see the relevant standards for your classroom.

  • OSEU.SS.C.1, Indigenous Media as Cultural Practice (All Grades): Students will understand the role of cultural expression and storytelling in Indigenous communities, including contemporary forms like journalism and digital media. (Native-owned newspapers — Indian Country Today, The Circle, Native Sun News Today — are the explicit cultural model for this unit. Students study what Indigenous journalism looks like before they build their own edition. The unit frames the Native newspaper tradition as a living practice that began with the Cherokee Phoenix in 1828 and continues in digital form today.)
  • OSEU.ELA.W.1, Research Writing Published for a Public Audience (All Grades): Students will produce original, research-based writing appropriate to task and audience, including informational writing about their own Tribal community. (Students write three original newspaper articles about their Tribal nation or community, one per article card, using verified sources and their own knowledge. The articles are styled as published journalism on a live webpage — not a classroom assignment — which positions the student as an author with a real readership and a responsibility to their community.)
  • CSTA 2-AP-13 (Grades 6-8): Decompose problems and subproblems into parts to facilitate the design, implementation, and review of increasingly complex programs. (Students build the newspaper in seven discrete stages, each adding one new layer: masthead, hero image, text overlay, and article cards. This intentional decomposition mirrors how professional developers approach complex page builds.)
  • ISTE 1.6, Creative Communicator: Communicate clearly and express themselves creatively for a variety of purposes using platforms, tools, formats, and digital media appropriate to their goals. (Students design and publish an online newspaper modeled after real Native-owned media outlets, making layout and design decisions that echo professional Indigenous journalism.)
  • ISTE 1.3, Knowledge Constructor: Critically curate a variety of resources using digital tools to construct knowledge and produce creative artifacts. (Students research real stories from their Tribal nation or community, write original articles, and select imagery for their newspaper, practicing responsible source selection alongside their CSS skills.)
  • MN ELA 6.3.3.2 / 7.3.3.2 / 8.3.3.2 (Grades 6, 7, 8): Create and share a multimedia or digital communication, choosing tools to meet the task, purpose, and audience, demonstrating understanding of digital footprint. (The online newspaper is the most complex media artifact students have built so far: original writing, layout, imagery, and intentional design decisions, all for a real public audience.)
  • MN Media Arts 2.8.2.3.1 (Grade 8): Create media artworks using transdisciplinary or transmedia production to express emotion and meaning, including simple web page design considering positioning with multimodal perception. (CSS positioning is the specific technical concept that enables the newspaper's hero image with overlaid text — a direct match for the layered, multimodal design described in this standard.)
  • MN Media Arts 2.6.5.10.1 / 2.7.5.10.1 / 2.8.5.10.1 (Grades 6, 7, 8): Demonstrate an understanding that artistic works influence and are influenced by personal, societal, cultural, and historical contexts, including the contributions of Minnesota American Indian Tribes and communities. (Native-owned newspapers are the direct cultural model for this unit. Students study and build on the tradition of Indigenous journalism to create their own digital edition.)
  • ND CS 6.DD.2 / 7.DD.2 / 8.DD.2 (Grades 6-8): Create an algorithm to solve a problem using multiple coding patterns, including loops, conditionals, functions, or variables. (CSS positioning requires algorithmic thinking: students must define a parent container, choose a positioned child, set the correct offset values, and refine until the overlay sits exactly right.)
  • ND CS 6.S.1 / 7.S.1 / 8.S.1 (Grades 6-8): Examine the positive and negative impacts of technology on how people live, work, and interact, including considerations of equitable access. (The existence and digital access barriers facing Native newspapers are a direct example of how technology shapes information access for Tribal communities, a real-world stakes conversation built into the unit's design.)
  • ND Indigenous Language Standard 2.2 (All Grades): Learners investigate, explain, and reflect on the relationship of products to the customs, traditions, and perspectives of the cultures studied. (Students build a cultural product — a newspaper — modeled after real Indigenous media. What stories a community chooses to tell reveals what it values, and students engage that question directly through their article writing.)
  • ND Indigenous Language Standard 5.3 (All Grades): Learners value and promote Indigenous, heritage, and native languages and show interest in efforts to preserve and revitalize those that are endangered through active engagement in language and cultural activities. (Native newspapers have historically played a key role in Indigenous language preservation and cultural transmission. Students building a newspaper about their community are participating in that same tradition.)
  • OSEU Standard 5.1 (All Grades): Understand and identify oral tradition as a primary source. Suggested approach includes creating a personal Winter Count. (Like a Winter Count, a newspaper captures the most significant events and stories of a community at a given moment in time. The newspaper is a contemporary parallel to this Indigenous tradition of recording history through images and narrative.)
  • OSEU Standard 1.1 (All Grades): Understand the history and contemporary status of the Oceti Sakowin. (For South Dakota students, Native Sun News Today and other Indigenous papers are active sources of information about Oceti Sakowin contemporary life, governance, and events. The unit grounds its design challenge in real media students can read and reference.)
  • SD CS 6-8.AP.03 (Grades 6-8): Design and iteratively develop programs that combine control structures, including nested loops and compound conditionals. (Layering position: relative and position: absolute requires iterative development: students place the overlay, test its position, adjust offset values, and refine across multiple stages before the result feels intentional.)
  • SD CS 6-8.IC.01 (Grades 6-8): Compare tradeoffs associated with computing technologies that affect people's everyday activities and career options in South Dakota and the world, as well as urban, rural, and reservation communities. (The digital divide affects Native newspapers and their ability to reach readers on reservations. Students building a newspaper for their own community engage directly with this tension between technology, access, and Indigenous media.)