{[ promptMessage ]}

Bookmark it

{[ promptMessage ]}

Study guide - Computing Science 165-3 Study Guide...

Info icon This preview shows pages 1–8. Sign up to view the full content.

View Full Document Right Arrow Icon
Computing Science 165-3 Study Guide Introduction to Multimedia and the Internet Summer 2007 Draft [On-campus Sections] by Greg Baker Faculty of Applied Sciences Simon Fraser University Centre for Distance Education Continuing Studies c circlecopyrt Simon Fraser University, 2001–2007
Image of page 1

Info icon This preview has intentionally blurred sections. Sign up to view the full version.

View Full Document Right Arrow Icon
2 [DRAFT, 1074]
Image of page 2
Contents I Introduction 11 Course Introduction 13 Learning Resources . . . . . . . . . . . . . . . . . . . . . . 14 Requirements . . . . . . . . . . . . . . . . . . . . . . . . . 17 Evaluation . . . . . . . . . . . . . . . . . . . . . . . . . . . 18 Schedule . . . . . . . . . . . . . . . . . . . . . . . . . . . . 21 Getting through CMPT 165 . . . . . . . . . . . . . . . . . 21 About the Author . . . . . . . . . . . . . . . . . . . . . . . 23 II The Web and Web Pages 25 1 The World Wide Web 27 1.1 Basics of the Internet . . . . . . . . . . . . . . . . . . . . . 27 1.2 Protocols . . . . . . . . . . . . . . . . . . . . . . . . . . . . 31 1.3 How Web Pages Travel . . . . . . . . . . . . . . . . . . . . 33 1.4 MIME Types . . . . . . . . . . . . . . . . . . . . . . . . . 34 1.5 Fetching a Web Page . . . . . . . . . . . . . . . . . . . . . 36 Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . 37 2 Markup and XHTML 39 2.1 Making Web Pages . . . . . . . . . . . . . . . . . . . . . . 39 2.2 First XHTML Page . . . . . . . . . . . . . . . . . . . . . . 41 2.3 XHTML Tags . . . . . . . . . . . . . . . . . . . . . . . . . 41 2.4 Why Do Markup? . . . . . . . . . . . . . . . . . . . . . . . 45 2.5 Another XHTML Page . . . . . . . . . . . . . . . . . . . . 46 3
Image of page 3

Info icon This preview has intentionally blurred sections. Sign up to view the full version.

View Full Document Right Arrow Icon
4 [DRAFT, 1074] CONTENTS 2.6 Attributes . . . . . . . . . . . . . . . . . . . . . . . . . . . 47 2.7 XHTML Reference . . . . . . . . . . . . . . . . . . . . . . 48 2.8 Images in HTML . . . . . . . . . . . . . . . . . . . . . . . 49 2.9 Relative URLs . . . . . . . . . . . . . . . . . . . . . . . . . 52 2.10 Choosing Tags . . . . . . . . . . . . . . . . . . . . . . . . . 56 Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . 57 3 Cascading Style Sheets 59 3.1 Styles . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 59 3.2 CSS . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 60 3.3 CSS Details . . . . . . . . . . . . . . . . . . . . . . . . . . 64 3.4 Why CSS? . . . . . . . . . . . . . . . . . . . . . . . . . . . 68 Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . 70 4 Advanced XHTML and CSS 71 4.1 Validating XHTML . . . . . . . . . . . . . . . . . . . . . . 72 4.2 Block vs. Inline Tags . . . . . . . . . . . . . . . . . . . . . 74 4.3 Entities . . . . . . . . . . . . . . . . . . . . . . . . . . . . 76 4.4 Generic Tags . . . . . . . . . . . . . . . . . . . . . . . . . . 78 4.5 Classes and Identifiers . . . . . . . . . . . . . . . . . . . . 79 4.6 More Selectors . . . . . . . . . . . . . . . . . . . . . . . . . 81 4.7 Colours in CSS . . . . . . . . . . . . . . . . . . . . . . . . 82 4.8 Positioning in CSS . . . . . . . . . . . . . . . . . . . . . . 85 4.9 Markup for Meaning . . . . . . . . . . . . . . . . . . . . . 90 Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . 93 III Graphics and Design 95 5 Graphics and Images 97 5.1 Graphics and Image Types . . . . . . . . . . . . . . . . . . 97 5.2 Bitmap vs. Vector Images . . . . . . . . . . . . . . . . . . 98 5.3 File Formats . . . . . . . . . . . . . . . . . . . . . . . . . . 100 5.4 File Formats, Common . . . . . . . . . . . . . . . . . . . . 104 Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . 106
Image of page 4
CONTENTS [DRAFT, 1074] 5 6 Design 109 6.1 General Design . . . . . . . . . . . . . . . . . . . . . . . . 109 6.2 Design Principles and XHTML/CSS . . . . . . . . . . . . . 114 6.3 Conventions . . . . . . . . . . . . . . . . . . . . . . . . . . 116 6.4 Readability . . . . . . . . . . . . . . . . . . . . . . . . . . 118 6.5 Page Design . . . . . . . . . . . . . . . . . . . . . . . . . . 119 Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . 120 IV Web Programming 121 7 Programming Introduction 123 7.1 What is Programming? . . . . . . . . . . . . . . . . . . . . 124 7.2 Starting with Python . . . . . . . . . . . . . . . . . . . . . 125 7.3 Web Programming . . . . . . . . . . . . . . . . . . . . . . 127 7.4 Expressions and Variables . . . . . . . . . . . . . . . . . . 129 Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . 131 8 Forms and Web Programming 133 8.1 Forms . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 134 8.2 Reading Form Input . . . . . . . . . . . . . . . . . . . . . 136 8.3 Handling Types . . . . . . . . . . . . . . . . . . . . . . . . 139 Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . 141 9 More Programming 143 9.1 Python Modules . . . . . . . . . . . . . . . . . . . . . . . . 143 9.2 Making Decisions . . . . . . . . . . . . . . . . . . . . . . . 144 9.3 String Formatting (optional) . . . . . . . . . . . . . . . . . 147 9.4 Debugging . . . . . . . . . . . . . . . . . . . . . . . . . . . 148 9.5 Coding Style (optional) . . . . . . . . . . . . . . . . . . . . 150 Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . 151
Image of page 5

