Articles

10 Great WordPress Plugins in 2023

,

WordPress is a highly flexible content management system for website creation. A key reason for this flexibility is the wide variety of plugins available. You can add features and other improvements to your site.

The thousands of available useful WordPress plugins cover almost every feature for any type of website. Your website’s niche determines the kind of plugins you should have. There are some great WordPress plugins that every blog site needs; security, speed, SEO, and contact form, to name several.

The most effective WordPress websites create an enjoyable visitor experience. Whether you’re blogging about the latest fashion trends or selling products for your brand, you can enhance your website. Do it with one or more of these ten great WordPress plugins.

1. Brizy: The Best Website Builder for Non-techies

You might want to approach Brizy with caution because once you start using it, no other website theme builder you might try will ever seem as easy to use. Even better, you can download this WordPress website builder for non-techies (and for techies as well) for Free.

With the Brizy WordPress theme builder at your fingertips, you can –

  • build a brand new website or upgrade an existing one;
  • create dynamic templates for your blog and archive pages, headers, footers, custom pages, and more;
  • enjoy instant access to 150+ customer-friendly pre-made templates;
  • build your blog exactly as you envisioned it;
  • easily customize your WooCommerce shop site.

Brizy’s Theme Builder, Global Blocks, and Global Styling features are right at your fingertips, and WooCommerce integration is also included.

You can also choose the 100% White Label option if you wish to brand the Brizy Builder as your own. A Pro option is available.

Click on the banner to learn more about Brizy and download it free.

2. WpDataTables – WordPress tables plugin

While there are a host of good reasons for using wpDataTables, the main benefit is that it works with any WordPress theme, it can create a responsive table in minutes, and it requires no coding to use.

With this WordPress tables plugin, you can take advantage of a host of useful features that include –

  • four chart-building engines: Google Charts, Highcharts, Chart.js, and the new Apex Charts;
  • connecting to multiple database sources, e.g., MYSQL, MS SQL, and PostgreSQL;
  • fine-tuning a table or chart to make it responsive or editable and using conditional formatting to highlight critical data;
  • the ability to create tables from a nested JSON file;
  • and use dynamic single-cell shortcodes in many different options;
  • integration with Elementor, Divi, WPBakery, and Avada.

wpDataTables is a robust table and chart-building plugin that’s remarkably straightforward. Just click on the banner to learn more.

3. Amelia – WordPress booking plugin

Amelia is a WordPress booking plugin that can fully automate and streamline its appointment booking operations when added to a business’s WordPress site. This makes Amelia an excellent choice for beauty, healthcare, fitness, consulting, educational, and similar client-dependent businesses.

The Amelia plugin can –

  • manage an unlimited number of appointment bookings at multiple locations, and do so from a single platform and dashboard;
  • enable clients to book appointments online 24/7;
  • easily manage group appointments, package bookings, and events;
  • send notifications and reminders to clients via Email or SMS, and make payments online with PayPal, Stripe, Mollie, or Razor;
  • customize booking forms to match its host’s brand.

Click on the banner to find out more about how the Amelia WordPress plugin could be used to upgrade your business’s booking operations.

4. Slider Revolution – more than a WordPress slider plugin

Slider Revolution is a WordPress plugin that is more than just a slider plugin. It’s a highly popular plugin that designers rely on to create visuals they know their clients and customers will love.

Slider Revolution features –

  • 250+ website and slider templates designed to impress;
  • innovative website animation effects and other features that push the boundaries of what is possible in web design.

Slider Revolution is trusted by over 9 million users around the world.

5. WordLift – AI-powered SEO

Structured data helps your website speak the language of Google, and WordLift is the most innovative way to create one.

It is an AI-powered SEO tool that: 

  • adds structured data to your content;
  • creates a Knowledge Graph that makes it easier for Google to understand the relevance of pages, their relationship, and their value;
  • build up the expertise, authority, and trustworthiness of your website.

As a result, you get more organic traffic and audience engagement.

6. TheDock – Ship Solid Websites

TheDock is a design team-oriented WordPress theme builder that supports collaboration, speeds up website design, and helps to create sites that look sharp, perform great, and are easily maintained because of its –

  • custom Post Types and Custom Fields;
  • speedy page load;
  • flexible auto-adjusting layout system with UI components;
  • white-label builder for sharing access to TheDock if you want to;
  • built-in features that assure excellent security and easy maintenance.

7. Download Monitor – Best WordPress Download Manager

Download Monitor is a WordPress downloads manager that can help you streamline your business operations without having to go through the process of setting up a complicated or costly tracking solution.

With the Download Monitor plugin, you can –

  • track any type of file download (ZIP, PPT, XSLX, PDF, etc.);
  • assemble aggregated file download statistics about different file download types;
  • establish access rules based on user roles and download quotas.

8. Essential Grid – best WordPress grid plugin

Essential Grid is, by all accounts, the best WordPress grid plugin on the market. Essential Grid makes it ever so easy to spice up your websites by using it to create superbly engaging and professional-looking galleries.

