Articles

Why Web Design Still Matters in 2023

,

As we move into 2023, there are an increasing number of ways companies can engage with their customers. And as the number of apps, browser extensions, social media feeds, newsletters, vlogs, and podcasts grows, you can be forgiven for thinking that websites are a little less essential than they were in say, 2021.

However, the truth is that websites remain an irreplaceable part of the digital landscape and they will continue to be into 2023 and beyond.

Websites, as the keystone of a centralized, privately run digital experience couldn’t be more relevant. Unlike competing technologies, websites allow almost total control of their source code, and that provides an opportunity for skilled designers and developers to compete against the biggest names in their clients’ industries in a way that simply isn’t possible in tightly governed systems like social media.

Not only does quality web design help businesses increase their traffic, but it can increase the quality of that traffic; an attractive and user-friendly web page will encourage web users to stay on the page longer, and explore more of the content it links to.

Websites vs. Social Media

For many brands, the option they turn to for connecting with customers is social media. Particularly platforms like Facebook and Instagram. While billions of us are happy to while away our free time on social media, it’s not a great platform for informed decision-making or task fulfillment. For any form of productivity, websites are superior:

  • Flexibility: Websites can be customized to suit a company’s vision and values, whereas social media tends to magnify accounts that reflect its own values.
  • Ownership: When you publish on your website you own your content, when you post to social media the platform tends to own your content.
  • Investment: As we’ve seen recently with a certain bird-themed social network, you can spend years investing time in your social media channel only to have it canceled by an individual with his own agenda.
  • Findability: Websites are discoverable on search engines, and although algorithms govern these search engines, competition across different search engines keeps search algorithms honest. Social media networks each use a single algorithm making them free to skew browsing any way they choose.
  • Scaleability: Websites can take advantage of the latest technologies to improve user experience, on social media user experience is governed by the network’s decisions.

Websites vs. Apps

When it comes to owning a piece of the internet, a connected app feels like ownership. However, websites have a number of benefits over an app, from a superior user experience to lower development costs. And ultimately, apps are also controlled by 3rd parties.

  • Accessibility: Websites are universally accessible, while apps are usually limited to certain operating systems or platforms. If you want to distribute to devices, you’ll need to be approved by the store owner who can (and will) change the terms and conditions of store distribution without consulting you.
  • Flexibility: Websites provide a greater level of flexibility and scalability than apps.
  • Cost-effective: A simple website can be created and launched in a weekend, they are considerably more cost-effective to develop and maintain than apps.
  • Findability: Search engines have evolved around website technologies, and it is far easier to create a discoverable website than an app that ranks high in an app store.
  • Universality: Websites have lower entry costs for users, and there aren’t any downloads or purchases required.
  • 3rd-party features: Websites can integrate 3rd-party content like chatbots, payment gateways, and forms, that generally require licensing to include in an app.

Websites vs. Podcasts and Vlogs

There’s no question that podcasts and vlogs are engaging types of content. However, they are very limited when it comes to different kinds of experience. These tend to be passive, linear experiences. Even if your podcast opens itself up to listener interaction, your customers are still passive consumers.

  • Cost-effective: Websites can be set up very cheaply, podcasts and vlogs on the other hand require high-production values to compete.
  • Longevity: Well-written website content can remain relevant for years, the lifespan of a vlog or podcast is often just a few months.
  • Flexibility: Websites can embed podcasts and vlogs, as well as virtually any other content; podcasts and vlogs can only ever be podcasts and vlogs. Websites will continue to evolve long after podcasts are obsolete.
  • Simple: There is now a range of no-code options for creating a reliable website, meaning it can be done with little to no skills or experience. Podcasts and vlogs require a great deal of technical knowledge to produce.
  • Findability: As with other technologies, podcasts and vlogs can’t compete with websites when it comes to search engine optimization.
  • Faster: A well-designed website is much smaller than a podcast or vlog, making it cheaper and easier to access, especially on a cellular network.

Websites in 2023 and Beyond

In 2023 websites will still be a critical part of a successful business strategy and web designers will continue to be essential members of any team.

