Week Six ➙ Iron Yard Tutorial Journal
June 12, 2015
A little simple stying goes a long way…
- In addition to a pleasing layout replete with golden-ratios, neatly gridded columns, fancy carousels, or similar design features — even relatively simple styles can have a positive impact on user-experience. Indeed, when it comes to buttons, or images that are clickable as functional links (or are otherwise part of the UI), a few basic styles can really make the elements on a page much more dynamic and responsive. For example, consider adding pseudoelements using
::before or ::after
- also, playing around with
box-shadow:, transition: all .2s ease-in-out;, or transform: scale(X); can really create some great effects very simply
dashed outlines or borders can also be used to great effect when combined with some of these other techniques
- However, for more advanced funtionality and user-experience, one can wire up some jQuery with CSS animations tied to click events or other interactions.
