検索

per class
クラス

「Sweet Spot Ice Cream」ウェブサイトのナビゲーション バーをコーディングする

年齢 11 歳-14 歳
ライブワンタイムクラス
これは初心者向けの楽しいクラスです。受講者はコーディングの基礎を学びます。HTML と CSS を使用して魅力的なナビゲーション バーを作成します。実践的な練習を通じて、Sweet Spot Ice Cream の Web サイトの鮮やかなデザインをコーディングします。

オンラインライブ授業
一度のみの受講
1 人-12 人 1クラスあたりの学習者
55 分

含まれるもの

1 ライブミーティング
55 分 授業時間
宿題:
週1時間. 週1~2回
文章の成績
クラス全体を通して1-2
この文章は自動翻訳されています

このクラスで学べること

英語レベル - A2
米国の学年 6 - 8
Beginner レベル向け
What will be taught?
We will began learning how to use HTML and CSS to code our first project-  which is code a navigation bar for a fictional ice cream parlor website called Sweet Spot Ice Cream. Throughout the program students will learn the foundational skills of HTML and CSS to code and design their own websites. By the end of the Learn to Code Program, they will be able to structure web pages using HTML and style them effectively with CSS.

What topics will you cover?
Introduction to HTML – Understanding what HTML is and how it works.
HTML Elements – Exploring different tags and their usage in building web pages.
Introduction to CSS – Learning how CSS enhances website design and layout.
CSS Properties – Applying common CSS properties such as colors, fonts, spacing, and positioning.
Hands-on Project – Students will build a simple web page from scratch, applying what they’ve learned.

How is your class structured?
Each session will follow a structured yet engaging format:
Warm-up & Welcome – Brief introduction, expectations, and class objectives.
Concept Explanation – Step-by-step breakdown of HTML and CSS concepts.
Live Demonstration – I will code alongside students, explaining each step.
Hands-on Practice – Students will apply what they’ve learned in real-time.
Q&A and Troubleshooting – Addressing issues, debugging, and reinforcing concepts.
Project Submission & Feedback – Students will submit their work for review.

How will you teach?
I will guide students step by step through coding exercises and projects. We will build together using an online text editor, where I will explain how to write, edit, and test code. Students will also learn how to submit their completed projects via a shared link for assessment. 
In addition, students enrolled in the Learn to Code Websites 6-week Bootcamp program will be given targeted practice lessons designed to reinforce key concepts and deepen their understanding through hands-on application, which needs to be turned in by the due date to receive a grade. Late assignments are not accepted.
What is your teaching style?
My teaching style is the Demonstrator Style (Coach or Facilitator)—a teacher-centered but highly interactive approach. This means:
I will demonstrate coding concepts while students observe.
Students will immediately apply what they learn through hands-on practice.
I will actively guide, support, and troubleshoot alongside students.

How much will learners interact with you?
Students will have continuous opportunities to interact with me through:
 Live Q&A – They can ask questions at any point during the session.
Screen Sharing – If a student needs help, they can share their screen so we can troubleshoot together.
Collaborative Learning – We will debug and refine code as a group to reinforce problem-solving skills.
 Multimedia Support – I will use slides, video clips, and live coding demonstrations to enhance learning.

Final Thoughts
This class is designed to be engaging, practical, and supportive. My goal is to make sure students not only understand the concepts but also gain the confidence to code independently.

学習到達目標

Learning Goal:
Students will learn to code a functional navigation bar using HTML and CSS. They will be able to:
Identify and use unordered lists (<ul>) to structure navigation menus.
Implement anchor tags (<a href="">) for linking web pages.

その他の情報

保護者へのお知らせ
All instructional materials will be age-appropriate, ensuring a safe and suitable learning environment for all students. Students will utilize a free online text editor, which requires setting up an account with a valid email address. This process will be guided to ensure students can easily access and use the tool effectively.
受講の前提条件
This class is perfect for beginners with no prior coding experience. Students should be comfortable typing on a computer. We'll use a collaborative, code-along approach, where you'll follow along as I guide you step-by-step.
受講に必要なもの
The Student needs a computer with a wi-fi connection, email for Google Classroom and Codepen set up. Resource website links for fonts, colors, code tip sheet and pictures, will be provided. Students will be provided all lessons via Google Classroom.
外部リソース
このクラスでは、Outschool内のクラスルームに加えて、以下を使用します。

先生について

参加しました February, 2025
プロフィール
教師の専門知識と資格
Hello Famiy,

My name is Mrs. W. I have been a web developer for 7 years who turned technology educator with experience teaching middle school students how to code websites for 3 years now and counting.  I will be teaching "Building Navigation Bars: An Introduction to HTML and CSS," as my first course offered on outschool.

Course Overview: This course is meticulously designed to introduce students to the fundamentals of web development through the practical task of coding navigation bars. By focusing on this essential component of website design, students will gain hands-on experience with:

HTML Elements: Understanding and implementing unordered lists (<ul>) and anchor tags (<a href="">) to structure navigation menus.
CSS Properties: Applying styling techniques to enhance navigation bars' visual appeal and functionality.


