A New Weekly Web Design Roundup via Solodev
Adding Filters to Search Inputs, Animated Scroll Down Anchors, Social Share Grids, Understanding CSS3 Animations...
Every day new HTML, CSS, and JavaScript tutorials are posted to the growing Solodev Web Design Blog! Here is a list of what was added the week of March 20th!
Adding a Filter to your Search Input using Bootstrap
Search on the web has gone far beyond simply going to search engines to find information. In order to dig deeper and find content more relevant to search queries, website visitors are increasingly searching through actual websites themselves for that right piece of content they're looking for. To take that a step further, it is possible to add filters to your search inputs so your website visitors can further specify the content they are looking for. This allows you to deliver a better web experience that provides the visitor with the content they are looking for at a much faster rate.
Adding an Animated Scroll Down Anchor
Contemporary web design is all about providing a simplified and direct user experience. For many websites, this means having clear actions that you expect users to undertake. One such action is the arrow that indicates a user should scroll down to continue reading. This type of UI elements is typically associated with large hero or sectional containers that are often full-width and full-height. The arrow indicates to the user that more content lies below the fold and that, by clicking on the anchor link, they will be taken to next appropriate section.
Understanding CSS3 Animations
Animations, and movement in general, have come a long way in terms of web design. Animations that were once ostensibly limited to gifs, JavaScript, and flash designs are now possible with CSS3. This helps designers and developers build unique elements while cutting down on clutter and page speed. That being said, there are a number of things to understand regarding CSS3 animations and their use. With a little bit of knowledge, however, you can use properly placed animations to encourage user interaction and direct the user flow.
Matthieu McClintock
Contributions Editor here at Solodev. Want to be featured on the Solodev Blog? Get in touch.
Follow me on Twitter
