Webdesigner Depot

syndicated content powered by FeedBurner

...

Reset this favorite; show all Subscribe options

Subscribe Now!

...with web-based news readers. Click your choice below:

...with other readers:

(Choose Your Reader)FeedDemonNetNewsWireNewsFireNewsGator Outlook EditionRSSOwlShrookUniversal Subscription Mechanism (USM)

Get Webdesigner Depot delivered by email

View Feed XML

FeedBurner makes it easy to receive content updates in My Yahoo!, Newsgator, Bloglines, and other news readers.

Learn more about syndication and FeedBurner...

Current Feed Content

• Quiz: The Inconceivably Hard Color Quiz

  Posted:Fri, 30 Jul 2021 14:45:56 +0000

  Color is one of the fundamental building blocks of design. The color decisions we make–what colors and where, how many different colors, or even if we use color at all–all have a huge impact on how well a design works as intended.

  So, here’s a chance to test your expertise on all things color-related. We’ve put together an inconceivably hard color quiz. Can you beat 7/10? We’ll start you off with an easy one, but be warned, they get harder…

   

  Featured image via Unsplash.

  Source

  The post Quiz: The Inconceivably Hard Color Quiz first appeared on Webdesigner Depot.

  

• 16 Free Websites for Learning to Code in 2021

  Posted:Thu, 29 Jul 2021 14:45:37 +0000

  The best free online coding websites for beginners are hubs of education and insight, designed to take your knowledge and career to the next level.

  For years, technical careers have been gaining more attention among innovative individuals. In a digital world, people capable of speaking computer language often have the widest selection of job opportunities. However, before you can start leveraging the blossoming job market, you need to hone your skills. That’s where free coding websites come in.

  A free online coding website is an environment where you can develop your understanding of various kinds of code, update your programming prowess, and even earn certifications. Today, we’re going to be looking at some of the most impressive coding websites on the market.

  Coding Careers: Opportunities in 2021 and Beyond

  Before we leap into our overview of the best free coding websites, let’s examine why it’s so important to invest in your coding role. Looking at the US Bureau of Labor Statistics, we see that coders earn an average of $89,190 per year.

  Elsewhere, CompTIA notes that technology hiring has accelerated since the end of 2020, with up to 391,000 new positions opening in the US during December.

  Though coding careers have been popular for some time now, they have particularly high value following the pandemic, as companies worldwide adapt to the changes associated with remote workforces, digital customer service, and ecommerce. The pandemic has made us more reliant on technology than ever before, as a result:

  • Coding skills are in high demand: Coding skills are essential for the newly digital world. Studies find that the pandemic has accelerated digital transformation by around 7 years. Companies need coding professionals to stay ahead of the curve.
  • Coding knowledge is becoming more versatile: Companies are looking for coding skills in more than just programmers. They want their data analysts, IT workers, artists, designers, and other professionals to have these talents too.
  • People with coding talent can earn more: Jobs requiring coding skills tend to pay more than those that don’t. This reveals the growing need for coding knowledge in the digital ecosystem.

  Coding skills provide an avenue to tech professionals for higher-income jobs, and these careers are growing faster on average than other job opportunities.

  The Best Websites for Learning to Code

  Learning to code or developing your existing coding skills can help you to unlock a host of new opportunities. Today, you can learn coding online for free, just by visiting the right websites.

  Even a basic knowledge of coding can drive a range of results, such as helping to support the better management of websites, reducing reliance on outside developers, and opening the door to app development. So whether you want to start a new career or upgrade your existing knowledge, these sites will help:

  BitDegree

  BitDegree is a wonderful website for anyone interested in web development, coding, data science, and programming. There are various courses to choose from, depending on the career path you want to take. For instance, you can learn about the AWS cloud or start your journey into gaming development. For coding, BitDegree covers languages like:

  • CSS
  • HTML
  • PHP
  • SQL
  • JavaScript
  • jQuery

  The best thing about BitDegree is how it makes learning so fun. There are gamified courses and sections where you can really dive into the essentials of coding. In addition, the online coding course collection often features hundreds of discounted options for people on a budget.

  

  CodeAcademy

  One of the most popular sites for learning how to code for free, CodeAcademy is home to over 24 million students who have built their skills. The interactive learning approach lets you apply what you’ve learned immediately. Over 300 million hours of free coding content are available to check out at your leisure. Like most coding platforms, you can learn languages such as:

  • CSS
  • JavaScript
  • HTML
  • PHP
  • jQuery
  • Python
  • PHP
  • Ruby

  CodeAcademy is particularly effective for beginners because you get instant feedback after submitting your coding efforts. When you make mistakes, you’ll find out exactly where you went wrong, allowing you to avoid similar mistakes in the future.

  

  Codewars

  Codewars by Qualified is definitely one of the most versatile free platforms for learning how to code. There are dozens of languages you can learn – too many to list right here. Options range from C++ and C# to Ruby, Python, Lean, Java, PHP, Scala, and countless others.

  Codewars teaches you your programming language in-depth by selecting challenges designed to put your mind to the test. The goal for each challenge is to help you sharpen your knowledge over time, with tasks that get progressively more difficult over time.

  The cool thing about Codewars is it allows you to see how you respond to challenges compared to how other coders have tackled the same issues.

  

  Code.Org

  Designed for a younger community of would-be coders, Code.org is an engaging and highly accessible introduction to coding. With around 60 million students worldwide, the Code.org platform gives you access to a wide range of different learning opportunities intended to suit different needs and learning levels.

  The Code.org environment is built on a desire to bring coding into the standard curriculum. You can dive into full one-hour tutorials, or you can experiment with a more structured approach to learning, which is ideal for people with different learning styles. There’s also a huge catalog of courses extending from basic coding for younger kids all the way to University-level education.

  

  Free Code Camp

  A diverse option in our free coding website list, Free Code Camp is all about developing your coding knowledge while simultaneously networking with other like-minded people in the industry. The solution allows you to learn coding by participating in challenges – which is ideal if you want to put your skills to the test as soon as possible.

  To help you jump in, you’ll have access to a range of courses and tutorials designed to help you understand and overcome each challenge. You can even code for non-profits on the platform and build tradeable projects in languages like:

  • HTML5
  • Javascript
  • Node.JS
  • CSS3
  • React.JS
  • Databases
  • Git

  If you’re a little nervous about the concept of coding alone, you’ll have a full community to work within the Free Code Camp. You might even meet someone you can work with in the years ahead.

  

  Code Conquest

  Code Conquest is less of a course website and more of a comprehensive guide for beginners diving into the world of code. This amazing platform will help you understand all of the basics of coding in no time – even if you’re brand-new to the landscape. You can find out what coding is all about, learn which languages are best to learn for your needs, and more.

  The website is full of resources for all kinds of coders, including comprehensive tutorials, reviews, a knowledge center, training packs, and more. You can even choose from a range of languages like:

  • CSS
  • HTML
  • PHP
  • jQuery
  • Ruby
  • JavaScript
  • Python
  • MySQL

  To help you figure out where you should get started, the Code Conquest website also gives you recommendations on which tutorials to take next.

  

  W3Schools

  One of the better-known free websites for coding on the market today, W3Schools is an environment packed full of example codes, resources, tutorials, exercises, and libraries to help you learn how to code. The site is one of the largest in the world for developers.

  To begin coding with W3 Schools, you’ll need to choose the programming language that’s right for you, then either jump into the program immediately or select from a range of learning options. The site comes with a handy quiz to help you define your knowledge level.

  Languages range from CSS to SQL, JavaScript, HTML, Python, Java, C++, and many more.

  

  Code Avengers

  Code Avengers offers a fun and interactive approach to learning how to program and code. There are various course options to teach you how to create everything from games and apps to entire websites. The good thing about the Code Avengers website is you don’t need a lot of spare time to start learning. Each course takes around 12 hours to complete.

  You can choose from languages like HTML, CSS, Python, jQuery, JavaScript, and more, and connect with a wide selection of similar coding enthusiasts, just like you. The biggest downside is that the free trial only lasts for seven days before you’ll need to pay to use the full program.

  

  The Code Player

  A simple and effective website for learning how to code and building your existing skills. There are tons of videos and demos to walk you through the process of learning how to code from scratch. All you need to do is click on one of the things you want to learn how to do, like creating a simple web page, and the site will give you a video walkthrough.

  Though a little simple compared to other coding resources, the Code Player still has a lot of great video guidance to help beginners jump into various languages. For example, you can learn about CSS and HTML or check out various tools to help you make a more effective website.

  

  CodeGym

  If you’re particularly interested in learning about Java, the CodeGym is probably the website for you. This online Java programming course teaches you the basics of Java by allowing you to dive into various tasks. You can get involved with various exercises depending on your existing skill level and play around with games designed to teach you more about the coding landscape.

  This website is fantastic for people in all stages of the coding journey. Whenever you suggest a solution to a challenge, the website will give you immediate feedback to learn from. There are more than 500 hours of Java coding exercises and educational resources to explore.

  

  The Odin Project

  One of the better-known free coding websites on the market, the Odin Project aims to take the headaches and frustration out of learning web development. If you’re a beginner looking to develop a career in coding, then the Odin Project will give you all the pieces of the puzzle required to decide exactly where you want to go and build the appropriate skills.

  This site offers a full-stack curriculum of coding education options, with tons of challenges, tasks, and exercises to help you put your newly gained knowledge to the test. You’ll learn how to program in languages like CSS and HTML, explore the basics of JavaScript and Ruby, and even get tips on how to get hired when your skills are maxed out.

  

  Plural Sight

  Previously known as Code School, Plural Sight is a fantastic online learning platform that allows you to build your knowledge through a range of paid and free courses. The comprehensive platform is organized into a wide selection of different learning paths. You can choose how you want to develop your skills based on your chosen language and your existing skillset.

  You choose an education path created by professional instructors to achieve specific outcomes, and Plural Sight gives you all the material you need. You can also practice what you’ve learned during the course in your browser and get immediate feedback on what you need to work on. There’s even a gamification aspect that allows you to earn points for every course level you complete.

  

  MIT Open Courseware

  Imagine how amazing it would be to get accepted to MIT to learn your new coding skills? What if you didn’t have to go through the headache of an official application. If you have a computer and internet access, you can explore MIT’s course material easily through the MIT Open Courseware website. This dedicated website gives you an insight into all of the courses and materials learned by students at MIT.

  You can browse through all the courses available in the programming landscape and filter through results based on things like course features. For instance, you might specifically look for courses with their own online textbook, lecture notes, and videos. It’s a great way to get an insight into how one of the most reputable universities in the world offers coding education.

  

  Web Fundamentals

  We’ve already looked at a website offering coding resources specifically for Java, now let’s take a look at one designed for HTML5. Launched about 11 years ago as HTML5 Rocks, the Web Fundamentals website is packed full of tutorials, resources, and insights into the most recent updates to HTML5. This open-source environment allows developers and programmers to really get active with their skills.

  You can play around with some of the code already available on the website, and explore tutorials authored by a range of amazing individuals. Although these courses are very comprehensive, it’s worth noting that they might not be the perfect choice for true beginners, as the tutorials can be more complex than most.

  

  Dash General Assembly

  If you’re keen to learn the essentials of coding in some of the most popular languages, like CSS, JavaScript, and HTML, then Dash General Assembly is the site for you. This website offers fun and free courses which will guide you through the basics of web development. You even get interactive tasks and challenges you can leverage within your browser, with no downloads required.

  Users learn how to do a range of amazing things with this website, including how to code HTML5, build a beautiful website, and balance your layouts for aesthetic appeal and usability. You can even design dynamic interfaces where you can add aminations and effects. Dash General Assembly is a fantastic tool for anyone keen to get started in the world of coding.

  

  Codeasy.net

  Finally, Codeasy.net promises beginners a fast and simple way to start learning how to code, while having plenty of fun. This exciting website immerses you within a digital story which takes you on an adventure through the basics of coding. You’ll need to learn real-life coding skills to navigate your way through the rest of the story, which means you can develop your C# knowledge as you go.

  This is one of the more unique tools for learning how to code that we’ve found so far. It’s a great way to discover the basics of C# without being bogged down in boring lectures. Remember, though, this website is intended for complete beginners, so you might find it a little basic if you already know some of the coding essentials.

  

  Free Websites for Learning to Code

  Free coding websites are an excellent way to develop your skills and unlock new opportunities in the world of coding. If you’re keen to jump into a new career as a programmer or coding developer, make sure you check out some of the options above. There’s no doubt you’ll find a site capable of giving you the boost you need.

   

  Featured image via Unsplash.

  Source

  The post 16 Free Websites for Learning to Code in 2021 first appeared on Webdesigner Depot.

  

