A few web design trends for 2018
As a web designer I like to follow the latest web design trends. Some of these are functional, like WordPress updates and plugins, php 7.2, security issues, or html/css related, and some are visual, such as flat and material design, flat lay photography, video, and line art icons. There’s a sea of trends and trend setters out there, I see new ideas and styles popping up all of the time – a lot while scrolling Twitter. It’s my job to decide what’s essential for our clients, what could be useful, and what’s just a ‘nice to have’ feature.
I’ve never followed every design trend as if it was law. – certainly not the ‘visual’ trends. I’m not talking about ignoring html5 and responsive design, or shunning design trends entirely, but when flat design was new, I didn’t throw out subtle gradients and shadows instantly, especially when they’re done with css3, (my interpretation of ‘flat design’ looked more like material design).
As long as a website ticks all boxes for UX, load time, on-page seo and security, I don’t think you should contain your creativity. How can we expect to have a strong brand, if it looks the same as everyone else?
Without further ado, here are just a few trends we’ll be focusing on in 2018.
Photography
Hardly a new one to 2018’s list. I’m sure photography has been on the ‘latest trends’ list since 2011, but like everything it’s more accessible now with new technology. 813 photos are uploaded to Instagram every second. source High quality photography can sell your product as soon as the page loads. Long before a user has chance to read the text or watch any videos on your site, they’ll have seen the images. ‘neuroscientists from MIT has found that the human brain can process entire images that the eye sees for as little as 13 milliseconds’ source
With this in mind, we bolt-on photography to every new website project we start, without adding extra cost. It is simply part of the ‘web design’ process.
SSL
In 2018 all modern web browsers will continue to highlight http:// as an insecure connection, prompting website owners and developers to use an ssl certificate to encrypt data sent between a user and the server. Not really a design trend, but it will influence user experience as users become more aware of online security. Having a secure encryption (seen as a green padlock in the address bar) will increase your conversion rate. info
Any new client that hosts with us on our cPanel server, will get access to AutoSSL, meaning you don’t have to spend extra.
Material Design
Flat design became popular in 2013, it’s based in minimalism and simplicity. Previously interfaces would use shadows, bevels, gradients and textures to make elements look more realistic (skeuomorphism). This was useful in the early days of computers and the internet. Flat design also helps websites and apps load quicker on mobile devices with poor internet connection.
Material design adds some of this realism back to websites and apps, but still focuses on clean, UX centric applications and websites.
Using both css3 and .svgs, means websites can load fast without sacrificing design.
Responsive Design
Another one that’s been around for a long time, and certainly isn’t going anywhere. https://www.w3schools.com/html/html_responsive.asp Since 2014 we have created all websites responsive as standard, rather than adding it in as an additional cost. In fact I’d have to check back on our quotes to see if we even mention it anymore, as it’s just a given. Every website that is built has to be optimised for various devices, such as phone, tablet, laptops and desktop.
Sticky headers and navigation
Websites which are strongly conversion focused are likely to have their navigations (primary CTA) follow the screen, by attaching to the top (or other side) of the browser window, reassuringly following you through the site. This makes the header or navigation act like a global object, rather than being a part of any one page.
Using material design means we can add a little drop-shadow to the header, lifting it away from the rest of the page.
Video content (with the <video> tag)
Using the <video> tag (a html5 element) lets you easily add a video ‘background’ to your site, and it comes with a bunch of useful attributes, including autoplay, controls, loop and muted. Media rich websites are easier to create than ever, and help improve seo.
Thanks for reading
Please let me know if you have any thoughts @john_indever