Best Website Designs of 2018

Search Top Website Designs by Industries & Styles
  • Latest Most Viewed
    Submit a design

    The 5 Best Website Design Trends of 2018

    Artificial Intelligence

    Artificial intelligence in web design encompasses chatbots, machine learning and automated personalization. Since 75 percent of consumers are more likely to purchase from a website that remembers their name or can suggest potential purchases to them, AI is a web design trend you should invest in, stat.

    Amazon, the reigning king of e-commerce sites, is the site that does machine learning right. They offer suggestions to users across every page of the e-commerce website, allowing users to find products quickly and easily while also discovering new items that are tailored to them. Their success is reflected in the numbers -- Amazon saw a total revenue of $177.9 billion last year, and that number is projected to grow in 2018.

    If you’re hoping to replicate some easy personalization yourself, try Molly by The Grid, an AI web designer that can adapt your site to what your consumers want, or BotSociety for a simple chatbot interface that is easily integrated and can improve customer service.

    img

    Unpredictable Layouts

    Seventy-seven percent of marketers saying creating a recognizable brand identity is crucial to a company’s success -- and an unexpected web design layout can achieve this! Everything from asymmetrical layouts to free-form design to brutalism fit this aesthetic. When implemented correctly, they can add depth and motion to a website design.

    To pull interesting layouts off, you have to know your visitors well. Will they appreciate an unexpected design? Are the rest of your design elements, such as checkout or navigation, intuitive and easy to use to counteract the unexpected appearance?

    The Outline incorporates the brutalism web design trend to add plenty of personality. Brutalism -- which can be unpolished, purposefully clunky and, well, just plain extra -- is seen in the wildly contrasting colors, bold serif type and the pop culture icons that adorn article headlines and menu items. However, The Outline combats all this with an easy, intuitive web design.

    img

    Unique, Bold Colors

    Color psychology -- aka the art of leveraging the emotional and psychological responses to certain colors -- can drive website conversions. After all, the majority of consumers are more likely to engage with a company if they feel some sort of emotional connection to it.

    By understanding cultural conditioning and human associations with particular hues, brands will be able to create the feeling they desire on their web design. But exciting colors don’t have to come in the form of flat designs and static backgrounds -- make them unique with gradients, layovers or duotone effects, which Spotify employs on many pages, including their Premium landing page splash image.

    This color effect -- which fittingly uses that popular ultra-violet purple -- helps a bright green call to action pop off the screen. However, Spotify smartly avoids overwhelming the user by introducing negative space above the fold to create a pleasing contrast.

    img

    Motion On The Screen

    Your site only has 17 milliseconds to impress consumers. This means that your website design has to be fast, user-focused and have a special “wow factor” that pulls visitors in. What better way to catch someone’s eye than a little motion?

    Videos within web design can increase conversions and motion graphics in general can help companies grow up to 49 percent faster. Why’s that? Motion cultivates a concrete brand identity, and draws attention to important information and calls to action, such as a purchase button or email signup. Ultimately, videos and animations on your website design can help you explain, promote and cultivate emotion in visitors, according to Forbes.

    Heystack capitalizes on motion graphics to signify their expertise. Upon landing on their homepage, users see an animated well-oiled machine, labeled with many of the programs Heystack supports, working together to churn out a successful project. This hits upon the “explain” pillar of the importance of motion graphics we mentioned earlier. Set against white space, this animation is both entertaining and valuable, as it calls attention to the efficiency Heystack can bring your business in a playful, on-brand way.

    img

    Custom Illustrations

    Website design isn’t all conversions and calls-to-action -- there needs to be a little humanity in there to give your brand a voice that people will gravitate towards. An easy way to achieve this (and increase brand consistency) is through hand-drawn illustrations.

    Tatyana Khamdamova, head of design at Blue Fountain Media, encourages her team to take tiny elements like illustrations and incorporate them throughout a website design. This helps every page reflect the brand -- even if the logo isn’t visible.

    Buzzy mattress startup Casper is known for its playful, cartoonish illustrations -- and implementing them across their website helps to create a consistent brand. It gives the company a lighthearted tone, ties in their company blog, and even gives them content for marketing campaigns, such as their now-iconic subway ads in New York City, from design agency Red Antler.

    img

    Top 5 Elements Of The Best Website Designs

    Call To Action

    More than 90 percent of website visitors who read your page’s headline will also read your call to action. And those views often turn into conversions too -- a case study from Brafton found that consistent and informative calls-to-action improved e-commerce conversion by 22 percent and overall revenue by 83 percent, proving that a little persuasion can go a long way.

    But wording is important. Studies show that more personalized, friendly calls-to-action consistently see better click-through rates. What’s better? Ingratiate yourself with users more by writing in first-person.

    Madewell places plenty of calls to action across their e-commerce website, from shopping cues to newsletter signups. While the CTA featured above is a email popup (which also showcases their brand’s tone, too), many other subtle prompts are found on every page. These CTAs pay off well, too. Despite being owned by a struggling J.Crew, Madewell’s revenue continues to increase. The second quarter of 2017 alone saw a revenue of $93.1 million.

    img

    Intuitive Navigation

    Seventy-seven percent of agencies believe that subpar user experience is a weakness for their clients -- and one of the largest factors in user experience is poor navigation. Unfortunately for those businesses, KoMarketing discovered that users like to quickly and easily find information about the company, products and services. Plus, 50 percent of users look to a navigation menu to discover where they are on a website when they arrive from a referral.

    Easily improve user experience on a website by creating intuitive navigation -- after all, visitors landed on their site because they want to find something. Why not make it easy for them?

    The Island of the Bahamas’ official website features truly intuitive (and extremely organized) navigation. Everything from activities to hotels are easy to find, and each menu item is clearly labeled, with subheads that can break down a visitors’ search even further. While it may not be the most Earth-shatteringly exciting site on the world wide web, this design is truly focused on the user.

    img

    Contact Us Page

    Sixty-four percent of visitors want to find a contact page after arriving on a website. But is it really that detrimental if you don’t have you?

    The simple answer is yes. Simple contact forms with three fields have a minimum conversion rate of 25 percent. Plus, when 42 percent of consumers are distrustful of brands with poor communication, a contact us page becomes even more critical.

    Top website designs that give users what they want will always have a contact page -- and you should, too. Service-based companies in particular, such as digital agency Blue Fountain Media, benefit immensely from clear and simple contact forms. The small form, readable text and clear messaging make this the perfect catch-all for potential clients.

    Other sites benefit from contact pages as well. E-commerce sites can strengthen customer relationships by answering questions through a contact form, while informational sites can field suggestions, allowing users to feel more engaged and understood by a company.

    img

    Content Marketing

    Content marketing may seem like an unnecessary evil, but that is certainly not the case. Ninety-one percent of marketers utilize some form of content marketing to boost a brand’s awareness and bottom line. Plus, content marketing creates more than three times as many leads as traditional marketing -- yet it costs 62 percent less.

    The good news is that content marketing isn’t all just fluffy blogs or long-form content. Anything from white papers to videos to social media can all constitute content marketing -- so long as it’s telling your business’s story in some way or informing your consumers on topics they care about.

    Furthermore from Equinox is a stellar example of content marketing done well. This standalone website is actually the content brainchild of the luxury gym Equinox. They subtly yet frequently promote both their locations AND the Equinox lifestyle -- healthy, chic and elegant. It’s a tricky yet effective ploy to strengthen their brand identity and organically capture potential gym-goers that fit their demographic.

     

    img

    Cohesive Brand Identity

    According to Adobe, 38 percent of users will just stop interacting with a website if the layout and content aren’t attractive. But a beautiful design on just one medium won’t grow your company -- instead, you need to invest in a consistent design across all pages and mediums. In fact, a dependable brand identity across all platforms can increase your revenue by up to 23 percent.

    It turns out that users want to trust the companies they give their business to, and a great web design that matches the image they product on social media, print ads, apps and partnerships fosters that.

    Need a little inspiration? Look at Nike. They have spent decades cultivating an image of simple strength across every platform. From their iconic responsive swoosh logo design -- which marks every product and post -- to their minimal website design, sleek product videos and seamless checkout, they put the user first while reassuring them that they’ll be taken care of by a reliable brand. 

    img

    What Are The Best Web Design Platform For Various Types Of Sites

    Informational

    Informational websites act as a resource for a visitor, informing them on companies and services without necessitating a purchase or specific action.

    Wordpress is, without a doubt, the most common and reliable platform for creating an informational website. The company will also help you purchase a custom URL and features templates for every price range and function.

    Meanwhile, Drupal boasts an open source content management system, making it an affordable and flexible option for companies that don’t want to be tied to one web development agency forever. They’ve powered a number of informational websites, including WhiteHouse.gov.

    The University of Oxford originally looked to Drupal to simply “refresh” their website design. However, upon learning about the many features and benefits of the latest Drupal 7 Platform, did a larger overhaul on their digital presence. Their academic site now features more content from the university, allowing them to employ content marketing to capture potential students.

    img

    E-Commerce

    E-commerce websites allow businesses to sell products and goods online. Global e-commerce sales are expected to reach $4.5 trillion by 2021, meaning a site that supports simple search and seamless checkout is worth your while.

    If you have a small inventory, Shopify is the perfect platform to facilitate online sales. However, if you have a larger e-commerce site,  e-commerce megapower Magento offers plenty of customization features that can help brands tailor the shopping experience to both visitors AND brand standards.

    CRM management company Salesforce also has an e-commerce platform that focuses on community building, making an online shopping experience that’s engaging for users. If you already utilize one of Salesforce’s many other platforms, integrating their social e-commerce is a great idea.

    UK-based retailer OSPREY LONDON recently switched to Magento Commerce Cloud in hopes of doubling online sales. Instead, they saw a 300 percent increase in e-commerce revenue and now tout a whopping $16.8 million in overall sales.

     

    img

    Blog/Magazine

    Blogs and magazines could be standalone sites (like The New Yorker) or add-ons to an informational or e-commerce site (like Warby Parker) but they all exist for one reason -- to entertain and inform visitors through content. With the prevalence of content marketing, a focus on blog and magazine websites is growing.

    We already know that Wordpress is a common website platform, but their host of features (such as Google Analytics support and monetization through ads) make it worth mentioning twice. What’s better? Wordpress can integrate into your existing site to help you implement content marketing without a total redesign.

    Squarespace offers trendy web templates and an intuitive admin panel that make creating and changing a website design simple. Plus, you have the option of adding additional features that can help your company grow in any direction.

    A number of well-known brands use Wordpress to fuel their content -- including the entertainment magazine Variety. Their customized design doesn’t just feature articles -- it also has a credits database and prominent search. Its focus on digital has paid off, too -- the publication has consistently grown since 2012.

    img

    Social Media

    While Facebook, Instagram and a handful of other websites dominate the social networking industry, there are plenty of other community-building websites that engage visitors and cultivate dialogue without an app or a character limit.

    Due to its flexibility, Drupal is an excellent web design platform to enlist if you’re hoping to create a more interactive website design. However, if you have a specific vision or particular web design features that you’d like to include, Symfony open source framework can create the social media site of your dreams. In fact, Laravel, Drupal and Magento (along with others) all utilize aspects of Symfony, boosting its credibility.

    Facebook Instant Articles used Symfony components CssSelector and Yaml to create a separate interactive platform that allows companies to directly publish content to Facebook. This new subset of the social media site has capture brands such as Rodale Inc. and Gray Television, allowing them to grow readership through automated networking.

    img

    Custom

    Have a specific vision for your web design? A custom website design is probably for you. While it can cost upwards of $5000-10,000, a custom website can ensure you have every web design trend and feature your consumers want.

    While there are plenty of platforms that can help you create your dream web design, Laravel is one of the best. The platform hosts several systems that features tons of integrations (Sublime and Javascript, for starters), plus tutorial videos to help developers use the open source framework to create custom sites. The catch? You’ll need someone who understands code.

    The modern, responsive website design for the movie The Disaster Artist used Laravel to design a creative website that adds an air of sophistication to the true story of a film that lacks it: The Room. The result was a site that reflects the award-winning film through an infinite scroll, compelling techno music and creative animations.

    img

    The 5 Best Website Design Features For A Site That Steals The Show

    Geometric Shapes and Textures

    2018 is all about big personality and bold design, and the nostalgic influence of the 1980s and 1990s is propelling this forward with more emphasis on geometric shapes, patterns and textures over flat design.

    This web design trend doesn’t just boost a site’s aesthetic appearance, though -- it can strategically draw attention to important information, featured products and calls to action. Plus, repetitive and symmetrical patterns create the illusion of movement on the site, which, we all know, increases those oh so precious conversions.

    Creative agency Young Blood layers images and patterns to create a stacked texture on their homepage that drives the call to action directly below. This texture is surrounded by white space and minimal navigation menus to keep the remainder of the landing page easy on the eyes.

    img

    Charts and Graphs

    People will believe anything they read in a chart -- or so says a scientific study from Cornell University. It turns out that the appearance of science is just as compelling as, well, science itself! So why not capitalize on that and add the appearance of science into your website design.

    While you definitely shouldn’t fudge numbers or fib about your services, showing that information instead of saying it will likely resonate more deeply with your consumers.

    Real estate investment startup Fundrise incorporates charts and graphs perfectly into their website design. Upon landing on their homepage, you’ll see a branded chart detailing the success of investing. Hearing them say there’s a good ROI is one thing -- but seeing the upward trend is effective. Note that not every piece of information is in “science form” -- this is strategic, and ensures only the most important information stands out and catches visitors’ eyes.

    img

    Unexpected Typography

    Sixty-five percent of consumers say that they are more likely to give a brand their business because they feel a connection to the company -- and typography can influence this.

    Many fonts are impactful due to culture significance -- such as art deco and the roaring ‘20s. Typography can also strike a chord in our semantic memories -- this is often seen with the font Helvetica and government associations (did you happen to notice it on your latest tax forms?).

    Fonts can also create an overarching vibe. For example, a thin, clean and capitalized font is chic, while a scrawling hand-drawn type is viewed as intimate. By determining the atmosphere you want to create on your site, you’ll be able to choose a typography that will help you achieve your goals.

    Le Cafe Noir Studio unlocked this with their horror film-like font. While the majority of the website is a minimal grid layout with colorful clothing images, this unique branding adds an extra layer of depth and personality to the brand, allowing the e-commerce site to appeal to its demographic -- fashionable women with creative personalities -- with more punch. What’s more? By only utilizing it in the logo branding, it actually strengthens how uncommon and interesting the typography is.

    img

    Unique Page Transition

    A 0.5 second delay in loading time can result in a 20 percent decrease in traffic. If loading times are delayed, visitors can develop interstitial anxiety, causing them to wonder if something is wrong with the site. But this anxiety can be reduced with the use of creative loading animations or interesting page transitions.

    Interesting transitions also boost UX by creating a seamless experience. And according to Forrester, a strong interface design can increase conversions by up to 200 percent, and strong user experience design can improve conversions by up to 400 percent.

    The Eames by Enso married unique page transitions and with a single-page site to create an engaging experience. There’s no clicking and no menu -- instead, you can scroll your way through the site, which moves both horizontally and vertically through the predetermined path.

    This unique page transitions add motion graphics -- such as a mask header and products that swell and reduce in size in conjunction with the scrolling -- to take users through a compelling timeline-like journey, and place emphasis on information like dates, products and life achievements that the readers should take note of through simple motion.

    img

    Optimized For Mobile

    Optimizing for mobile isn’t really a web design trend -- it’s an absolute necessity. Mobile e-commerce sales are expected to account for nearly 40 percent of all online sales in 2018, and that number is expected to grow to 53.9 percent by the year 2021.

    In fact, Google places an even higher emphasis on mobile optimization vs desktop when it comes to search engine rankings. To get yourself closer to that coveted no. 1 spot, create a responsive design and ensure the loading time is quick -- 53 percent of mobile sites are abandoned if they don’t fully load in three seconds.

    Walmart is a stellar example of an e-commerce website design that is well-optimized for mobile devices. The quickly-loading site features a prominent search bar and a left-side hamburger menu upon landing on the home page. The shopping cart is easily accessible on the right-hand side throughout the mobile experience. When you navigate through the site on mobile, you can easily sort, filter and access your shopping cart. The minimal sunburst-like symbol found within their logo design is also seen upon arrival, branding the site with consistency without taking up too much real estate. This shows the effectiveness of a responsive logo design.

    img