First Web Page on Pitt Servers Windows Machines
Follow Pitt CSSD instructions to download Putty and WinScp for Windows machines: timesharing/Secure_UNIX_Windows_FINAL.pdf timesharing/Secure_UNIX_Windows_FINAL.pdf Download the Getting Started document from CSSD about HTML sites/html_inst.pdf sites/html_inst.pdf Download the basic unix commands document from CSSD f f 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 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
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: 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: list.html list.html 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" " <meta http-equiv="content-type" content="text/html;charset=utf-8" /> … Your HTML content here …
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 US/firefox/personal.htmlhttp:// US/firefox/personal.html Firebug FireFTP Optionalhttp://fireftp.mozdev.org/ SourceChart US/firefox/addon/655/ Optionalhttps://addons.mozilla.org/en- US/firefox/addon/655/ Web Developer US/firefox/addon/60/ US/firefox/addon/60/
All homeworks will be posted on your webpage for the class at 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
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 s/ s/ – The Web Standards Project – 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.standardsbrowser companiesauthoring tool makersour peers
W3C – 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.World Wide Web Consortiumleading the Web to its full potentialmember organizations MicrosoftAmerica OnlineNetscape CommunicationsApple Inc.AdobeSun MicrosystemsMIT INRIAKeio University
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 – – HTML 5
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.European Computer Manufacturers Association ECMAScript (standardized JavaScript)
History of HTML – – HTML Tutorial HTML Templates -document structure - doctypes – HTML 5 Overview HTML Simulator Use HTML simulator to see implementation:
Comprehensive List of resources Massive list of web development tools Cheat sheets are particularly helpful sheet/ sheet/