Web Design

Video Transcript:

Hey, this is Al Carmona with Useractiv websites. And today, I want to talk about web standards. Now web standards are just a certain way that makes it easier for most users to take a look at a website and navigate it and use it. Specifically, we’re going to talk about headers and footers today, and what the standards are for a header and footer as far as where you position certain elements and make it easier for the user that’s coming in, and having to figure out what it is that is on the website and how to use the website.

Because if you look at the majority of B2B websites, you’re going to see that they have basically the same thing in the header and in the footer, and that’s just as I said, for usability purposes, just to make things easier. So taking a look at a couple of websites. We’ve got Slack here, and Slack is a product that a lot of companies use, and this is the home page of their website. You’ve got this element right here, which is the logo, and then you’ve got a drop-down navigation here, and then the rest of the main navigation here in the header, a search button, and a call to action here to talk to sales or create a new workspace.

So this is a standard, a web standard header. If you take a look at Microsoft, they’re basically doing the same thing. You’ve got the logo here on the left corner, which links to the home page, you’ve got a menu here, and then you’ve got another menu, which is a full menu, along with a call-to-action, which is to sign in.

Now, if we take a look at the footer here at Slack, you could see that it’s got more links, so you could go ahead and explore and they’re categorized, you’ve got “Why Slack” and then all the links that go to explaining why you should choose a product, pricing resources, and company.

And this is kind of like a sub-footer here, along with the social media icons. Another standard of websites having the social media icons in the footer. Most people will look for those when scrolling through a website by going all the way to the bottom… To the footer.

Let’s see if Microsoft is doing that as well. It looks like they are not… They don’t really have that here. They do have it in the footer though, but a little bit higher up, if you see right here, that’s where they have the social media icons. So this is a little bit out of place in regards to web standards, usually you’ll find it here at the bottom, the way Slack has done it.

So that’s just a quick overview of web standards for what you should have in your B2B website as far as items in your header and in your footer. It’s all to make it easier for a user to be able to find navigation, find your logo, find important links and find social media links as well. And the call to action, it’s a great idea to put it up in the header.

I hope you enjoyed this video, please hit the like button and please subscribe for more helpful videos about how to make your website and improve it and get more leads and more sales.

If you need a new website or you need website work, be sure to contact Useractiv, we’re happy to help. That’s all we do is website marketing and website design and development. Thanks!

Hey, this is Al Carmona with Useractiv. And in today’s video, I want to talk about how to choose the right web designer for your business.

Check out their portfolio

So the first thing that people look at when they’re looking around for web designer is they’re probably looking at portfolios. They’re looking at the designs that people have done, whether it’s the mockup or whether it’s a live site, and seeing what kind of work an agency has done and the quality of their work.

Once they kind of see the quality of the work of several agencies, then it’s good to go ahead and drill down a little bit further.

These are more of the things that you should be looking for when choosing the right web designer for your business beyond the portfolio…

Do they ask the right questions?

When you have that first meeting with your prospective web design company, you want to listen and see if they’re asking the right questions, the right questions about your business, about your customers, about the way you work, about your goals, about what it is that you want to accomplish with your website, and what’s wrong with your website. Now, what can you do to fix it? What are your key performance indicators that you’d like to increase or better?

And the types of questions that they ask are going to be very indicative of the type of company they are and what their approach is leading on to that aspect of a web company asking the right questions.

Are they focused on your users’ experience?

And the next question that they should be asking or that you should be asking of them is… what about the users? What about your users, your customers, because in reality, your website design company, or your website design agency’s customer is not you, it’s your customers. They’re trying to appeal to them. They’re trying to have a better user face interface for your customers, so they could find what they’re looking for. And they’re able to accomplish tasks, be it, find out more information, schedule a consultation, or making a purchase easier.

So a web design company that thinks about the user first that asks questions about your user and what your user can do, or how they can benefit from your website and how that I, that can be improved by some of the things that you’re going to be going ahead and working on when you’re redesigning the website.

What’s their process?

The next thing that you probably want to ask or that you want to inquire about of your new web design company is what their process is. How do they manage the web design process and how do they communicate every step of that process, make sure that they’re very clear in their process.

How long it takes to research, how long it takes to do this design, what the back and forth is on the revisions of the design and the wireframing and the architecture of the website. Communication is going to be very important. And you’re going to need that in order to get all the right information that you’re going to go ahead and put on the website.

Recap

