UX UI Design Resources

• MDN "Planning a Simple Website" https://developer.mozilla.org/en-US/docs/Learn/HTML/Introduction_to_HTML/Document_and_website_structure#planning_a_simple_website

How to design (for a non-designer)

https://undsgn.com/how-to-design-a-website-like-a-professional/

https://forum.freecodecamp.org/t/how-to-layout-and-design-a-website-without-any-design-skills/188603

CSS Framework or not

this one points to some resources

https://dev.to/xenoxdev/do-we-really-need-a-css-framework-4ma6#:~:text=So%2C%20if%20you%20are%20working,Frameworks%20can%20save%20your%20day.&text=If%20you%20don't%20have,don't%20need%20a%20framework.

https://www.typewolf.com/free-fonts discussion of free fonts from professional

https://themeforest.net/

https://designerup.co/blog/10-best-design-systems-and-how-to-learn-and-steal-from-them/ (design systems)

https://www.invisionapp.com/inside-design/guide-to-design-systems/

https://careerfoundry.com/en/blog/ux-design/free-wireframing-tools/

Bootstrap

Tailwind (CSS) & DaisyUI (Tailwind component)

Element UI

"CSS replacement for bootstrap" (well organised)

https://github.com/you-dont-need/You-Dont-Need-Javascript

Best CSS Snippets Sites

https://www.awwwards.com/best-css-code-snippets-sites.html

https://css-tricks.com/snippets/css/ - lots of tricks but not really "copy and paste"

Basics:

https://www.internetingishard.com/html-and-css/web-typography/

https://practicaltypography.com/summary-of-key-rules.html

Drop-down select effect then copy/paste

https://sarthology.github.io/Animatopy/