Websites continue to offer numerous benefits over other technologies including increased flexibility, cost-effectiveness, and superior search engine opportunities.

Unlike social media platforms that allow you to customize a few assets like avatars and colors, websites can be completely customized to fit the tone and style of a brand. Additionally, websites have a far lower barrier to entry than podcasts, vlogs, or apps. While apps may offer a richer set of features than a website, that is offset by the restrictions on platform and device capabilities that apps impose.

Websites will continue to evolve as the tech landscape changes. New ideas for consuming digital media will appear over time, offering unique new experiences — for example, mass adoption of AR (Augmented Reality) is just around the corner. However, the website is perfectly evolved for the types of simple customer interaction that businesses rely on, and will continue to matter in 2023 and beyond.

 

Featured image by fullvector on Freepik

Source

The post Why Web Design Still Matters in 2023 first appeared on Webdesigner Depot.

Source de l’article sur Webdesignerdepot

/par

40 Best New Fonts of 2022

,

Choosing the right typefaces for your website can elevate a design from dour to delightful. The right typeface gives personality to your brand voice and can make sure your content gets read.

And so, every month, we put together a roundup of the best new fonts for web designers. In this roundup of the year, we look back at the past twelve months and showcase our forty favorite fonts of 2022. Enjoy!

Tellumo

Tellumo is an elegant geometric sans-serif that oozes positivity. It comes with a standard set of caps and an alternative set of swash caps.

DT Random Display

DT Random Display is an original approach to typeface design. It’s perfect for posters or a branding project with a courageous client.

Rebrand

Rebrand is a sans-serif packed with character. There are display and text versions, each with seven weights.

Aiglon

Aiglon is a monolinear semi-geometric sans-serif. It is simple and forthright, without being dull or forgettable.

Shorai Sans

Shorai Sans is a blend of geometric sans-serif and calligraphic brushstrokes. As well as Latin glyphs, there’s a complete set of Japanese characters.

Monden

Monden is a high-contrast serif with a clever little kick on the lowercase h, m, and n that adds richness to body text.

Canora

Canora is a calligraphic typeface with two styles: Frente leans to the right, and Verso leans to the left.

Epicene

Epicene is a beautifully baroque typeface with some intriguing details. There are two families, a display version and a text version.

Sangbleu

Sangbleu is a super-family of typefaces with five complementary styles: Empire, Kingdom, Republic, Versailles, and Sunrise.

Forme

Forme is a typically British grotesque typeface with the bonus of having an equally functional Arabic sibling.

Aprello

Aprello is a robust sans-serif that’s ideal for branding projects. There are six weights, each with an italic and a variable font version.

Selva

Selva is an elegant serif typeface in the Scotch tradition. It has a vast number of weights and a particularly attractive italic.

GT Planar

GT Planar is a unique typeface with both italic and retalic styles that slant up to 45 degrees in each direction.

Veqay

Veqay is an elegant stencil typeface with organic shapes, making it ideal for certain branding and editorial design.

Apta

Apta is a clean sans-serif with excellent proportions. Unusually it comes in three versions, a geometric style, a humanist style, and a combination style.

Antodits

Antodits is an energetic script face that has the feel of graffiti. This is a great display font for headlines.

Delvard

Delvard is a family of three typefaces, Display, Subhead, and Text. It’s a beautiful serif with script-like strokes.

Rosales

Rosales integrates a humanist style with geometric forms and calligraphic alternatives to create a unique typeface.

Fisterra

Fisterra is an informal serif with two different styles: Morte, with emphasizes curves, and Fora, which emphasizes sharp lines.

Connection

Connection is a precisely drawn typeface with beautiful detail courtesy of a calligraphic influence.

Ping Round

Ping Round is a simple sans-serif drawn with as few strokes as possible, resulting in some characterful letterforms.

Mule

Mule is a hard-working serif with friendly, engaging letterforms. It has a great rhythm, making it ideal for extended text.

Arnika

Arnika is a contemporary typeface with a large x-height. The flares on its strokes put it mid-way between a serif and a sans-serif.

Kingsad

Kingsad is a sans-serif designed for branding. The generous curves and wide letterforms make it best suited to short text.