To recap, those are some of the most important things to consider:

Check out their portfolio

When you’re interviewing the companies, make sure that they’re asking the right questions and listening to your goals.

That their user-centric

Make sure they’re focused on the user experience, your user, and your customer.

Their process

How long do things take, what are the phases of web design and how do they communicate along the way?

Making sure that everybody’s on board, that they’re on the same page, and that you’re moving towards that end goal of launching that new website. That new and improved website that’s going to make your business a whole lot better, and that’s going to be better for your customers.

So I hope that helps please subscribe to more tips on how to improve your website, better your website marketing, generate more, leads, more traffic, and get more sales. Thanks.

Video Transcript:

Hey, it’s Al from Useractiv. And today I kind of want to go over the differences between web design and web development. So in a nutshell, web design is more or less the graphics that are designed usually by somebody who is a specialist in creating mockups and designs. But not necessarily somebody who is a coder and then web development is when you actually do the coding of the website. So just to give you an example, and I’m going to break the web design part of it up into two different types of sections, because probably the best process of creating a website involves, you know, the research phase the wireframing phase, the web design phase, and the web development phase.

So we’ll probably get into the research phase and maybe the coding aspect in other videos. But I wanted to give you an overview of what the design and web development, what are the main differences between the two. So after you’re done with the research phase where you’ve looked into what your target market is who your users are, what they’re looking for, how that relates to your product, and so forth you start to create something called a wireframe, and a wireframe is when you start to get elements that you want to have on the webpage, and you start to lay them out in a very simple way, using boxes and text.

So as you can see on this page by the way, this is Figma, which is what I use for pretty much all my wireframing and my web design mockups. So, it’s a great program. I recommend it highly. I think everybody should use it. It’s free to use you know, there are different tiers for Figma, but it allows you to quickly create these wireframes. So as you can see, this is very simple. This is just to illustrate to a client and to work out between the client and yourself on my end, at least, as a web developer, what goes where, so here, we’re looking at a blog wireframe. So the client requested, you know, the redesign of the blog and they had some ideas. So rather than designing everything and then saying, okay, I wanna move this here and move this. There you start off with a wire frame. So as you can see, you got the logo here, you’ve got some links, you’ve got a call to action at the top. And this is the hero section with you know, the headline, a static image here. And since this is the home of the blog, it’s going to have a listing of a bunch of different blogs based on a category. So here, you’ve got a dropdown for categories you could search, and then you start to see all the blog posts here, or at least snippets of them with, you know, a featured image and category title excerpt, and then call to action to read more. And this goes on and on. They could go ahead and load more. And then the simple footer is here. So this is kind of what we ended up with with the blog homepage. We moved a few things around, and this is where we ended up. So as you can see, this is much easier to grab and move around. Then if we were to fully skinned this lets you get an idea of the space and the content and how that gets laid out on the page. And it makes it much easier. Once you have this part of the design process approved to go in and design this fully into a mock-up.

And now if I move over here, you could see that this is the wireframe for the single page or a single post. As you could see here, we have a featured image. So obviously if somebody clicks on here, they go to this template here for the featured post or for an individual post, you could see a featured image, the title, the author, the text, and how this will be laid out. So this was also approved. So it, the wireframe just makes it easier for you to go ahead and start creating a design. It lets the client know that you want to position things in a certain place. All the content that they want to have is going to be in there and it’s going to be easily accessible for users that go onto the website. So once you have that, you kind of move on to the design part of it. So just to separate it out to give you an idea, this is what a full-fledged design look like, looks like. So this is for a homepage on a different site, and you could see all the graphics are already in here. All the text, everything has been kind of designed here.

And this is what we call a full mock-up of a webpage. And this is what the web is, and this is also in Figma. So this is what the webpage looks like live. Once this has been launched on the web. Now, if we take a look at the code for this if I right-click anywhere on here and have view source, you could do this for any webpage. If you go ahead and do that, it’ll show you the code. And this is really what the web development part is. The coding of the website is what goes, where you could see it’s got all this code is needed for the webpage to be able to be viewed this way for you to be able to scroll for there, to be interactivity for there to be links. This is what the web browsers view, what they see. They see this code and they translate this code into this, the markup or the full website page that all your users view. So again, I mean, I’ll get into how to create the code for this based on the design here. And this is what they call custom development, taking a graphic, and then turning it into code strictly from that graphic.

