[ad_1]
I run a prototyping service mostly through word of mouth and facebook marketplace, however, I am hoping to expand out a little further and decided to make a WordPress website. I have never made a website before, and I would love to hear if there are any common pitfalls I should watch out for or just basic advice on things I am missing? Hoping to keep the website simple for now but open to any ideas!! This service is specifically tailored to people with small budgets as I myself have experienced being frequently priced out in other prototyping services, especially if I did not have a 100% completed design, which I do not require!
​
[https://matrixmaterials3d.com/](https://matrixmaterials3d.com/) [ad_2]
Not bad for a first site. What I’d improve o:
1. The green is a dated color, can you use another shade?
2. I’d make the “Request a quote” in the hero a prominent button, on the right of the menu
3. I don’t like the darkness of the hero right next to the dark header
4. Too many shades of blue
5. Text over hero is hard to read
6. A little too much movement for my taste
7. What we offer – all boxes should be the same height
8. I like the about us row
9. Why choose us icons – the spacing is uneven
10. Subscribe – make input the same height as the button
11. The request a quote page needs more padding
the buttons; add some padding.
and the site is not mobile responsive
These are more general tips that are more or less applicable to any website:
1. If possible, use SVG for the loco and icons
2. There are some minor-ish [accessibility issues](https://wave.webaim.org/report#/https://matrixmaterials3d.com/)
3. The text under “Who we Serve” is too wide – limit the width to 70ch or so
4. Don’t use hardcoded pixels for font sizes, use REM instead. An user with impaired vision may increase the font size from the browser’s settings, but that will not work with hardcoded font sizes
5. Add some horizontal padding to your section elements. With certain screen sizes the cards of the “What We Offer” are glued to the edges of the screen, which is not optimal (at least not in this scenario)
6. The header links are hoverable outside of their text area due to the padding of the <a> tag
7. The social media icons in the footer don’t currently have working links (which you may be aware of)