• Collaborative Task Management with Taskade

  Posted:Tue, 27 Jul 2021 14:45:43 +0000

  Productivity is a crowded space, with countless apps and services promising to make your life and business easier and more profitable. Of all the apps that make that promise, very few deliver, but we’ve found one that does: Taskade.

  Flexible Planning With Taskade

  Every problem is unique, and part of what defines us as creative professionals is the different ways we approach problems. What suits one person in one situation doesn’t suit another in another. This is where many planning apps fall down: they adopt one singular approach and expect users to fit around the app.

  Taskade is different. Like the love-child of Trello, Notion, and Slack, Taskade uses a template approach to create a flexible planning system that you can use in whatever way you prefer.

  When you open up Taskade, you’ll see some quick options: ‘blank,’ ‘weekly planner,’ ‘meeting agenda,’ and so forth. But there’s also a ‘more’ option that will give you access to the hundreds of templates Taskade supplies. There are dozens of template categories, and each category contains multiple templates that you can use to drive your planning process.

  

  Whether you’re looking for a task list for launching on Product Hunt, a design system checklist, or a project scrum board, you’ll find the template ready and waiting for you.

  If none of the predesigned options are right for the task at hand, Taskade gives you the option to create your own template from the basic building blocks of boards, actions, mind maps, charts, and lists.

  

  Team Collaboration With Taskade

  One of Taskade’s main strengths is its ability to work equally well for individuals and teams.

  It makes sense when you’re evaluating a product that you do it on your own. But we encourage you to bring team members on board early in the trial because it’s when working with teams that Taskade really excels as a collaborative tool.

  Once you’ve created a new planning project, you can invite your team, either by email or — if they’re already registered — by tagging them with their Taskade username.

  You can assign tasks to individuals or multiple individuals (a much better option than the free-for-all you find in some to-do apps). You can also set deadlines for tasks so that everyone knows what the schedule is.

  Team Chat on Taskade

  Another area that Taskade excels for teams is the built-in real-time live chat. You can communicate with team members right in the project instead of jumping onto Slack or email.

  For teams working remotely, or even just multi-tasking throughout the day, it’s a great way of ensuring that everyone has the information they need. As a result, mistakes are minimized, and best of all, there’s a written record that can be referred back to at any time.

  Chat can be sent to the whole team, or direct messaged to an individual, so you don’t need to worry about filling up everyone’s notifications with messages that don’t apply to them.

  

  Project Management With Taskade

  If you’re working on a single project, then you probably know exactly where it is at all times. But for anyone working on multiple projects, it can be hard to keep track of everything. So Taskade has several different options for project managers.

  The Mindmap section is one of the most useful parts of Taskade because it gives you a complete overview of everything in your project. You can see what has been completed and how much time it took — that way, you can assess how viable the timeline for your other tasks is.

  Another great feature of Taskade is the activity feed. When one of your team makes a change to a project, it will pop up in your activity feed, and the next time you log in, you’ll see the status of your projects with a single glance.

  

  Multi-Platform

  One of our favorite aspects of Taskade is that it works equally well across different platforms. As well as the desktop web app, you’ll also find native apps in the iOS app store and the Android play store.

  Syncing your account over different apps is awesome because ideas often occur at inconvenient times — on your commute, walking the dog. Even when you’re at your desk, it’s much handier to grab your phone and make notes than it is to switch to your browser and visit a site.

  

  Easy Registration

  If you’re feeling the pressure of a bulging inbox, or to-do lists on multiple post-its, then the last thing you need is another complex, confusing task to add to the pile.

  Taskade is super-easy to get started with. Just click the ‘Sign up’ link in the top right of the site, and you’ll have three options: Sign up with Google, sign up with your email, or you can continue as a guest.

  If you’re not sold yet, then continue as a guest — essentially a free trial — you can sign in properly later once your curiosity is satisfied.

  

  Free to Use

  Taskade is free to use on a limited basis. The free plan comes with 500Mb of storage and a maximum 25Mb file size. You can create individual tasks or whole projects, workflows, and custom templates and share tasks and projects with your team. That’s enough to help you make the most of Taskade for $0.

  If you find that the generous free plan isn’t quite enough, paid plans start at just $5 per month. The paid plan gives you unlimited storage and bumps the maximum file size up to 250Mb. You have the same core features as the free plan; it’s just that they’re unlimited, which means you can do even more planning. In addition, the paid plan adds some handy extra features that are great time-savers, such as sorting tasks, creating repeat tasks, and bulk assigning tasks. Just look at how Taskade compares to similar tools.

  Most professionals will get along with the free plan just fine, but $5 per month for unlimited storage is a great deal. On top of that, you have future premium features to look forward to, including a project revision history and a calendar view.

  You can sign up to Taskade for free now, as a guest, with your email, or with Google.

   

  [– This is a sponsored post on behalf of Taskade –]

  Source

  The post Collaborative Task Management with Taskade first appeared on Webdesigner Depot.

  