So I hope you enjoyed this video, please let me know if you have any questions and put those in the comments, please subscribe. And like this video, if you want me to continue to create quality content that helps you with your website design and marketing your website. Thanks.

Before you start building your website, there are some things you need to know. If you make these common mistakes, you’ll ruin your website before it even gets off the ground. So read on for the top 10 ways to ruin a website!

1. Not Planning Ahead

One of the most common mistakes people make when creating a website is not planning ahead. They try to just start building without any sort of plan or direction, and as a result, their website ends up being a hot mess. If you want your website to be successful, you need to take some time to plan ahead. Figure out what your website is going to be about, what kind of design you want, and what sorts of features & content you’re going to include. Only then should you start actually building your site.

2. Not Making It Mobile-Friendly

An increasing number of people use their cell phones to go online. This means that if your website isn’t designed to be viewed on a mobile device, you’re going to lose a lot of potential visitors. Make sure your website is responsive and can be easily viewed on all sorts of devices.

3. Making It Too Complicated

Another common mistake people make is making their websites too complicated. They try to pack too much into one page, or they include too many intricate details that just end up confusing people. Keep your website simple and easy to navigate.

4. Not Optimizing for Search Engines

If you want people to actually find your website, you need to make sure it’s optimized for search engines. This means using the right keywords and phrases, as well as making sure your website is easy to crawl and index. If you don’t optimize your site, it’s likely that no one will ever find it.

5. Not including Calls to Action

If you want people to do something on your website- whether it’s buying a product, signing up for a newsletter, or just learning more about your company- you need to include calls to action. These are clear and concise messages that tell people what you want them to do, and they’re essential for getting people to take action. Without calls to action, people will just leave your website without taking any sort of action.

6. Not Updating Regularly

If you want people to keep coming back to your website, you need to make sure you’re updating it regularly. This means adding new content, fresh images, and anything else that will help keep people interested. If your website is stale and outdated, people will quickly lose interest and move on.

7. Not Promoting Your Site

It’s not easy to attract new customers when they don’t know you exist. In order for people to actually find your website, you need to promote it. This entails a number of methods, including social media, sponsored advertising, and search engine optimization. If you don’t promote your site, no one will ever know it exists.

8. Not Monitoring Your Traffic

If you want to improve your website, you need to monitor your traffic. This means keeping track of where your visitors are coming from, what pages they’re spending the most time on, and what sort of actions they’re taking. This information will help you figure out what’s working and what needs to be changed.

9. Not Collecting Emails

One of the best ways to keep people coming back to your website is to collect their email addresses. This way, you can stay in touch with them and let them know about new products, services, or content that you’ve added to your site. Email marketing is a great way to build a relationship with your visitors and keep them coming back.

10. Not Testing Your Site

Before you launch your website, you need to make sure you test it out. This means trying out all the different features and making sure everything is working correctly. You also need to test it on different browsers and devices to make sure people can actually view it. Launch your site without testing it first, and you’re likely to run into a number of problems.

Bonus! 5 common errors website creators make when designing a website

1. Not having a clear purpose or target audience for the website- before you start designing your site, you need to have a good understanding of who you are trying to reach with your content, and what kind of message you want to communicate. Otherwise, your site will likely be cluttered and confusing and fail to engage its intended audience.

2. Creating a website that is too text-heavy- people are more likely to skim through a website than read it word for word. So, it’s important to keep your content concise and make use of headlines, lists, and other formatting techniques to break up the text and make it easier to scan.

3. Overusing images or using them inappropriately- too many images on a website can make it look cluttered and unprofessional. Likewise, using images that are irrelevant or low quality can also negatively impact the overall look of your site.

4. Failing to proofread content- it’s important to proofread all of the content on your website before making it live. Any typos or grammatical errors will make your site look unprofessional and could turn off potential visitors.

5. Not making use of whitespace- incorporating white space into your website’s design is important in order to create a clean and organized look. Too much crammed-together content can be visually overwhelming and difficult to read.

Conclusion

Building a successful website takes time, effort, and planning. If you want your site to be successful, avoid making any of the common mistakes mentioned in this article.

Take the time to do things right, and you’ll be rewarded with a website that brings in plenty of traffic and helps you achieve your business goals.

There’s a big difference between designing a website for consumers (B2C) and businesses (B2B). When you’re designing a website for consumers, the focus is on creating an enjoyable experience that will keep them coming back. This often means using flashy graphics, bright colors, and engaging content.