This WordPress plugin can give you –

  • stunning, fully customizable boxed and full-width to full-screen grid layout options and various grid designs;
  • responsive designs that enable you to control grid appearance on various devices;
  • access to social media content. 

9. LayerSlider – Best WordPress Slider Builder Plugin

LayerSlider is the best WordPress slider plugin, but it is not just for sliders. Create image galleries, popups, landing pages, animated page blocks, parallax and scroll scenes, and even full websites.

LayerSlider –

  • will fit your needs and is easy to use;
  • can spice up and add flair and style to an otherwise run-of-the-mill website;
  • supports any WordPress theme and page builder;
  • features 210+ highly customizable websites, slider, and popup templates.

10. YellowPencil – Visual CSS Editor

YellowPencil is a visual CSS editor you can use to customize any WordPress site in minutes.

Key features include –

  • a complete visual editing interface that allows you to redesign a page with a few clicks;
  • a simple interface that does not require coding;
  • the capability to edit any font and any color;
  • the capability to visually edit a design element’s size, margin, and padding properties;
  • the ability to undo/redo mistakes.

*******

It is almost needless to tell any WordPress user how important plugins are for a website. A good WordPress plugin has the power to boost the success of your business online by adding a range of helpful features and functionality to your website.

In this article, we have shared our expert pick of 10 great WordPress plugins for your websites in 2023.

 

[– This is a sponsored post on behalf of BAW media –]

Source

The post 10 Great WordPress Plugins in 2023 first appeared on Webdesigner Depot.

Source de l’article sur Webdesignerdepot

/par

6 Predictions for Web Design in 2023

,

Welcome to our annual guessing game of what the next twelve months will bring.

As ever, the design world isn’t isolated from the world in which it exists, so when events shape our lives, they impact our work, the work clients ask for, and the work that inspires us. According to Collins Dictionary, the word of the year for 2022 was permacrisis. And frankly, 2023 doesn’t look any less turbulent, with some good and some bad things already on the horizon.

Russia seems all but certain to retreat to Crimea and claim its objectives in Ukraine have been achieved; Ukraine may not accept that end, but it will probably be enough to end sanctions against Russia, which will significantly impact the economy worldwide. Brazil may have been forced to watch Argentina lift the FIFA World Cup, but it has a new (old) president and fresh hope for the survival of the Amazon rainforest. Crypto has weathered a series of storms (although there may be more to come), and historical precedence suggests the bear market has run its course; 2023 will see stagnation, with an upward trend taking hold toward the end of the year. The former Pope has died, potentially paving the way for the retirement of the current Pope and the election of a new Pope, bringing with it either renewed liberalism or renewed conservatism to the world’s largest religion. Oh, and the IMF thinks a third of the world will be in recession at some point in 2023; the UK and Russia already are, and policymakers in the US are looking nervous.

And that’s just the obvious. Of course, there will be surprises, too, because there always are.

Against this backdrop, designers must not only navigate a problematic jobs market but produce designs that respond to the needs and desires of their clients’ users.

How Did I Do in 2022?

Before diving into this year’s predictions, let’s take a look at how I thought 2022 would play out.

I predicted that 2022 would be the year of blockchain, with decentralized data storage taking over. Well, I got the decentralized part right, but not so much the blockchain aspect (feel free to tell me I’m wrong on Mastodon because I’m not checking Twitter anymore). I’ll call that half a point.

I said design would be positive, playful, and accessible. I think design did emerge from its obsession with corporate minimalism, but positive and playful? Unfortunately, I’m calling that a miss.

I said everything would be green. Again, that’s a miss. If there was a color for 2022, it was a pink-purple gradient.

I predicted hero text would replace hero images, and in the third quarter of 2022, that’s exactly the trend we saw; tick.

Finally, I suggested that illustration would adopt a grainy texture. Well, some designers did, but it was hardly a dominant trend, so I’m going to have to call that a miss.

So for my 2022 predictions, I scored 30%. Way worse than last year’s clean sweep. Let’s see if we can’t beat that in 2023…

1. We’ll Stop Freaking Out Over AI

By now, you’ve probably tried AI, freaked out, and Googled how to start a small holding in the mountains.

The truth is that AI is just a tool. And a good one at that. AI is really good at derivative work. But it’s entirely incapable of improvising, holding opinions, having an agenda, or thinking outside the box.

AI will not replace your job — unless your job is deleting the background from photos, in which case it already has. Since when did Stephen King get replaced by a spellchecker?

If you haven’t tried an AI tool yet, I’d encourage you to try it. It does the small repetitive tasks well.

2. We’ll Embrace the Real World

One of the reasons AI can’t be creative is that it doesn’t have the same number of input sensors we have. We can smell, hear, feel, and experience the world in a multitude of different ways.

Most of us spent a year in lockdown working remotely. Then rushed back to the office, only to discover that our teamwork didn’t actually improve. With the worsening economic outlook, big companies are looking to budget, and the simplest way to cut costs is to ask staff to work remotely.

