INF-250: Web Design and Development — Class Intro

Links and resources:

Important things to keep in mind:

  • Always bring a laptop to class!
  • Attendance is mandatory and counts for 15% of your grade
  • There will be 5 quizzes throughout the semester totalling 25% of your grade
  • No exam, but there is a final capstone website and reflection
  • There will be daily in-class activites and journal entries

What we will cover:

HTML

HTML - the structure of a webpage

HTML (hypertext markup language) uses tags to define elements and structure page content.

It is not a programming language — it is a markup language.


	<h1>Hello</h1>
	<p>This is a paragraph.</p>
	<button>Click me</button>

CSS

CSS - the style of a webpage.

CSS (cascading style sheets) is used to control the visual presentation of HTML elements.

Each browser has a default style for HTML elements, but using CSS allows us to customize the look and feel of a site.


	button {
		background: red;
		color: white;
		padding: 8px 12px;
	}

JavaScript

JavaScript - the behavior of a webpage.

JavaScript is a true programming language that allows us to add interactivity and dynamic behavior to a webpage.

const button = document.querySelector("button")
button.addEventListener("click", () => {
  alert("Hello!")
})

Putting it all together

Websites - what the heck are they?

What is a website?

A kind of software? A method of communication? A glorified advertising billboard? An emerging art form, like film in its early days?

Maybe all of these things, and more.

Today, websites are almost like virtual computers, capable of running complex applications and providing interactive experiences.

But their primary purpose remains communication. We will learn how to build websites that communicate effectively and elegantly.

Now's the time to start thinking about the kind of website you want to build!

Video: The 5 Design Principles

Now go to Blackboard and enter your first journal entry discussing your reactions to this video. This is your "exit ticket" to leave class!