Contents of this tutorial #

Practical web design using Photoshop


Introduction to web design using Photoshop


Setting Artboards


Setting the stage


Wireframing


Wireframing UI/UX for Mobile


Exporting Wireframes


Designing for Desktops


Preparing for Slicing


Final words

Interactive HTML5: Basics


Introduction to HTML


HTML4 vs. HTML5


Making your first HTML page


Tools to create HTML files


Base HTML Tags


Paragraph Tags


Break Tags


Header Tags


Bold and Italic Tags


Ordered and unordered Lists

Interactive HTML5: Advanced


Difference between Absolute Links and Relative Links


Hyperlinking to an external page


Hyperlinking to an email address


Hyperlinking to a file in your site


Playing and controlling audio


Playing and controlling video


Embedding a video


Whats is a Table - Pros and Cons


Table properties


Adding an iFrame


Adding an iFrame: Part 2


What is possible with a form using on HTML knowledge


Defining the form


Text fields and text areas


Radio buttons and check buttons


Data input and buttons


Proper file structure


Code commenting


Meta tags




Interactive CSS3: Basics


What is CSS? Why we need it?


What's new in CSS3


CSS Selectors, properties and attributes


ID Selectors


Class Selectors


Element Selectors


All Selectors


Inline style sheets


External Style sheets

Interactive CSS3: Advanced


The Box model


Adding Color


Working with fonts


Background images


Styling ID tags


Float and Clear


Block and inline elements


Positioning


Adding the elements

Interactive Bootstrap: Basic


Why Bootstrap?


Downloading Bootstrap


Adding Bootstrap in your site


Creating navigation: Part 1


Creating navigation: Part 2


Creating navigation: Part 3


Styling images


Creating the footer


Adding styled buttons



Unlock Offer