Web Dev 2: Style Your Page — Colors, Photos, Links 🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥

🟢 Easy

Your first page is online (see Web Dev 1) — now make it look good. Add colors, a photo, and links, then republish. Same free tools, about 20 minutes.

You need: a laptop or desktop, your Web Dev 1 page live on GitHub Pages (or finish that first).

What to add

A background color or theme, at least one photo or image, and one link (your socials, favorite site, anything). That's the minimum. Ideas if you want more: a second section, styled headings, buttons instead of plain links.

Only share what you're comfy with — never your home address, phone number, or passwords.

Steps

1. Open your my-first-page repo from Web Dev 1.
2. Edit index.html: add some style. Easiest way — paste this block inside your <head> section and change the colors to ones you like:

<style>
  body { background: #1a1a2e; color: #eee; font-family: sans-serif; }
  h1 { color: #e94560; }
  a { color: #53d8fb; }
</style>

1. Add a photo: upload any picture you own (you, your pet, your view — your choice) to the repo, then show it with <img src="photo.jpg" width="300">.
2. Add at least one link: <a href="https://...">my favorite site</a>.
3. Commit, wait 1-2 minutes, and check your live page — the new styling, photo, and link must all show.

Never written CSS? Let AI do it

Paste your current page code into any free AI chat (ChatGPT, Gemini, Copilot) and say: "style this page for me — suggest 3 color themes and pick the best one, keep it one file." Then tweak what it gives you.

What to Submit

1. Your live page URL (https://<your-username>.github.io/my-first-page/).
2. In the notes field, log it like this:

url | <your live page link>
added | <what you added: colors, photo, links — one line each>
ai_help | <yes/no + which AI chat, if any>

⚠️ Important

• The live page must load and show the new styling, photo, and link. A repo link alone is rejected — we check the published page.
• Use a photo you own or have the right to use — no random images pulled from Google.
• Keep the ownership line (satsboard <your-lightning-address>) from Web Dev 1 on the page.