When your commute is a five-second walk to the spare bedroom, you find yourself with more free time. Sure, you could probably learn Python, but wouldn’t you be happier learning to paddleboard?

As we open ourselves to new experiences, our design work will inevitably become more diverse and natural.

3. We’ll Reject Brutalism

It had a good run, but Brutalism isn’t a good fit for most UI projects. The trend of 2021–22 will vanish as quickly and as unexpectedly as it arrived.

4. We’ll Reject Darkmode

It has had a good run, and dark mode is a perfect fit for most UI projects. But we’re all kinda sick of it.

I hope I’m wrong about this one; not only is dark mode genuinely better for both your eyes and the environment, but the rich, warm blackness is the perfect antidote to sterile white corpo-minimalism.

Dark mode options are built into our OS, so it’s doubtful that it’s going to vanish anytime soon. However, dark mode as a design trend for its own sake is probably on the wane.

Typically trends come and go in symmetrical waves. Dark mode has been a dominant trend for years, so it should take as long to vanish completely.

5. We’ll Embrace Personal Retro

Every year we get the exciting job of guessing which decade the zeitgeist will rip off next. Will 2023 be the year of ’80s retro, ’90s retro, ’00s retro, or maybe (somebody shoot me) ’10s retro?

The retro trends we’ve seen over the last few years have been poor pastiches of their associated decades. If last year’s ’90s retro was inspired by the ’90s, it was a ’90s someone else was living.

In 2023 we’ll move beyond someone else’s ideas of what the past was like, to a personal vision of what came before. One in which the sunbleached colors of eternal Summers in the suburbs dominate.

6. We’ll Fall For Borecore

We’re all guilty of designing with our egos from time to time, and there is a tendency to hit users between the eyes with the biggest type, the loudest gradient, and the flashiest animation.

If you truly want to impress users in 2023, stop inserting pop-ups, adverts, cookie notices, and the other extraneous detritus that stops them from doing whatever it is they arrived on your site for. Impressing users in 2023 means clean typography, low-distraction art direction, and helpful content. Boring design just isn’t as boring as it used to be.

In 2023, the best thing designers can do for their users is get out of the way.

Happy New year! We hope it’s a good one.

 

Featured image by myriammira on Freepik

Source

The post 6 Predictions for Web Design in 2023 first appeared on Webdesigner Depot.

Source de l’article sur Webdesignerdepot

/par

50 Best Websites of 2022

,

We’ve seen some incredible websites in 2022. There have been more than the usual number of sites with a political mission, and plenty that made us want to travel. The big design trends were brutalism, huge typography, and bold positive color. We’re looking forward to what the web will bring in 2023, but in the meantime, take a look back at the best 50 websites of 2022. Enjoy!

Justice Reskill

Justice Reskill used bright colors and positive, uplifting artwork to create a supportive platform for people who’ve been through the justice system.

Pienso

Bold type and plenty of on-scroll animation made this site for Pienso stand out back in January.

Gazelle No.1

The promotional site for Gazelle No.1 used innovative scroll-activated video to sell the electric bike.

Mekanism

Mekanism’s site was the first agency redesign to impress us in 2022. Super-polished then, super-polished now.

Redbrick

Redbrick was well ahead of the trend for brutalism with a twist when it released this site promoting its coffee.

SOS Foods

Ethical and sustainable goods were top of the sales charts in 2022, and SOS Foods did a great job capitalizing on the style.

Hartzler Dairy

Hartzler Dairy embraced its mid-20th-century branding with a nostalgia-infused site.

Engineered Floors

Even in 2022, designers are still paying mobile short shrift, but this site for Engineered Floors is excellent on mobile.

Emi Ozaki

We loved the quirkiness of Emi Ozaki’s phone-style interface for her portfolio back in February.

I Killed A Cactus

I Killed A Cactus is a beautiful 3D site designed to help people care for houseplants.

Aris Hotel

We were tempted in the direction of Crete by this stunning luxury site for Aris Hotel on the island.

Milton Textiles

Milton Textiles is a big, bold site for a product that is usually an afterthought in the interior design world.

MAAP

The site for MAAP is predictably excellent, modern, and efficient. It encapsulated the apparel brand’s values perfectly.

Garden Eight

The promotional site for Garden Eight, a digital design studio in Tokyo and Copenhagen, was suitably standout eccentric.

Circus Shanghai

Circus Shanghai used a mid-century illustration style to reference the solar system and the Chinese flag.

Normand

Normand took the bold decision to step away from the typical law firm design strategy.

SND

Designing a site for UI sound kits is challenging, but SND pulled it off perfectly with this minimal site.

Polybion

We saw lots of brutalism in 2022, and Polybion’s site was a standout example of how to make the trend work.

neueMeta

Bold block coloring added depth and interest to this portfolio site for design studio neueMeta.

Dumpling Delivery

OK, we confess we spent waaay too much time playing this dumpling delivery game from Mailchimp back in May.

Nowhere Bakery

Nowhere Bakery succeeded in making vegan, paleo, gluten-free cookies seem appealing.

Triniti

We were mesmerized by the perpetual motion video for the pan-Baltic law firm Triniti.

