New Website for Photorestoration Business

[Markoc]

I've put this one together using wysiwyg ver 20. It's for my photo restoration business. Had to work through quite a few head scratches but with such a large wealth of info in the forums, and helpful help pages I got them sorted out.

https://www.photorestorationma.com/index.php

[crispy68]

Hey Markoc,

few things I noticed and observations:

1. The slide show with the 4 slides towards the top causes horizontal scrollbars in the browser each time the image slides into view. Try setting the overflow=hidden on Layoutgrid12.

2. I noticed that on your pages almost everything fades into view as you scroll. In some cases, I see the objects and they disappear until I scroll which leaves blank spaces on the page which looks odd. I would suggest on things near the top of the screen you use 'onscrollreveal' which should fire it to show the minute it is in the viewport. I would also suggest just using this effect on certain parts of the page to highlight stuff rather than everything otherwise it kind of diminishes the effect overall. It's a nice effect but you don't want to overuse it.

3. The scrolling 'Get Started' and to the 'top arrow' buttons that delay scroll into place as you scroll down the page...not a fan of it doing that as I find it sort of distracting as I scroll and I see that in my peripheral. I would used fixed positioning for the scroll to top button in the bottom right and I would add the Get Start button to my header on the right side so it is always visible. Just my opinion.

Overall, very nice site and you do good work!

[Markoc]

Hi Crispy68,

Thank you so much taking the time out of your day to review my website. I agree with all your suggestions and have made the changes and uploaded everything.

The horizontal scrolling when those slides changed always bothered me but didn't know how to fix it. I just decided to change the transition to a fade instead which seemed to clear it.
I redid the Back to Top button as I can see your point about it getting annoying. I also put back the Get Started button back in the menu where I originally had it. It was giving me some issues on smaller viewports so I'll just test leaving it there. I did remove most of those transitions as I did notice them seem to be resetting alot, which bugged me too.
Always good to have another pair of eyes to see things

Thanks again!

[wwonderfull]

And here are some more you can fix.

1. On the index page on mobile devices the heading "wb_Heading8" causes overflow. Adjust it for mobile devices.

2. On your contact-us.html something causes overflow on that page you might need to adjust that for mobile devices.

3. On your testimonials.html there is Extension5 which causes overflow on the Y meaning vertically (down). It happens after the breakpoint so check your breakpoints.

Although I have a very sharp eye but even for me the text seemed too thin and some places it is too small. If people cannot see the websites text properly, I am not sure, how will they see a restored images detail. Mostly elderly people may come to visit the site. So, with due respect try to improve the font for their sake at least because many have disabilities.

That is from my honest perspective.

[crispy68]

On the contract is page it's the Google map causing the overflow.

[wwonderfull]

Yes, correct crispy because the iframe which contains the maps has a fixed width of 450px.

[Markoc]

Thank you both for reviewing the site for me. I really appreciate and value your expertise. I think I got all the changes made. I adjusted most of the fonts to at least 16px. I couldn't figure out how to get the google map to adjust correctly for different viewpoints so I just made it 300 px and called it a day.

On the testimonials.html the Extension3 and Extension5 are both Read More extensions and after much trial and error I get it to work on all breakpoints
but when I get back into the page and make any changes the two testimonials that are read more, the text disappears on everything but the default viewpoint.
Any thoughts on how to get the extension to work? I believe it is one of yours Crispy68?

[crispy68]

If you are using the embed code from google then in the code, change the width to 100%.

[wwonderfull]

Something of concern has been found..

On your website you have <meta name="robots" content="noindex, nofollow" />

which means you are wanting to block the search engine robots to not index the page and not follow any links on that page. Essentially, this prevents the page from appearing in search engine results and stops search engines from crawling any links found on the page.

From a logical perspective it should have been <meta name="robots" content="index, follow" />

[wwonderfull]

Thank you both for reviewing the site for me. I really appreciate and value your expertise. I think I got all the changes made. I adjusted most of the fonts to at least 16px.

let me show you something from a visual perspective about which thin fonts and font sizes I was mentioning about. Those fonts are all over the place which may need adjustments.

On the left side is the way you currently have and on the right side is the way I adjusted it.

[AliGW]

Ironically, the screenshots are too small to be able to properly appreciate the issue (with which I agree, by the way)!

[Markoc]

Hi Crispy68, I did try the map at 100% but the map is wide but not tall so it looked funny. So going to a 300px square was ok.

Hi Wwonderfull, that ons section I wanted the font to be smaller so I could stuff a bunch of keywords into a small space. I'll find a better way to do it or remove it all together. I'll check again to see if I have more small fonts below 16px.

On the <meta name="robots" content="noindex, nofollow" />, I had gone through and fixed them already but I will check them again.


Thanks again for checking the site out.

[crispy68]

To me, the map at 300px looks odd on my desktop. It's too small and is on a line by itself which creates a lot of empty space.



Why not put the text with your name, address, phone etc in the left column and the map in the right column? I would still use 100% for the width so it will look good on all devices. It would look something like this:

demo

Decrease the browser to see how it would look down to mobile.

[Markoc]

Hi Crispy68,

I already had it in a 2 section layout grid and on chrome it displays fine, on Microsoft edge it shows like your sample.

Here is it on chrome:


So I changed it to 100% width but got the same results. I removed the divs surrounding the iframe and I got your result. Looks much better now.

Thanks again