Difference between revisions of "Week Eight (MGDP2050)"

From Wiki @ Karl Jones dot com
Jump to: navigation, search
(Exercises: in class)
Line 61: Line 61:
 
== Exercises: in class ==
 
== Exercises: in class ==
  
...
+
=== Download and install jQuery UI ==
 +
 
 +
Browse the jQuery UI website:
 +
 
 +
* https://jqueryui.com/
 +
 
 +
Click the "Stable" link (in the Quick Downloads section).
 +
 
 +
* This will download a [[Zip file]] containing the jQuery UI files.
 +
 
 +
Unzip the jQuery UI files.
 +
 
 +
Move the jQuery UI files to your [[local root folder]].
 +
 
 +
=== Create folder named week8 ===
 +
 
 +
In your local root folder, create a new folder named '''week8'''.
 +
 
 +
=== Create web page ===
 +
 
 +
In your '''week8''' folder, create a web page named '''index.html'''.
 +
 
 +
* Similar to other exercise pages.
 +
* Set page title, etc.
 +
 
 +
=== Demonstrate a jQuery UI component ===
 +
 
 +
In your web page, demonstrate a jQuery UI component of your choice.
 +
 
 +
=== Update your home page ===
 +
 
 +
On your [[Home page]], make a link to your jQuery UI exercise.
 +
 
 +
=== Upload to web server ===
 +
 
 +
Upload your work to the web server:
 +
 
 +
* Exercise page
 +
* jQuery UI folder
  
 
== Exercises: for next week ==
 
== Exercises: for next week ==

Revision as of 06:59, 29 March 2016

Lecture notes and exercises for Week Eight of Web Design and Development II (MGDP2050).

See also Week Seven (MGDP2050) - Week Nine (MGDP2050).

HTML and semantics

In principle, the role of HTML is to provide semantics (meaning).

In practice, HTML is a mix of semantic and non-semantic elements.

Semantic HTML

Semantic HTML refers to HTML that is entirely semantic (or perhaps "very semantic with acceptable compromises").

Bold versus strong

Earlier versions of HTML specified a bold element, to make text display in boldface.

HTML 4 also specified a strong element, intended to replace the bold element.

Both elements are valid in HTML5.

Italic versus emphasis

Earlier versions of HTML specified an italic element, to make text display in italicf.

HTML 4 also specified an emphasis element, intended to replace the italic element.

Both elements are valid in HTML5.

JavaScript

Recognizing JavaScript

Using JavaScript

Script element

Debugging JavaScript

  • See the browser console for JavaScript error messages and other browser-related tools.

JavaScript Validation

See JSLint and JSONLint.

jQuery

  • Review jQuery ...

jQuery UI

Introduce jQuery UI ...

Exercises: in class

= Download and install jQuery UI

Browse the jQuery UI website:

Click the "Stable" link (in the Quick Downloads section).

  • This will download a Zip file containing the jQuery UI files.

Unzip the jQuery UI files.

Move the jQuery UI files to your local root folder.

Create folder named week8

In your local root folder, create a new folder named week8.

Create web page

In your week8 folder, create a web page named index.html.

  • Similar to other exercise pages.
  • Set page title, etc.

Demonstrate a jQuery UI component

In your web page, demonstrate a jQuery UI component of your choice.

Update your home page

On your Home page, make a link to your jQuery UI exercise.

Upload to web server

Upload your work to the web server:

  • Exercise page
  • jQuery UI folder

Exercises: for next week

...

Reading for next week