Kim Kniepp

Kim Kniepp’s site impressed us with interconnected navigation and a superbly coded masonry grid.

Feed The 300

Feed The 300 is one of dozens of great sites to combat Russia’s invasion of Ukraine. In this case, it was aimed at feeding zoo animals.

Icons By Menu

Icons By Menu is a stunning minimalist site that is a pleasure to browse.

Museum Of Pink Art

The Museum of Pink Art is an immersive experience celebrating the color pink. It was easy to lose hours wandering around.

BelArosa Chalet

2022 was the year of illustrations, and BelArosa Chalet’s site used them to significant effect to sell a venue still under construction.

WTFFF

Online sexual abuse and harassment are particularly appalling when directed at young people. WTFFF tackled the issue sensitively.

Pretty Damn Quick

Logistics aren’t the most engaging topic, but this friendly, illustrated site for Pretty Damn Quick grabbed us immediately.

Norwegian Soda Co.

This site for the Norwegian Soda Co. uses beautiful photography to create an engaging one-page site.

Fornasetti Profumi

Fornasetti Profumi wowed us with its long-form videos used to emphasize stillness and calm.

Laesk Kombucha

We were convinced this site for Laesk Kombucha had been produced by Wes Anderson.

Cased In Time

Single-product sites are often underwhelming, but this excellent ecommerce site bucks that trend.

DS & Durga

Eschewing the well-trod approach of flowers and pretty models, this perfume site for DS & Durga fully embraces the brutalist trend.

Daniel Spatzek

We loved the way Daniel Spatzek’s portfolio site broke all the rules and still managed to be informative and engaging.

Aro

Aro kept minimalism alive with a simple site that exudes luxury while selling a simple concept.

Think Packaging

Think Packaging took a case study approach to present its products, and it worked really well.

Steffie de Leeuw

Giant typography intertwined with botanical illustrations created a memorable site for Steffie de Leeuw.

Anna Jóna

The prelaunch teaser site for the Ana Jóna café and cinema was elegant and modern and had us eyeing a long weekend in Reykjavik.

Das Salz

More wanderlust courtesy of the fresh, enticing site for the Das Salz hotel and café.

Jono Pandolfi

This simple-to-use site for US tableware and cookware brand Jono Pandolfi sold us on hand-made ceramics.

LolaVie

We still can’t get over the fact that it took until 2022 for Jennifer Aniston to produce a haircare range.

Nathan Riley

Another big trend in 2022 was masonry-style sites, and this portfolio for Nathan Riley was one of our favorites.

Capsul’in Pro

With the excellent application of animation and careful use of color, this site for Capsul’in Pro transformed coffee pods into luxury items.

Seen

Seen is an essential site that explores themes of prejudice and racism in creative fields. It’s a strong approach to a difficult subject.

Glasfurd & Walker

Glasfurd and Walker’s superb portfolio site sets itself apart by over-extending the viewport. It’s a highly original idea.

The Other Side Of Truth

The Other Side of Truth is the standout site of 2022. It used the web expertly to present two interpretations of the facts surrounding the Russian invasion of Ukraine.

Bannach

Back in October, we fell in love with the pixel-block animation loading for the Bannach furniture brand.

Karina Sirqueira

Karina Sirqueira’s portfolio was a joy to browse through. The morphing shapes imposed simplicity on a series of beautifully presented case studies.

Joshua’s World

We were amazed by Joshua’s World, a little island that can be titled and rotated to power the little cyclist along his career.

Source

The post 50 Best Websites of 2022 first appeared on Webdesigner Depot.

Source de l’article sur Webdesignerdepot

/par

3 Essential Design Trends, December 2022

,

As we head into the final month of 2022, plenty of new ideas and website design trends are still emerging. The evolution throughout the year has been exciting and designed to help website designers and developers create greater engagement and interactivity while pushing the envelope. These trends are no exception.

Here’s what’s trending in design this month.

1. Video Game Inspiration

That space where reality and virtual reality merge is popular for website design. Trending are design elements and themes with a pseudo-video game style that looks interactive, somewhat real, and much imagined.

These websites can have a variety of looks and themes but have a few key elements in common:

  • Plenty of animation
  • Interactive elements, real or perceived
  • Fast motion that puts the user in the scene
  • ”Unreal elements” such as the bat-skull for Mythical Games
  • Dark color schemes
  • Often lack traditional navigation or calls to action so that the “game” is the whole screen
  • Leading text or design elements to help you move through interactions

Each of these examples takes a similar but different approach with their video-game-inspired design styles.

Adidas uses a three-dimensional trio of people in flight to get you interested in jobs at their animation studio. The point of view makes you feel part of the action, but traditional design elements, such as navigation, help you know what to do next.

Mutant Stand looks like an old-school video game and moves between a home screen with navigational elements to more of an in-game experience. The motion creates an interactive feel even before you dive into the design.

Mythical Games is an actual gaming website design, so you would expect video game inspiration here. Interestingly, this site takes the most subtle approach, although the design elements of fantasy are strong here.