Apice

Apice is an elegant script font perfect for posters, branding, and editorial design. It’s a variable font with a setting to control stroke contrast.

The Future

The Future is a reworking of the ideas behind Futura. It has a great mix of Western and Japanese typographic traditions.

Mallory

Mallory is an Art Nouveau-inspired display face. It has graceful sweeping curves and strong contrast.

Fabbrica

Fabbrica is a functional sans-serif that performs exceptionally well at small sizes and especially well on screen.

Gills & Co

Gills & Co is another of this year’s crop of Art Nouveau-inspired typefaces. It’s ideal for editorial design.

Satiata

Satiata is an energetic typeface that almost dances across the screen. Best used for branding or display type.

Fold

Fold is a no-nonsense sans-serif that’s plan spoken and trustworthy. It has four weights with corresponding italics.

Bells Morten

Bells Morten is a display font inspired by vintage signage. It’s bold and all-caps, with sharp flared serifs.

Mori

Mori is a versatile sans-serif inspired by contemporary Japanese design. It’s ideal for branding and editorial design.

Nitido

Nitido is a humanist sans-serif designed as a companion for the popular Nitida font family. It’s beautifully suited to branding work.

Lithops

Lithops is a fantastic display face for posters, T-shirts, and editorial design, with a pattern making up the letters that’s reminiscent of seaweed.

Rapidissima

Rapidissima is a companion typeface to Rapida. While Rapida is a careful usable serif, Rapidissima is an exploration of speed.

Firelli

Firelli is a warm, contemporary slab serif with a range of weights. It’s an excellent choice for display and body type.

OBO Star

OBO Star is a semi-monospaced typeface, meaning that most of the characters use the same space.

Nagel

Nagel is a uniwidth sans-serif with a low stroke contrast and some bold detailing. It’s ideally suited to short texts and branding.

Practico Slab UI

Practico Slab UI is a workhorse slab serif that blends European and American mid-century styles. It’s available as a variable font.

Source

The post 40 Best New Fonts of 2022 first appeared on Webdesigner Depot.

Source de l’article sur Webdesignerdepot

/par

How To Build A Design Portfolio With Zero Clients

,

A design portfolio is an excellent way to demonstrate your skills as a freelancer. As a web designer, you compete with millions of other web designers. Therefore, you must have a strong portfolio to land a high-paying web designing job in such a competitive space. A strong portfolio sets you apart from others. Having no clients, however, can make it challenging to get your portfolio noticed and build up any momentum.

People typically build portfolios from projects they do for clients. Hence, it seems unlikely for a new web designer without clients to have a strong portfolio. However, it’s attainable. You can build a design portfolio with no clients, and you’ll find out how in this post.

What Makes A Good Design Portfolio?

A good portfolio should display your best work, as most clients want to see your best. However, your best work may not be client work. In addition, what’s more, important than displaying your best work is showing your versatility.

Being a versatile web designer will land you more jobs than being an expert in just one type of web design. Notably, you don’t need to have many clients to be versatile in web design. Instead, you become versatile by taking on different projects.

A good design portfolio should include professional recommendations. Testimonials from previous clients are valuable here, but anyone can recommend you. It could be a web designer friend, collaborator, or even your tutor.

Furthermore, a good portfolio should feature non-client work; even if you have thousands of past clients, featuring personal projects is still ideal. It shows your growth as a web designer isn’t limited to what clients ask you to do.

Many other factors constitute a good portfolio, but these points are the most important regarding showing your skill. You can build a portfolio that includes them even if you have no clients.

How To Build A Design Portfolio With Zero Clients

You can try all or some of these methods to build a design portfolio if you have no clients.

1. Take On Design Challenges

A simple way to build a strong web design portfolio is by competing in challenges. It’s helpful whether you have clients or not.

Winning a design challenge is like finishing at the top of the class. It demonstrates that you’re the best web designer in the room and the type of web designer clients want to hire. Generally, taking on design challenges will help sharpen your skills.

You can partake in competitions arranged by renowned web design communities. You can find such competitions on websites like 99designs and Design Crowd. More often than not, winning a web design challenge will land you a job.

