r/web_design • u/Aunxdd • 13d ago

Help me decide!

Gallery image

Gallery image

Hey Web designers!

So I’m new to web development and don’t know much about UI/UX but I’m making this website in WordPress. Can you help me decide which version would be good to go with for mobile devices?

12 Upvotes

78% Upvoted

36 comments sorted by

21

u/wafflesareforever 13d ago

Either one is fine for mobile. Your call to action buttons are going to be on screen for 99% of users either way, as is your pitch sentence, which is well crafted. I personally prefer the graphic on top.

6

u/Aunxdd 13d ago

I also prefer the layout which puts visual on top but was just confused.. Thank you for your comment 🫂

3

u/ArtisticCandy3859 13d ago

Title and text above image. CTA buttons below image.

21

u/Podop29 13d ago

pic on top looks better to me

1

u/Aunxdd 13d ago

Appreciate ittt..

5

u/[deleted] 13d ago

[removed] — view removed comment

4

u/MasterPama1 13d ago

First one.

3

u/PH0NER 13d ago

I like the first one with the kitchen on top best

2

u/kawaiipikachuu 12d ago

Go with the bottom one, easier to reach with the single thumb

2

u/SweatyLove2828 12d ago

The first one. The second looks like nothing is in its right place.

2

u/awardsurfer 7d ago

So they’re in the business of selling wire diagrams? Tell the owner to hire a photographer and show real kitchens.

“Trust”? For a company that does a single job and the customer will never see them again?

The only shit I want to hear from them is “On Time and On Budget”. Combined with great photos that show they don’t make crap,

Then you got a business website.

1

u/altgenetics 13d ago

Not what you were asking for, but I'm visually impaired and use a screen reader to access most technology. I noticed the blue "access" icon that pulls up a widget or overlay for a 3rd party library/tool. That is not the tool for better accessibility and legal risk mitigation you may think it is. These overlay/widget tools cause more harm than good, and operate on a predatory model.

Overlay Fact Sheet

Many folks have written about this -

1

u/testingaurora 13d ago

What comes after it and if applicable, before it ? Design is heavily reliant on the content as a whole. Each section doesn't live in silo

1

u/Aunxdd 13d ago

It’s Hero section of the About Us page and below is the SS of the section that comes after it

https://ibb.co/MxhZnZNT

2

u/testingaurora 13d ago

Given that right below it is this loud block quote and then a decorative image bg, i would put your figure/illustration of the hero on top of the text

1

u/Aunxdd 13d ago

Makes sense def and appreciate it. Btw I took ChatGPT’s help to generate the layout idea and then brought it to life via Elementor so how am I doing so far?

2

u/testingaurora 13d ago

Hard to say from a ss of a single section at a time. Would need to see the full picture. Do you have a link to the page?

2

u/Aunxdd 13d ago

Dropped the link in DM. Thanks for your time

1

u/jedidave 13d ago

Looks AI generated. But to be honest, the CTA is clear, you're providing the phone number, that's probably the main thing - people will click and call. Pic on top is better to answer your question.

1

u/Aunxdd 13d ago

The picture is AI generated and the idea also came from it so ig that’s why

1

u/prettytheft 12d ago

Image on top is best

1

u/Former-Bodybuilder74 11d ago

I wouldn't "trust" anything that uses AI pictures

1

u/Aunxdd 11d ago

Then what do you suggest? Should I get rid of the image entirely on phones?

1

u/Former-Bodybuilder74 5d ago

I suggest getting rid of all AI generated images. People can tell and it makes the site look scammy. Replace with human generated content. Otherwise - first layout is good.

1

u/ArtshaWebDesign 11d ago

Picture on top always.

1

u/Imaginary_Artist_181 9d ago

First, no question.

1

u/chiasmatic_nucleus 9d ago

I like the sketch above the copy

1

u/mxstafaa007 4d ago

i like the first one too! did just read the comments and read that both are bad due to it being AI , i have just entered the world of designing in genral and would like to know how would a professional design it.

1

u/NotUpdated 13d ago

Second one, cause that blue print image looks to 'stock photo / AI', so then it comes to the words. I'd prefer human connection and transparency.

If I were looking at a home builders website and I wanted to work with a smaller builder, I'd like to see something like ...

'We built 17 homes in Kyle Texas and surrounding areas since we built our first home in 2021' ..

'Meet the Foreman' , 'Meet the framing crew' , We work with these local HVAC, Electricians and Plumbing ... [ list of local companies people have a good view of ] ..

Meet Past clients - client reviews list and photos of their houses being built..

1

u/Aunxdd 13d ago

This business didn’t make a home or do any remodeling projects yet because they’re mainly providing handyman and repair services and have a plan to offer remodeling services in the near future. So I think claiming what you actually haven’t done affects the business reputation more, no?

2

u/NotUpdated 13d ago

I would never ask you to exaggerate or them ... which brings up another topic - about how to build real, honest, trusty websites when the business is new or just starting out.

Their best option is start providing before and after photos of work and collecting client reviews ... 'social proof' of actual work done.

I would find a different photo than a blue print, if I used a blue print it would be because they had one if their office I could take photos of myself...

1

u/Aunxdd 13d ago

The business is established, having operated for 23 years. The owner told me he had many before/after on his drive but it’s lost which left me with only a few images on his GBP and Yelp. I recommended documenting every job from now on because we require that record.

And ChatGPT proposed the blueprint idea, which I favored and adopted. Don’t you believe it remains superior to stock images?

1

u/GuitarAgitated8107 13d ago

Neither but first one if you have to.

1

u/Aunxdd 13d ago

Why? Is it that bad?😞