2. Difficult Typography

Sometimes website design trends can be tough to explain. That’s the case with this one, where designers are experimenting with very difficult typography styles. What’s difficult about the text in these projects is readability.

Difficult typography is somewhat subjective but is emphasized by designs that have a lot of words. The reading challenge extends to mobile design, particularly when these fonts are smaller and can present even greater readability issues.

There are a lot of different styles and combinations of typefaces that can cause readability challenges. Some of the most common for website design include:

  • Condensed or thin typefaces
  • Unusual character styles or strokes
  • Modern or thick serifs
  • Old world styles
  • Scripts or cursive styles

All of this, though, is somewhat in the eye of the beholder. While these examples all present some reading challenges, the designs are still interesting and visually sound. Whether to make these font choices is a personal choice, but you should pay attention to your audience base and website analytics to make sure it works for you.

Here’s where you probably see a lot of this trend outside of website design. Pay attention to the typefaces used for World Cup broadcasts. Difficult typefaces are paired for all on-screen text elements.

Kakeru Yagou uses an interesting modern serif with a bit of a tilted style. As a logotype, the typography works pretty well. It is when there’s a lot to read that the challenge comes into play.

Abymes Numerique uses a condensed typeface in an all-caps style. Either of these options alone might create less of a readability concern than when paired.

Think Dance uses an incredibly interesting but difficult typeface for the two keywords on its website. They do an excellent job by using only two words and pairing them with easy-to-read options everywhere else. But it still takes a minute to think about and comprehend the words, so you can argue the effectiveness of the font choice.

3. Avatars

Already popular on social media platforms such as Snapchat and Facebook, avatars are having a pretty big moment in website design as well. The big difference is that website avatars aren’t just cartoon heads, they can include full-body designs and animated effects.

Avatars can have an extremely personal look and feel, such as when they are used for portfolio websites or be more character-oriented. Both are an excellent way to use faces and incorporate somewhat of a personal element when you don’t have the right photography for the job or want a greater element of whimsy in the design.

Simona Nikolova uses an oversized avatar for her portfolio site. She pairs it with her name to create a connection with users, and the style shows her creativity as well. An avatar is a good way to “show yourself” in a portfolio without the privacy concerns that might come with an actual photo.

Byte Trading uses “Lego-style” avatars to get you interested enough to “enter” the website. Each avatar moves and changes clothing to get you ready to enter the website for the crypto marketplace. Avatars are a popular option for crypto and NFT websites.

Pomelo Paradigm uses three-dimensional avatars to create scenes throughout its website. These created characters help explain what the company does and interactions people should have with the design. They have very human looks, and you almost don’t miss that they aren’t actual photographs.

Conclusion

As we head into a new year, what website design trends are you most excited for? Do you plan to try new things with projects in the new year? Hopefully, these trends give you some ideas and jumpstart that inspiration heading into 2023.

Source

The post 3 Essential Design Trends, December 2022 first appeared on Webdesigner Depot.

Source de l’article sur Webdesignerdepot

/par

20 Best New Websites, November 2022

,

Every month we put together this collection of the best new websites we’ve seen appear on the web in the previous four weeks.

In this month’s collection, you’ll find lots of daring interactions, some inventive portfolio sites, florescent yellow colors, and even some old-school mouse trails. Enjoy!

Joshua’s World

Joshua’s World is a fantastic animated site. Grab and drag to tilt and rotate the island and watch the little cyclist power past important links to milestones in his creative career.

Vana

Vana is a new service aiming to help you take control of your data. Its site is modern and lively and uses some great retro-illustrations to bring its features to life.

Velocity Nitro 2

This slick site has some incredible 3D renders for the Puma Velocity Nitro 2 running shoe. The scrollable animation guides you through each feature in a thrillingly engaging fashion.

Norwegian Soda Co.

The Norwegian Soda Co. uses beautifully shot photographs to capture the zest of its products. It’s an excellent example of how a one-page site can be rich and engaging.

Anytype

Anytype is a collaborative platform pitching itself to creative thinkers. It uses a lovely gradient animation to create a sense of power and technological evolution.

Dash

Dash claims to be almost the best tech company, and its modest site does a great job of expelling the tedium from HR. Plus, it has an old-school mouse trail!

Sileon

Sileon is a site packed with clever details. For example, the hover effect on text links is pleasingly minimal, and the photography shot through distortion is a simple but effective technique.

Karina Sirqueira

Karina Sirqueira’s portfolio is a joy to browse through. The morphing shapes add interest to a collection of case studies that are engaging and beautifully presented.

Hotel Santa Caterina

This beautiful website for the Hotel Santa Caterina on the Amalfi Coast captures the light and wonder of the region with a muted color palette and stunning photography.

La Lulu

La Lulu is a Columbian-American singer, dancer, and musician. Her site uses color to disrupt a fairly standard layout and infuse it with amazonian, psychotropic, South American vibes.

International Magic

International Magic is a design agency that boasts some impressive clients, from Maison Margiela to Nike. Its scroll-to-browse portfolio is a masterful example of selling design.