2. Carry Out Personal Projects

Carrying out personal projects is similar to competing in challenges. However, in this case, you’re challenging yourself.

Have you ever had a unique idea for a website? Don’t wait until a client asks you to build such a website. Instead, you can begin the project on your own. Then, if you succeed, you can proudly display the project in your portfolio.

When you get clients, you wouldn’t need to convince them that you can handle such tasks; the personal project is a testament to it.

You can carry out as many personal projects as you envisage, no matter how simple or complex. Furthermore, you don’t always have to complete them. Even failed personal projects can be part of your portfolio.

3. Clone Websites

When most clients contact you, they’ll want you to create a website similar to some existing website. You can give yourself a head start by cloning some popular websites and featuring the projects in a portfolio.

Your ability to build a replica of a professional website from scratch shows expertise. In addition, you most likely won’t get a 100% match with the original version. Your version may have improvements that subsequent clients would appreciate.

Furthermore, some website designers specialize in cloning. Suppose you plan to provide such services to clients. In that case, displaying your previously cloned website projects is all you need to create a strong portfolio.

4. Create Websites for Family and Friends

Your family and friends are potential clients. Hence, you can offer to build websites for them, even if it is for free. Afterward, you should include the work in your portfolio.

If your friend or relative has an offline business, for example, you could offer to build a website to give them an online presence.

Even if they eventually don’t use the website, you can include it as a demo project in your portfolio.

5. Get Inspiration From Others

You’re not the only web designer with no clients who wants to build a strong portfolio. Therefore, you can draw inspiration from others.

Dribbble, the social networking platform for designers, is among the best options you have. Dribbble allows you to find thousands of new and veteran web designers with varying portfolios.

You can scan the portfolios, examine the content, and try to replicate what you can in yours. Furthermore, you can even build a portfolio directly on Dribbble.

Bottom Line

Not having clients shouldn’t discourage you as a new web designer. You can still build a strong design portfolio with the methods discussed in this article.

After creating your portfolio, you can then use it to secure jobs. Subsequently, you can update the portfolio with your best client work.

 

Featured image by storyset on Freepik.

Source

The post How To Build A Design Portfolio With Zero Clients 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

Are Modals In Web Design A UX Disaster?

,

Modals, a nifty little feature that allows you to display different messages at the top of your website, have been touted as extremely useful. Some even claim that they are helpful enough to completely replace the banner ads we all hate so much. But are modals in web design a UX disaster?

If you are unfamiliar with the term, a modal is a dialogue window appearing when a visitor clicks on a hyperlink or hover image.

Suppose you want to collect on-site subscribers or you want visitors to sign up for a freebie. In that case, you can use modals.

However, many web designers – and some website visitors – are against using modals in web design. The main argument is that it affects the user experience. But are modals in web design a UX disaster? Read on to find out.

What Do Modals Do?

Modals often appear as pop-up windows on a web page, requesting a visitor to take action. Most times, they appear following a click on a page element.

Also known as lightboxes, modals isolate the page’s main content. The user will have to complete the action requested by the modal or close it before reassessing the page.

Web designers use modals to capture a visitor’s attention. Since other page contents are inaccessible, a visitor must interact with the modal.

Cons Of Modals In UX

While there are different cons of modals in UX, they all sum up to one con – interruption. When modals appear, they interrupt whatever the user is doing.

Unlike regular pop-ups, users cannot simply ignore the modal and continue browsing. As a result, modals demand immediate attention. 

A user may be interested and decide to interact with the modal. However, if the modal’s content differs from the page’s, the user could forget what they were doing after interacting with the modal.

Furthermore, sometimes modals require action related to information on the page. For example, suppose the user wants to review the information before taking action. In that case, they’ll have to close the modal since the main page is inaccessible.

Statistics show that up to 82% of users dislike pop-ups. Most website visitors aren’t knowledgeable about the technicalities of web design. As a result, they won’t be able to differentiate between regular pop-ups and modals.

After all, modals are a type of pop-up. Some users may consider modals worse since they darken the page’s primary content, making it inaccessible.

