Tag Archives: FRAME WORKS

SUBSCRIBE TO UI STREET

Optimize Mix and match typography in web design

Optimize Mix and Match Typography in Web Design

Mix and Match Typography in Web Design
Technology advancements has popularized a typography style in websites. The ability of selecting the appropriate font has broaden to the extreme to make websites attractive. Mix and Match typography has become the necessary features of web design for creating the best user experience. To improve the website look and feel in long run, selecting the right typographic plays the key role to leave viewers attractive. After years of working, many customers are focusing and pushing designers to go with mix and match typography style of usage in their websites.

With emergence of new trends popping up for better readability, there is raise in usage of usage of typography in web design. Most notably, retro typography on vintage style websites is quiet powerful across the web. This trend has been around for a while but now we are seeing this in full force for websites who want to set up their brand in bold and visually interesting ways. This Mix and Match typography relies on the designer’s ability to choose the right fonts to match not just the message, but the other typographic styles in use.

Some designers usually stick to one font to what they like, but it is good to mix and match fonts with the flow of website without effecting the overall look. Think of not to use too-small or too loopy fonts that are hard to read and look for long periods of time. Though there are several kinds of fonts available, look for the right mix and match typography that fits the mood and aesthetic of your design. Try out new things to achieve a desired effect for your website allowing viewers with maximum readability.

SUBSCRIBE TO UI STREET

Benefits of using new Frameworks-LESS and Sass

Benefits of using new Frameworks-LESS and Sass

Benefits of using new Frameworks-LESS, Sass

There are numerous CSS frameworks that are used to develop web applications such as Sass and LESS. They are both CSS based frameworks but the complexity of app handled by these frameworks are different. Each of these frameworks is suited for different web app development. Here I have provided a brief introduction between these frameworks and its features.

Sass is an extension of CSS3, adding nested rules, variables, mixins, selector inheritance, and more. It’s translated to well-formatted, standard CSS using the command line tool or a web-framework plugin. Sass has two syntaxes. The older syntax, called “the indented syntax” uses a syntax similar to Haml. It makes use of indentation to separate code blocks and newline characters to separate rules. The newer syntax, “SCSS” uses block formatting like that of CSS. It uses curly brackets to denote code blocks and semicolons to separate lines within a block. The indented syntax and SCSS files are generally given the extensions .sass and .scss respectively. Both these syntaxes are fully supported – there is no functional difference between them.

Features of Sass:

  • Fully CSS3-compatible
  • Language extensions such as variables, nesting, and mixins
  • Many useful functions for manipulating colors and other values
  • Advanced features like control directives for libraries
  • Well-formatted, customizable output
  • Firebug integration
  • Syntax

SASS is an excellent scripting language for web app development. But using it with frameworks makes web development even easier and enjoyable. One great thing about SASS is it has built in CSS color math. One can automatically change the color of the menu and the hover state manually. Another great way to use SASS is you can organize all of your CSS into a single file. It simply adds more power and better organizational tools, making it an easy choice as a go-to replacement.

LESS is a dynamic style sheet language that allows developers to reuse CSS elements and write LESS code with the same semantics. The LESS compiler is written in JavaScript, so you can just include it in your page along with your LESS stylesheet. It has everything that CSS is missing like Variables, Mixins, Nested rules, Operators and functions, Namespaces for grouping variables and mixins etc.

The similarity between these SCSS and LESS frameworks is its features and functions. But they slightly differ in syntax. They make web app development easier for the programmers and facilitate them to create intriguing web applications. SASS is only accessible to Ruby/Rails environments, while LessCSS can be used by anyone, with any languages, or just plain HTML website. For developers adopting these frameworks, it is essential to understand the paradigm shift these frameworks bring to client side application development.