• 20 Best New Websites, July 2021

  Posted:Mon, 26 Jul 2021 14:45:28 +0000

  This month we have a variety pack for you. There are all sorts, from the most conservative layouts and structures to more experimental navigation. And we see how even the most traditional and functional websites can connect with users through mood-enhancing color schemes, clever font choices, and illustrations.

  Non-functional–that is, purely decorative–details can really improve the user’s reaction to a site when applied sparingly. Constant movement gets tiring, and adding too many elements can feel fussy and unfocused. Getting the balance right so that things are kept simple but not bare and boring can be difficult, but it is a skill worth mastering.

  Enjoy!

  Laboratorio Permanente

  The site for this multi-disciplinary architecture studio makes very nice use of a scrolling concertina effect.

  

  Sometimes Always 

  Wine sellers Sometimes Always have gone for a retro vibe with their color scheme and type.

  

  Empty State 

  Split-screen contraflow scrolling and the pop of bright blue against neutrals give Empty State’s home page impact, while the clean layout and clear navigation make the rest of the site pleasant to use.

  

  Kibana 

  Quirky display type and illustrations give this single-page site for Kibana lodge a friendly, welcoming feel.

  

  For Good Design Lab

  For Good Design Lab’s site is simple and bold; it makes a strong statement. And its design works even better on mobile.

  

  Levitate

  Levitate is a sports brand that makes an affordable running blade. Their site has a clean minimal feel, contrasting spaciousness with a sense of movement in the photography used.

  

  Sunst-studio 

  Multidisciplinary creative agency Sunst Studio keeps things simple but impactful with oversized black type on white and smaller images.

  

  Made By Nacho 

  Strong colors and illustrations, with the occasional subtle animation, work well for Made By Nacho.

  

  Flexe 

  Flexe are logistics experts, not the first industry that springs to mind when we think of great website potential, but this one is very appealing.

  

  Friesday 

  This site for Friesday restaurant/takeaway is lively, colorful, and fun.

  

  Go out{side}

  This offshoot site from B.A.S.S. (Bass Anglers Sportsman Society) aims to promote angling as part of an outdoor lifestyle. Earthy colors and a lively visual rhythm create energy.

  

  Protos Car Rentals

  Illustration brings a touch of personality to this site for Protos Car Rentals, while attention to detail pays off in the usability.

  

  21wallpaper 

  21wallpaper offers downloadable screen savers from different illustrators (7 artists, 3 designs each) regularly, which at the same time acts as a showcase for the artists.

  

  Elon’s Toilet 

  This is a brilliant and vital piece of marketing that succeeds in presenting a serious subject in a lighthearted and engaging way. You’ll have to find out for yourself what it’s about.

  

  Pa’lais

  A fresh feeling color scheme, a distinct lack of straight lines, and a scattering of illustration work well for the site for this vegan food producer.

  

  Benjamin Righetti

  Using a primarily visual medium to effectively promote an artist whose medium is sound is not always easy. This website for organist Benjamin Righetti does an outstanding job.

  

  Wavemaker

  Wavemaker is a creative media agency. Their site is strong and confident but with a playfulness that is engaging for the user.

  

  Dpt.

  This site for Dpt. throws out the usual menu concept and has its navigation arranged around the screen. It can be a risky strategy, but here it works well.

  

  Plunt.co

  Plúnt sells mix and match plant and planter combinations. The site’s core functionality is the combination chooser, which is pleasingly reminiscent of an animal flipbook.

  

  Kingdom & Sparrow

  Branding agency Kingdom & Sparrow have gone for a fairly standard approach, but the little hand-drawn details here and there add just enough individuality without overdoing it.

  

  Source

  The post 20 Best New Websites, July 2021 first appeared on Webdesigner Depot.

  

