Week-03

HTML
We'll spend much of this class working hands-on with HTML. Try to keep in mind the overall structure of this markup language as introduced by the
 * DH 101 Tutorial on HTML
 * (Can you spot the error on this page? )
 * Brief demo of page structure.

Creating a Github account to serve HTML web pages
Many internet companies provide website builders. Wix, Weebly, Squarespace. They make it easy to post pages and style them attractively. But users give up the portability and stability of simple HTML. Github is a free publishing space primarily used by programmers for open-source projects. When people write collaborative code, they need "version control" to keep track of changes, merging or forking developments in the code base. Since many such projects also require documentation, Github provides free hosting for simple webpages. The pages that you learn to create using HTML5 and CSS can be viewed on any computer; and you can store them in a folder and remount this anywhere (on your IUP server space, on your employer's server, or even set up a server in your home).

Follow these slides:


 * 1) Register for a Github account
 * 2) Create a repostitory called MyUsername.github.io
 * 3) Add one file
 * 4) Visit your website at http://MyUsername.github.io

Editing Simple HTML
Experienced: If you have written pages using html before, please look at these overviews and practice a bit on W3Schools free tutorial: @http://www.w3schools.com/html/default.asp

Using StackEdit to Author and Upload HTML
StackEdit is a simple, web-based editor for the Chrome Browser. (You can also use a simple tool like Notepad; however, StackEdit has syntax highlighting AND will easily backup to your GoogleDrive or Dropbox AND can be set to easily PUBLISH to Github.)

Using CSS External Style Sheets
Simple HTML looks very plain. CSS gives it style and color. Modern websites separate content and structure (your words and the ) from the visuals. This has many advantages. Among them are accessibility and longevity.

The W3 Schools CSS Tutorial will take you a long way towards a beautiful website.

Professional Web Page Project
The main goal of this mini-project is to help you understand how markup tags work and to give you the capacity to hand edit html. Here are the minimal project requirements for your webpage.

Homework

 * 1) ======Please begin to work through the W3 Schools CSS Tutorial and make style decisions for your site. For your project, you must use at least one external style sheet hosted on your github page. You can //borrow// from my markdown.css or simple.css if that's helpful.======
 * 2) ======Be prepared to discuss chapter one of //Literature in the Digital Age//.======

Continued Web Work - CSS

 * 1) Uploading files via Stackedit
 * 2) Linking between files on your web host
 * 3) CSS stylesheet (principle of an external style sheet)
 * Define style characteristics of chosen selectors ( etc.) in a separate file named "style.css" (or something else you choose in the form of *.css)
 * Associate your content file (index.html) with the style file (style.css) by adding a link **in the head area** of your html file.
 * See my simple index2.html for examples.
 * 1) Several useful ways to customize styles:
 * Text
 * Backgrounds
 * Custom Google Fonts

Discussion LTDA Ch. 01 - The Digital Medium and Its Messaage
media type="custom" key="29009123"

Homework

 * 1) ======Academic web page due (published) on Tuesday 2/14. Be sure to review minimal project requirements for your webpage.======
 * 2) ======Read and prepare to discuss; LDA “Medium Shifts” C2, pp 22-40LDA “Short-circuiting Publication” C6, pp. 133-152======