But when you’re designing a website for businesses, the focus is on usability and function. The layout needs to be easy to navigate, and the content needs to be helpful and relevant. B2B websites are often more bland and boring than B2C websites, but they get the job done.

Here are a Few More Key Differences Between B2B and B2C Website Design:

1. Target Audience

The first and most obvious difference is the target audience. B2B websites are designed for businesses, while B2C websites are designed for consumers. This means that the overall tone and approach will be different.

For example, a B2B website might use more formal language, while a B2C website can be more casual. And a B2B website will likely have a lot more technical information than a B2C website.

2. Goal of the Site

The goal of a B2B website is usually to generate leads, while the goal of a B2C website is usually to generate sales. This means that the content and call-to-actions will be different.

A B2B website might have a form to fill out for more information, while a B2C website might have a “buy now” button. And the content on a B2B website will likely be more educational, while the content on a B2C website will be more promotional.

3. Buying Process

The buying process is also different for B2B and B2C websites. The buying process for a B2B website is usually longer and more complex, as businesses need to do more research before making a purchase.

This means that the overall design of a B2B website needs to be more intuitive and user-friendly. The navigation should be easy to understand, and the content should be organized in a way that makes sense.

4. Budget

The budget for a B2B website is usually higher than the budget for a B2C website. This is because businesses are willing to invest more money into their website, as they know it will pay off in the long run.

5. Design Style

The design style of a B2B website is usually more conservative than the design style of a B2C website. This is because businesses want their website to look professional and trustworthy.

So, if you’re designing a website for a business, make sure to keep the design clean and simple. Avoid using too much color or too many graphics, as this will make the site look unprofessional.

6. User Experience

The user experience is extremely important for both B2B and B2C websites. But the focus is different. 

For a B2B website, the focus is on making the site easy to use and navigate. This means that the layout needs to be clear and concise, and the content needs to be well-organized. 

For a B2C website, the focus is on creating an enjoyable experience that will keep users coming back. This means that the overall design should be attractive and engaging. Use bright colors, interesting graphics, and compelling content to keep users interested.

7. Testing

Both B2B and B2C websites need to be tested before they’re launched. But the focus of the testing will be different. 

For a B2B website, the focus is on making sure the site is easy to use and navigate. This means testing things like the navigation, forms, and content. 

When testing a B2C website, the focus is on making sure the overall experience is enjoyable. This means testing things like the design, graphics, and overall user experience.

8. Launch Date

The launch date for a B2B website is usually sooner than the launch date for a B2C website. This is because businesses need their website up and running as soon as possible.

So, if you’re designing a website for a business, make sure to keep the launch date in mind. You might need to sacrifice some features in order to meet the deadline.

9. Maintenance

Both B2B and B2C websites need to be maintained after they’re launched. But the focus of the maintenance will be different. For a B2B website, the focus is on making sure the site is always up-to-date and accurate.

This means regularly updating the content, forms, and navigation. For a B2C website, the focus is on making sure the overall experience is still enjoyable. This means regularly adding new content, graphics, and features.

What Are the Benefits of Having a B2C Website design?

In general, the benefits of having a B2C website design are:

1. Increased credibility and professionalism: A professionally designed B2C website helps you build trust and credibility with potential customers. It also gives you an edge over your competitors who may not have a well-designed website.

2. Greater visibility: A professionally designed website can help increase your visibility online and attract more visitors to your site.

3. Better customer service: A well-designed B2C website can help improve customer service by providing easy-to-find contact information and helpful FAQs.

4. Increased sales: A well-designed B2C website can help increase sales by providing a user-friendly shopping experience for your customers.

5. Improved brand awareness: A well-designed B2C website can help improve brand awareness by showcasing your products and services in a positive light.

What are the Benefits of Having a B2B Website Design?

The main benefit of having a B2B website design is that it helps you to build relationships with other businesses. These relationships can be extremely beneficial to your business, as they can help you to get new customers and clients, as well as help you to grow your business.

Another benefit of B2B website design is that it can help you to create a more professional image for your business. If you have a website that looks like it was designed by a professional, it will help to build trust with potential customers and clients. This can be extremely important, as many people are hesitant to do business with companies that they don’t feel are trustworthy.

Conclusion

There are some key differences between B2B and B2C website design. These differences include the purpose of the site, the content, the buying process, the budget, the design style, the user experience, and the launch date. Keep these things in mind when you’re designing a website for either a business or a consumer.