OAD

OAD uses color expertly to convey contrasting temperatures. At this time of year, who doesn’t want a pullover crafted to withstand the Norwegian weather?

También

También is a creative agency specializing in organizations that positively impact the world. Its scrolling collage of client projects is one of the best examples of this type of portfolio.

Dragonfly

If you were designing a website to be used in a 90s film about the internet, you’d create Dragonfly’s site. It’s packed with glitches, code references, and awesome pixelated imagery.

Elva

There’s a lot of distortion entering the design lexicon at the moment, and one of the best examples is Elva’s portfolio site, which uses it to enliven its black-and-white site.

Sussex Taps

Sussex Taps uses multiple full-screen video clips to sell its carbon-neutral tapware range, but it’s the horizontal scrolling product videos that really make this site stand out.

Angello Torres

Angello Torres’ portfolio is packed with daring typography that breaks pretty much all the rules and yet still manages to work somehow to convey energy and creativity.

Repeat

Repeat is an excellent service for upselling customers with repeat orders. It uses simple illustrations to represent generic products with an attention-grabbing yellow for interactions.

High Five Strategies

High Five Strategies eschew the formality of most business pitches to deliver a positive message with bold colors and typography that makes you feel ready to move forward.

Delight

Delight Snowparks employs a questionable lilac color, but its fantastic imagery and video framing more than makes up for that. Plus, there’s another super-old-school mouse trail!

Source

The post 20 Best New Websites, November 2022 first appeared on Webdesigner Depot.

Source de l’article sur Webdesignerdepot

/par

3 Essential Design Trends, November 2022

,

Color and depth are key themes this month as we look at what design trends are happening across websites. Red is the primary color of choice, and you can see it almost everywhere; the new thing is that it’s being used in backgrounds and as more than an accent color. Additionally, 3D elements and depth of field are making significant impressions.

Here’s what’s trending in design this month.

1. Red Backgrounds

Red is the color of power, passion, and attention, but until recently, it wasn’t the go-to choice for website backgrounds. Now trending is red as a background color.

These designs are bold and in-your-face with bright color, an almost brash feel in some cases, and a lot of impact.

But it works.

In the projects below, red is a powerful tool to help convey the message of the website design. The color demands that you engage with the design to see what’s happening and the content therein, and in the case of Pentel, it’s part of the brand color.

Arze uses a bold red background with a smaller inset of contrasting color to show items on the site. It’s an interesting and quite bold choice. The red background carries through the scroll as well. This is a use of color that verges on off-putting but still gets the point across and helps show products thanks to a lot of contrast.

Russia Invaded Ukraine is a perfect use of red as a color that invokes feelings of passion with content to explain the conflict. Red can be a charged color; here, that’s precisely the intent.

Pentel uses a red background that’s a little softer than the previous examples. Here, red is a brand color, and they use the background to help draw attention to items and elements on the site. The red carries below the scroll as well to keep the theme moving.

 

 

2. 3D Icons and Graphics

Three-dimensional elements seem to keep ebbing and flowing with designers. We see a lot of 3D in projects, and then it seems to vanish again. It’s like we haven’t really figured out how to use it well or in a way that works with the content of various designs.

Admittedly, 3D icons, graphics, and illustrations can be difficult to create and use. Often they look a bit light and don’t go with all kinds of content. Therefore, they don’t get used that often.

Each of these projects takes a different approach:
Admilk goes all in with a series of 3D animations featuring the brand name. They are fun, light, and a bit unexpected. The graphics include objects that look like balloons, milk and cereal, and grass with flowers. (Click through to see each one.)

Refokus uses three-dimensional objects that move on a scroll to create directional flow and visual interest in a space where there’s not much else in terms of art. The objects stick with the aesthetic on the scroll and create an interesting element that carries you through the design without overwhelming you with tricks.

Junni is one of those website designs that goes all in with 3D. This illustrated bubble style of graphics is beginning to be a 3D trend in itself as a style that’s being used more and more with icons and even emojis. It has a light feel, and the animation almost makes it seem silly and somewhat childish.

 

 

3. Long Focal Depth

It’s been a while since a true photography or videography trend made this roundup, but there are so many instance of this image/video style in projects it can’t be ignored. Long focal depth is almost everywhere, from travel sites to architecture to e-commerce.

Long focal depth or depth of field allows the image to show a lot of space in an image in a way that’s sharp and viewable. Depth of field, in photography terms, is the distance between the closest and farthest objects in an image that are acceptably sharp.

In this trend, each website features a strong image with plenty of depth of field. The image can be still or moving, and the image is the thing that really draws you into the design.

What’s great about this trend is that you can see a lot of a scene and even feel like you are part of it. It’s an engaging visual concept that can work for a variety of purposes.

Interest Media uses a video reel that slowly zooms even further out. The image is lovely, and with the text overlay is easy to read and understand. It almost feels like you are walking backward on the bridge in the video.