• Popular Design News of the Week: July 19 2021 – July 25, 2021

  Posted:Sun, 25 Jul 2021 14:45:00 +0000

  Every day design fans submit incredible industry stories to our sister-site, Webdesigner News. Our colleagues sift through it, selecting the very best stories from the design, UX, tech, and development worlds and posting them live on the site.

  The best way to keep up with the most important stories for web professionals is to subscribe to Webdesigner News or check out the site regularly. However, in case you missed a day this week, here’s a handy compilation of the top curated stories from the last seven days. Enjoy!

  The Best Olympic Logos of all Time

  

  16 CSS Backdrop-Filter Examples

  

  9 Must-Install Craft CMS Plugins

  

  Adobe Reveals the World’s Favourite Emojis in 2021

  

  14 Must-See Graphic Design Movies You Should Watch

  

  Desech: No-Code Visual HTML/CSS Editor

  

  Of Course We Can Make a CSS-Only Clock

  

  8 CSS & JavaScript Code Snippets for Creating Realistic Animation

  

  What is a Headless CMS and What Does it Mean For SEO?

  

  OOP is Dead. Wait, Really?

  

  Source

  The post Popular Design News of the Week: July 19 2021 – July 25, 2021 first appeared on Webdesigner Depot.

  

• Making Your Mark: 6 Tips for Infusing Brand Essence into Your Website 

  Posted:Thu, 22 Jul 2021 14:45:01 +0000

  What makes a company special? There are hundreds of organizations out there selling fast food, but only one McDonalds. You’ve probably stumbled across dozens of technology companies too, but none of them inspire the same kind of loyalty and commitment as Apple. So why do people fall in love with some companies more than others?

  Most of the time, it comes down to one thing: brand essence. Your brand essence, or brand identity, represents all of the unique components of your business that separate it from the competition. It’s not just about your logo or the brand colors you choose for your website. Your brand essence entails all of the visual assets you use and those less tangible concepts like brand values and personality.

  When your customers decide which companies to buy from, they’re not just looking for another dime-a-dozen venture with the cheapest products. Instead, your audience wants to buy from a business that they feel connected with. That’s where your brand comes in.

  Infusing brand essence into your website helps give your digital presence that extra touch that differentiates you from other similar companies.

  So, how do you get started?

  What is Brand Essence?

  Your brand essence is a collection of core characteristics responsible for defining your brand. More than just a single asset, your essence encompasses everything from your unique tone of voice, from your brand image, your message, and even what you stand for.

  More than just a single asset, your essence encompasses everything

  When you’re trying to boost your chances of sales, a brand essence helps build a kind of affinity with your customers. Your clients see aspects of your character that they can relate to, such as a modern and playful image or a commitment to sustainable practices. It’s that affinity that convinces your customer to choose your company instead of your competition time after time.

  Your website is one of the first places that your customer will visit when looking for answers. They might happen across your site when searching for a key phrase on Google or stumble onto it from social media. When they arrive on your product or home page, everything there should help them make an immediate emotional connection.

  The only problem?

  It’s challenging to portray a unique brand identity through a standard website template. If your site looks the same as a dozen other online stores, how can you convince your customers that you’re better?

  Why Your Website Needs Brand Essence

  First impressions are a big deal.

  In a perfect world, your visitors would land on your website and instantly fall in love with what they find there. So everything from the unique design of your homepage to the pictures on your product pages should delight and impress your audience.

  Unfortunately, if just one element is wrong, then you could also make the wrong impression entirely on your customers too. Adding elements of brand essence to your site will:

  • Build trust with your audience: Your brand should be a consistent component of everything your business does, from selling products to interacting with customers. When your consumers land on your website, everything from your logo to your chosen colors should remind them of who you are and what you stand for. This consistency will lead to better credibility for your business. 
  • Make you stand out: How many other companies just like yours are on the internet today? Your brand essence helps to differentiate you as special by showing what’s truly unique about you. It’s a chance to remind your audience of your values and make them forget all about your competitors. 
  • Create an emotional connection: Brand essence that shows off your unique values, mission, and personality will help create an emotional link with your audience. Remember, people fall in love with the human characteristics behind your brand!

  Easy Ways to Add Brand Essence to your Website

  Since there are so many elements that add up to a strong brand essence, there are also a variety of ways you can add your brand to your website. Whether it’s using specific colors to elicit an emotional response from your fans or adding your unique tone of voice into content, there’s no shortage of ways to show off what makes you special.

  1. Use Your Brand Colors Carefully

  Brand colors are an important part of your brand essence. Walk into Target, and the bright shades of red will instantly energize you. Likewise, when you see a McDonalds, that golden arch logo might instantly remind you of joy and nourishment.

  Color psychology plays a significant role in every brand asset you create, from the packaging you choose for your products to the shades in your logo. With that in mind, you should be using your colors effectively on your website too. Stick with the same selection of shades in every digital environment online.

  For instance, the Knotty Knickers company uses different shades of pink and white to convey feelings of femininity and comfort. Not only is the website packed with this color, but the company also follows through with similar shades on its social media pages too.

  

  Everything from the highlights on the Knotty Kickers Insta to the decorations in their images feature the soft tones of pink that make the company recognizable.

  Remember, consistent use of color is psychologically proven to help improve recognition by up to 80%. So let your colors shine through.

  2. Know Your Type

  Your colors are just one component of your brand essence.

  Fonts and typography are other components that your customers use to recognize and understand your business. There are many different styles of font, and new ones appear all the time. However, your company should have a specific selection of fonts that it uses everywhere.

  If you have a typeface logo, then you might have one specific kind of font for this, like Original Stitch’s logo here:

  

  On top of that, you may also use one font for the “heading” text on your website and something slightly different for the body text. Your heading and body text need to be extremely clear and easy to read on any device if you want to appeal to your target audience.

  However, there’s more to getting your fonts right than choosing something legible. The fonts you pick need to say something about your company and what it stands for. For example, the modern sans-serif font of Original Stitch’s website conveys a sense of forward-thinking cleanliness and style.

  The fonts feel trendy and informal, perfect for a luxury fashion company. Alternatively, a serif font like Garamond might look more formal and professional. So what do you want your customers to think and feel when they see your typography?

  3. Know Your Images

  Stock images look out-of-touch, cliché, and fake. If you cover your website in images like that, then you’re not going to earn the respect of your customers. Instead, it’s up to you to ensure that every graphic on your website conveys the sentiment and personality of your brand.

  Bringing your brand essence into your website design means thinking about how you can convey your values in every element of that site. From the photos of your team that show the real humans behind your products and services to the pictures that you use on your product pages, choose your graphics wisely. If you have dedicated brand colors, you can even include these in your photos.

  Of course, the most valuable graphic on your website should always be your logo. This is the thing that you need to include on all of your website pages to ensure that your audience knows who they’re shopping with. So ensure that no matter how much visual content you have on your page, your logo still stands out.

  Firebox places its logo at the top of the page in the middle of your line of sight, no matter where you go on the website. This ensures that the logo is the thing that instantly grabs attention and reminds consumers of where they are.

  

  Remember to ensure that each of the images you do include in your website is surrounded by plenty of white space so that your customers can see them properly too.

  4. Use the Right Tone of Voice

  It’s easy to get stuck focusing on things like logos and colors when you’re trying to make your brand essence shine through in your website. However, one of the most common things that your customer will recognize you by is your tone of voice.

  Your brand tone of voice is what gives the content you share online personality and depth. It can come through in the kind of words you use, including slang and colloquialisms. In addition, you can add humor to your voice (if it’s appropriate) and even include emojis if that makes sense for your brand.

  With formal words, you can make sure that you come across as reliable, dependable, and sophisticated. With informal words, you’re more likely to convince your audience that you’re friendly and relatable. Sticking with the Firebox example, look at how the company writes its product descriptions.

  Everything from the length of the sentences to the humor in the tone of voice helps to convey something unique about the brand.

  Like all of the elements that bring your brand essence into your website, your tone of voice must remain consistent wherever your customers see it. Make sure that your customer service agents know how to use your voice in chat with customers and that you include that personality on social media too.

  5. Focus on Your Message

  The tone of voice and personality that you showcase in your website and content is crucial to driving success for your business. However, under all of that, the most important thing to do is ensure you’re sending the right message. In other words, what do you want your customers to think and feel when they land on your website?

  If your whole message is that you can make great skincare easy to obtain without asking people to compromise on animal safety, this should be the first thing that comes across when someone arrives on your homepage. That’s why Lush combines clean, simple web pages with credibility-boosting badges that tell customers everything they need to know instantly.

  

  Ensuring that your message can come across correctly means learning how to use all the different brand assets you rely on consistently and effectively. Everything from the colors on your website to how you place trust badges along the bottom of every page makes a difference to how significant and believable your message is.

  Notably, when you know what your core message is, it’s important to repeat it. That means that you don’t just talk about what your ideals and values are on your homepage. You also include references to your message on every product page and the “About” page too. Lush has an entire “ethical charter” on its website, where you can learn more about its activities.

  Having a similar component included within your web design could be an excellent way to confirm what your most crucial considerations are for your customers.

  6. Never Copy the Competition

  Exploring other website designs and ideas created by your competitors is one of the easiest ways to get inspiration. Competitive analysis gives you an insight into the trends and design strategies that are more likely to work for your target audience. It’s also an opportunity for you to learn from your competitors’ wrongs and what they’re doing right.

  However, it would be best if you never allowed your initial research and exploration to go too far. In other words, when you see something great that your competitor is doing, don’t just copy and paste it onto your own website. This is more likely to remind your customers of the other company and send them to that brand than it is to improve your reputation.

  Instead, focus on making your website unique to you. If you’re having trouble with this, then start by looking at your About page. How would you describe your background and your mission as a business to someone who has never heard of you before? What makes your company different from all of the other organizations out there?

  Take the unique features that you rave about on your About page and the personality you try to convey through your employees and bring it into the rest of your website design. The whole point of bringing brand essence into your web design strategy is that it helps to differentiate you from the other companies out there.

  It’s a good idea to protect any assets that other people might try to steal from you too. Copyrighting your logo, your name, and other essential components of your brand will stop people in your industry from treading on your toes too much.

  Make the Most of Your Brand Essence

  Your website is one of the most valuable tools that you’ll have as a brand. It’s an opportunity for you to share your products and services with the world, capture the attention of your target audience, and potentially make sales too. However, it’s important not to forget that your website is also a chance for you to demonstrate what your brand is truly all about.

  Through your brand essence, you can share the unique values and messages that make your company special. But, more importantly, you can use those components to build a deeper relationship with your audience – the kind of connection that leads to dedicated repeat customers and brand loyalty. People connect with other people – after all, not just faceless corporations.

  Once you’ve identified your brand essence, the next step is to make sure that you know how to connect with your customers consistently. Every aspect of your website, application, social media pages, and anything else you make for your business sends the same message.

  Source

  The post Making Your Mark: 6 Tips for Infusing Brand Essence into Your Website  first appeared on Webdesigner Depot.

  

