Having just watched and commented on the previous 50 that really sparked my artistic soul, I have to say these new 50 feel much more user-focused and less restrictive on creativity. In my opinion, they are much closer to what I would consider "must-dos".
Here are the 50 web design mistakes summarized in points: Layout and Design Don't center align titles with left-aligned paragraph text Use content containers or wrappers to ensure usability on wide monitors Avoid adding line breaks to headings for aesthetic purposes Don't hover scroll-to-top buttons over footer content Avoid crazy letter spacing that makes text harder to read Use sufficient text area space to encourage users to provide more information Headings and Typography Headings should not be the size of sentences Avoid using stock photos Use a consistent font size and style throughout the website Don't use more than two to three bold colors on a website Use italics for reviews, testimonials, or quotes Navigation and Links External links should open in a new tab Set the HTML theme color to match the website's color scheme Provide a way to get back to the parent page from sub-pages Don't hide the sidebar on mobile devices Use hover effects on buttons, even on mobile devices Accessibility Ensure sufficient color contrast between background and text Provide captions for videos and images that require explanation Make sure the logo is readable in different navigation styles Use focus effects to help users understand what's been clicked Content and Organization Don't use too many button styles Design for your target demographic Provide a dedicated page for important information like contact or pricing Use a clear and consistent URL hierarchy Avoid using too many body paragraph styles User Experience Avoid horizontal scrolling Provide a clear call-to-action on the 404 page Use a search field or provide high-level links to help users find what they're looking for Use an overlay instead of text shadow to make text readable Use proper line breaks on paragraphs Miscellaneous Avoid using full background colors on titles Use descriptive text on buttons instead of "Learn More" Avoid top notification banners that cover navigation Use sticky menus to improve navigation Ensure text is at least 12 pixels in size for accessibility Avoid using off-canvas menus for contact information Don't use decorative borders around the viewport Use breadcrumbs at the top of the page Group related items together to improve scanning Avoid using two call-to-actions side by side Include products on the homepage of e-commerce websites Include currency when mentioning pricing on the website Avoid center aligning drop-down menus
1:05 But: the more info you let people write, the more text you will have to spend time reading. And when someone has gone so far that he will write and send you a message that box size will not stop him.
As someone who'only just starting on web design, some of these could do with mor information, or a comparison between a site that makes the mistake snd one that doesn’t. Some of these were a bit confusing and I don't really know what they mean. Also, would be interested to know which two mistakes from the previous video you don't stand by anymore.
Hey hello! How should I start web design? I’m really interested in creating designs in Canva, but I’m unsure if it’s as good as using something else to practice.
Bro, #4! Even multi-billion dollar companies mess this up. How was your experience? Would you like to rate 5 but can't because there is a help icon over it?
While there are some good ideas in there, half of those are just opinions, and contradict each other (i.e. Show 3 testimonials so users have more info on screen, // Always use sticky nav (which reduce the screen real estate, and thus the amount of info you can display)) You’re obviously a bright individual. I wish you’d put in the effort to give nuanced explanations that people can actually learn from, instead of a list of rules (immutable laws, really, in the way you present them and how they're going to be perceived). This is treating the symptoms, not the disease.
Your content is much better than typical boring tutorial based stuff from other channels, keep it up!
Having just watched and commented on the previous 50 that really sparked my artistic soul, I have to say these new 50 feel much more user-focused and less restrictive on creativity. In my opinion, they are much closer to what I would consider "must-dos".
Great list, going back to review the first one.
*Great tips, Aaron!* Thank you!
Here are the 50 web design mistakes summarized in points:
Layout and Design
Don't center align titles with left-aligned paragraph text
Use content containers or wrappers to ensure usability on wide monitors
Avoid adding line breaks to headings for aesthetic purposes
Don't hover scroll-to-top buttons over footer content
Avoid crazy letter spacing that makes text harder to read
Use sufficient text area space to encourage users to provide more information
Headings and Typography
Headings should not be the size of sentences
Avoid using stock photos
Use a consistent font size and style throughout the website
Don't use more than two to three bold colors on a website
Use italics for reviews, testimonials, or quotes
Navigation and Links
External links should open in a new tab
Set the HTML theme color to match the website's color scheme
Provide a way to get back to the parent page from sub-pages
Don't hide the sidebar on mobile devices
Use hover effects on buttons, even on mobile devices
Accessibility
Ensure sufficient color contrast between background and text
Provide captions for videos and images that require explanation
Make sure the logo is readable in different navigation styles
Use focus effects to help users understand what's been clicked
Content and Organization
Don't use too many button styles
Design for your target demographic
Provide a dedicated page for important information like contact or pricing
Use a clear and consistent URL hierarchy
Avoid using too many body paragraph styles
User Experience
Avoid horizontal scrolling
Provide a clear call-to-action on the 404 page
Use a search field or provide high-level links to help users find what they're looking for
Use an overlay instead of text shadow to make text readable
Use proper line breaks on paragraphs
Miscellaneous
Avoid using full background colors on titles
Use descriptive text on buttons instead of "Learn More"
Avoid top notification banners that cover navigation
Use sticky menus to improve navigation
Ensure text is at least 12 pixels in size for accessibility
Avoid using off-canvas menus for contact information
Don't use decorative borders around the viewport
Use breadcrumbs at the top of the page
Group related items together to improve scanning
Avoid using two call-to-actions side by side
Include products on the homepage of e-commerce websites
Include currency when mentioning pricing on the website
Avoid center aligning drop-down menus
Thank you!
Will you ever do mobile-focused design videos? You've spoken a lot about designing on desktop already, so I'm looking for new things to learn.
Great stuff - difficult for me to disagree with any of these 50, Thanks a ton!
Another great video from The Website Architect. Awesome tips to make your website more user friendly.
this is so helpful ! we want more ! thank you for sharing your knowledge
1:05
But: the more info you let people write, the more text you will have to spend time reading. And when someone has gone so far that he will write and send you a message that box size will not stop him.
Nice to see another banger
Great list! I agree with every single item!
Love your content !
Amazing video!
I will make a checklist of these mistakes
Great... Many things to learn
Can you elaborate on changing theme app color?
Refreshingly useful content. I mean I knew all of these since I'm a god damn professional :) bit still, very useful.
As someone who'only just starting on web design, some of these could do with mor information, or a comparison between a site that makes the mistake snd one that doesn’t. Some of these were a bit confusing and I don't really know what they mean.
Also, would be interested to know which two mistakes from the previous video you don't stand by anymore.
I made 49 of 50 mistakes..... so either, 1. there's still hope for me or 2. I best take up golf.
"whatever the hell this is." I nearly spit out my coffee. :)
Can you do a video on css manipulation of text per item 26 please?
Hey hello! How should I start web design? I’m really interested in creating designs in Canva, but I’m unsure if it’s as good as using something else to practice.
ANY BOOKS THAT U CAN SUGGEST TO LEARN MORE ABOUT THIS ?
Bro, #4! Even multi-billion dollar companies mess this up.
How was your experience? Would you like to rate 5 but can't because there is a help icon over it?
I already knew all of these but it's great list. I think you went through them too quickly, though.
Bro remember his password
"Whatever the hell this is." 😆😆😆😆😆😆😆😆😆😆😆😆😆😆😆
Sorry but what is number 10? not setting up HTML theme... and the rest is lost on me. Not a native speaker obviously. Thanks
The messiah is back!
While there are some good ideas in there, half of those are just opinions, and contradict each other (i.e. Show 3 testimonials so users have more info on screen, // Always use sticky nav (which reduce the screen real estate, and thus the amount of info you can display))
You’re obviously a bright individual. I wish you’d put in the effort to give nuanced explanations that people can actually learn from, instead of a list of rules (immutable laws, really, in the way you present them and how they're going to be perceived). This is treating the symptoms, not the disease.
“People in their mid forties will begin to have sight problems”
Me at 26 😢