HTML5 - It is a markup language used for describing contents and appearance of web pages. It is fifth and latest version of HTML.
- Provides great graphics and visual images by using canvas elements.
- Display videos on web pages without third party plugins.
- Local storage to accommodate large amount of information.
- Supports offline mode website.
- It can provide geographical location of website users.
- Helps in SEO through semantic enrichment
- No need to install any flash plugin.
- Can be used on client side as well as on server side.
- Functional programming language.
- Object oriented language.
- Its process for designing is open for the community.
- It makes customization very easy with flexible stylings and themes.
- All widgets are designed so as to provide elegant visual and interaction design.
- The jQuery UI API is very simple and intuitive.
- Widgets are even accessible to JS capable users who have disabilities like blindness or deafness.
- Independent of server technology.
- Makes webpage faster.
- No need to reload the complete website by pushing submit buttons.
- Sends only important information on the webpage to the server to develop faster and more interactive web applications.
- Helps using ajax technology.
- Built-in animation effects.
- Cross browser support.
- Very lightweight library.
- Capture variety of events like user clicking on a link.
- Extensibility through plugins.
- Effects and animations.
- JSON parsing.
- Encourages separation of JS and HTML.
CSS - Cascading Style Sheet is a style sheet language which adds value to presentation of a document by adding fonts, color, background images, height, width, lines, margins and many more.
- Creats animations using transition declaration and @keyframe rule.
- Clean layouts and good stylesheets by using advanced selectors.
- Use less HTML by using pseudo elements.
- Smooth transition between colors using gradients.
- Embed beautiful fonts by simply including a stylesheet.
- Build responsive websites with the help of media queries.
Semantic UI - The technology to make the web more intelligent and intuitive about how to serve user’s needs.
- Enables web page data to be understood by computers by extending web documents to data.
- Aggregates large amount of data.
- Understands relationships between pieces of contents.
- Organises data by building vocabularies (OWL) and knowledge organisation system (SKOS).
- Its query language SPARQL goes hand in hand with databases.
UI Kit - It is most often used framework to develop iOS applications. It is equivalent of Application Kit framework for OS X development.
- Open source framework to make the web look good.
- Used to write well-structured and extendable codes with the help of LESS and SASS.
- Contains simple to use and customize HTML, CSS and JS components.
- Provides great experience for mobiles and tablets using its mobile first approach.
Material Design - A UI kit developed by google that acts as a design language.
- Uses grid-based layouts, transitions, animations, padding and depth effects.
- It acts as a visual language which involves principles of good design.
- It develops a single underlying system which provides a unified experience across all platforms and device sizes.
- It is a three dimensional environment containing light, material and cast shadows.
Bootstrap - It is free and open source front end web framework for designing responsive websites and applications.
- Speeds up development process because of readymade blocks of code, cross-browser functionality and CSS-Less functionality.
- Creates mobile ready websites easily using ready made classes.
- Pairs designers with developers.
- Customizable i.e developers have choice to download custom version of bootstrap by selecting the features they want.
- It can be simply integrated with other platforms and frameworks on existing sites.
- Very simple in terms of API and design.
- Very flexible to structure an APP the way one wants.
- Provides benefits of reactive data binding and composable view components with an simple API.
- Builds large “Single page applications” using various tools and applications.
Angular JS - It is an open source web application framework for dynamic web pages.
- Hides most of the code of web application using two way data binding.
- Application is easier to develop using dependency injection subsystem.
- Helps to create custom widgets and decorate elements using directives.
- Makes testing of applications very easy.
- Follows Model-View-Controller architecture.
- Creates well-defined and organised structure using modules.
- Modifies data before presenting it to users using filters.
- Gets easily adopted with ease and convenience.
- Free and open source.
- Expands a function’s behaviour by simply wrapping it in another function by using decorators.
- Server side communication.
- Easily manage data across the whole application through FLUX library.
- Allows one to save keystrokes and load a subset of required module through destructive assignments.
Phonegap - Software development framework used to develop mobile applications.
- Open source and free.
- Allows user to develop apps using standard web APIs in all major mobile OS.
- Apps are future-proofed to work with browsers as they evolve.
- Allows to create app for each of the platform that one choose using a single code base.
Ionic - It is a free and open source SDK for mobile app development.
- It provides effective tools and libraries of HTML5, CSS and JS components.
- It provides great speed on all latest mobile devices by including practices like virtual DOM rendering, hardware accelerated transition and touch-optimized gestures.
- It is built on top of AngularJS and Apache Cordova.
- It is clean, simple and beautifully designed on all mobile devices and platform.
- It allows to share the app with anyone without uploading it on playstore.
- It provides hundreds of quality templates, add-ons and themes.
Hope this list would help you construct a website with a wonderful UI. Which tools and technologies do you use often to jazz up user interface and create a lasting experience for users? Do share your favorites in comments below. We would love to know and explore those.