Furthermore, people want to visit a website and get what they want immediately. Hence, time is significant. Therefore, modals that require actions that take time can make a website lose visitors.

With all of these cons, you can understand why many web designers say modals are a UX disaster in web design.

Can Modals Be Useful in UX?

In some situations, modals are helpful, and they can improve UX. Many web designers swear on the usefulness of modals, and it’s not difficult to understand why.

Firstly, modals can help simplify a website’s content. For example, a user can immediately exit the page if your website is relatively complex, with lots of content and elements.

You can use a modal to explain the content on the page so that the user doesn’t get confused. Perhaps the modal can display when the user clicks on the back button. The modal can highlight the most critical content on the page and tell the user what to do next.

Secondly, modals are invaluable if you must capture your user’s attention. For example, perhaps you want to display a warning or pass any crucial information that users must know before they continue browsing.

As mentioned before, a user can easily ignore a pop-up, especially if it opens in a new window. However, with modals, the user must at least view the content before they proceed.

Thirdly, a modal can make a web page easier to navigate. It sounds ironic considering the cons, but it’s true if properly implemented. Rather than packing different elements on a web page, you can set some to display as modals.

For example, you can have a page with just text to improve readability. Then, users can click to view visual elements like images and videos as modals.

How To Use Modals the Right Way

Using modals correctly is key to ensuring they don’t negatively affect UX. Here are some ideal situations when you can use modals:

1. Display Warnings

Using modals to give users crucial warnings is ideal, especially if their subsequent actions have serious consequences.

For example, most websites display modals when users click the delete button. Deletion is always critical because, in most cases, it’s irreversible.

A practical example would be an eCommerce website where a user opts to delete items from their cart. You can use a modal to ask the user to confirm before deleting.

2. Input or Collect Information

Modals are effective in prompting users to input information. Sometimes, users must enter specific details before they continue browsing.

A practical example would be a review site where a user wants to submit a review. Before submitting the review, you can use a modal to request the user’s name and other necessary information.

3. Simplify Navigation

As mentioned before, modals can simplify a complex website. In addition, it will help a user navigate better, which is a UX boost.

A practical example would be a news site with many stories and updates. You can use a modal to highlight the day’s trending news stories so that users can visit the web pages with one click.

Conclusion: Are Modals a Disaster in UX?

In conclusion, modals affect a site’s user experience since visitors must interact with them. However, it doesn’t always have to be a negative effect.

Modals become a UX disaster in web design when wrongly used. However, if you follow good practices, modals can improve your website’s user experience.

Generally, only use modals when necessary and in a way that won’t frustrate the users.

 

Featured image by Freepik.

Source

The post Are Modals In Web Design A UX Disaster? first appeared on Webdesigner Depot.

Source de l’article sur Webdesignerdepot

/par

How to Design an MVP Web Page

,

Learning how to design an MVP webpage or website could be one of the best things you can do as a site creator in today’s digital world.

In a fast-paced landscape, where customer preferences and technology are constantly changing, most companies don’t have time to dedicate months or years to each web project. The longer you take to complete your website, the more likely your creation will be outdated by the time you hit “publish.” That’s why countless creators are beginning to take a different approach.

To avoid wasting time, money, and effort on something that doesn’t deliver a significant return on investment, designers are now building “Minimum Viable Products,” or “MVPs.”

Here’s what you need to know about creating your MVP webpage.

What is MVP Web Design?

Typically, the “MVP” development process is most common in the app or software creation world. It refers to when a developer builds the simplest version of a technology capable of achieving specific goals. For instance, if a company wanted to create an ecommerce app, they would design a simple tool capable of listing products, enabling payments, and tracking orders.

After launching the MVP product, the company or developer would check to ensure it had the right impact on the target market and generated positive results. Using feedback and analytics, the developer would then begin to add new features one at a time.

MVP design aims to ensure you’re developing the best, most valuable product for your audience while getting your solution to market as quickly as possible.

The same strategy in MVP app and software design can also apply to website creation. Rather than building a highly complicated website with multiple features straightaway, the designer would focus on creating a single page equipped with the essential elements.

