web site design & management class one agenda attendance questionnaire introductions class...
TRANSCRIPT
Web Site Design & Management
Class One
Agenda
• Attendance• Questionnaire• Introductions• Class Policies• About the class
• Code your first page• FTP• Assignments
Attendance
• Sign it at every class.
• No signature = absent
• Attendance Policy/Late Policy
• Please correct your name on the attendance sheet.
See Attendance policy in Blackboard
Questionnaire
• To help me plan the rest of the semester
• Please fill out as completely as possible
• This is NOT graded.
• It is OK not to know an answer. If you don’t know the answer, just write “DK”
Introduction
• Who am I?• Please call me Pam• Where can I be reached? • Contact me through Blackboard or• [email protected] • Contact me by calling CCV
(all this information is also in Blackboard)
Email protocol
• Your name
• Your class (Web Design)
• A pertinent subject line
• Please do not SHOUT at me unless you mean it.
• I expect email – I expect questions
• If I don’t reply in 24 hours, please resend.
Now introduce yourself!
• Name
• Where you live & a little about yourself.
• Any web design experience?
• Name one thing you hope to learn in this class.
A few important things you can’t do during
class.
(but most of them you can do on break)
NOFOOD AT
COMPUTErS
NOGAMES
NOEMAIL
NOInstant
Messaging
NOCrunchy
Food
NOMyspace
About the course
• Description, expectations, grading
• Attendance Policy
• Homework Policy
• Books & Software
All of these are in Blackboard!
Blackboard
• Log In
• Find Course Policies
• Take Sample Quiz
• Keep Blackboard open, we’ll use it later
• Go on break.
What is HTML?
• A file format
• Hypertext Markup Language
• The program used to render (look at) an .html file is a browser– There are many different browsers
• Internet Explorer
• Firefox
Process for making HTML code
Write, Save, Test, Upload
• Write your code in a text editor (Notepad)– Don’t use Word or Wordpad.
• SAVE AS filename.html
• Test in a browser
• Upload to a host using ftp so people can see it on the Internet
HTML Code
• Code is plain text
• HTML is a series of elements
• How do you see the code on a web page?– In the browser go to
View > Source
HTML open (start) tag
• Opening bracket
• Tag name
• Attributes – usually optional
• Closing bracket
<html>
HTML close (end ) tag
• Opening bracket <• forward slash /• Tag name• Closing bracket >• (there are some exceptions, we’ll see them soon)
</html>
HTML element - example
• The paragraph element
• Open tag, content, close tag
<p> This is the content of the paragraph element.
</p>
There are “empty elements”
• They don’t have the closing tag.
• Also called “self closing” tags
• We’ll learn about these later.– <img />– <br />– <hr />– <input />
There are “attributes”
• Attributes define a property of a tag
• name=“value”
• Goes within the open tag
• Can have multiple attributes in one tag
Attributes - examples
<font color=“red” face=“arial”> </font>
<p align=“center”></p>
What do you think these do?
A basic web page template
<html><head><title> The title of your web page</title></head><body>
</body></html>
All visible content of your page goes between the two body tags, in HTML elements
Tips to make your coding life easier
• Organize your files first
• Consistency
• Write the closing tag immediately after you write the opening tag.
• Indent
• Know where you are saving things
• Don’t have lots of windows open at once
More tips/class policies
• small letters
• no spaces in file names, use a hyphen to separate things for clarity
• save as .html
• Create a basic web page template and reuse it over and over.
Copy and Paste is your friend
Copy & Paste is your friend
• Doesn’t mean to copy someone else’s code
• It helps you avoid typos
• Make yourself a standard template and use it over and over.
Terminology
• Server• Browser• Case-sensitive• File extension• stweb• ftp• WYSIWYG editor
• Source code• Text editor• Usability• Upload• Host• url• domain
Let’s Code
FTP server information
• Open up WinSCP3
• stweb.ccv.edu
• Your user name and password
• Your class is CIS-1151-VU03
• You should have a folder inside of that with your user initials on it.
Assignments
• Linked in Blackboard & on class website
• Reading/Coding
• Quiz
• Journals
• Email me with questions
• I expect problems this first week.