Fundamentals of Website Development

Size: px
Start display at page:

Download "Fundamentals of Website Development"

Transcription

1 Fundamentals of Website Development CSC 2320, Fall 2015 The Department of Computer Science In this chapter History of HTML HTML

2 The birth of HTML HTML Blows and standardization

3 HTML 4.0 and 4.01and XHTML HTML in 1998 HTML in 1999 separation of structure and presentation and improving accessibility XML Why is needed? XHTML 1.0 Strict HTML 4.01 More works on XHTML XHTML 2.0 Not Backward-compatible Hard for Browser Implementation XHTML 2.0 -> stuck for 10 years XHTML -> HTML

4 Hello HTML 5.0 In, 2004 WHATWG: Web Hypertext Application Technology Working Group real-world authoring practices and browser behavior W3C HTML5 Working Group Based on WHATWG Merge XHTML 2.0 to HTML5 HTML 4.01 legacy

5 Meet the DTD DTD: Document Type Definition DTDs in HTML 4.01 Transitional DTD Strict DTD Frameset DTD E.g. DTDs in XHTML 1.0 DOCTYPE declaration

6 What do the pros do before HTML 5.0 Follow the XHTML 1.0 strict DTD No deprecated and presentational elements Use style sheets Validate the pages What s new in HTML 5 A new DOCTYPE New elements and attributes Obsolete 4.01 elements APIs

7 New DOCTYPE Read fun facts on page 185. HTML > HTML 5 No DTD needed Easy declaration Compared with the one in HTML 4.01 What should we use for now? HTML 4.01 DTD, XHTML 1.0 DTD and HTML 5 New Elements and Attributes New Elements On Page 197. W3Schools.com Semantic/ Structural, why not presentational? Semantic elements

8 Semantic Elements When a layout becomes popular New Attributes New Form Input Attributes Meet the new attributes W3Schools New Global Attributes W3Schools What is the trend? More logical More functional High encapsulation

9 Obsolete 4.01 elements From textbook page 189 APIs Multimedia API Session History API Drag and Drop API Web workers API Web socket API Others

10 Add video and audio Add video: <video src= poster= controls> Controls: Autoplay Loop Muted Preload: auto, none, metadata What is the future browser The trend High isolation (Semantic, presentational, logical) High encapsulation Common use combinations like input date What is the future browser? A platform? An operation system? All-in-One software?

11 HTML5 and Designing a Rich Internet Experience HTML5 HTML 5 + CSS 3 + JavaScript Rich Internet Applications (RIA) HTML5 x 5 Caution and Progress Example and Reference Sites

12 HTML5 HTML 5 + CSS 3 + JavaScript HTML5 is a suite of tools for: Markup (HTML 5) Presentation (CSS 3) Interaction (DOM, Ajax, APIs) Brought on by the evolving use of the web A Rough History of Web Standards HTML 1 HTML 2 HTML 4 XHTML 1 CSS 1 CSS 2 T-less D JS ECMA, DOM Web HTML 5 CSS3 DOM 2 Ajax DOM, APIs HTML WHATWG started 2008 W3C Working Draft 2012 (2010) W3C Candidate Rec 2022 W3C Rec CSS 1996 CSS 1 W3C Rec 1998 CSS 2 W3C Rec 1999 CSS 3 Proposed 2005 CSS 2.1 W3C Candidate Rec 2001 CSS 3 W3C Working Draft

13 Rich Internet Applications (RIA) Space between the internet and the desktop Apps that look good and behave well Adobe Air/Flash, Java, Silverlight, Gears Availability Anywhere a web browser is available As a desktop widget or application Part of a mobile application store RIA Examples

14 5 HTML Enhancements HTML Forms CSS Offline applications Local storage HTML Extended Document Flow: div, section, article, nav, aside, header, footer Audio, Video and Embed Canvas: paths, gradients, image manipulation, events Microdata for semantics and enhanced search engine results (Google Rich Snippets)

15 HTML Header Figure Asid e Navigation Section Article Footer Article Footer Article Footer Image, Video, Quote, Table, etc Footer Legend Canvas <canvas id= canvas width= 150 height= 150 > </canvas> function draw() { var canvas = document.getelementbyid( canvas ); if (canvas.getcontext) { var ctx = canvas.getcontext( 2d ); ctx.fillstyle = rgb(200,0,0) ; ctx.fillrect (10,10,55,50); } } ctx.fillstyle = rgb(0,0,200) ; ctx.fillrect (30,30,55,50);

16 Form Enhancements Placeholder text Specific text input: , URL, number, search Slider Date picker User Agent validation CSS Effects Rounded corners Gradients Box and text shadows Fonts Transparencies Multiple background images and border images Multiple columns and grid layout Box sizing Stroke and outlines Animation, movement and rotation Improved selectors