For instance, instead of building an entire site for your online course, you may develop a single-page website where customers can learn about the system, sign up, and pay for their membership. The great thing about an MVP web page is it allows companies to start advertising their solution, product, or service quickly, with the minimum initial investment.

How to Create an MVP Web Page

Creating an MVP web page is similar to designing any Minimum Viable Product. Throughout the project, the focus will be on keeping the development process simple while collecting as much feedback as possible.

Here’s how you’d get started with an MVP web page.

Step 1: Planning

Planning is an important stage in any web design project. It’s particularly crucial in the MVP landscape, where you need to define the most critical features of your webpage or website to ensure it’s “viable” for your needs. The initial planning stage can sometimes be the lengthiest part of the process, depending on the amount of research you need to do.

For the most part, web designers and companies will begin by conducting market research. This means examining crucial concepts intended to drive your strategy, such as:

  • Your target audience: Who are you trying to target with this web page, and what will they need from your site? A user persona can be helpful if you don’t already have one.
  • Competitors: Who are your main competitors in this space, and what do their web pages offer? Which features do you need to replicate or avoid?
  • Goal setting: What is the main objective of this web page? What do you need it to do, and what might it need to accomplish in the future?

The key to MVP web page planning is ensuring you look holistically at your project without thinking too far ahead. The site you create should be capable of scaling and expanding in the future, but it shouldn’t have too many features from day one.

Step 2: Creating Your Feature List

Once you’ve done your research and formed the foundations of your plan, it’s time to list all the features your MVP web page needs to have. Unfortunately, this is where the process can get a little complicated. It’s easy to start adding capabilities and components that aren’t necessary to make your site more exciting or competitive.

As worrying as it can feel to release a very basic web page, remember your focus is on rapid growth and development. With this in mind, concentrate on narrowing your feature lists down into:

  • Initial must-have capabilities: First, decide what your web page can’t thrive without. If the primary goal of your page is to sell software subscriptions, then you’ll need to implement tools for collecting member information and payments.
  • Next stage functionality: Consider the features you might add once you’ve confirmed your webpage is effective. This will allow you to ensure you’re creating a platform that can expand to suit future needs.
  • Possible future requirements: You can also list features that might be helpful in the future but don’t necessarily need to be implemented immediately. For instance, if you’re selling an online course, you might create a separate page where people can sign up to learn about future lessons.

Step 3: Finding the Right Software

Next, you’ll need to decide how to build your web page. There are several options available to today’s designers. An open-source solution is usually the best route for designers who need to create something specific from scratch. However, if the factor that makes your solution “viable” is unique, you may need access to code to bring your idea to life.

Alternatively, if you’re building a basic webpage capable of something like collecting customer email addresses or facilitating transactions, you might be able to use an off-the-shelf tool. CMS services for web designers can reduce the work and expense involved in creating a minimum viable product.

For instance, you might use a tool like Wix or Squarespace to edit a pre-existing template and simply drag-and-drop the features you need into the right places. On the other hand, if you’re planning on adding more functionality to your site down the line, it’s worth checking if any builder you will use has the right level of flexibility. Many tools will allow you access to code, advanced features, and essential module-based building functions.

Step 4: Implement Your Analytics

One of the essential parts of an MVP workflow is feedback. When you roll out your MVP, you’ll be looking for insights, guidance, and analytics to help you decide what your next steps are going to be. As a result, MVP workflows are based heavily on experimentation.

This means you’re going to need the right analytical tools in place to track crucial information. You can implement tools for collecting customer feedback directly. It’s also worth having a system in place for tracking metrics like:

  • Conversion rate;
  • Traffic numbers;
  • User behavior;
  • Most used/least used features;
  • Technical site performance;
  • Bounce rate;
  • Average time spent on the page.

While Google Analytics is one of the most popular tools for collecting insights in the MVP website design world, various other options are available. You can even find tools with in-built heatmaps to see how people navigate your site more effectively.

It’s also worth having A/B testing components in place. This will allow you to test the different “new” features you add to your web pages over time and examine how they influence your conversions and support your goals. For example, you can use A/B testing to explore the impact of everything from CTA button colors to webpage copy and offers.

