My first client! Layout feedback deeply appreciated

I posted on Craigslist and got my first client. He had VERY specific ideas of what he wanted, and so I’m just going with it, even though I don’t really like the older style website he is looking for. He also didn’t get the concept of a call-to-action button, so that was deleted. LOL

My main problem right now is the layout; the client specifically asked for just 2 pages, but the text is so long, it needs to be broken up.

I added a grey box to try to break up the text a bit, but I still feel it’s missing something. Any design suggestions appreciated.
View my wireframe here: [https://www.figma.com/file/dkY38V0KgKzdFhOIdDlKxxEN/IRA2?node-id=16%3A45]

Thank you FCC community! I’ll try to also contribute to others here from now on also!
EDIT: Well, I already started coding the page, but feel free to comment since I haven’t delivered to the client yet.

2 Likes

Congrats!

Ok, just a few design things to make the page more readable and attractive…that is, if its within the parameters that the client wants :sweat_smile:

  1. Make the text over the picture more legible. The white text on a majority white picture makes the text not easily seen. I also would sharpen the text shadow to really define it. You could try putting an opacity on your picture and see if that helps, but I like how clear it is already.
  2. You could try making the CALL TODAY! a call-to-action button and center that along with its subtext. I’d also make them larger, maybe bold? You want people to call this guy so make it important for this page.
  3. I’d put the Contact info with his picture in a box on the left to separate it from the rest of the content. Maybe make his little picture a circle to add some oomph? lol whatever, I’ve had a lot of coffee :stuck_out_tongue_winking_eye: But definitely put the contact info in a box.
  4. I like the IRA stuff in that box, but maybe make it more pretty, like with a border, box-shadow, text-shadow, etc?

For the Second Page:

  1. For the first block of text, I’d make each heading bold or a different font or something to differentiate it from the rest of the text.
  2. Why is the top block of text so thin and small while the bottom is big and colorful? Can you make the top block, for example, in a grey box, maybe not as big and bold since there’s more wording? Just something to keep the readers interested!
  3. Put the left contact sidebar in a box. I don’t think you need so much spacing between the contact info and his picture as well.
  4. Put the solution text area in a different color box. I’d also space each contact sentence into different lines and maybe make them linkable! (like, make “Facebook” into a link to his Facebook)

Also, make sure your re-read your text. I didn’t do it thoroughly, but I noticed some spacing, grammar, and maybe spelling that could be looked over. Example, page 2:

"In most situations the cost will range from $350 to $750 per zero valuation report,depending on the complexity of the situation."
When it should probably read as:
"In most situations **,** the cost will range from $350 to $750 per zero **evaluation** (unless it's supposed to be valuation?) report, **(space added)** depending on the complexity of the situation."

Andddddd yeah! That’s about it so far! Sorry if it was a lot. It’s not meant to make you discouraged either. Everything is nice, simple, to the point, which I think a guy like that would appreciate. It just needs a little simple pizzazz~!
I hope you can use some of those ideas! Good luck! I hope we can see an update soon

1 Like

WOW! Thank you so much for the comprehensive review!! I will adopt many of these suggestions, I’m sure.
Definitely the white text needs to be more visible, thank you, I see that now! As I said, the call to action was something I pushed for (a tel: or mailto:) but the client just doesn’t seem to value the concept, and I didn’t want to push it further. I might try to bring it up again later.
A circle portrait might be better, yeah!
Drop shadow, yes! OMG, thank you!!
“The Solution” text a different color – that is a GREAT idea
Facebook text an actual link to his Facebook, thank you, yes.

Thank you for going so far as to proofread. ‘Valuation’ got me for a second, too, but it’s correct.

Muchas gracias, domo arigatou, shi shi, mahalo…I can’t thank you enough for your generosity with your time! I’m making the recommended changes now.
-Zandra

lol, no problem, really! I actually like being on this forum and seeing other people’s work and progress, and maybe being able to help. I’m pretty new at all of this, so you having your first client is AH-MAZING! I just want it to go well for you.I can’t wait until I get mine too

I’m glad you liked the suggestions. I really hope it makes everything more well-rounded. I can’t wait to see the next draft. For the call-to-action part, maybe you can make two different markups: one with, and one without, for him to see and compare? It takes a little more time, but I think its a part of the industry :woman_shrugging: Anyways, its all good, link the new draft when you can!

1 Like

Please noticed at some points below:

  1. The contrast of your site: Shouldn’t place your text on your un-predicted image background, that will make your site difficult to read
  2. Drop-shadow: Many modern site and design trending for now using flat-design for more simpler and easier to browse, read your page content, don’t waste your user’s traffic with those issues, that will make your users distracted and confused
  3. Layout: Most common layout type I thought are: single column for landing page (or might be 2 column for content pages)

Materials and Tutorials you can refer to learn everything you want and will be up-to-date for you:
youtube dot com/channel/UCg7GE5bWGvBGnvjt7ZiL04g

1 Like

Thanks! I feel really welcomed here thanks to you folks!

I’m gonna keep working at the same file, so that same Figma link should remain the valid one. I started making edits already, forgot I have to crop the photo to square dimensions to get a perfect circle. LOL

Working on the text boxes now.

Thank you jimidark,

Yes, the text on the image background IS a bit hard to read – I’ve faded out the image transparency a bit and darkened the text shadow, too!

Drop shadow – I’m still playing with things, not final yet!

The client is an older gentleman, he’s not really concerned with modern aesthetics. His main concern is SEO (yikes!!! for a single page with no blog, no backlinks, and a brand-new URL)…
Mainly for my portfolio, I’m trying to make it look a bit better. So thank you for all your tips, so kind to take the time!