Bloomingdales uses an immersive video with plenty of depth and virtual reality elements to create an immersive shopping experience. It makes you feel like you are in the store via the website and encourages shopping. It’s a fun way for the retailer to showcase its 150th anniversary.

 

Arredamento Design uses a photo with a wide focal area to provide interior design inspiration. Note the crisp lines and ease of which you find yourself engaging with the image, or even imagining a room like the one pictured. The effect used in the design, with a zoom on scroll, pulls the user into the image even more. Depth here keeps the motion and zoom from being too much and almost allows you to see more and feel even closer to objects that are further away in the image.

 

 

Conclusion

There are two trends here that tend to cross over into one another: The color red is everywhere and having a major emergence this fall as a dominant hue and depth, and three-dimensional focus is everywhere.

Both are highly usable design elements that can be incorporated easily, making them even more likely to continue to gain prominence in projects.

Source

The post 3 Essential Design Trends, November 2022 first appeared on Webdesigner Depot.

Source de l’article sur Webdesignerdepot

/par

20 Best New Websites, October 2022

,

The design world fluctuates back and forth, swerving between love and hate for different design trends. Sometimes we see a wide range of approaches, and sometimes designers all hop on the same idea.

This month, the web is dominated by animation. Designers are cramming in motion in unexpected ways. And it’s fun to explore. Here are 20 of the best new sites on the web this month. Enjoy!

Bannach

Bannach is a German furniture brand. Its products are colorful and geometric, so it makes sense that when you scroll down to the collection, the thumbnails begin as pixel blocks and animate into product photography.

Fornasetti Profumi

Fornasetti Profumi takes a different approach to motion. It uses video to emphasize stillness to promote the calming qualities of its candle products.

The Other Side of Truth

The Other Side of Truth is a superb exercise in utilizing the web for a cause. It presents facts on the Russia-Ukraine war, but the standout feature is the toggle switch that, instead of light mode-dark mode, toggles facts and Russian state propaganda.

Glasfurd & Walker

Glasfurd & Walker is a portfolio site for a design agency. So far, so standard. However, it sets itself apart because it’s slightly bigger than the browser and swerves left and right with your mouse movement.

Sirup 5th Anniversary

Sirup is a Japanese singer-songwriter, and to celebrate the fifth anniversary of his first hit single, his record company has put together this awesome maximalist micro-site that uses type, motion, and art direction to capture his style.

Fitzjohn’s

Fitzjohn’s is a slick site for a new apartment complex in the Hampstead area of London. It uses a refreshing modern color palette and calming animation to take the edge off the frankly ludicrous price tag.

Persepolis Reimagined

Persepolis Reimagined is an awe-inspiring WebGL tour through one of the most important cities in ancient Iran. Make sure you tour it on a large screen. It’s hard not to be wide-eyed with wonder.

JaM Cellars

JaM Cellars is a Californian wine brand that’s pitching to bachelorette parties. With names like Butter, and Sugar, it’s not the most sophisticated tipple, but yellow, we love a yellow site.

Danielle Levitt

This portfolio site for film director and photographer Danielle Levitt features samples of her best work scrolling past the viewport. There’s a clever switch of thumbnail and background color when you scroll down to the contact details.

Propel

From total color energy to Apple-levels of minimalism: Propel is a slick, animate-on-scroll site for a marine motor brand selling an outboard and inboard motor. The animated masks on the images are a nice subtle touch.

Standards

Standards is a site for a SaaS that helps organizations create, maintain, and share brand guidelines. It uses subtle animation, video of its UI, and compelling copy to sell its approach.

Chris Carruthers

The portfolio site for Chris Carruthers is deliberately self-indulgent with scrolling text, clipped images, and scroll-jacking, but it’s also delightful to peruse.

Theodore Ellison Designs

We don’t often see colored glass in real life, but the play of light on stained glass is beautiful. This site for Theodore Ellison Designs uses video to bring the effect to the web.

Owomaniya!

The Owomaniya report for 2022 uncovers the state of gender diversity in the Indian entertainment industry. Presented in the style of infographics, the information is brought to life by animation.

Meetings

Meetings is a French events company. Its site uses an animated collage approach to showcase its services, and animated text to pull you into its content.

Blakeney

Blakeney invests in African companies on behalf of institutional investors. Its site is typical of the financial industry, but it uses animation to lift it to a higher level of interest.

Becklyn

Becklyn is a digital design agency. Its portfolio site uses animated text, expanding image masks, and video to guide us through its site and app design approach.

Cabi

Cabi is a brand of Japanese condiments with a typically Japanese feeling site. Bright colors, a slowly scrolling slideshow of dishes, and editorial to pack shot hover effects are a great introduction to the brand.

Slantis

Slantis provides building information modeling to architecture and infrastructure providers. Its site uses animation to showcase the types of content it produces for clients.

July Fund

July Fund is a venture capital project. It takes an entirely different approach than its competitors by adopting a chaotic but enjoyable card-based design.

Source

The post 20 Best New Websites, October 2022 first appeared on Webdesigner Depot.

Source de l’article sur Webdesignerdepot

/par

Exciting New Features in Safari 16

,