17 CSS Effect Example.amazing { border: 1px solid blue; color: red; background-color: gold; Amazing CSS Effects -webkit-border-radius: 40px; -moz-border-radius: 40px; border-radius: 40px; -webkit-box-shadow: 8px 8px 6px #474747; -moz-box-shadow: 8px 8px 6px #474747; box-shadow: 8px 8px 6px #474747; text-shadow: 8px 8px 2px #595959; filter: dropshadow(color=#595959, offx=8, offy=8); } CSS Timelines

18 Programmer Tools Offline Applications Storage Communication Web Workers Web Sockets Desktop experience Drag and Drop Notifications Geolocation Offline Applications <html mainfest= > </html> someapp.manifest CACHE MANIFEST #v1.01 #Explicitly cached files CACHE: index.html Stylesheet.css Images/logo.png NETWORK: Search.cfm Login.cfm /dynamicpages FALLBACK: /dynamicpage.cfm /static.html

19 Local Storage Beyond cookies- local storage Manipulated by JavaScript Persistent 5MB storage per origin Secure (no communication out of the browser) Session storage Lasts as long as the browser is open Each page and tab is a new session Browser based SQLite or IndexedDB Local Storage Web storage window.localstorage[ value ] = Save this! ; Session storage sessionstorage.uselater( fullname, Garth Colasurdo ); alert( Hello + sessionstorage.fullname); Database storage var database = opendatabase( Database Name, Database Version ); database.executesql( SELECT * FROM test, function(result1) { });

20 User Agent Storage Cautions Browser implementation is fragmented Standards are in development HTML Candidate Recommendation is scheduled for 2012 CSS3 is in multiple drafts and proposals ECMA-262 (edition 3) (or JavaScript 1.5) New markup and architecture design

21 Progress Multiple support levels HTML editors CSS editors and frameworks JavaScript libraries and frameworks Astounding user agent development JavaScript engines Rendering engines Device awareness Widget adoption Robust vendor competition and cooperation Continue with progressive enhancement/graceful failure methods Homework Read Chapter 10 Try new input types in chapter

22 Questions Thank You!

Index LICENSED PRODUCT NOT FOR RESALE

Index LICENSED PRODUCT NOT FOR RESALE Index LICENSED PRODUCT NOT FOR RESALE A Absolute positioning, 100 102 with multi-columns, 101 Accelerometer, 263 Access data, 225 227 Adding elements, 209 211 to display, 210 Animated boxes creation using

More information

Techno Expert Solutions An institute for specialized studies!

Techno Expert Solutions An institute for specialized studies! HTML5 and CSS3 Course Content to WEB W3C and W3C Members Why WHATWG? What is Web? HTML Basics Parts in HTML Document Editors Basic Elements Attributes Headings Basics Paragraphs Formatting Links Head CSS

More information

HTML5 and CSS3: New Markup & Styles for the Emerging Web. Jason Clark Head of Digital Access & Web Services Montana State University Library

HTML5 and CSS3: New Markup & Styles for the Emerging Web. Jason Clark Head of Digital Access & Web Services Montana State University Library HTML5 and CSS3: New Markup & Styles for the Emerging Web Jason Clark Head of Digital Access & Web Services Montana State University Library Overview Revolution or Evolution? New Features and Functions

More information

COURSE OUTLINE MOC 20480: PROGRAMMING IN HTML5 WITH JAVASCRIPT AND CSS3

COURSE OUTLINE MOC 20480: PROGRAMMING IN HTML5 WITH JAVASCRIPT AND CSS3 COURSE OUTLINE MOC 20480: PROGRAMMING IN HTML5 WITH JAVASCRIPT AND CSS3 MODULE 1: OVERVIEW OF HTML AND CSS This module provides an overview of HTML and CSS, and describes how to use Visual Studio 2012

More information

HTML5 and Mobile: New Markup & Styles for the Mobile Web. Jason Clark Head of Digital Access & Web Services Montana State University Libraries

HTML5 and Mobile: New Markup & Styles for the Mobile Web. Jason Clark Head of Digital Access & Web Services Montana State University Libraries HTML5 and Mobile: New Markup & Styles for the Mobile Web Jason Clark Head of Digital Access & Web Services Montana State University Libraries Overview Demos View some code bits New Features and Functions

More information

COPYRIGHTED MATERIAL. Defining HTML5. Lesson 1

COPYRIGHTED MATERIAL. Defining HTML5. Lesson 1 Lesson 1 Defining HTML5 What you ll learn in this lesson: Needs fulfilled by HTML5 The scope of HTML5 An overview of HTML5 Syntax An overview of HTML5 APIs and supporting technologies In this lesson, you

More information

MODULE 2 HTML 5 FUNDAMENTALS. HyperText. > Douglas Engelbart ( )

MODULE 2 HTML 5 FUNDAMENTALS. HyperText. > Douglas Engelbart ( ) MODULE 2 HTML 5 FUNDAMENTALS HyperText > Douglas Engelbart (1925-2013) Tim Berners-Lee's proposal In March 1989, Tim Berners- Lee submitted a proposal for an information management system to his boss,

More information

Course 20480: Programming in HTML5 with JavaScript and CSS3

Course 20480: Programming in HTML5 with JavaScript and CSS3 Course 20480: Programming in HTML5 with JavaScript and CSS3 Overview About this course This course provides an introduction to HTML5, CSS3, and JavaScript. This course helps students gain basic HTML5/CSS3/JavaScript

More information

COURSE 20480B: PROGRAMMING IN HTML5 WITH JAVASCRIPT AND CSS3

COURSE 20480B: PROGRAMMING IN HTML5 WITH JAVASCRIPT AND CSS3 ABOUT THIS COURSE This course provides an introduction to HTML5, CSS3, and JavaScript. This course helps students gain basic HTML5/CSS3/JavaScript programming skills. This course is an entry point into

More information

16. HTML5, HTML Graphics, & HTML Media 웹프로그래밍 2016 년 1 학기 충남대학교컴퓨터공학과

16. HTML5, HTML Graphics, & HTML Media 웹프로그래밍 2016 년 1 학기 충남대학교컴퓨터공학과 16. HTML5, HTML Graphics, & HTML Media 웹프로그래밍 2016 년 1 학기 충남대학교컴퓨터공학과 목차 HTML5 Introduction HTML5 Browser Support HTML5 Semantic Elements HTML5 Canvas HTML5 SVG HTML5 Multimedia 2 HTML5 Introduction What

More information

Programming in HTML5 with JavaScript and CSS3

Programming in HTML5 with JavaScript and CSS3 Programming in HTML5 with JavaScript and CSS3 20480B; 5 days, Instructor-led Course Description This course provides an introduction to HTML5, CSS3, and JavaScript. This course helps students gain basic

More information

HTML5. HTML5 Introduction. Form Input Types. Semantic Elements. Form Attributes. Form Elements. Month Number Range Search Tel Url Time Week

HTML5. HTML5 Introduction. Form Input Types. Semantic Elements. Form Attributes. Form Elements. Month Number Range Search Tel Url Time Week WEB DESIGNING HTML HTML - Introduction HTML - Elements HTML - Tags HTML - Text HTML - Formatting HTML - Pre HTML - Attributes HTML - Font HTML - Text Links HTML - Comments HTML - Lists HTML - Images HTML

More information

HTML5 MOCK TEST HTML5 MOCK TEST I

HTML5 MOCK TEST HTML5 MOCK TEST I http://www.tutorialspoint.com HTML5 MOCK TEST Copyright tutorialspoint.com This section presents you various set of Mock Tests related to HTML5 Framework. You can download these sample mock tests at your

More information

Basics of Web Technologies

Basics of Web Technologies Dear Student, Based upon your enquiry we are pleased to send you the course curriculum for Web Designing Given below is the brief description for the course you are looking for: Introduction to Web Technologies

More information

The course also includes an overview of some of the most popular frameworks that you will most likely encounter in your real work environments.

The course also includes an overview of some of the most popular frameworks that you will most likely encounter in your real work environments. Web Development WEB101: Web Development Fundamentals using HTML, CSS and JavaScript $2,495.00 5 Days Replay Class Recordings included with this course Upcoming Dates Course Description This 5-day instructor-led

More information

Web Development 20480: Programming in HTML5 with JavaScript and CSS3. Upcoming Dates. Course Description. Course Outline

Web Development 20480: Programming in HTML5 with JavaScript and CSS3. Upcoming Dates. Course Description. Course Outline Web Development 20480: Programming in HTML5 with JavaScript and CSS3 Learn how to code fully functional web sites from the ground up using best practices and web standards with or without an IDE! This

More information

Varargs Training & Software Development Centre Private Limited, Module: HTML5, CSS3 & JavaScript

Varargs Training & Software Development Centre Private Limited, Module: HTML5, CSS3 & JavaScript PHP Curriculum Module: HTML5, CSS3 & JavaScript Introduction to the Web o Explain the evolution of HTML o Explain the page structure used by HTML o List the drawbacks in HTML 4 and XHTML o List the new

More information

Developer's HTML5. Cookbook. AAddison-Wesley. Chuck Hudson. Tom Leadbetter. Upper Saddle River, NJ Boston Indianapolis San Francisco

Developer's HTML5. Cookbook. AAddison-Wesley. Chuck Hudson. Tom Leadbetter. Upper Saddle River, NJ Boston Indianapolis San Francisco HTML5 Developer's Cookbook Chuck Hudson Tom Leadbetter AAddison-Wesley Upper Saddle River, NJ Boston Indianapolis San Francisco New York Toronto Montreal London Munich Paris Madrid Capetown Sydney Tokyo

More information

HTML 5: Fact and Fiction Nathaniel T. Schutta

HTML 5: Fact and Fiction Nathaniel T. Schutta HTML 5: Fact and Fiction Nathaniel T. Schutta Who am I? Nathaniel T. Schutta http://www.ntschutta.com/jat/ @ntschutta Foundations of Ajax & Pro Ajax and Java Frameworks UI guy Author, speaker, teacher

More information

GRAPHIC WEB DESIGNER PROGRAM

GRAPHIC WEB DESIGNER PROGRAM NH128 HTML Level 1 24 Total Hours COURSE TITLE: HTML Level 1 COURSE OVERVIEW: This course introduces web designers to the nuts and bolts of HTML (HyperText Markup Language), the programming language used

More information

Introduction to WEB PROGRAMMING

Introduction to WEB PROGRAMMING Introduction to WEB PROGRAMMING Web Languages: Overview HTML CSS JavaScript content structure look & feel transitions/animation s (CSS3) interaction animation server communication Full-Stack Web Frameworks

More information

Programming in HTML5 with JavaScript and CSS3

Programming in HTML5 with JavaScript and CSS3 20480 - Programming in HTML5 with JavaScript and CSS3 Duration: 5 days Course Price: $2,975 Software Assurance Eligible Course Description Course Overview This training course provides an introduction

More information

HTML CS 4640 Programming Languages for Web Applications

HTML CS 4640 Programming Languages for Web Applications HTML CS 4640 Programming Languages for Web Applications 1 Anatomy of (Basic) Website Your content + HTML + CSS = Your website structure presentation A website is a way to present your content to the world,

More information

1.7 Uniform Resource Identifiers and Domain Names 13 URIs and URLs 13 Domain Names 13

1.7 Uniform Resource Identifiers and Domain Names 13 URIs and URLs 13 Domain Names 13 Chapter 1 Introduction to the Internet and World Wide Web 1 1.1 The Internet and the Web 2 The Internet 2 Birth of the Internet 2 Growth of the Internet 2 Birth of the Web 2 The First Graphical Browser

More information

WEB DESIGNING COURSE SYLLABUS

WEB DESIGNING COURSE SYLLABUS F.A. Computer Point #111 First Floor, Mujaddadi Estate/Prince Hotel Building, Opp: Okaz Complex, Mehdipatnam, Hyderabad, INDIA. Ph: +91 801 920 3411, +91 92900 93944 040 6662 6601 Website: www.facomputerpoint.com,

More information

CompuScholar, Inc. Alignment to Utah's Web Development I Standards

CompuScholar, Inc. Alignment to Utah's Web Development I Standards Course Title: KidCoder: Web Design Course ISBN: 978-0-9887070-3-0 Course Year: 2015 CompuScholar, Inc. Alignment to Utah's Web Development I Standards Note: Citation(s) listed may represent a subset of

More information

Jim Jackson II Ian Gilman

Jim Jackson II Ian Gilman Single page web apps, JavaScript, and semantic markup Jim Jackson II Ian Gilman FOREWORD BY Scott Hanselman MANNING contents 1 HTML5 foreword xv preface xvii acknowledgments xx about this book xxii about

More information

UI Course HTML: (Html, CSS, JavaScript, JQuery, Bootstrap, AngularJS) Introduction. The World Wide Web (WWW) and history of HTML

UI Course HTML: (Html, CSS, JavaScript, JQuery, Bootstrap, AngularJS) Introduction. The World Wide Web (WWW) and history of HTML UI Course (Html, CSS, JavaScript, JQuery, Bootstrap, AngularJS) HTML: Introduction The World Wide Web (WWW) and history of HTML Hypertext and Hypertext Markup Language Why HTML Prerequisites Objective

More information

State of the Open Web. Brad Neuberg, Google

State of the Open Web. Brad Neuberg, Google State of the Open Web Brad Neuberg, Google http://flickr.com/photos/jamespaullong/164875156/ Who is this guy? Ajax Image CC: jopemoro/flickr Who is this guy? Ajax Image CC: jopemoro/flickr Ajax Who is

More information

Chapter 1 Getting Started with HTML 5 1. Chapter 2 Introduction to New Elements in HTML 5 21

Chapter 1 Getting Started with HTML 5 1. Chapter 2 Introduction to New Elements in HTML 5 21 Table of Contents Chapter 1 Getting Started with HTML 5 1 Introduction to HTML 5... 2 New API... 2 New Structure... 3 New Markup Elements and Attributes... 3 New Form Elements and Attributes... 4 Geolocation...

More information

20480B: Programming in HTML5 with JavaScript and CSS3

20480B: Programming in HTML5 with JavaScript and CSS3 20480B: Programming in HTML5 with JavaScript and CSS3 Course Details Course Code: Duration: Notes: 20480B 5 days This course syllabus should be used to determine whether the course is appropriate for the

More information

Webgurukul Web Designing Course

Webgurukul Web Designing Course Webgurukul Web Designing Course Take One step towards IT profession with us Web Designing Course 1. HTML 5 Introduction > W3C and W3C Member > HTML Basics > What is Web HTML Basic > Introduction > Parts

More information

PHP,HTML5, CSS3, JQUERY SYLLABUS

PHP,HTML5, CSS3, JQUERY SYLLABUS PHP,HTML5, CSS3, JQUERY SYLLABUS AAvhdvchdvchdvhdh HTML HTML - Introduction HTML - Elements HTML - Tags HTML - Text HTML - Formatting HTML - Pre HTML - Attributes HTML - Font HTML - Text Links HTML - Comments

More information

Full Stack Web Developer

Full Stack Web Developer Full Stack Web Developer S.NO Technologies 1 HTML5 &CSS3 2 JavaScript, Object Oriented JavaScript& jquery 3 PHP&MYSQL Objective: Understand the importance of the web as a medium of communication. Understand

More information

HTML5 - INTERVIEW QUESTIONS

HTML5 - INTERVIEW QUESTIONS HTML5 - INTERVIEW QUESTIONS http://www.tutorialspoint.com/html5/html5_interview_questions.htm Copyright tutorialspoint.com Dear readers, these HTML5 Interview Questions have been designed specially to

More information

[PACKT] HTML5, CSS3, and jquery. Dreamweaver CS5.5 Mobile. and Web Development with

[PACKT] HTML5, CSS3, and jquery. Dreamweaver CS5.5 Mobile. and Web Development with Dreamweaver CS5.5 Mobile and Web Development with HTML5, CSS3, and jquery Harness the cutting edge features of Dreamweaver for mobile and web development David Karl ins [PACKT] PUBLISHING BIRMINGHAM -

More information

HTML5. Language of the Modern Web. By: Mayur Agrawal. Copyright TIBCO Software Inc.

HTML5. Language of the Modern Web. By: Mayur Agrawal. Copyright TIBCO Software Inc. HTML5 Language of the Modern Web By: Mayur Agrawal Copyright 2000-2015 TIBCO Software Inc. Content Exploring prior standards Why HTML5? HTML5 vs HTML4 Key Features of HTML5 HTML5 and Technical Writing

More information

Etanova Enterprise Solutions

Etanova Enterprise Solutions Etanova Enterprise Solutions Front End Development» 2018-09-23 http://www.etanova.com/technologies/front-end-development Contents HTML 5... 6 Rich Internet Applications... 6 Web Browser Hardware Acceleration...

More information

20480C: Programming in HTML5 with JavaScript and CSS3. Course Code: 20480C; Duration: 5 days; Instructor-led. JavaScript code.

20480C: Programming in HTML5 with JavaScript and CSS3. Course Code: 20480C; Duration: 5 days; Instructor-led. JavaScript code. 20480C: Programming in HTML5 with JavaScript and CSS3 Course Code: 20480C; Duration: 5 days; Instructor-led WHAT YOU WILL LEARN This course provides an introduction to HTML5, CSS3, and JavaScript. This

More information

CSS Futures. Web Development

CSS Futures. Web Development CSS Futures Web Development CSS Futures CSS3 CSS Preprocessors: SASS & LESS CSS Frameworks CSS3 CSS3 is the latest standard for CSS Combined with HTML5, CSS3 makes it possible to create highly interactive

More information

HTML5, CSS3, JQUERY SYLLABUS

HTML5, CSS3, JQUERY SYLLABUS HTML5, CSS3, JQUERY SYLLABUS AAvhdvchdvchdvhdh HTML HTML - Introduction HTML - Elements HTML - Tags HTML - Text HTML - Formatting HTML - Pre HTML - Attributes HTML - Font HTML - Text Links HTML - Comments

More information

Overview

Overview HTML4 & HTML5 Overview Basic Tags Elements Attributes Formatting Phrase Tags Meta Tags Comments Examples / Demos : Text Examples Headings Examples Links Examples Images Examples Lists Examples Tables Examples

More information

Styles, Style Sheets, the Box Model and Liquid Layout

Styles, Style Sheets, the Box Model and Liquid Layout Styles, Style Sheets, the Box Model and Liquid Layout This session will guide you through examples of how styles and Cascading Style Sheets (CSS) may be used in your Web pages to simplify maintenance of

More information

Website Development with HTML5, CSS and Bootstrap

Website Development with HTML5, CSS and Bootstrap Contact Us 978.250.4983 Website Development with HTML5, CSS and Bootstrap Duration: 28 hours Prerequisites: Basic personal computer skills and basic Internet knowledge. Course Description: This hands on

More information

Understanding this structure is pretty straightforward, but nonetheless crucial to working with HTML, CSS, and JavaScript.

Understanding this structure is pretty straightforward, but nonetheless crucial to working with HTML, CSS, and JavaScript. Extra notes - Markup Languages Dr Nick Hayward HTML - DOM Intro A brief introduction to HTML's document object model, or DOM. Contents Intro What is DOM? Some useful elements DOM basics - an example References

More information

Mobile MOUSe WEB SITE DESIGN ONLINE COURSE OUTLINE

Mobile MOUSe WEB SITE DESIGN ONLINE COURSE OUTLINE Mobile MOUSe WEB SITE DESIGN ONLINE COURSE OUTLINE COURSE TITLE WEB SITE DESIGN COURSE DURATION 19 Hours of Interactive Training COURSE OVERVIEW In this 7 session course Debbie will take you through the

More information

8/19/2018. Web Development & Design Foundations with HTML5. Learning Objectives (1 of 2) Learning Objectives (2 of 2) Helper Applications & Plug-Ins

8/19/2018. Web Development & Design Foundations with HTML5. Learning Objectives (1 of 2) Learning Objectives (2 of 2) Helper Applications & Plug-Ins Web Development & Design Foundations with HTML5 Ninth Edition Chapter 11 Web Multimedia and Interactivity Slides in this presentation contain hyperlinks. JAWS users should be able to get a list of links

More information

WA1925 Enterprise Web Development using HTML5 EVALUATION ONLY

WA1925 Enterprise Web Development using HTML5 EVALUATION ONLY WA1925 Enterprise Web Development using HTML5 Web Age Solutions Inc. USA: 1-877-517-6540 Canada: 1-866-206-4644 Web: http://www.webagesolutions.com The following terms are trademarks of other companies:

More information

Lab 1: Introducing HTML5 and CSS3

Lab 1: Introducing HTML5 and CSS3 CS220 Human- Computer Interaction Spring 2015 Lab 1: Introducing HTML5 and CSS3 In this lab we will cover some basic HTML5 and CSS, as well as ways to make your web app look and feel like a native app.

More information

Web Designing Course

Web Designing Course Web Designing Course Course Summary: HTML, CSS, JavaScript, jquery, Bootstrap, GIMP Tool Course Duration: Approx. 30 hrs. Pre-requisites: Familiarity with any of the coding languages like C/C++, Java etc.

More information

Friday, January 18, 13. : Now & in the Future

Friday, January 18, 13. : Now & in the Future : Now & in the Future CSS3 is Modular Can we use it now? * Use it for non-critical things on the experience layer. * Check sites that maintain tables showing browser support like http://www.findmebyip.com/litmus

More information

PIC 40A. Lecture 4b: New elements in HTML5. Copyright 2011 Jukka Virtanen UCLA 1 04/09/14

PIC 40A. Lecture 4b: New elements in HTML5. Copyright 2011 Jukka Virtanen UCLA 1 04/09/14 PIC 40A Lecture 4b: New elements in HTML5 04/09/14 Copyright 2011 Jukka Virtanen UCLA 1 Sectioning elements HTML 5 introduces a lot of sectioning elements. Meant to give more meaning to your pages. People

More information

An Overview of. Eric Bollens ebollens AT ucla.edu Mobile Web Framework Architect UCLA Office of Information Technology

An Overview of. Eric Bollens ebollens AT ucla.edu Mobile Web Framework Architect UCLA Office of Information Technology An Overview of Eric Bollens ebollens AT ucla.edu Mobile Web Framework Architect UCLA Office of Information Technology August 23, 2011 1. Design Principles 2. Architectural Patterns 3. Building for Degradation

More information

Using CSS for page layout

Using CSS for page layout Using CSS for page layout Advantages: Greater typographic control Style is separate from structure Potentially smaller documents Easier site maintenance Increased page layout control Increased accessibility

More information

Lecture : 3. Practical : 2. Course Credit. Tutorial : 0. Total : 5. Course Learning Outcomes

Lecture : 3. Practical : 2. Course Credit. Tutorial : 0. Total : 5. Course Learning Outcomes Course Title Course Code WEB DESIGNING TECHNOLOGIES DCE311 Lecture : 3 Course Credit Practical : Tutorial : 0 Total : 5 Course Learning Outcomes At end of the course, students will be able to: Understand

More information

Introduction to HTML5

Introduction to HTML5 Introduction to HTML5 History of HTML 1991 HTML first published 1995 1997 1999 2000 HTML 2.0 HTML 3.2 HTML 4.01 XHTML 1.0 After HTML 4.01 was released, focus shifted to XHTML and its stricter standards.

More information

WHAT IS WEBKIT? COPYRIGHTED MATERIAL SMASHING WEBKIT CHAPTER 1

WHAT IS WEBKIT? COPYRIGHTED MATERIAL SMASHING WEBKIT CHAPTER 1 1 WHAT IS WEBKIT? WEBKIT IS AN open-source rendering engine designed to display web pages. It powers Google Chrome and Safari as well as a variety of mobile devices such as iphone, ipad, and Android phones

More information

IGME-330. Rich Media Web Application Development I Week 1

IGME-330. Rich Media Web Application Development I Week 1 IGME-330 Rich Media Web Application Development I Week 1 Developing Rich Media Apps Today s topics Tools we ll use what s the IDE we ll be using? (hint: none) This class is about Rich Media we ll need

More information

JSN EasySlider Configuration Manual

JSN EasySlider Configuration Manual JSN EasySlider Configuration Manual Introduction Product Overview JSN EasySlider JSN EasySlider is the cutting-edge way to present content on website: Informative - Impressive - Interactive. It helps you

More information

HTML5 in Action ROB CROWTHER JOE LENNON ASH BLUE GREG WANISH MANNING SHELTER ISLAND

HTML5 in Action ROB CROWTHER JOE LENNON ASH BLUE GREG WANISH MANNING SHELTER ISLAND HTML5 in Action ROB CROWTHER JOE LENNON ASH BLUE GREG WANISH MANNING SHELTER ISLAND brief contents PART 1 INTRODUCTION...1 1 HTML5: from documents to applications 3 PART 2 BROWSER-BASED APPS...35 2 Form

More information

HTML & CSS. SWE 432, Fall 2017 Design and Implementation of Software for the Web

HTML & CSS. SWE 432, Fall 2017 Design and Implementation of Software for the Web HTML & CSS SWE 432, Fall 2017 Design and Implementation of Software for the Web HTML: HyperText Markup Language LaToza Language for describing structure of a document Denotes hierarchy of elements What

More information

Sections and Articles

Sections and Articles Advanced PHP Framework Codeigniter Modules HTML Topics Introduction to HTML5 Laying out a Page with HTML5 Page Structure- New HTML5 Structural Tags- Page Simplification HTML5 - How We Got Here 1.The Problems

More information

INTRODUCTION TO HTML5! HTML5 Page Structure!

INTRODUCTION TO HTML5! HTML5 Page Structure! INTRODUCTION TO HTML5! HTML5 Page Structure! What is HTML5? HTML5 will be the new standard for HTML, XHTML, and the HTML DOM. The previous version of HTML came in 1999. The web has changed a lot since

More information

IBM Forms V8.0 Custom Themes IBM Corporation

IBM Forms V8.0 Custom Themes IBM Corporation IBM Forms V8.0 Custom Themes Agenda 2 Overview Class Names How to Use Best Practice Styling Form Items Test Custom CSS Sample Overview 3 To create custom theme you must be familiar with the basic concept

More information

Full Stack Web Developer

Full Stack Web Developer Full Stack Web Developer Course Contents: Introduction to Web Development HTML5 and CSS3 Introduction to HTML5 Why HTML5 Benefits Of HTML5 over HTML HTML 5 for Making Dynamic Page HTML5 for making Graphics

More information

Advanced Dreamweaver CS6

Advanced Dreamweaver CS6 Advanced Dreamweaver CS6 Overview This advanced Dreamweaver CS6 training class teaches you to become more efficient with Dreamweaver by taking advantage of Dreamweaver's more advanced features. After this

More information

Content Elements. Contents. Row

Content Elements. Contents. Row Content Elements Created by Raitis S, last modified on Feb 09, 2016 This is a list of 40+ available content elements that can be placed on the working canvas or inside of the columns. Think of them as

More information

Mobile Site Development

Mobile Site Development Mobile Site Development HTML Basics What is HTML? Editors Elements Block Elements Attributes Make a new line using HTML Headers & Paragraphs Creating hyperlinks Using images Text Formatting Inline styling

More information

WebKit ; FOR : DUMMIES. by Chris Minnick WILEY. John Wiley & Sons, Inc.

WebKit ; FOR : DUMMIES. by Chris Minnick WILEY. John Wiley & Sons, Inc. WebKit ; FOR : DUMMIES by Chris Minnick WILEY John Wiley & Sons, Inc. Table of Contents Introduction 7 Why I Love WebKit, and You Should Too 1 Who Should Read This Book 2 Conventions Used in This Book

More information

Web Standards Mastering HTML5, CSS3, and XML

Web Standards Mastering HTML5, CSS3, and XML Web Standards Mastering HTML5, CSS3, and XML Leslie F. Sikos, Ph.D. orders-ny@springer-sbm.com www.springeronline.com rights@apress.com www.apress.com www.apress.com/bulk-sales www.apress.com Contents

More information

This course is designed for web developers that want to learn HTML5, CSS3, JavaScript and jquery.

This course is designed for web developers that want to learn HTML5, CSS3, JavaScript and jquery. HTML5/CSS3/JavaScript Programming Course Summary Description This class is designed for students that have experience with basic HTML concepts that wish to learn about HTML Version 5, Cascading Style Sheets

More information

CS144 Notes: Web Standards

CS144 Notes: Web Standards CS144 Notes: Web Standards Basic interaction Example: http://www.youtube.com - Q: what is going on behind the scene? * Q: What entities are involved in this interaction? * Q: What is the role of each entity?

More information

('cre Learning that works for Utah STRANDS AND STANDARDS WEB DEVELOPMENT 1

('cre Learning that works for Utah STRANDS AND STANDARDS WEB DEVELOPMENT 1 STRANDS AND STANDARDS Course Description Web Development is a course designed to guide students in a project-based environment, in the development of up-to-date concepts and skills that are used in the

More information

Microsoft Programming in HTML5 with JavaScript and CSS3

Microsoft Programming in HTML5 with JavaScript and CSS3 1800 ULEARN (853 276) www.ddls.com.au Microsoft 20480 - Programming in HTML5 with JavaScript and CSS3 Length 5 days Price $4510.00 (inc GST) Version B Overview This course provides an introduction to HTML5,

More information

Introduction to HTML 5. Brad Neuberg Developer Programs, Google

Introduction to HTML 5. Brad Neuberg Developer Programs, Google Introduction to HTML 5 Brad Neuberg Developer Programs, Google The Web Platform is Accelerating User Experience XHR CSS DOM HTML iphone 2.2: Nov 22, 2008 canvas app cache database SVG Safari 4.0b: Feb

More information

20480B - Version: 1. Programming in HTML5 with JavaScript and CSS3

20480B - Version: 1. Programming in HTML5 with JavaScript and CSS3 20480B - Version: 1 Programming in HTML5 with JavaScript and CSS3 Programming in HTML5 with JavaScript and CSS3 20480B - Version: 1 5 days Course Description: This course provides an introduction to HTML5,

More information

UX/UI Controller Component

UX/UI Controller Component http://www.egovframe.go.kr/wiki/doku.php?id=egovframework:mrte:ux_ui:ux_ui_controller_component_3.5 UX/UI Controller Component Outline egovframework offers the user an experience to enjoy one of the most

More information

Programmazione Web a.a. 2017/2018 HTML5

Programmazione Web a.a. 2017/2018 HTML5 Programmazione Web a.a. 2017/2018 HTML5 PhD Ing.Antonino Raucea antonino.raucea@dieei.unict.it 1 Introduzione HTML HTML is the standard markup language for creating Web pages. HTML stands for Hyper Text

More information

Next... Next... Handling the past What s next - standards and browsers What s next - applications and technology

Next... Next... Handling the past What s next - standards and browsers What s next - applications and technology Next... Handling the past What s next - standards and browsers What s next - applications and technology Next... Handling the past What s next - standards and browsers What s next - applications and technology

More information

NEW WEBMASTER HTML & CSS FOR BEGINNERS COURSE SYNOPSIS

NEW WEBMASTER HTML & CSS FOR BEGINNERS COURSE SYNOPSIS NEW WEBMASTER HTML & CSS FOR BEGINNERS COURSE SYNOPSIS LESSON 1 GETTING STARTED Before We Get Started; Pre requisites; The Notepad++ Text Editor; Download Chrome, Firefox, Opera, & Safari Browsers; The

More information

MTA EXAM HTML5 Application Development Fundamentals

MTA EXAM HTML5 Application Development Fundamentals MTA EXAM 98-375 HTML5 Application Development Fundamentals 98-375: OBJECTIVE 3 Format the User Interface by Using CSS LESSON 3.4 Manage the graphical interface by using CSS OVERVIEW Lesson 3.4 In this

More information

CSS for Page Layout Robert K. Moniot 1

CSS for Page Layout Robert K. Moniot 1 CSS for Page Layout 2015 Robert K. Moniot 1 OBJECTIVES In this unit, you will learn: How to use style sheets for layout Controlling text flow, margins, borders, and padding Controlling visibility of elements

More information

What s New in QuarkXPress 2018

What s New in QuarkXPress 2018 What s New in QuarkXPress 2018 Contents What s New in QuarkXPress 2018...1 Digital publishing...2 Export as Android App...2 HTML5 enhancements...3 Configuration changes...5 Graphics...7 Transparency blend

More information

PASS4TEST. IT Certification Guaranteed, The Easy Way! We offer free update service for one year

PASS4TEST. IT Certification Guaranteed, The Easy Way!   We offer free update service for one year PASS4TEST IT Certification Guaranteed, The Easy Way! \ http://www.pass4test.com We offer free update service for one year Exam : 9A0-046 Title : Adobe GoLive CS2 ACE Exam Vendors : Adobe Version : DEMO

More information

What is HTML5? The previous version of HTML came in The web has changed a lot since then.

What is HTML5? The previous version of HTML came in The web has changed a lot since then. What is HTML5? HTML5 will be the new standard for HTML, XHTML, and the HTML DOM. The previous version of HTML came in 1999. The web has changed a lot since then. HTML5 is still a work in progress. However,

More information

Webgurukul Web Development Course

Webgurukul Web Development Course Webgurukul Web Development Course Take One step towards IT profession with us 1. Web Development Course 1. HTML 5 Introduction > W3C and W3C Member > HTML Basics > What is Web HTML Basic > Parts in HTML

More information

WHAT S ALL THE FUSS ABOUT HTML5? Mark DuBois Nov. 12, 2010

WHAT S ALL THE FUSS ABOUT HTML5? Mark DuBois Nov. 12, 2010 WHAT S ALL THE FUSS ABOUT HTML5? Mark DuBois Nov. 12, 2010 Disclaimer HTML5 is a work in progress Not yet an official W3C recommendation This information is current as of mid-october, 2010 (subject to

More information

CSC309 Winter Lecture 2. Larry Zhang

CSC309 Winter Lecture 2. Larry Zhang CSC309 Winter 2016 Lecture 2 Larry Zhang 1 Announcements Assignment 1 is out, due Jan 25, 10pm. Start Early! Work in groups of 2, make groups on MarkUs. Make sure you can login to MarkUs, if not let me

More information

WEB DESIGNING CURRICULUM

WEB DESIGNING CURRICULUM WEB DESIGNING CURRICULUM Introduction to Web Technologies Careers in Web Technologies and Job Roles How the Website Works? Client and Server Scripting Languages Difference between a Web Designer and Web

More information

CS7026 CSS3. CSS3 Graphics Effects

CS7026 CSS3. CSS3 Graphics Effects CS7026 CSS3 CSS3 Graphics Effects What You ll Learn We ll create the appearance of speech bubbles without using any images, just these pieces of pure CSS: The word-wrap property to contain overflowing

More information

Joomla! extension JSN EasySlider User Manual

Joomla! extension JSN EasySlider User Manual Joomla! extension JSN EasySlider User Manual (for JSN EasySlider 2.0.x) www.facebook.com/joomlashine www.twitter.com/joomlashine www.youtube.com/joomlashine This documentation is release under Creative

More information

Make a Website. A complex guide to building a website through continuing the fundamentals of HTML & CSS. Created by Michael Parekh 1

Make a Website. A complex guide to building a website through continuing the fundamentals of HTML & CSS. Created by Michael Parekh 1 Make a Website A complex guide to building a website through continuing the fundamentals of HTML & CSS. Created by Michael Parekh 1 Overview Course outcome: You'll build four simple websites using web

More information

Adobe Dreamweaver CS6 Digital Classroom

Adobe Dreamweaver CS6 Digital Classroom Adobe Dreamweaver CS6 Digital Classroom Osborn, J ISBN-13: 9781118124093 Table of Contents Starting Up About Dreamweaver Digital Classroom 1 Prerequisites 1 System requirements 1 Starting Adobe Dreamweaver

More information

QUICK REFERENCE GUIDE

QUICK REFERENCE GUIDE QUICK REFERENCE GUIDE New Selectors New Properties Animations 2D/3D Transformations Rounded Corners Shadow Effects Downloadable Fonts @ purgeru.deviantart.com WHAT IS HTML5? HTML5 is being developed as

More information

footer, header, nav, section. search. ! Better Accessibility.! Cleaner Code. ! Smarter Storage.! Better Interactions.

footer, header, nav, section. search. ! Better Accessibility.! Cleaner Code. ! Smarter Storage.! Better Interactions. By Sruthi!!!! HTML5 was designed to replace both HTML 4, XHTML, and the HTML DOM Level 2. It was specially designed to deliver rich content without the need for additional plugins. The current version

More information

Mobile Application Development

Mobile Application Development Android Native Application Development Mobile Application Development 1. Android Framework and Android Studio b. Android Software Layers c. Android Libraries d. Components of an Android Application e.

More information

HTML5 Application Development Fundamentals. Course Outline. HTML5 Application Development Fundamentals. ( Add-On ) 01 Aug 2018

HTML5 Application Development Fundamentals. Course Outline. HTML5 Application Development Fundamentals.   ( Add-On ) 01 Aug 2018 Course Outline HTML5 Application Development Fundamentals 01 Aug 2018 ( Add-On ) Contents 1. Course Objective 2. Pre-Assessment 3. Exercises, Quizzes, Flashcards & Glossary Number of Questions 4. Expert

More information

MS_ Programming in HTML5 with JavaScript and CSS3.

MS_ Programming in HTML5 with JavaScript and CSS3. Programming in HTML5 with JavaScript and CSS3 www.ked.com.mx Av. Revolución No. 374 Col. San Pedro de los Pinos, C.P. 03800, México, CDMX. Tel/Fax: 52785560 Por favor no imprimas este documento si no es

More information

Interview Question & Answers

Interview Question & Answers BASIC Interview Question & Answers OUR TRAINING YOUR CARRER QUESTIONS & ANSWERS OF HTML Ques: - What are the five possible values for position? Ans: - Values for position: static, relative, absolute, fixed,

More information

LECTURE 3. Web-Technology

LECTURE 3. Web-Technology LECTURE 3 Web-Technology Household issues Blackboard o Discussion Boards Looking for a Group Questions about Web-Technologies o Assignment 1 submission Announcement e-mail? Have to be in a group Homework

More information