L I S 4 9 3 0 W e b A p p l i c a t i o n D e s i g n

Web DevelopmentWith HTML5

Web DevelopmentWith HTML5

L I S 4 9 3 0 W e b A p p l i c a t i o n D e s i g n

HTML5 is…

• HyperText Markup Language• a W3C Recommendation• evolved from HTML (4.01) and XHTML 2.0– http://www.w3.org/TR/html5/

• Becoming a Living Standard– http://www.whatwg.org/specs/web-apps/

current-work/

L I S 4 9 3 0 W e b A p p l i c a t i o n D e s i g n

CSSprovidesvisualdesign

HTML5providesdata

BrowserRendersWebPage

L I S 4 9 3 0 W e b A p p l i c a t i o n D e s i g n

Learning HTML5

– Some basic rules:

• “tags” markup sections of content• tags must be properly nested• tags must always be closed <br />• tags must be lowercase <ul> not <UL>• tag attributes must be in quotes

L I S 4 9 3 0 W e b A p p l i c a t i o n D e s i g n

Development Process

• Edit HTML in text editor • Save as .html• Open file from Web browser• Further edit HTML in text editor• Save• Refresh page in Web browser

L I S 4 9 3 0 W e b A p p l i c a t i o n D e s i g n

Development Process

• Development of an HTML page typically takes place on local PC

• Finished Web site is uploaded to server (staging or production)

• Changes to Web site are made on local machine and uploaded when completed

• Two copies of the Web site are maintained, one local and one on server.

L I S 4 9 3 0 W e b A p p l i c a t i o n D e s i g n

Development Process

• Web development tools are often used to simplify the development process.