Creating Your MVP Web Page

In the fast-paced web development and design world, the old-fashioned and slow approach to designing web pages is growing increasingly less common. Instead, an MVP strategy may be the best bet for companies looking to go to market faster, collect insights from their target audience, and accelerate growth.

Though getting used to this design strategy initially can be challenging, it can save you significant time, resources, and money in the long term.

 

HTML vector created by vectorjuice – www.freepik.com

Source

The post How to Design an MVP Web Page first appeared on Webdesigner Depot.

Source de l’article sur Webdesignerdepot

/par

15 Inspiring Alternatives to Dribbble & Behance

,

Web design is often stagnant because designers look at the same work and follow the same trends. Unfortunately, algorithms promote work that is liked, and designers produce content to get likes, which leads to a self-feeding cycle.

We’ve been talking about the dribbblization of design for years, but Behance is just as guilty of promoting and encouraging homogenous design.

It’s not that Dribbble and Behance don’t have value; they are both excellent resources for designers. But they’re victims of their own success, and it’s healthier for them, designers, and the industry if we broaden our sources of design inspiration.

And so, today, we’re presenting this list of the best places to find design inspiration for web designers that aren’t Dribbble or Behance. (OK, you can check them out too, if you really want to!)

Awwwards

Awwwards is the top site for web design inspiration. The best agencies in the world post here, and a ‘Site of the Day’ award is a coveted accolade. So if you’re looking for design inspiration, this should be your first stop.

Admire The Web

Admire The Web is an excellent collection of curated sites. It’s more selective than sites like Awwwards, so you don’t have to dig through so much to find the best web design.

One Page Love

One Page Love is one of the best resources for designers seeking inspiring new ideas. It’s devoted to one-pagers, which means it leans towards apps, tech start-ups, and smaller independent projects.

Godly

Godly is another excellent collection of web design inspiration. Godley uses animated thumbnails, so you can get a sense of a site before you look at it in detail. As such, it’s perfect for animated landing pages.

Hoverstat.es

Hoverstat.es is a collection of curated websites that often finds little gems other sites miss. Unlike most roundups, it doesn’t go into much detail on each site, and new sites are infrequent, but it’s always worth a browse.

Siteinspire

Siteinspire is one of the most established design inspiration sites. The collection is carefully divided into different styles; if you find your own site listed, you can add your contact details.

Land-book

Land-book is a curated collection of the best sites on the web. The site does a great job of presenting screenshots clearly, and the similar sites feature is great for browsing a particular mood.

Savee

Savee is a fantastic site for browsing all kinds of design inspiration. It’s like Pinterest for designers as it leans towards art direction and photography. It’s easy to scan for mood boards.

UIJar

UIJar is a nicely designed collection of hand-picked websites. Unlike most other sites on this list, UIJar also features a collection of branding that’s great for identity designers.

Brutalist Websites

Brutalist Websites is the perfect inspiration site if you’re a fan of the Brutalist design trend. There are plenty of designs that show why Brutalism is so popular right now, but the site itself is probably short-lived.

Minimal Gallery

Minimal Gallery is a collection of sites that embrace minimalism. Like Brutalist Websites, the quality of the collection is very high, but the site’s lifespan is probably short-lived thanks to being tied to one trend.

Ello

Ello is a platform for showcasing excellent design work. It’s solid on illustration and artwork. There’s also a great deal of photography on show. You’ll also find regular opportunities tied to creative briefs.

DeviantArt

DeviantArt is still the largest, and arguably the best, showcase for illustration, with dozens of styles from Anime to classicism. It’s easy to lose a few hours browsing DeviantArt.

Figma Community

Figma Community is a collection of the best work from the Figma community. But you don’t need to be a Figma user to grab some inspiration from the UI work on show.

Lapa

Lapa is a collection of 5000+ landing pages. The collection is headhunted from around the web, so if you only have time to check out one site, Lapa could be a good choice.

Source

The post 15 Inspiring Alternatives to Dribbble & Behance first appeared on Webdesigner Depot.

Source de l’article sur Webdesignerdepot

/par