•  7 Top Multipurpose WordPress Themes You Should Check Out

  Posted:Tue, 20 Jul 2021 14:45:23 +0000

  You have been looking for a theme for your website. You haven’t yet settled on all the design details or come across a specialty theme that appears to have what you might need. Then, a multipurpose theme would be a wise choice.

  Multipurpose WordPress themes have become extremely popular because of the flexibility they offer. Also, because of their relative ease of use and the powerful tools, you will usually find built into them.

  With a good multipurpose theme at your fingertips, you are usually in a position to build anything. You can build a simple personal blogging site or a complex multifunctional site for a client. To make life a little easier, most multipurpose WordPress themes have features to help you get started quickly and in the right direction.

  Here is a superb collection of 7 of the top multipurpose WordPress themes on the market today. These themes can help you build virtually any kind of website.

  1. Betheme – Website Builder for WordPress with 600+ Pre-Built Websites

  BeTheme has long been one of the most popular multipurpose WordPress themes. Not content to rest on their laurels, BeTheme’s authors took suggestions from their customers and created a better builder.

  The Live Builder is 60% faster. Its UI is so intuitive that you won’t waste time learning how to use it. It features exciting new and powerful capabilities and performs familiar page-building features better than ever.

  With the Live Builder, you can –

  • Edit live content visually without switching between backend and frontend; you can view an element and customize it simultaneously.
  • Use the Revisions feature to create, save, and restore what you want; no more lost changes thanks to the Autosave, Update, Revision, and Backup options.
  • Access the Pre-built Sections Library: find the section or block you need and add it to your page.
  • Select from the large and diverse selection of Items; categories include typography, boxes, blocks, design elements, loops, etc., to help you create exactly what you have in mind.

  Click on the banner to learn more.

  

  2. Total WordPress Theme

  The introduction emphasized the ease of use and flexibility most multipurpose themes provide. Total has both in abundance thanks to its drag and drop frontend page builder and hundreds of built-in styling options.

  Highlights include –

  • An advanced version of the WPBakery page builder.
  • 40+ single click importable demos, 100+ page-building modules, and 500+ styling settings to help you create exactly what you want.
  • Dynamic Template and Pre-styled Theme Cards to tailor dynamic templates for your posts.
  • Templatera and Slider Revolution plugins plus full WooCommerce compatibility.
  • A selection of developer-friendly hooks, filters, and snippets for future theme customization.

  Even though Total was designed with perfection in mind, or perhaps because of it, it is the right choice if you need to get a high-quality website up and running in a short period of time. Total’s 47,000+ customers seem to agree.

  Click on the banner to learn more.

  

  3. Avada Theme

  The fact that Avada is the all-time best-selling WordPress theme with more than 450,000 sales to date might be all the reason you need to choose it, but there are plenty of other good reasons for doing so as well.

  For example –

  • Avada’s drag and drop page builder, together with the Fusion Page and Fusion Theme options, makes building a website quick and easy.
  • Single-click import demos, stylish design elements, and pre-built websites are there to help speed up your project’s workflow and impart a high level of quality to the finished product.
  • Avada’s Dashboard organizes your work, and its Dynamic Content System gives you maximum flexibility and full control over your project.

  Click on the banner to find out more about this fast, responsive, and WooCommerce-compatible theme.

  

  4. Uncode – Creative Multiuse & WooCommerce WordPress Theme

  Uncode will be an ideal choice for building creative, magazine, and blogging websites and for building agency sites as well. This fast, sleek, pixel-perfect multipurpose theme has sold more than 80,000 copies to date.

  Uncode’s impressive features include –

  • More than 450 Wireframe section templates that can easily be modified and combined.
  • A Frontend Editor on steroids coupled with the WooCommerce custom builder.
  • A “must-see” gallery of user-created websites.

  

  5. TheGem – Creative Multi-Purpose High-Performance WordPress Theme

  TheGem is literally a Swiss Army knife of website building tools that make it ideal for creating business, portfolio, shop, and magazine websites.

  Among the many gems included in the package are these –

  • The popular and industry-leading WPBakery and Elementor front-end page builders.
  • 400+ beautiful pre-built websites and templates together with 300+ pre-designed section templates.
  • A splendid collection of WooCommerce templates for shop-building projects.

  

  6. Impeka – Creative Multipurpose WordPress Theme

  With Impeka, flexibility is almost an understatement. This intuitive, easy-to-work-with multipurpose theme gives beginners and advanced users alike complete freedom to dream up their ideal website and then make it happen – and fast.

  You can –

  • Choose among the Enhanced WPBakery, Elementor, and Gutenberg page builders.
  • Select from 50 handcrafted design elements and Impeka’s 10 custom blocks.

  Impeka is perfect for building every website type, from blogging and online stores to commercial businesses and corporations.

  

  7. Blocksy – Gutenberg WordPress Theme

  Blocksy is a blazing fast and lightweight WordPress theme that was built with the Gutenberg editor in mind and is seamlessly integrated with WooCommerce.

  • Blocksy is responsive, adaptive, translation ready, and SEO optimized.
  • Blocksy plays well with all the popular WordPress page builders, including Elementor, Beaver Builder, and Brizy.

  This popular multipurpose WordPress theme can be used to create any type of website in no time.

  

  Of all the design choices a WordPress user needs to make, choosing a WordPress theme for the task at hand is perhaps the most important.

  That choice, more often than not, involves a multipurpose theme. Most multipurpose WordPress themes are extremely flexible. So, you can avoid the tedious and time-consuming task of trying to find exactly the right one for your niche and for the job.

  Multipurpose themes work for any website niche and offer whatever an admin might need.

  Choose one from these 7 Best Multipurpose WordPress Themes, and you should be able to create your website with relative ease.

  Source

  The post  7 Top Multipurpose WordPress Themes You Should Check Out first appeared on Webdesigner Depot.

  

