Tuesday, January 31, 2012
Fizz Buzz Test
Fizz Buzz Test: write a program that prints the numbers from 1 to 100. But for multiples of three print “Fizz” instead of the number and for the multiples of five print “Buzz”. For numbers which are multiples of both three and five print “FizzBuzz”
Monday, January 30, 2012
As your teacher, my objectives for you this semester are:
+The ability to handle content well, to make it accessible and support its meaning and purpose
+An appreciation of how to best structure assets and code to create well optimized sites
+A clear understanding of how HTML, CSS and Javascript all work together to create wonderful user experiences
+Mastery of semantic HTML
+A solid grounding in modern CSS
+An appreciation of ECMA scripting languages in general, and Javascript in particular, and of their shared syntax
+Strategies for designing across browsers, platforms and devices
+An appreciation of well-written code — I want you to become a code snob
+An understanding of basic programming concepts like variables, conditionals, loops, and functions
+The ability to write and debug your own code
The Web is really a set of accepted rules for sending, addressing, and formatting data. It is built on top of the Internet and, unlike the Internet, it allows information to persist. It is the combination of URL, HTTP, and HTML that make the Web possible.
The Web is built along the spine of the Internet. It is the brainchild of Sir Tim Berners-Lee. It is defined by the use of:
-HTTP, Hypertext Transfer Protocol: This protocol permits networking and is the foundation of communications on the Web.
-FTP, File Transfer Protocol: The standard network protocol that allows the transfer of files from a client machine to a server.
-URL, Uniform Resource Location: Originally known as URI, Uniform Resource Identifier, this is the address of a particular resource.
The < i m g > tag was introduced by the Mosaic browser in 1994. It was so popular that it was later included in the specifications for HTML 2.0. People were hungry for more media and richer Web experiences.
The specifications is the approved description of the language. The specifications are maintained by the W3C, the World Wide Web Consortium. As it describes itself, "The World Wide Web Consortium (W3C) is an international community that develops standards to ensure the long-term growth of the Web." At the end of the day, the Web works because the major players agree to follow the rules pretty much the same way. Browser manufacturers work to implement the standards as laid out by the W3C.
The next big advance in HTML came with the introduction of XHTML, which is HTML written to follow the rules of XML. XML and HTML are sibling languages -- HTML is a subset of XML. XML, as a stricter language with stricter rules, has its advantages. It forced web authors to all code the same. XHTML emerged around 1999, about the same time that browser support for CSS began to improve. Also emerging were cell phones and a need for the mobile web.
By 2002, browser development had stagnated.... If you are interested in learning more, you can read the specification here: HTML5.
The focus of this class is client side coding. In this course we are writing in different languages: HTML, CSS and Javascript. Writing clean code is not difficult, but it does require precision and you need to know what you are doing. The style in which you write is not nearly as important as consistency.
You need to watch spelling, capitalization, punctuation -- everything counts. Here is a short list of the rules that will improve your code and avoid embarrassing errors:
Rules for File & Folder Names:
Begin all names with either a lowercase letter or an underscore ("_"). Do not use numbers to start names -- I know it's tempting, but it will cause problems.
Limit yourself to letters, numbers and underscores.
Avoid capital letters in file and folder names. Older servers may break them and your page will fail.
Avoid special characters like ?, #, $, etc. Browsers use these characters to pass information to the servers and they will break your names. For instance, the question mark ("?") is used in URLs to attach the name and value of a variable to the URL. When you do a Google search, your query is attached at the end of the search URL by a question mark. The parameters are separated by ampersands ("&".) That's how Google figures out what to search for. In ECMA scripting languages, these characters have special meanings as well. Javascript, PHP and ActionScript are all examples of ECMA scripting languages. Special characters will break your code.
Don't use spaces in your file or folder names -- it's bad Web form and your names will break. Other web developers will laugh at you behind your back. It will bring shame on your family. Your kids will be embarrassed to go to school. If you need to separate two words, use an underscore "_" or possibly a hyphen, "-".
General Rules for Coding:
When referring to external files, always use the proper file extension. Otherwise, the poor browser will have to guess how to handle your file. You may not like the results!
When interpreting files, browsers will ignore white space. This means you can use line breaks, tab and multiple spaces to make your code easier to read. Make liberal use of this gift. Indent to show nesting. Use line breaks to visually "chunk" your code into related parts.
Comment your code liberally. The browser will ignore the comment. Commenting your code helps you understand and document your choices and decisions. You will be glad you did (and will also make all the other folks who have to support or update your files happy).
//this is a single line of comment in Javascript only
/*
this is a multiple line comment.
It work great in both CSS and Javascript!
It is the only form of comment that CSS understands.
I can write a novel in this comment.
*/
Special Rules for CSS and Javascript:
Be mindful of case sensitivity. "mydog" is not the same as "MyDog", or "myDog" or "MYDOG". As far as Javascript and CSS are concerned these are all different names. Best practice is to use lowercase letters. If there is more than one word, you may capitalize the second word or use an underscore (_) to make your name more readable.
Choose names that reflect what they refer to. For instance, if you are writing a Javascript function that swaps out images, good name choices might include "swapImage" or "imageSwap" -- "vodkaMartini" would not be a good choice. When your boss asks you update your code six months later, you will be able to understand what you meant.
Rules for HTML:
HTML was designed to be flexible. There are multiple styles for writing HTML. For the purposes of these demonstrations, we will prefer and use a strict style based on XML. We believe that the added rigor clarifies the code and reduces sloppy errors. Just know that there are other ways to code. Here is a list of the conventions that we will use in this class:
-Use lowercase for all tag names and attributes.
-Quote all attribute values.
-Indent nested tags to show the document structure.
-Close all tags, even the stand-alone tags. There are two styles for closing tags:
< script src = " js /scripts.js " > < / script >
-OR-
< img src = " myimage.jpg " />
Don't worry if this feels like a blur now. You will see lots of examples and get plenty of experience writing this kind of code for yourself! you can keep coming back and re-read this!
Backing Up Your Files
Time is expensive and memory is cheap. Never rely on any one single computer or device -- have back up. External hard drives and thumb drives are both cheap. As you work on your demonstrations and assignments for this class, make copies frequently. Store them on an external drive or a thumb drive. If your computer should fail or one of your drives goes bad, you'll be glad you did. It's not uncommon for hardware to fail!
Alternatively you could investigate back-up services in the cloud like Dropbox (free), Carbonite or Sugarsync.
You will need the following tools (options for each category follow below, so scroll on down. remember this page is in reverse chronological order.):
+A good text editor that supports code tinting (textWrangler or BBedit are linked below)
+A development browser and browser add-ons to inspect your code (links below. http headers, firebug, etc)
+An FTP client for transferring your assignments to your server
+An image editor to make and compress your graphics (photoshop, imageReady, fireworks included with Tuition)
sample html
< title > This is a title in the head! < / title > < br />
This is< h 1 > the largest of the h tags < / h 1 >
P tags are great to know
This is< h 1 > the largest of the h tags < / h 1 >
P tags are great to know
sample html
This is the largest of the h tags
P tags are great to know blah blah huehrowehtrowie
CNET Bandwidth Meter: Online Speed Test - CNET Reviews
CNET Bandwidth Meter: Online Speed Test - CNET Reviews
it's good to know how fast things are... test things out wherever you are. call your ISP out... if you're paying for a fast bandwidth and you're not getting it, make them provide what you're paying for.
Fetch Softworks
Fetch Softworks
This is what's on the desktops at school. Doesn't hurt to get to know it... it's old school... pun intended.
Fetch was created in the summer of 1989 by Jim Matthews, an employee of Dartmouth College. At the time, it was intended primarily for internal college use. Fetch was maintained and updated as a Dartmouth software project and was eventually released as shareware, becoming very popular in the Macintosh community.
Hosting Plans - CNET Reviews
Hosting Plans - CNET Reviews
for as little as a coffee at starbucks... you can host your files, projects, art, etc. a month. please be sure it meets the minimum requirements for the course...
Hosting service must provide the following services:
• FTP access
• MySQL
• PHP version 5
Bare Bones Software | TextWrangler
Mac
TextWrangler is a powerful general purpose text editor, and Unix and server administrator’s tool.
TextWrangler is a powerful general purpose text editor, and Unix and server administrator’s tool.
TextWrangler 3.5 System Requirements
- Mac OS X 10.5 or later (10.5.8, 10.6.7 or later recommended)
- Universal application (for both Intel and PowerPC-based Macs)
What about BBEdit Lite?
BBEdit Lite was discontinued a number of years ago, and the world has moved on. TextWrangler and BBEdit have capabilities that were never supported (or possible) in BBEdit Lite:
- Run natively and at full speed on Macs with Intel processors;
- Open files from (and save them to) remote FTP and SFTP servers;
- The powerful and flexible pattern matching supported by PCRE;
- Support for editing Unicode text files, and converting between text encodings;
- Find Differences to compare files or folders;
- Integration with the Unix command-line environment;
- Advanced and extensible programming language support, with code folding, syntax coloring, and extensibility;
- …and much much more.
Web Hosting Service
Web Hosting Service
Win or Mac
(students will need to acquire or have access to their own web hosting space, and domain name, to use to host assignments, exercises, and projects; these can be acquired from providers such as godaddy.com)
NOTICE: As of Spring 2012, the Academy of Art University will provide the entire Adobe Creative Suite Master Collection to all registered students. Download instructions can be found in your Student Profile.
You will need an image editing program such as Photoshop or Fireworks that is capable of exporting images in GIF, JPG and PNG formats. You DO NOT need the newest version; as long as you can produce GIF, JPG and PNG file types you will be able to successfully complete all course work.
WNM 608 - 02: MS: Web Technology 1
(Cross-listed as WNM_800_114 ) - Spring 2012 - Jan 30 - May 19, 2012
- Dept:
- AAUSF
- Prerequisites:
- WNM 601, WNM 605, & WNM 606
- Units:
- 3.0
- Course Fee:
- 100.00
Course Description
Students will be introduced to the full advantage of opportunities afforded by the web. User interface, design principles and project management will be associated with hands on applications for the entire process of front-end web development. Languages include HTML, XHTML, CSS and Javascript.Course Learning Outcomes
Will be able to:- Hand code HTML and CSS from scratch
- Confidently design and execute a web site
- Apply best practices for client-side coding and web standards
- Organize and develop a website
- Apply proper file organization and management
- Design usable navigation
- Meet assigned deadlines
- Accept and apply critiques
- Analyze and discuss work using industry specific terminology
- Prepare for and contribute to class discussions and critiques
Grading
| 15% | Projects |
| 10% | Participation |
| 25% | Midterm |
| 50% | Final |
Topics Covered by this Course
- Clients and Servers
- Internet Protocols
- Browser Differences
- HTML
- CSS
- Image Preparation for the Web
- Project Management Tools for Web Sites
- Introduction to Information Architecture
- Introduction to Usability
- Web Standards
- Introduction to JavaScript
- Web Typography
Lab Policy
http://maclab.academyart.edu/you're required to have your own Web Host...
Personal Website / Domain Name (MFA WNM OC Standard)
Win or Mac
Process:
- Select Domain Name with an Internet Service Provider (ISP). Strongly recommended: Bluehost.com
- Register (buy) domain name.
- Get website hosted.
• FTP access
• MySQL
• PHP version 5
Recommended Reading
Optional Books
| HTML5 for Web Designers |
|
|
| Introducing HTML5 |
|
|
| CSS: The Definitive Guide by Eric Meyer |
|
|
| CSS3 for Web Designers |
|
|
| jQuery in Action |
|
|
| JavaScript: The Good Parts |
|
|
| DOM Scripting: Web Design with JavaScript and the Document Object Model |
|
Bibliography
Head First HTML with CSS & XHTMLBy Elisabeth Freeman, Eric Freeman
First Edition, December 2005
ISBN 10: 0-596-10197-X | ISBN 13: 9780596101978
Head First JavaScript
By Michael Morrison
First Edition, December 2007
ISBN 10: 0-596-52774-8 | ISBN 13: 9780596527747
Head Rush Ajax
By Brett McLaughlin
First Edition, March 2006
ISBN 10: 0-596-10225-9 | ISBN 13: 9780596102258
CSS: The Definitive Guide, Third Edition
By Eric A. Meyer
Third Edition, November 2006
ISBN 10: 0-596-52733-0 | ISBN 13: 9780596527334
Designing with Web Standards
By Jeffrey Zeldman
New Riders Press, First Edition (May 14, 2003)
Don't Make Me Think
By Steve Krug
New Riders Press, Second Edition (October 13, 2000)
Information Architecture
By Louis Rosenfeld and Peter Morville
O'Reilly, Second Edition (August 15, 2002)
The Design of Everyday Things
By Donald Norman
Currency, Reissue Edition (February 1, 1990)
Weaving the Web: The Original Design and Ultimate Destiny of the World Wide Web
By Tim Berners-Lee
Collins, First Edition (November 1, 2000)
Method of Evaluation
Projects, Assignments, ParticipationAssignments
Students are expected to spend a minimum of 10 hours per module on projects outside of class. All projects are due on the specified dates (see course schedule). A late project is marked down one grade ("B" to "C"). A project more than one week late will receive a grade of "F".Attendance
Students are expected to attend all class meetings and final grades will reflect this policy. The Academy has developed a Model Attendance Policy and a Model Policy on Late Submission of Projects/Assignments. Most classes follow these policies; however, departments may differ from the model policies. Class attendance is required. Attendance means arriving on time and staying for the entire class session. Each course requires that the student be present at and participate in, every class session. Failure to attend classes, tardy arrivals and early departures will be reflected in final grades as follows:- Four (4) late arrivals may drop the final grade by one letter grade ("B" to "C", "C" to "D"...)
- Three (3) unexcused absences may result in a final grade of "F".
- Three (3) consecutive absences may result in a final grade of "F" or being dropped from the class.
Academic Probation
Students will be placed on Academic Warning if their semester Grade Point Average (GPA) falls below a 2.0, but their cumulative GPA remains at 2.0 or higher. If their cumulative GPA falls below a 2.0, the student will be placed on Academic Probation and if their cumulative GPA falls below 2.0 for two consecutive semesters, the result is dismissal from college. If a student is dismissed, the student may apply for reinstatement after one full term has passed by submitting a letter to the Grievance Committee giving reasons for his/her academic record and requesting that re-admission be granted.Grading Criteria
Students are graded on their skill level relative to industry standards. The student's skill level comprises all of the following:- The quality of conceptualization as it relates to assignments.
- The quality of craft and design skills.
- The quality of a student's presentation.
- The student's mature ability to interact with peers and faculty members.
- The student's mature ability to receive and act upon critiques.
- The student's participation in and contribution to the class.
- The student's ability to meet weekly and final deadlines.
- The student's attendance record.
Grade Interpretations
| Letter Grade | Description | Grade Points |
| A | Exceptional | 4.00 |
| A- | Excellent | 3.70 |
| B+ | Very Good | 3.30 |
| B | Good | 3.00 |
| B- | Competent | 2.70 |
| C+ | Above Average | 2.30 |
| C | Average | 2.00 |
| C- | Below Average | 1.70 |
| D+ | Marginal | 1.30 |
| D | Weak | 1.00 |
| D- | Minimal Achievement | 0.70 |
| F | Failing | 0.00 |
| I | Incomplete* | 0.00 |
| IP | In Progress* | 0.00 |
| P | Pass | 0.00 |
| T | Transfer* | 0.00 |
Grades of "I" will be given credit only when they are converted to a Letter Grade.
Grades of "F" are computed as zero (0) points toward the Grade Point Average.
Students must achieve a "C" or better in all Graduate level coursework.
Students must achieve a "C-" or better in all Undergraduate major classes.
Passing grade for an Undergraduate elective course is "D-" or above.
Passing grade for an Undergraduate Liberal Arts course is "D-" or above.
A "D+"/"D"/"D-" in an Undergraduate major required course that is not repeated will be given credit as an elective.
University Code of Conduct
The Academy of Art University is committed to upholding its policies regarding student conduct. By enrolling at the University, students agree to abide by the policies as outlined in the University Code of Conduct, which can be found in the catalog, in the Enrollment Agreement and on the Academy of Art University website. This includes, but is not limited to, the expectations of professional behavior, proper classroom etiquette, attending and participating in all classes. All works, written and visual, must be the student's own creations. Plagiarism and cheating will not be tolerated.Academy Resource Center (ARC)
631 Howard Street (Main Office)All services are offered free of charge and are provided to both online and on campus students. Please call or email for more information.
(415) 618-3917 or arc@academyart.edu
Speaking Lab. Assistance is offered for oral presentations and pronunciation practice. The Speaking Lab also arranges conversation groups for international students.
Student Academic Support
One-on-one coaching is available by appointment or on a drop-in basis for assistance with study skills and time management. SAS also refers students to outside and other AAU services.ARC Tutoring (formerly Study Hall Tutoring)
ARC Tutoring provides remedial, one-on-one tutoring to qualifying students to supplement workshops.Classroom Services
Reasonable accommodations can be made for students with disabilities. For more information, or to establish eligibility, contact Classroom Services at 415.618.3775 or classroomservices@academyart.edu They are located at 631 Howard Street, 4th Floor.ESL Support Program and Online English as a Second Language (OESL)
In-class language support is provided for international students in designated sections. Weekly study groups and one-on-one tutoring are open to all students.Writing Lab
Writing Lab and Online Writing Lab (OWL). Assistance is available for all writing assignments.Midpoint Review Workshop
Midpoint Review Workshops (graduate students only). Workshops and one-on-one help are provided to graduate students working on written proposals and oral presentations for midpoint and final reviews.
Subscribe to:
Posts (Atom)