Study smarter with Fiveable
Get study guides, practice questions, and cheatsheets for all your subjects. Join 500,000+ students with a 96% pass rate.
In Media Technologies, you're being tested on more than just knowing what HTML or JavaScript do—you need to understand how these languages work together to create complete web experiences. Exams will ask you to identify which language handles structure vs. presentation vs. behavior, how data flows between front-end and back-end systems, and why separating these concerns matters for modern web development.
Think of these five languages as a team with distinct roles: some build the skeleton, some add the style, some create interactivity, and others manage the data behind the scenes. Don't just memorize syntax examples—know what layer of the web stack each language operates on and when you'd choose one over another. That conceptual understanding is what separates surface-level recall from exam-ready mastery.
These languages define what content exists and how it's organized. They create the foundation that other technologies build upon—without structure, there's nothing to style or animate.
<header>, <nav>, and <article> to give meaning to content, which improves both accessibility and SEO<bookTitle>, <price>)Compare: HTML vs. XML—both use tags and similar syntax, but HTML displays content to users while XML stores and transfers data between systems. If an exam asks about data interchange between applications, XML is your answer; if it's about what users see in a browser, that's HTML.
This layer controls how content looks. The key principle here is separation of concerns—keeping visual design separate from content structure makes code cleaner and sites easier to maintain.
Compare: HTML vs. CSS—HTML says "this is a heading," CSS says "this heading should be blue, 24px, and centered." Exam questions often test whether you can identify which language handles structure (HTML) versus presentation (CSS).
JavaScript adds the action—it's what makes web pages respond to users in real time. This is the programming language of the browser.
Compare: CSS animations vs. JavaScript interactivity—CSS handles simple visual transitions (hover effects, fades), while JavaScript manages complex user interactions (click handlers, form processing, API calls). Know which tool fits which job.
Behind every dynamic website sits a database. SQL is how applications talk to that database—retrieving user profiles, storing form submissions, and powering search results.
JOIN operations and aggregations, enabling data analysis across multiple tablesCompare: XML vs. SQL—both deal with data, but XML transports data between systems while SQL manages data within databases. An API might send XML (or JSON) to your browser, but that data was retrieved using SQL on the server.
| Concept | Best Examples |
|---|---|
| Content structure | HTML, XML |
| Visual presentation | CSS |
| User interactivity | JavaScript |
| Data storage/retrieval | SQL |
| Client-side execution | HTML, CSS, JavaScript |
| Server-side capability | SQL, JavaScript (Node.js) |
| Separation of concerns | HTML + CSS + JavaScript working together |
| Data interchange | XML |
If a web page's button changes color when you hover over it, which language is most likely responsible—CSS or JavaScript? What if clicking the button submits a form?
Compare HTML and XML: both use tags, so what's the fundamental difference in their purpose?
A developer wants to ensure their website looks good on both smartphones and desktop monitors. Which language provides this capability, and what feature specifically enables it?
Explain how the principle of "separation of concerns" applies to HTML, CSS, and JavaScript. Why does keeping these roles separate benefit web development?
An FRQ asks you to trace how a user's search query becomes results on screen. Which languages are involved at each step—entering the query, retrieving matching data, and displaying results?