Info icon This preview has intentionally blurred sections. Sign up to view the full version.

View Full Document Right Arrow Icon
6 [DRAFT, 1074] CONTENTS 10 Internet Internals 153 10.1 URLs . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 153 10.2 Cookies . . . . . . . . . . . . . . . . . . . . . . . . . . . . 155 10.3 HTTP Tricks (optional) . . . . . . . . . . . . . . . . . . . 156 10.4 Security and Encryption (optional) . . . . . . . . . . . . . 160 Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . 161 V Appendices 163 A Technical Startup 165 A.1 Installing Software . . . . . . . . . . . . . . . . . . . . . . 165 A.2 SFU Computing Account . . . . . . . . . . . . . . . . . . . 167 A.3 CMPT 165 Server Account . . . . . . . . . . . . . . . . . . 168 B Software Instructions 169 B.1 Mozilla Firefox . . . . . . . . . . . . . . . . . . . . . . . . 169 B.2 TextPad . . . . . . . . . . . . . . . . . . . . . . . . . . . . 170 B.3 Transferring Web Pages . . . . . . . . . . . . . . . . . . . . 170 B.4 Validators . . . . . . . . . . . . . . . . . . . . . . . . . . . 174 B.5 The GIMP . . . . . . . . . . . . . . . . . . . . . . . . . . . 175 B.6 Python . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 179
Image of page 6
List of Figures 1 CMPT 165 course schedule . . . . . . . . . . . . . . . . . . . 22 1.1 How information might get from the SFU web server to a home computer . . . . . . . . . . . . . . . . . . . . . . . . . 29 1.2 The conversation that a web client and web server might have when you view a web page . . . . . . . . . . . . . . . . . . . 31 1.3 The parts of a simple URL . . . . . . . . . . . . . . . . . . . 34 1.4 Some example MIME types . . . . . . . . . . . . . . . . . . . 36 2.1 A simple first XHTML page . . . . . . . . . . . . . . . . . . 41 2.2 Display of Figure 2.1 in a browser . . . . . . . . . . . . . . . 44 2.3 A sample web page about houses. . . . . . . . . . . . . . . . 46 2.4 Display of Figure 2.3 in a browser . . . . . . . . . . . . . . . 47 2.5 A sample page from the XHTML reference . . . . . . . . . . 49 2.6 A web page with an image . . . . . . . . . . . . . . . . . . . 51 2.7 Display of Figure 2.6 in a browser . . . . . . . . . . . . . . . 51 2.8 URLs starting at http://www.sfu.ca/ somebody/pics/index.html 55 3.1 A simple XHTML page with a stylesheet applied . . . . . . . 61 3.2 A simple CSS style ( simple.css ) . . . . . . . . . . . . . . . . . 61 3.3 Figure 3.1 without a stylesheet . . . . . . . . . . . . . . . . . 62 3.4 Figure 3.1 with the CSS in Figure 3.2 . . . . . . . . . . . . . 62 3.5 The CSS “Box Model” . . . . . . . . . . . . . . . . . . . . .
Image of page 7

Info icon This preview has intentionally blurred sections. Sign up to view the full version.

View Full Document Right Arrow Icon
Image of page 8
This is the end of the preview. Sign up to access the rest of the document.

{[ snackBarMessage ]}

What students are saying

  • Left Quote Icon

    As a current student on this bumpy collegiate pathway, I stumbled upon Course Hero, where I can find study resources for nearly all my courses, get online help from tutors 24/7, and even share my old projects, papers, and lecture notes with other students.

    Student Picture

    Kiran Temple University Fox School of Business ‘17, Course Hero Intern

  • Left Quote Icon

    I cannot even describe how much Course Hero helped me this summer. It’s truly become something I can always rely on and help me. In the end, I was not only able to survive summer classes, but I was able to thrive thanks to Course Hero.

    Student Picture

    Dana University of Pennsylvania ‘17, Course Hero Intern

  • Left Quote Icon

    The ability to access any university’s resources through Course Hero proved invaluable in my case. I was behind on Tulane coursework and actually used UCLA’s materials to help me move forward and get everything together on time.

    Student Picture

    Jill Tulane University ‘16, Course Hero Intern