• 9 Must-Install Craft CMS Plugins

  Posted:Mon, 19 Jul 2021 14:45:31 +0000

  Craft CMS is increasing in popularity, and as it does, the previously relatively scant range of plugins is growing rapidly.

  There are plugins for Craft ranging from simple field utilities to the full ecommerce solution provided by Pixel & Tonic — the makers of Craft.

  An early decision that has borne fruit for Craft has been the plugin licensing model. Paid plugins for Craft charge an initial license fee and then a reduced annual renewal price for updates. This ongoing payment structure ensures plugin maintenance is economically viable for developers, and as a result, Craft plugins tend to be updated more often and are abandoned less.

  The best plugins depend very much on the site you’re developing and what you’re trying to achieve. However, some are so universally useful that I install them on virtually every site I build; here’s a list.

  1. Redactor

  Installing Redactor is a no-brainer when it comes to picking your plugins. Maintained by Pixel & Tonic, it’s a rich text field that extends Craft‘s basic text input. It’s so useful it may as well be part of the core Craft code.

  One of the best features is the ease with which Redactor can be customized. Just duplicate the settings file inside the config directory and edit its contents to alter what editing options are available; it’s simple to create anything from a field with a bold option to a full rich text editor. In addition, each Redactor field can be set to use any of the settings files.

  Free

  2. Retcon

  When you’re outputting code from a rich text field like Redactor, you’ll get clean HTML output — which most of the time is what you want. However, if you’re using something like Tailwind, those classes are non-negotiable. I’m not a fan of Tailwind, but I am a fan of using classes in my CSS selectors instead of element names.

  Retcon is an invaluable plugin that extends Twig filters to supply a host of options when you’re outputting content. It can add classes to elements, insert attributes, modify the element type, and tons more.

  Free

  3. Venveo Bulk Edit

  During the life of a site, there’s a good chance that you’re going to have to alter fields and sections after the content is in. It’s a common problem if you’re importing data from another platform using FeedMe, or if you have an indecisive client, or even if the site is simply growing.

  Venveo Bulk Edit is a plugin that integrates closely with the Craft UI and allows you to edit the contents of multiple entries at once. This plugin has saved me hundreds of hours that would otherwise have been spent painstakingly editing entries one at a time.

  Free

  4. Super Table

  At some point, you’re going to need a configurable list of inputs. Maybe you’re creating a list of documents to download, building a directory, or even your site navigation. You could create a new channel and then add the entries as an entry field, or even set it up with a matrix field, but this is awkward to edit even with Craft 3.7’s new editing experience.

  I’m a big fan of opting for the simplest solution, and in this case, the simplest option is a table field. Unfortunately, Craft’s built-in table field has limited field type support. Super Table, on the other hand, supports almost anything, giving you a powerful, orderable set of fields.

  Free

  5. No-Cache

  Craft has a really powerful caching system. It allows you to cache whole or partial templates, and it‘s intelligent enough to know when you’ve edited content that has been cached so that it can be re-cached.

  Understanding Craft’s caching is vital; as a very general guide, dynamic content benefits from caching, but static content does not.

  However, you will regularly encounter situations where you want to opt out of the caching. A blog post, for example, could be cached, but the time since it was posted must not be, or every post would appear to have been published “today” until the cache is refreshed.

  The No-Cache plugin adds a couple of Twig tags that allow you to temporarily opt-out of the cache. This means that you can cache larger sections of your templates, simplifying your caching decisions considerably while still being able to fine-tune what is cached.

  Free

  6. Retour

  Sooner or later, you’re going to have users hitting 404 errors. If you’re restructuring a site and changing the architecture, it will be sooner. To avoid breaking the UX and SEO, you need to add redirects.

  Retour is a helpful plugin that sits in your dashboard side menu. Anytime a user triggers a 404, Retour will flag it up, so you can decide how to redirect the URL in the future.

  $59 for the first year; $29/year for updates after that

  7. Sherlock

  One of Craft’s big strengths is its security. A lot of attention has gone into making sure that the core installation uses best practices. However, as with any CMS, potential security vulnerabilities start to creep in as soon as you introduce 3rd-party code (WordPress’ biggest vulnerability by far is its plugins).

  You only need to look at the size of the vendor directory in your installation to see how many 3rd-party dependencies your site has. Even a small site is a house of cards.

  Sherlock is a security scanner that performs a number of different tasks to help you stay secure, from checking on security threats in 3rd-party scripts to checking directory permissions. The paid version will even let you limit IP addresses if your site comes under attack — although your hosting company may well do this for you.

  Lite: Free
  Plus: $199 for the first year; $99/year for updates after that
  Pro: $299 for the first year; $149/year for updates after that

  8. Imager X

  Craft’s built-in image transforms are a little limited. For example, they only work with actual assets, not remote images.

  Imager X is an excellent plugin that, among many benefits, allows you to transform remote images. In addition, its refined syntax is perfect for coding complex art direction.

  Imager X isn’t cheap, but considering the enormous importance of image optimization, unless you have a straightforward set of images to manipulate, it’s an investment you’ll be glad you made.

  Lite: $49 for the first year; $29/year for updates after that
  Pro: $99 for the first year; $59/year for updates after that

  9. SEOMatic

  SEOMatic is the SEO solution most Craft developers default to, including Pixel & Tonic themselves.

  You’ll need to define the basics in its settings, and you may find yourself creating extra fields specifically for it to pull data from, but the handy progress bars on its dashboard page will give you an overview of what’s set and what needs to be done.

  SEOMatic is another premium plugin, but implementing it is far simpler and cost-effective than digging through all those meta tags and XML files yourself.

  $99 for the first year; $49/year for updates after that

  Must-Install Craft CMS Plugins

  The Craft ecosystem is rapidly growing, and the diversity of the plugins available increases as Craft is utilized for more and more sites.

  But despite the lure of shiny new plugins, there are some tools that I return to again and again either because they elegantly fill a gap in the core Craft feature set or because I’ve tried them, and I trust them to be robust.

  These are the plugins that I have found most useful in the last couple of years, and installing them is the first thing I do when I set up a new Craft installation.

  Source

  The post 9 Must-Install Craft CMS Plugins first appeared on Webdesigner Depot.

  

