Today, I Discuss about differences between web designer and UI/UX designer, and why this is important?
It is highly important understanding difference between two and so you can better elaborate yourself. Use the terminology of UI/UX designing you can link in account, your portfolio and your resume so you can better position yourself.
Web designing is whose capable to design a website. Someone who’s known’s Basis graphic design, creating button, links, Dhtml, css and built the simple web site that are web designer does.
UI is the stand for User Interface and UX is the stand for User Experience. UI/UX designer who can build application widget on webpage, for example Facebook is a one of the largest Web Application on internet. The Skills UI/UX Designer someone who understands different flow page to page, Different in action, wireframes design, icon, forms and create great experience within web app weather it is web app or mobile device app etc. UX designers are higher-level discipline than UI Designers because how the user thinks and feel.
Bootstrap’s grid has allowed only 12 columns. We can define this group in the columns together to create a section. 12 columns are scale up the grids as the device or viewport size increase. These columns are also containing 15 pixels gaps between column content. If we remove the padding, then we use the rows(.row) which contain the negative margin.
Bootstrap is a most using front end framework for developing responsive, mobile friendly web sites and app. It’s free source and open source Collection.
Sass and less: Bootstrap provided a two most popular css preprocessors, less and Sass. Easy to pre compiled css.
One framework, Work Multi devices: It’s a free collection of tools for creating websites and web applications. It’s easy to get started, based on grid systems and easily scales your websites and application according to devices or screen resolution.
Why programmers preferred Bootstrap Framework: With bootstrap, you get typography, forms, buttons, grids, and also Jquery plugins like (Modal, Scrollspy, Tooltips, Popover, Alert, Button). So when we use this framework most of the day based plugins are available for designing your website
Box-shadow commonly used css3 property in the websites. If we give the shadow to Block level elements(like divs), Also , you can use RGBa and HSLa values for the color, for example, a 50% transparency of black.
-webkit-box-shadow: 10px 10px 5px 0px rgba(0,0,0, 0.4);
-moz-box-shadow: 10px 10px 5px 0px rgba(0,0,0,0 .4);
box-shadow: 10px 10px 5px 0px rgba(0,0,0, 0.4);
Box-shadow: x-offset(horizontal) y-offset(vertical) blur spread color(rgba,hexadecimal); Continue reading
Just quick review: Many of us used px instead of em and still do is as a result of they need management. They don’t wish or can’t cater for a user setting personal font preferences. It’s terribly exhausting to code a style that appears sensible across several font sizes.
At the time of constructing the website, we wish to tell the browser but the things is,
heading is higher font and the paragraph has high. Pixels have perpetually created excellent sense because the chosen unit of measurement; we’re outputting to a screen, thus what else would we tend to use?! However, it seems that pixels square measure inherently inflexible. And it seems that being inflexible is not nice for the online.
The text-align property is used for given alignment to text inside the inline or block elements. Text-align properties are different values: left, center, right, justify and interit;
- Lefttext-align left is default value. Content are started from left side of element.
- RightContent is started from right side of element.
- CenterContent are center from left side and right side of element.
- JustifyContent are cover left side edge and right side edge of element.
- InheritThis value would be depend on the parent div text-align properties.
Styles can be applied on link with different ways. There are four types of links states.
//we are also known this special state as pseudo class.
Font attribute is use for giving a size, style, font-family, weight and line-height of a text. We can specific font attributes as a shorthand and individually (longhand) code.
The Font-family attribute specified with the font family names and/or with generic family names Question is? , What is difference between font-family name and generic-family names? “Arial”, “Open sans” are font-family on the other side generic-family are ‘serf’, ‘sans-serif’, ‘fantasy’, ‘monospace’ and ‘cursive’. Font family attribute values are starting with font you want, and end with generic family. If fonts are available on the system then it works on browser, otherwise browsers pick the generics family.
font-family: "Open Sans", Arial, serif;
In our last tutorials, we discussed about the css selectors. In this tutorials and further tutorials, how we apply the css properties on the selectors. Let’s start with the background properties.
Background properties are using shorthand and longhand properties.
Background: background-image | background-position | background-repeat | background-size | background-origin and background-color.