The Perfect Ecommerce Website Layout Explained

แชร์
ฝัง
  • เผยแพร่เมื่อ 11 มิ.ย. 2024
  • For more private training and resources for web designers, join us at:
    www.paitpro.com
    🔳🔳🔳🔳🔳🔳🔳🔳🔳🔳🔳🔳🔳🔳🔳🔳🔳🔳🔳🔳🔳🔳🔳🔳
    More videos to help your career:
    🎥 Perfect Homepage Layout 🎥
    🔳🔳🔳🔳🔳🔳🔳🔳🔳🔳🔳🔳🔳🔳🔳🔳🔳🔳🔳🔳🔳🔳🔳🔳
    CHAPTERS
    0:00 Intro to ecommerce web design
    1:16 The best example of an ecommerce website
    4:13 The most important parts of an ecommerce product page
    8:22 A bad ecommerce site example
    10:15 Ecommerce site design on mobile
    🔳🔳🔳🔳🔳🔳🔳🔳🔳🔳🔳🔳🔳🔳🔳🔳🔳🔳🔳🔳🔳🔳🔳🔳
    The Perfect Ecommerce Website Layout Explained

ความคิดเห็น • 55

  • @catalinim4227
    @catalinim4227 11 หลายเดือนก่อน +26

    amazon having the best layout is subjective. they have huge success because of the low prices, the huge range of products, delivery, refunds, etc.

    • @rootenshi
      @rootenshi 8 หลายเดือนก่อน +7

      Yes!
      If it wasn't for these services I would have never opened their website.
      By far the most confusing UX I've had with an e-commerce website. Let alone the super ugly cluttered ui.

    • @laincoubert7236
      @laincoubert7236 7 หลายเดือนก่อน

      i wonder if the same applies to facebook but in terms of algorithms (or the fact that they were the first). when i signed up for the first time i was shocked by how awful and confusing the experience was, haven't touched that website since lol.

    • @joaomarcoscosta5095
      @joaomarcoscosta5095 2 หลายเดือนก่อน

      @@rootenshiwhat’s a UX?

    • @rootenshi
      @rootenshi 2 หลายเดือนก่อน

      @@joaomarcoscosta5095
      UX (user experience) in plain terms, how easy it is for the user to undrrstand, use and navigate the app.
      Of course there is more to it. But this is the caveat. The experience of the user whilst using your product. Whether it's alright as expected, or more positive such as joyful experience. Or even negative ones like frustrating.

    • @Dylan_Marshall
      @Dylan_Marshall 2 หลายเดือนก่อน

      @@joaomarcoscosta5095 User Experience

  • @cruchlorent
    @cruchlorent ปีที่แล้ว +5

    Love this! We'd love to have more of ecommerce design videos like this...Subscribed!

  • @dylandavino
    @dylandavino ปีที่แล้ว +9

    Ecommerce is a great space to be in. Great points you bring up, and definitely don't forget to add upsells and limited time sales to add that urgency throughout the site.

  • @abdu_brh
    @abdu_brh ปีที่แล้ว +5

    Thank you Payton, we need more videos like this for other types of websites !

  • @scott8193
    @scott8193 2 หลายเดือนก่อน

    Wowwww your knowledge runs deep with this stuff. I look forward to paying you for a consultation

  • @zanvengust1205
    @zanvengust1205 3 หลายเดือนก่อน +1

    Thank you for sharing knowledge and not selling courses.

  • @dragonflyjones5023
    @dragonflyjones5023 ปีที่แล้ว +1

    You're incredible! Thanks!

  • @TheLeighjones
    @TheLeighjones ปีที่แล้ว +3

    Great insights and I like your teach style.

  • @hrgraphicsstudio
    @hrgraphicsstudio ปีที่แล้ว

    this is really helpful bro✔✔

  • @salih-khan
    @salih-khan 7 หลายเดือนก่อน

    within 20 seconds of this video im hearing about the importance of getting it right but jokes on you im making it for myself

  • @joe6776
    @joe6776 ปีที่แล้ว

    Clark, you rock.

  • @jordanrazowskymusician8178
    @jordanrazowskymusician8178 7 หลายเดือนก่อน

    Great info!

  • @nhsareng
    @nhsareng ปีที่แล้ว +1

    Superb, high quality video 👏

  • @nicknorway
    @nicknorway 2 หลายเดือนก่อน

    Thanks for video.
    What can you suggest,
    How to get products rewie for a new site?

  • @developer_george
    @developer_george ปีที่แล้ว

    Amazing video

  • @fatjay9402
    @fatjay9402 ปีที่แล้ว +1

    Great Video!

  • @SpaceGhostSupreme
    @SpaceGhostSupreme ปีที่แล้ว +1

    If I'm to build this style of eCommerce site on WordPress, is there a plug-in you could recommend or some way to build my website in this style?

  • @Higgfarm
    @Higgfarm ปีที่แล้ว

    Do you recommend this layout for digital products?

  • @wealthyman5420
    @wealthyman5420 ปีที่แล้ว +2

    Hey Clerk,
    What's your recomended pixel height of "fold"?
    Thanks.

    • @dbs5212
      @dbs5212 8 หลายเดือนก่อน

      The height of your screen I Guess?

  • @jaymarcelodagos9665
    @jaymarcelodagos9665 6 หลายเดือนก่อน

    what language can I compute the prize when they have discount prize?

  • @joe6776
    @joe6776 ปีที่แล้ว +2

    Btw, can you show us a video on how the extension you made was built?

    • @PaytonClarkSmith
      @PaytonClarkSmith  ปีที่แล้ว +4

      I am planning a video walking through the design process. The dev was done by my team and that would be a pretty complex video

  • @yaakovchaim
    @yaakovchaim 3 หลายเดือนก่อน

    Do you think it's better to have 3D images or real product images?

  • @user-zf7wp2fc2k
    @user-zf7wp2fc2k 10 หลายเดือนก่อน

    reely gud vydeo

  • @hustleyas__
    @hustleyas__ 3 หลายเดือนก่อน

    Hey, where can we found the template of this website ?

  • @alexandrabeskrovnaya5327
    @alexandrabeskrovnaya5327 3 หลายเดือนก่อน

    Great video, with some helpful advice, but ultimately falls short. In today's mobile-dominated world, optimizing for 'add to cart' buttons or screen spacing isn't paramount. Focus on your unique selling proposition for real business success.

  • @aireisorentertainment3143
    @aireisorentertainment3143 ปีที่แล้ว

    How do you define the viewport size? Everybody has different size monitors & resolutions

    • @alanrobertson3734
      @alanrobertson3734 8 หลายเดือนก่อน

      Design for the minimum and scale up.

  • @Faks_Ar
    @Faks_Ar ปีที่แล้ว +3

    Sorry but what's the size of that viewport you're using as example? looks really off, that height looks mobile but the width dont..
    Also, you can auto scroll the viewport on page load

    • @PaytonClarkSmith
      @PaytonClarkSmith  ปีที่แล้ว

      It wasn’t any official size. Just an example to illustrate!

    • @Faks_Ar
      @Faks_Ar ปีที่แล้ว

      @@PaytonClarkSmith Oh! Okay, makes sense 👍

  • @TheoEllis-my3ig
    @TheoEllis-my3ig 2 หลายเดือนก่อน

    Worth more than gold

  • @Sam_North
    @Sam_North 6 หลายเดือนก่อน

    Isn't the bad ecommerce example just mobile layout? So the viewport would be horizontal

  • @chunghoangngoc8620
    @chunghoangngoc8620 10 หลายเดือนก่อน

    Ok

  • @iUmerFarooq
    @iUmerFarooq ปีที่แล้ว +2

    But personally on mobile version I will use dashes instead of circles!

  • @user-es3gs4xj8v
    @user-es3gs4xj8v 9 หลายเดือนก่อน +1

    Can I get the figma link

    • @ApeHolder42069
      @ApeHolder42069 3 หลายเดือนก่อน

      Sorry, best I can do is Ligma!

  • @bodyclockcoach3367
    @bodyclockcoach3367 7 หลายเดือนก่อน

    Your face section should be smaller for such a video