CS110: Computers and the Internet Getting Started Orit ShaerOrit Shaer, Scott Anderson, Sohie Lee, Jean Herbst

Getting Started1-2 Am I in the right class? CS110, Computer Science and the Internet introduces the fundamentals of web design and programming, and the impact of the digital revolution. CS111 introduces the fundamentals of programming and problem solving techniques using Java. CS112, Computation for the Sciences, teaches programming skills using MATLAB CS114, The Socio-Techno Web, teaches the structure of the social web. Won’t be offered again until Fall, CS117, Inventing Mobile Apps, teaches the programming and big ideas of CS in the context of making apps for Android smartphones. Won’t be offered again until Fall, 2012.

Getting Started1-3 Please register for lab section* Labs provide hands on experience with the ideas presented in lecture. Labs meet on Tuesday If you cannot get into the section you want, register for another and use Q&A to arrange a swap. *This does not satisfy the Wellesley laboratory requirement.

Getting Started1-4 Home Away from Home All course materials may be found at The CS file server, cs.wellesley.edu, is used to download and upload programming assignments.* There are two textbook. Lecture notes are available on the course website.

Getting Started1-5 Four big ideas Four important concepts are at the core of this course: 1.Digital representation of information 2.Impact of the digital revolution; 3.Problem Solving; 4.Project Development Cycle We will illustrate these ideas in the context of web design.

Big Ideas Digital representation of information Impact of the digital revolution Problem solving Project development cycle

Big idea #1: Digital representation How do we represent the many kinds of information: – Numbers – Text – Images – Color – Video – Sound How can we keep information private? How can we compress information?

Big Idea #2: Impact of digital revolution How does access to information impact our society? How does it impact you? Privacy Security Intellectual property

Big idea # 3: Problem Solving Divide problem P into subproblems. Conquer each of the subproblems. Glue (combine) the solutions to the subproblems into a solution S for P. Modularity Large systems are built from components called modules. The interfaces between modules are designed so they can be put together in a mix-and-match way. Our goal is to design for maximum reusability. Getting Started1-9 P P1P1 P2P2 P3P3 P4P4 S4S4 S3S3 S2S2 S1S1 S

Big Idea #4: Project Development Lifecycle Apply these ideas to build a website: – Form team – Find a client – Specify requirement – Design, implement, test – Deliver – Present

Course Overview HTML CSS JavaScript Concepts and tools for graphics, sound, form, animation, and movies Social, legal, ethical implication Designing and implementing a website

Seurat, A Sunday Afternoon on La Grande Jatte Seurat, Study for La Grande Jatte

HTML: View Page Source How is a different from ? How is different from ? from ? How is a bullet list created? What does do? What does do? What does do? What does do? How are the beginning and end of a region marked? Are there tags that don't have both a beginning and an end? What tag is used to insert an image? How does its use differ from other tags in the file? How are hyperlinks (links to other web pages) created?

HTML Syntax An HTML document is composed out of elements that begin and end with tags: – contents Some HTML tags that you have seen: – Structural tags – Header tags – Text tags – List tags – Other tags – Comments

Tag Syntax Some tags have attributes: – Yahoo! – contents

What’s Next? Tell us about yourself Find a well designed website Sakai quiz before next lecture (due midnight before class)

Getting an Account account-request.htm account-request.htm You will need a password: – Use a mixture of upper and lower case letters, digits, and characters. – Longer passwords are more secure (at least 6 characters) – Don’t use information associated with you that someone could guess. – Don't write it down, but don't forget it – Use different passwords for different systems and purposes. That way, if one password is broken, the others will be okay. And the Magic Word is….