In my experience, web trends can steer both clients and designers in the wrong direction. We all get sidetracked with things that seem or look cool from time to time. But we must always ask ourselves what is under the shiny surface. It’s worthwhile to stop before embracing any web trends and think about whether they provide real value to the users or not.
Ugly but useful trumps pretty but pointless.
Here are several common trends I see on a daily basis and some of the questions you can ask yourself before making design decisions.
Carousels can be effective, but can also turn into a nightmare if not designed and developed carefully. Take extra time to study carousel design to make sure you’re doing the right thing. When thinking about implementing a carousel, ask yourself:
- Will the carousel provide real value to the user?
- Are there too many or too few items for a carousel?
- Are all carousel items easily accessible? On mobile devices, too?
- Is it apparent there are more carousel items to be discovered from each of the slides?
- Is the animation smooth?
- Are all carousel links apparent and easy to click and tap (including dot indicator links)?
- And on a funny note: so… should I use a carousel?
2. Fixed Headers
We’re seeing more and more of headers that have a fixed position and take up a significant amount of the viewport. They stay glued to the top and can block the content underneath them. I’ve seen headers on high-production websites that are over 100 pixels in height even though it’s hard to see real value behind it. Sure, a lot of the users will be using a huge screen, and sticky menus can be a plus on big resolutions, but a significant portion will also be using a small one. So, before sticking a big header to the top of the webpage, ask yourself:
- Does the type and amount of content in the header justify the fixed positioning?
- Does the header take too much of space for comfortable browsing?
- Does the header block the content on smaller viewports?
- Is keeping the header sticky on big resolutions, but removing it on smaller ones a good idea?
- Can the header be smaller without sacrificing too much of the visual appeal and brand presence?
3. Flat Design
Flat design is currently very popular, but can be very dangerous — making the interface too simple can make the experience more complex. It is safe to simplify the UI as longs as you preserve visual clarity and do not add to the cognitive load. Remember to find a sweet spot between visual appeal and usability. Before making flat design decisions, ask yourself:
- Will the flat design it make the website easier or more complex to use?
- Will the flat style make the users think?
- Could the UX be improved with more shadows and gradients?
- Is the function of the UI elements (buttons, forms, etc.) clear and easy to understand?
- Is the visual hierarchy affected by the flat style?
4. Parallax Effects
Parallax effects have been around for a while and they don’t seem to be on their way out just yet. Clients seem to love them and developers seem to love them as well, but do the users lovem them, too? Remember to be extra careful not to go overboard with parallax ask yourself:
- Is the parallax scroll distracting to the users?
- Does it work on mobile devices?
- Is it affecting the page performance in a bad way?
- Is the development time (expense) worth it?
5. Thin (Light) Type
We’re seeing more and more of thin type on the web, but thin type can cause problems. One of the main goals of a text is to be legible, and thin type can effect legibility in a big way. Not everyone will be using your website on a display that will render the thin type well. I have found thin type extremely difficult to read on my iPhone and iPad with Retina display. Before choosing light over normal, ask yourself:
- Having various displays in mind, will the thin type make the text easy to scan and read?
- Is the thin type easy to scan and read on mobile devices in daylight?
- Does the normal weight produce better results than thin in testing?
- If thin is a must, is it worth it to invest in responsive typography (graded fonts)?
6. Full Screen Photo & Video Backgrounds
This is another dangerous web trend. More often than not, background images and videos do not provide real value and try to add to the visual appeal by sacrificing usability. Before adding a hero section with images or videos behind actual content, ask yourself:
- Will the background images and videos improve or hurt the UX?
- Is the content above the images and videos easy to scan and read?
- Is the page load time going to be a problem?
- Are the images and videos too distracting?
- Do the images and videos add to the visual clutter?
- What exactly are the pros and cons of hero-size photos and videos?
7. Scroll Hijacking
Scroll hijacking must be one of my least favorite current web trends. Restricting the user in this way is very rarely going to turn out well. I tend to close my browser tab as soon as my scroll is hijacked. Before implementing it, ask yourself:
- Will the hijacked scroll provide real value to the user?
- Is the lack of control going to frustrate the user?
- What is the real benefit of the hijack?
- Is the scroll hijack what the user expects?
8. Web Fonts
Web typography is experiencing a real boom and we currently have great choice of fonts to use on websites. From a guy who has spent several years working mainly with Georgia, Verdana and Arial — this is nothing short of amazing. But let’s not get overwhelmed with the abundance of fonts we can choose from. When making typography decisions, ask yourself:
- Does my font kit support all the characters I need? (I’m looking at you, fellow Croats, and our lovely š, đ, č, ć and ž’s)
- Is the weight of my kit affecting page loading times in a bad way?
- Do I really need all the font weights and styles in my kit?
- Is the font legible and easy to scan and read?
- Is the font rendering well on systems my target audience will likely use?
9. Hidden Navigation Menus
Last, but not least — hidden navs. This trend came from mobile design and is now being used by numerous websites on all resolutions. But is it safe to use on all resolutions? Before playing hide and seek with your users, ask yourself:
- Is the hidden menu simplifying the browsing or making it more difficult?
- Is the hidden nav wasting users time?
- If the nav is hidden, does the user immediately know where he is and where he can go?
- Do higher resolutions justify having a visible global navigation?