Course Details
- Category
- Web Designing Training
- Mode of Training
- Online/Offline
- Duration
- 6 months
- Fees
- ₹ 2000
Course Features
Instructor led Sessions
Real-life Case Studies
Assignment
Certification
Instructor led Sessions
HTML5 Training
Oranium Tech introducing some amazing content on HTML 5. HTML 5 is a standard for structuring and presenting content on the Web. It incorporates features such as geolocation, video playback and dragand-drop. HTML 5 allows developers to create rich internet applications without the need for third party APIs and browser plug-ins.
Course Syllabus
• HTML 5 comes with many new content-specific elements, like the article, footer, header, nav, and section.
• Improvements to HTML web forms where new attributes have been introduced for input tags with support for form controls like calendar, date, time, email, URL, search, etc…
• Introduction of the canvas, which supports a two-dimensional drawing surface that you can program with JavaScript.
• Embedding audio or video to web pages without third-party plugins.
• Choice for the visitors to share their physical location with your web application. (Geo Location)
• CSS Support for additional selectors, Drop shadows, Rounded corners, multiple backgrounds, Gradients, Animation, Transparency and many more…
• The CSS3 specification is still under development by W3C. However, many of the new CSS3 properties have been implemented in modern browsers like New Selectors, Backgrounds and Borders, Gradient Effects, Text Effects and Fonts, Transformations, Transitions, Animations, Multiple Column Layouts.
• basic understanding of html and its tags
In this module, you will learn the evolution of html5. HTML5 is the latest standard for HTML. HTML5 was designed to replace both HTML 4, XHTML, and the HTML DOM Level 2.
• Limitations of HTML 4
• Introduction and Advantages of HTML 5
• First HTML5 Document
• Overview of New Features of HTML5
• List of HTML 4.01 elements removed from HTML5
In this module, you will learn what semantic elements is and how to use it. A semantic element clearly describes its meaning to both the browser and the developer.
• Header
• Navigation
• Section & Articles
• Footer
• Aside and more
In this module, you will learn about html web forms, HTML form on a web page allows a user to enter data that is sent to a server for processing. Forms can resemble paper or database forms because web users fill out the forms using checkboxes, radio buttons, or text fields.
• HTML 5 Global Attributes
• Displaying a Search Input Field
• Contact Information Input Fields
• Utilizing Date and Time Input Fields
• Number Inputs
• Selecting from a Range of Numbers
• Selecting Colors
• Creating an Editable Drop-Down
• Requiring a Form Field
• Autofocusing a Form Field
• Displaying Placeholder Text
• Disabling Autocomplete
• Restricting Values
In this module you will learn about canvas, The HTML<canvas>element is used to draw graphics, on the fly, via JavaScript. The<canvas> element is only a container for graphics. You must use JavaScript to actually draw the graphics. Canvas has several methods for drawing paths, boxes, circles, text, and adding images. Overview of HTML5 Canvas
• History
• What Is a Canvas?
• Canvas Coordinates
• Registering the Canvas dimensions
• Drawing on Canvas with paths, curves, etc.
• Working with Solid colors, Gradients & Transparency
• Importing External Images & Setting the background
• Working with Color & Geometrical transformations
• Creating graphs & charts
• Working with Text
• Animating a Vertical Bar-Chart
• Fine tune animation with Acceleration & Easing.
• Working with Pixel Data
• CSS and Canvas
• Create High-Res, Retina-Display-Ready Media with Canvas
• Clipping Canvas drawings & saving them to a file.
• When Not to Use Canvas
• Fallback Content
• Implementing Canvas Security
• Ensuring backward compatibility Support of Canvas API to older versions of browsers
In this module you will learn about svg, svg stands for Scalable Vector Graphics and it is an SVG viewer then renders a language for describing 2D-graphics and graphical applications in XML and the XML. SVG is mostly useful for vector type diagrams like Pie charts; Two-dimensional graphs in an X, Y coordinate system etc.
• Overview of SVG
• Understanding SVG
• Scalable Graphics
• Creating 2D Graphics with SVG
• Adding SVG to a Page
• Simple Shapes
• Transforming SVG Elements
• Reusing Content
• Patterns and Gradients
• SVG Paths
• Using SVG Text
• Putting the Scene Together
• Building an Interactive Application with SVG
• Adding the CSS Styles
• Ensuring backward compatibility Support of SVG API to older versions of browsers
In this module, you will learn multimedia. HTML5 introduced two new elements that include playback functionality for supported media formats. The audio element can be used to add audio content to a web page.
• Adding Video & Audio to a page
• Supported Audio & Video formats
• Audio & Video codecs
• Loss & Lossless compression
• Media specific attributes Vs Global attributes
• Deployment challenges on Mobiles
• Converting Audio & Video to supported formats using open source & commercial software
• Using a Frame grabber
• Custom Controls, Seek bar, Progress bar with Javascript & CSS
• Applying CSS skins & transforms
• Working with multiple tracks, Subtitles & Captions with Captionator, Player & the Lean back Player
• Integrating Video with Canvas & SVG
• Applying Visual filters using Canvas & SVG
• Debugging, Browser support.
• Licensing issues.
• Ensuring backward compatibility Support of Media API’s to older versions of browsers
In this module you will learn web storage, web storage sometimes known as DOM storage (Document Object Model storage), provides web application software methods and protocols used for storing data in a web browser Goodbye cookies introducing Web Storage
• Browser Support
• Local Vs Session storage
• Using the HTML5 Web Storage API
• Setting and Retrieving Values
• Storing forms & caching events with local storage
• Storing & Accessing JSON data.
• Communicating Web Storage Updates
• Data Security
• Need more storage space – exploring Web SQL Database API & Indexed DB
• Creating a Grocery List with Web SQL DB
• Ensuring backward compatibility Support of Web Storage API to older versions of browsers
In this module, you will learn about geolocation. Geolocation is the identification or estimation of the real-world geographic location of an object, such as a radar source, mobile phone, or Internet-connected
computer terminal. Comparing Geolocation techniques in the past & modern day Geolocation
• Understanding the pillars of Geolocation. i.e., GPS/ IP Address/ Cell IDs/ Wi-Fi and Bluetooth
• LBS (Location based services)
• Mobile & Augmented reality applications, which consume geolocation service.
• Understanding Latitude, Longitude, Speed, Course & Accuracy
• Getting you current location
• Browser compatibility & Fallbacks.
• Reverse geocoding
• Mapping location
• Getting Distance & Directions between two places.
• Following a moving location
• Combing geolocation with google maps
• Triggering the Privacy Protection Mechanism
• Saving Geographical information
• Geolocation usage – Geo Marketing, Geo social, Geo-tagging, Geo social, Geo-tagging & Geo applications.
• Building a Real-Time Application with HTML5 Geolocation
• Ensuring backward compatibility Support of Geolocation API to older versions of browsers
In this module, you will learn about web working. A web worker is a JavaScript that runs in the background without affecting the performance of the page. You can continue to do whatever you want: clicking, selecting things, etc., while the web worker runs in the background.
• What are web workers?
• Possibilities & Limitations of web workers
• Inline, Dedicated & Shared Workers
• Creating a worker, Assign roles & deploying the same.
• Leveraging a Shared Worker
• Worker support in modern browsers
• Managing multiple workers
• Parsing data with workers
• Perform Heavy array computations
• Using timers in conjunction with worker
• Work with pixel manipulations
• Make twitter JSONP requests
• Connect to share workers at same time with multiple browser windows
• Transferable objects
• Debugging Your Workers
• Ensuring backward compatibility Support of Web Workers API to older versions of browsers
Server-sent events is a standard describing how servers can initiate data transmission towards clients once an initial client connection has been established. They are commonly used to send message updates or continuous data streams to a browser client and designed to enhance native, cross-browser streaming through a JavaScript API called Event Source.