Educational Benefits: Engaging in coding activities, such as building navigation bars, increases creativity, collaboration, and open-mindedness among students. It also enhances problem-solving skills and analytical thinking, which are invaluable across various disciplines. By learning to code, students develop a methodical approach to challenges, preparing them for future academic and professional endeavors.

レビュー

その他の人気クラス
子どものためのウェブデザイン: HTML & CSS & WordPress
AI Code Academy
4.7
(1,793)
クラスごと
次回のセッションは Mon 5/12 の11:30 PM です
グループクラス
10 週間、 1/週、 1 時間
9 歳-14 歳
サマーキャンプ: 子どものためのウェブデザイン: HTML & CSS & Wordpress
AI Code Academy
4.7
(1,793)
クラスごと
次回のセッションは Mon 6/16 の3 PM です
グループクラス
2 週間、 5/週、 1 時間
10 歳-15 歳
個別指導:HTMLとCSSを使った初めてのウェブサイト構築
Antonia Burroughs
セッションごと
1対1レッスン
オンデマンド
3 歳-18 歳
HTML、CSS、Javascript を使用して独自の Web サイトを構築する - サマー キャンプ コーディング ワークショップ
Coding Doctors Learning Lab, Inc.
4.8
(1,254)
クラスごと
次回のセッションは Mon 5/19 の2 PM です
グループクラス
2 週間、 4/週、 55 分
10 歳-14 歳
コーディング - 初心者向けウェブサイト作成のための HTML と CSS 入門 レベル 1
Einsteins Square: Chess, Coding, Math, Art, Games
4.8
(5,862)
クラスごと
次回のセッションは Wed 6/4 の10 PM です
グループクラス
10 週間、 1/週、 50 分
9 歳-14 歳
コーディング - 初心者向けウェブサイト作成のための HTML と CSS 入門 レベル 2
Einsteins Square: Chess, Coding, Math, Art, Games
4.8
(5,862)
クラスごと
グループクラス
10 週間、 1/週、 50 分
10 歳-15 歳
ウェブ開発をマスターする:子供向けの1年間のHTML、CSS、JavaScriptプロジェクト
Faruk Hasan
4.8
(149)
クラスごと
次回のセッションは Tue 7/1 の11 PM です
グループクラス
1/週、 35 分
11 歳-15 歳
HTML、CSS、AIマジックを使って素晴らしいウェブサイトを構築する(初心者向け)
PopSkool: English, Music, Art, Math, Coding & More
5.0
(3)
クラスごと
次のセッションは明日の 7 PM です
グループクラス
8 週間、 1/週、 55 分
10 歳-14 歳
HTML Safari - コーディングと技術 - 週1回開催
Teacher Lee
クラスごと
次のセッションは今日 6 PM です
グループクラス
1/週、 55 分
9 歳-14 歳
ウェブプログラミング 1 週間キャンプ
MissB aka Bhavana R (Coding)
4.9
(38)
クラスごと
次回のセッションは Mon 7/14 の7 PM です
グループクラス
1 週間、 5/週、 1.50 時間
10 歳-15 歳
ウェブサイト開発 | 初心者向け - コーディング
Codingal - #1 AI & Coding | Backed by Y Combinator
4.8
(8)
クラスごと
次回のセッションは Thursday の3 PM です
グループクラス
4 週間、 2/週、 1 時間
12 歳-17 歳
「キッズ コーディング クエスト: 一緒に素晴らしい Web サイトを構築」
MS. JEN of ARTISTIC KIDS WORKSHOP
4.7
(6)
クラスごと
次回のセッションは Mon 6/2 の11 PM です
グループクラス
4 週間、 2/週、 55 分
9 歳-14 歳
1:1 コーディング セッション: Java、Python、HTML、CSS、JavaScript (カスタマイズ可能)
MissB aka Bhavana R (Coding)
4.9
(38)
セッションごと
1対1レッスン
オンデマンド
9 歳-18 歳
オブジェクト、音楽、サウンドを使って HTML5 ウェブサイトをデザイン、コーディング、公開しましょう。対象年齢 7~12 歳
Raymond Mullikin (Raytoons Comics)
4.9
(503)
クラスごと
次回のセッションは Sunday の6 PM です
グループクラス
6 週間、 1/週、 50 分
7 歳-12 歳
ウェブ開発とグラフィックデザイン - 5日間 - サマーキャンプ
Fleming Tech Camps
4.9
(26)
クラスごと
次回のセッションは Mon 6/9 の8:15 PM です
グループクラス
1 週間、 5/週、 2.92 時間
10 歳-15 歳
オブジェクト、音楽、サウンドを使って HTML5 ウェブサイトをデザイン、コーディング、公開しましょう。対象年齢 12 歳以上
Raymond Mullikin (Raytoons Comics)
4.9
(503)
クラスごと
次回のセッションは Mon 5/19 の8 PM です
グループクラス
6 週間、 1/週、 50 分
13 歳-18 歳
もっとクラスを見る
アプリを入手 
App StoreでダウンロードGoogle Playで入手する
Home
検索
ギフトカードを贈る
通貨、タイムゾーン、言語の設定を開く
言語と地域
ログイン