• Popular Design News of the Week: July 12 2021 – July 18, 2021

  Posted:Sun, 18 Jul 2021 14:45:13 +0000

  Every day design fans submit incredible industry stories to our sister-site, Webdesigner News. Our colleagues sift through it, selecting the very best stories from the design, UX, tech, and development worlds and posting them live on the site.

  The best way to keep up with the most important stories for web professionals is to subscribe to Webdesigner News or check out the site regularly. However, in case you missed a day this week, here’s a handy compilation of the top curated stories from the last seven days. Enjoy!

  40 New Startup Websites and Landing Pages for Inspiration

  

  Is It Time for Web Designers to Retire the Slider?

  

  Exciting New Tools for Designers, July 2021

  

  24 Beautiful Examples of Gradient Websites

  

  Towards Richer Colors on the Web

  

  3 Kinds of Tech Debt

  

  20 Free Psychedelic Fonts All Designers Must Have

  

  10 Graphic Designers Reimagine the Iconic Instagram Logo

  

  What is WordPress 5.8’s Query Loop Block?

  

  Helvetica Now Variable Offers One Million Fonts in a Single File

  

  Source

  The post Popular Design News of the Week: July 12 2021 – July 18, 2021 first appeared on Webdesigner Depot.

  

• 10 Homepage Design Comparisons to Inspire Your Business in 2022

  Posted:Thu, 15 Jul 2021 14:45:18 +0000

  Looking to give your homepage a well-needed design update in late 2021 or 2022? Not a bad idea; first impressions are crucial when it comes to business websites. But, fixing your homepage and website design is no easy feat.

  Web design trends are evolving faster. Blame the ever-decreasing user’s attention span. The average visitor now spends just 0.5 seconds scanning your homepage to form an opinion about your brand and decide whether to click through or bounce.

  Increased user expectations and uncertainty in the user’s response, which is highly impacted by the site’s first impression, are other reasons to consider. This is why the designs which were trending in 2019 are no longer viable in 2021 or 2022.

  We have curated the ten best examples of homepage designs to inspire your business in 2022, including a rundown of the best strategies and tips.

  Let’s start by highlighting why homepage optimization is necessary for 2022:

  Why Your Homepage Will Be So Important in 2022

  Your website — especially your homepage — is your brand’s first chance to attract, build trust with, and connect with visitors.

  According to recent statistics on why website design is important:

  1. 38% of visitors will stop interacting with a website if they think the layout isn’t visually appealing or intuitive. This creates a higher bounce rate and fewer conversions.
  2. 94% of a visitor’s first impression is based on website design (including colors, fonts, layout, navigation menus, etc.).
  3. 46% of people base a business’s credibility on the aesthetics of its website. Brands with less-than-stellar homepage designs are seen as less trustworthy than companies investing in the visitor experience.

  Think of it the same way as walking into a brick-and-mortar store. Visitors are more enticed by a carefully curated ambiance of neatly stocked shelves and welcoming employees than a store that’s dark, messy, or seemingly unfriendly.

  Using this logic, your homepage’s above-the-fold section is where you’ll greet visitors and reel them in for more.

  10 Homepage Design Comparisons (2019 vs. 2021) To Inspire Your Business Website Design in 2022

  Homepage design has come a long way since 2019. In this section, you will explore how.

  These homepage designs crush it above the fold. Take just a few of these tips to heart, and your website will be poised to attract leads and conversions — no matter which industry you’re in.

  1. Netflix – Crafting The Perfect Call To Action That Reduces Friction With An Additional FAQs Section

  Most businesses make the mistake of adding a CTA button that first persuades the user to click on it and then asks for the visitor’s email address.

  Netflix also did the same in its 2019 design.

  However, Netflix combined both steps in its 2021 homepage design.

  The new, improved 2021 homepage design asks for the user email address right up front along with the CTA button.

  Here is a good comparison of both the designs:

  

  2019 homepage design

  vs.

  

  2021 homepage design

  Key Takeaways:

  • The design encourages visitors to enter their email address right when they land on the homepage. As a result, form submission is much easier when the user has started the process. Hence, Netflix makes it easier for visitors to move along their conversion funnel nicely by reducing the friction.
  • The 2021 design also has a nice FAQ section that provides quick information about the company’s services and improves the overall user experience.
  • FAQs also help increase the organic presence of the website in the search engines because Google presents snippets from the FAQ section in the form of an answer box in the search results.

  2. Spotify – Revamped Color Combinations For Improved CTA Visibility And Using The ‘Rule of Three’ For Heading Text

  The older 2019 Spotify homepage design used light pink and orange colors in its home page main area. The CTA color was green, but if you look closely, the CTA lacks visibility.

  The new 2021 design uses blue and green colors with a much larger font size for the main heading. The colors are attractive, and the CTA is visible clearly.

  Here is the comparison of the Spotify homepage 2019 design vs. 2020 design:

  

  2019 homepage design

  Vs.

  

  2021 homepage design

  Key Takeaways:

  • Blue is the most versatile color, and green is the perfect choice for the CTA button. Spotify used universally accepted color combinations to redesign its homepage and made the CTA more visible.
  • The main heading is also made larger than it was in the 2019 design, and it follows the rule of three in writing which is effective and satisfying. It uses just three words in the main heading to allow the human brain to process information as a pattern that is more memorable.

  3. Hulu – Give Priority To Your Brand Name And Hide Pricing

  If you compare the Hulu 2019 vs. 2021 Hulu homepage, the brand name has been prioritized and shown as the main heading.

  Moreover, the older homepage had pricing information everywhere, which has been reduced intelligently in the new design.

  

  2019 homepage design

  vs.

  

  2021 homepage design

  Key Takeaways:

  • The brand name ‘Hulu’ is displayed as the main heading of the homepage, which helps to build audience trust.
  • The older design persuaded the users to pick a paid plan even though they had a free trial option—this discouraged users from trying their service. The new 2021 design encourages users to try the platform for free. In addition, the packages have prominent CTAs that mention “try for $0”. This design move improves conversions on the website.
  • The new design makes it easier for the visitors to select a viewing plan with easy comparison of the three available plans. The best part is, customers can start all the plans for $0. It’s a win-win situation for the users, and they can quickly pick a plan to start watching Hulu.

  4. Nextiva – Reduce Visual Noise And Add Pictures In Menu To Improve UX

  Nextiva realized the importance of reducing visual noise in its newly designed 2021 homepage. Visual noise happens when you use too many colors to attract user attention. Different colors compete with each other resulting in diluted customer observation.

  In the old 2019 homepage, Nextiva used orange, blue, and green as the primary colors, while in the 2021 revamped design, they have used blue as the main color.

  Here is a comparison of the two designs:

  

  2019 homepage design

  vs.

  

  2021 homepage design

  Moreover, the older homepage didn’t have an image in the product menu, but the new 2021 homepage improves the UX further.

  Below is a comparison:

  

  2019 homepage design

  vs.

  

  2021 homepage design

  Key Takeaways:

  • Nextiva used blue as their base color for the homepage design and removed orange and green colors to reduce visual complexity. This is an excellent change to keep the user’s attention focused. Notice the green colored bar at the top of the homepage in the 2019 version now replaced with blue.
  • The 2021 design has a clean look compared to the 2019 design, which looks scattered with too many different elements, including CTAs that confuse the users.
  • The product menu does an excellent job of linking intelligently to service pages such as phone systems and video meetings. The image of a smiling lady attracts users to click on Nextiva’s products to learn more about them. Improving UX is an impressive way to reduce bounce rates and increase time on site.

  5. GoToMeeting – Avoid Lengthy Sign Up Form, Educate Users About Your Products, and Add Images That Depict The Current Needs of The Audience

  GoToMeeting does a great job educating the users about their product by adding more content on the homepage that comprehensively explains their product features.

  Moreover, they have replaced the older hero image with a new picture that portrays the changing needs of their audiences. Nowadays, there is a rise in work from home culture due to Covid-19. Hence, the photo and the heading text clearly target the needs of their users.

  Here is a comparison of the 2019 vs. 2020 homepage of GoToMeeting:

  

  2019 homepage design

  vs.

  

  2021 homepage design

  Key Takeaways:

  • The 2019 homepage design had a sign-up form on the homepage, which GoToMeeting removed in the 2021 design. People hate to fill in so much information right when they land on the home page. Hence, GoToMeeting did the right thing by removing the signup form from their homepage.
  • The hero image steals the show of the 2021 redesign because the picture of a working mom with her kid playing studying in front of her is a great way to portray the current needs of the society when over 60% of the employees are working from home. Audiences can quickly relate their working environment with the hero image leading to more sign-ups.
  • The older 2019 design was confusing, and it made little effort to help the users understand the different features of the product. The new 2021 homepage design has a product features section that explains the different features of the software. When users are educated about the product, they earn the confidence to try the product.

  6. Zillow – Apply Hick’s Law To Allow Visitors To Take Faster Decisions

  Zillow does an impressive job of applying Hick’s Law in allowing visitors to make faster decisions. Hick’s law states that the more options you present to the users, the faster they will decide. Therefore, it is a major factor in improving website usability.

  The old 2019 homepage design of Zillow offered too many options to the users, like they want to buy, rent, or sell a property. The users first select either one of the three options and then enter the zip code to start their search.

  The new 2021 homepage design changed that. Now, Zillow offers users a single option. They only need to enter the zip code to get started.

  By reducing the number of actions that users need to take to just one, the homepage design eases the overall decision-making process of the site visitors.

  

  2019 homepage design

  vs.

  

  2021 homepage design

  Key Takeaways:

  • The new homepage design has a simple search bar that persuades visitors to take prompt action.
  • The Hero image is placed smartly behind the search bar to depict the needs of the users accurately.
  • The homepage does have three different panels for buying, renting, or selling a home when the users scroll below. The old design is missing that. The new design removed so many options above the fold and kept just a single option for the users to encourage more users to search properties on the site.

  7. Plex – Placement of Prominent Calls-to-Action On Homepage

  The CTA is a key element of every website. It helps the users decide on their next action and helps to convert the visitors into leads.

  Plex lacked an optimized CTA placement in its 2019 home page design. Hence, the 2021 design received an uplift to better place the CTA for increased visitor engagement.

  Take a look at the home page designs of Plex from two different years. If you compare the two home pages of 2019 vs. 2021, the primary difference that will grab your attention is the CTA.

  

  2019 homepage design

  vs.

  

  2021 homepage design

  Key Takeaways:

  • The call-to-action buttons are more prominent and have actionable texts.
  • The number of CTA buttons is increased to two to encourage users to take action.
  • The additional CTA button is wisely placed at the center to get immediate attention.
  • Note that the color choice for the button is also bright and highly contrasts with the background yet matches the color theme.
  • The old heading text ‘Stream Smarter’ was confusing because it didn’t help the users understand what Plex does. Hence it is now revised to ‘Watch Free Movies and TV on Plex.’ The new text is easy to understand and has the word ‘Free’ to increase the number of visitors clicking on the CTA.

  8. Dropbox – More Above The Fold Content And Change of Fonts

  Dropbox has significantly worked on its main content, which is clearly visible in the comparison homepage design images of 2019 vs. 2021.

  The 2021 homepage is seen fixing faded, minimalistic, and less engaging content in the older homepage.

  

  2019 homepage design

  vs.

  

  2021 homepage design

  Key Takeaways:

  • Sans serifs, with their clean readability, are included for longer bouts of the homepage.
  • Bold sans text is doing the job of drawing user attention effortlessly.
  • The color contrast of the text with the background is increased, which improves the visibility.
  • The right side image of a laptop is replaced with a screenshot of the software, which intrigues users to know more.

  9. Cisco – Moving Blocks To Outsmart Competitor Websites

  The homepage design of American technology company Cisco has seen a drastic change in 2021; it deserves to appear on this list. The company website smartly represents an appeal for future development through its killer homepage design.

  Here is a comparison of the old 2019 homepage design vs. the new moving block design of 2021:

  

  2019 homepage design

  vs.

  

  2021 homepage design

  Key Takeaways

  • The home page contains moving blocks with news from the blog. As you hover over the image, it widens up, and a CTA button appears. The blocks represent a design of the future which the competitors might find hard to replicate.
  • Every block has a CTA, which was missing in the 2019 design. Each block represents a specific Cisco service and caters to the different needs of the visitors.
  • The new design is elegant and cleaner with lots of information.

  10. Slack – Product Video On Home Page For More Conversions

  Slack has made it easier for the users to understand the product well by using a video on the homepage.

  The 2019 design has an image, while the 2021 design has a video that helps the visitors understand how the product works.

  Here is a comparison of the 2019 design vs. 2021 design:

  

  2019 homepage design

  vs.

  

  2021 homepage design

  Key Takeaways

  • The inclusion of a product video leaves a great impression in the minds of the visitors and shows them what your product does.
  • Video helps Slack to make its value proposition clear and super fast.
  • Video has a strong correlation to conversions, and they work well as compared to hero images. Slack used a hero image on the homepage in 2019, but they replaced it with a video in 2021.

  Final Thoughts on Using These Homepage Designs for Inspiration in 2021

  By making it to this point in our guide, you now have plenty of inspiration to run with when upgrading your homepage. You should also have a better understanding of how powerful this tool may become for your brand.

  So now it’s time to brainstorm how to use these ideas for your own 2021 homepage design. First, jot down the key points from this guide and honestly assess how your website currently compares.

  Accomplish this task, and your brand might see an uptick in website traffic and conversions. It may even earn a spot in a roundup of killer website designs just like this one.

  Source

  The post 10 Homepage Design Comparisons to Inspire Your Business in 2022 first appeared on Webdesigner Depot.

  

FeedBurner delivers the world's subscriptions wherever they need to go. Publish a feed for text or podcasting?
You should try FeedBurner today.