Apple has released an OS update. Packaged in with it is the latest version of Safari, 16.

Expected to be released ahead of next month’s macOS 13, Safari 16 is packed with updates, making it one of the most capable browsers available.

For web designers, the significance is the forward momentum in web technologies that enable freer design work and fewer hacks to achieve complex layouts. Little by little, CSS recommendations are being implemented to the point that using JavaScript for layout is rapidly becoming as unnecessary as it is disliked.

Some of this was announced in June in the Safari 16 beta. But a lot has been added in the last couple of months. So here’s what’s new in Safari 16 today.

CSS Container Queries

The most exciting addition to Safari 16 is CSS Container Queries.

It is hard to understate how in-demand this feature has been; if you imagine an edit button on Twitter that gifted you crypto every time you corrected a typo, you’d be getting close to how popular this feature is.

Until now, media queries have detected the whole viewport. And so, if you have an element like a card, for example, that needs to change at smaller viewports, you need to calculate the available space and adapt the element’s design accordingly. Unfortunately, this frequently gets out of sync with edge cases causing more than a few headaches for front-end developers.

Media queries are severely restrictive to modern layout methods like Grid that wrap elements automatically because there is no way to detect how the elements are laid out.

Container Queries solve this by allowing you to define styles based on the size of the actual containing element; if a div is 300px wide, the contents can have one design, and if it’s 400px wide, they can have a different design—all without caring what size the whole viewport is.

This is dangerously close to OOP (Object Orientated Programming) principles and almost elevates CSS to an actual programming language. (All we need is conditional logic, and we’re there.)

The latest versions of Chrome, Edge, and now Safari (including mobile) support CSS Grid. Even discounting the rapid decline of Twitter, this is way more exciting than any edit button.

CSS Subgrid

Speaking of Grid, if you’ve built a site with it (and if you haven’t, where have you been?), you’ll know that matching elements in complex HTML structures often results in nesting grids. Matching those grids requires careful management, CSS variables, or both. With CSS Subgrid, grids can inherit grid definitions from a grid defined higher up the hierarchy.

CSS Subgrid has been supported by Firefox for a while but is not yet part of Chrome or Edge. Until there’s wider support, it’s not a practical solution, and using a fallback negates any benefit of using Subgrid. However, its introduction in Safari will surely herald rapid adoption by Google and Microsoft and moves the web forward considerably.

CSS Subgrid is likely to be a practical solution within 18 months.

AVIF Support

AVIF is an exceptionally compact image format that beats even WebP in many instances. It even allows for sequences, creating what is essentially an animated GIF but smaller, and for bitmaps.

AVIF is already supported by Chrome, with partial support in Firefox. Safari now joins them.

AVIF support is one of the more valuable additions to Safari 16 because you’re probably already serving different images inside a picture element. If so, your Safari 16 users will begin receiving a smaller payload automatically, speeding up your site and boosting UX and SEO.

Enhanced Animation

Safari 16 introduces some significant improvements in animation, but the one that catches the eye is that you can now animate CSS Grid.

Yes, let that sink in. Combine Container Queries and animation. The possibilities for hover states on elements are tantalizing.

Safari 16 also supports CSS Offset Path — known initially as CSS Motion Path — which allows you to animate elements along any defined path. This enables the kind of animated effect that previously needed JavaScript (or Flash!) to accomplish.

Chrome, Edge, and Firefox all support CSS Offset Path; the addition of Safari means it’s now a practical solution that can be deployed in the wild.

Web Inspector Extensions

Announced as part of the beta release, Web Inspector Extensions allow web developers to create extensions for Safari, just as they would for Chrome.

Web Inspector Extensions — or Safari Extensions as they’re destined to be known — can be built in HTML, CSS, and JS, so the learning curve is shallow. It’s a good route into app development for web designers.

Because the underlying technology is the same as other browser extensions, anyone who has made a Chrome, Edge, or Firefox extension will be able to port it to Safari 16+ relatively easily. As a result, there should be a rapid expansion of the available extensions.

Improved Accessibility

Accessibility is key to an effective and inclusive web. Be like Bosch: everybody counts, or nobody counts.

When testing a design for accessibility, emulators don’t cut it. In my experience, Safari has some of the most reliable accessibility settings, especially when it comes to Media Queries like prefers-reduced-movement.

Further gains in this field mean that Safari continues to be an essential tool for QA tests.

Reduced Resets

Finally, I want to throw up my hands to celebrate the reduced number of non-standard CSS appearance settings.

For years we’ve been prefacing our style sheets with elaborate resets like Normalize, designed to undo all the assumptions browser developers make about design and the UI preferences of their engineers.

Safari 16 has reportedly “Removed most non-standard CSS appearance values.” How effective this is and how much we can rely on it given the other browsers on the market remains to be seen. However, like many of Safari 16’s changes, it’s a step towards a browser that’s on the developers’ side instead of an obstacle to overcome.

Source

The post Exciting New Features in Safari 16 first appeared on Webdesigner Depot.

Source de l’article sur Webdesignerdepot

/par