first web page on pitt servers windows machines. follow pitt cssd instructions to download putty...
TRANSCRIPT
First Web Page on Pitt ServersWindows Machines
Follow Pitt CSSD instructions to download Putty and WinScp for Windows machines: http://technology.pitt.edu/Documents/network/unix-timesharing/Secure_UNIX_Windows_FINAL.pdf
Download the Getting Started document from CSSD about HTML http://technology.pitt.edu/Documents/network/web-sites/ht
ml_inst.pdf Download the basic unix commands document from
CSSD http://technology.pitt.edu/Documents/misc/unix_command
s.pdf
Also, there are two links on the syllabus that give advice for creating Pitt websites using MACS
Connect to Pitt Servers (unixs.cis.pitt.edu) using Putty or FTP client
Use sftp port=22 your username/psword are from your authorization account – call 412-624-help if problem
Unix is case sensitive!!!!! Change to the public directory
cd public Once in the public directory make a new directory
called html mkdir html
Look at files in a directory by typing ls Create a directory called 1052
mkdir 1052 Create your homework file and label it index.html
and put it in the 1052 directory
Each file and directory have read, write, and execute permissions
You can right click on folder(directory) or file and set the permissions via FTP program
Or you can set permissions via Putty using the chmod command Welcome to binary numbers chmod nnn filename
Check permission with ls-l command Ex chmod 755 filename – owner has rwx and
everyone else rx Be careful not to give write permissions to
others.
Permissions on directories are a little different from those on files. 'read' allows the contents of a directory to be listed, 'write' means that you can add or delete files in the directory, and 'execute' allows direct access to files in the directory (if you already know their names). On most directories read and execute bits tend to go together ie typically directories will either have both bits set or neither set. From http://drupal.org/node/34023
After you have created an html and named it index.html and moved it to your 1052 directory and set the appropriate permissions 755 ( read, write, execute for you and read, execute for everyone else)
Open your browser and type in the address bar: www.pitt.edu/~username/1052
The browser will automatically look for index.html file and load it
Start with a template: Recommend XHTML 1.0 Strict for this class for
first two weeks– Later we will move over to HTML 5
W3C recommended templates: http://www.w3.org/QA/2002/04/valid-dtd-list.htm
l Doctypes tell browsers how to interpret the
document Doctypes help validators know which rules
to use to evaluate your page Don’t use Framesets in this class
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml">
<head> <Your page title</title> <meta http-equiv="content-type" content="text/html;charset=utf-8" /> </head>
<body>
<p>… Your HTML content here …</p>
</body> </html>
Text Editor – Notepad, Notepad++, Netbeans, TextWrangler or your choice
Dreamweaver, Photoshop and Adobe Products Great Deal at CSSD while a student
Firefox and add-ons – REQUIRED! Firefox
http://www.mozilla.com/en-US/firefox/personal.html
Firebug http://getfirebug.com/ FireFTP http://fireftp.mozdev.org/ Optional SourceChart
https://addons.mozilla.org/en-US/firefox/addon/655/ Optional
Web Developer https://addons.mozilla.org/en-US/firefox/addon/60/
All homeworks will be posted on your webpage for the class at www.pitt.edu/~username/1052 Create a file called index.html and place it in this
directory
All homeworks are due in one week at the start of the class.
Your homework page should be: Neat Well organized Easily understood Have your NAME
All homeworks will reference the homework number and possibly title.
Run your code through the W3C validator.
Pay attention to the errors but, it is not necessary to correct all of them
Be sensible: if your page has over 100 errors then it is not a good page
If your page has six errors and you know why they are occurring then it may be acceptable
http://validator.w3.org/
Benefits of Web Standards Coding Variety of user agents
Same marked up content can be read by browser, smartphones, screen readers etc.
Performance File size is smaller – exclude presentational
mark-up Cross Browser Compatibility Separation of Content and Presentation
From Stylin’ with CSS by Charles Wyke-Smith Second Edition
Benefits of Web Standards Coding (cont) Build more fluid pages
Easier to change number of list items etc. Validation tools
Use HTML, CSS, XHTML validators Streamline production
Allow teams of people to work on project Each team member knows rules for content and
design Accessibility
List of Standards Organizations http://www.webstandards.org/learn/external/o
rgs/
– The Web Standards Project– http://www.webstandards.org/learn/articles• Founded in 1998, The Web Standards Project
(WaSP) fights for standards that reduce the cost and complexity of development while increasing the accessibility and long-term viability of any site published on the Web. We work with browser companies, authoring tool makers, and our peers to deliver the true power of standards to this medium.
• W3C - http://www.webstandards.org/learn/faq/#p21
– The World Wide Web Consortium (W3C) is an international industry consortium dedicated to “leading the Web to its full potential“. It’s led by Tim Berners-Lee, the inventor of the Web. Founded in 1994, the W3C has more than 450 member organizations – including Microsoft, America Online (parent company of Netscape Communications), Apple Inc., Adobe, Sun Microsystems, and a variety of other hardware and software manufacturers, content providers, academic institutions, and telecommunications companies. The Consortium is hosted by three research institutions – MIT in the US, INRIA in Europe, and Keio University in Japan.
• What are the W3C Standards related to web design ?
-- HTML 5 - – HyperText Markup Language–HTML 4.01 – HyperText Markup Language–XML 1.0 – Extensible Markup Language–XHTML 1.0, 1.1, and Modularization–CSS – Cascading Style Sheets–DOM 1 – Document Object Model Level 1
• W3C HTML Working Group–http://www.w3.org/html/wg/–HTML 5
• http://dev.w3.org/html5/spec/Overview.html
The European Computer Manufacturers Association (ECMA) is an organization officially founded in 1961 in order to meet the need for standardizing computer operational formats, including programming languages and input/output codes. ECMAScript (standardized JavaScript)
• History of HTML– http://www.w3.org/People/Raggett/book4/ch02.html– http://www.yourhtmlsource.com/starthere/historyofhtml.html
HTML Tutorial http://htmldog.com/guides/htmlbeginner/
HTML Templates http://www.webmonkey.com/templates/ -document structure http://www.webstandards.org/learn/reference/templates/ - doctypes
– HTML 5 Overview• http://www.webmonkey.com/tutorial/Building_Web_Pages_With_HTML_5• http://www.alistapart.com/articles/previewofhtml5
HTML Simulator Use HTML simulator to see implementation: http://www.practiceboard.com/
Comprehensive List of resources http://www.alvit.de/handbook/
Massive list of web development tools Cheat sheets are particularly helpful
http://www.addedbytes.com/cheat-sheets/css-cheat-sheet/