Why is it hard to earn online in the Philippines?

The problem is systemic — not enough jobs especially in the province, low minimum wages (Region II is among the lowest nationally), and most guides are written for Metro Manila or other markets, not for Filipinos starting from zero.

How much can a beginner Filipino earn online?

Beginners in their first 1–3 months can realistically earn ₱1,800–₱5,000/month through microtasks, basic VA work, affiliate marketing, or online selling. With 6–18 months of experience this grows to ₱10,000–₱20,000/month.

Do I need a college degree to earn online in the Philippines?

No. Most online jobs — virtual assistant, data entry, social media management, content writing — require no degree. You need a skill, a device, and internet access.

What is the best platform for Filipino beginners to find online work?

OnlineJobs.ph is the most beginner-friendly — employers there are specifically searching for Filipino workers, and there is no bidding against the whole world.

Yes. All guides, tools, and downloads on Cyberussell are completely free. No email required, no payment, no upsell.

BeginnerWebFundamentals12 min

Programming · Lesson 4 of 7

HTML, CSS, and JavaScript

Every website runs on three things. Once you understand what each does, nothing looks mysterious.

After This Lesson, You Will Be Able To

Understand the role of HTML, CSS, and JavaScript in a webpage — and modify each layer of an existing project using AI assistance.

The Three Layers of Every Website

Every website — from Google to a personal blog — is built from the same three technologies. Once you understand what each one does, you can look at any website and understand its structure.

HTML: The Structure

HTML (HyperText Markup Language) defines what's on the page: headings, paragraphs, images, buttons, forms, links. Everything you see on a page as content is HTML.

Think of HTML as the skeleton of a building — it defines what rooms exist and where they are, but not what they look like.

AI can generate all the HTML you need. You need to understand that `

` is a heading, `
` is a paragraph, `

CSS: The Style

CSS (Cascading Style Sheets) defines how the HTML looks: colors, fonts, sizes, layouts, spacing. The same HTML with different CSS looks completely different.

AI is exceptionally good at generating CSS. You can describe what you want visually and Claude will produce the CSS. What matters is that you can identify which CSS property to ask Claude to change when something doesn't look right.

JavaScript: The Behavior

JavaScript makes pages interactive: button clicks, form validation, showing/hiding elements, fetching data, animations. Without JavaScript, pages are static — they look the same regardless of what the user does.

This is the most powerful and complex of the three. AI can generate JavaScript that does sophisticated things. Your job is to describe what should happen when the user does something.

How to Modify AI Code for Each Layer

Change the structure (HTML)

Ask Claude: 'Add a new section below the hero with 3 feature cards. Each card has a title, a description, and an icon.' Claude adds the HTML and you see it immediately.

Change the look (CSS)

Ask Claude: 'Change the background color to dark blue, make the heading font size larger, and add 20px padding to all sections.' Claude modifies the CSS.

Change the behavior (JavaScript)

Ask Claude: 'When the user submits the form, show an alert saying Thank you for your message and clear the form fields.' Claude adds or modifies the JavaScript.

Exercise

~10 minutes · ChatGPT or Claude

Prompt to use

I have this existing webpage: [paste your HTML file code]. I want to make the following changes: 1) Structure change: [describe what content to add or move], 2) Visual change: [describe how you want it to look differently], 3) Behavior change: [describe what should happen when the user does something]. Make each change separately and explain which technology (HTML, CSS, or JavaScript) each change touches and why.

Mark Complete

I can identify HTML, CSS, and JavaScript sections in a webpageI know which technology to ask Claude to modify for visual vs structural vs behavioral changesI've successfully modified the color scheme and layout of my first app using AII understand that any website I visit can be inspected to see its HTML, CSS, and JS

Reflect

Every website you've ever visited is built from these three things. Right-click on any webpage and click 'Inspect'. What do you see?

Key Takeaways

HTML = structure (what's on the page). CSS = style (how it looks). JS = behavior (what happens when you interact).

AI generates all three. Your job is to describe what you want clearly and know which layer to ask Claude to change.

Right-click → Inspect on any website to see its HTML, CSS, and JS. This is how you learn what's possible.

You never need to write these from scratch. Understanding what they do makes you a more effective director of AI.

Challenge

Inspect your favorite website and identify the three layers.

Open a website you use regularly. Right-click anywhere and select 'Inspect' (Chrome/Firefox). You'll see the HTML panel on the left. Click the Elements tab to explore the structure. Click the Styles panel to see the CSS. This is not intimidating — you're just reading. Take 10 minutes to explore, then ask Claude to explain anything that confuses you.

Next Lesson

Working with APIs

Programming · Lesson 5 of 7 · 10 min