#+TITLE: Web Design - tags :: [[file:design.org][Design]],[[file:fonts.org][ Fonts]] * Philosophy :PROPERTIES: :ID: 84fdf4e2-8050-40e8-bd93-502d6e260dfa :END: Websites should be minimal. There is no reason to download five megabytes of Javascript to communicate my hiring credentials. I shouldn't have to wade through frameworks and dark patterns to read a blog post! I am taking a reductionist approach to web design by: - Limiting the number of lines of Javascript. Javascript consumes unnecessary resources and can distract from information presented; as such, Javascript should serve only to enhance current content. - Limiting the number of colors on the site, shifting focus to central components. - Reducing the overall complexity of the project. You can only truly understand a machine if you can remove every piece you don't need. If every piece is necessary for communicating the information, it's all the end user should need to see. Aesthetics aside, focusing on minimizing web development allows the millions of people worldwide with slow connections to access resources and information. Using a simple subset of CSS and Javascript, too, enables older browsers and hardware to sufficiently load websites. The web doesn't have to be so hostile or expensive to run. Focus on boiling it down to its essentials. https://matthiasott.com/notes/the-thing-with-leading-in-css * Inspiration :PROPERTIES: :ID: 3f7f93ab-9bc7-4322-9f3e-15d8efa5b949 :END: - [[http://mikhailkhoury.com/][Mikhail Khoury's website]], one I stumbled upon only because he shares a last name with Northeastern's Computer Science college, has an astoundingly minimal yet well-designed site. It's easy to navigate and has no distractions from the site's objective. - [[https://100r.co][100 Rabbits]] are a creative duo comprised of Rekka Bellum and [[https://xxiivv.com/][Devine Lu Linvega]]; they've inspired me to move towards using minimal, accessible tooling, and have a fantastic design language present throughout all of their work. [[file:../people/100_rabbits.org][100 Rabbits]] - [[https://www.pentagram.com/work/secondmind][Pentagram]], a design consultancy with a lot of great work. They have lots of mockups and designs to reference. * Resources https://cargo.site/ [[https://www.huffpost.com/entry/complexion-reduction-a-new-trend-in-mobile-design_b_577d828fe4b05b4c02fb8b07?test_ad=taboola_iframe_mw_life][complex reduction]] [[https://medium.com/startup-grind/i-got-rejected-by-apple-music-so-i-redesigned-it-b7e2e4dc64bf][apple music redesign case study]] https://codepen.io/ge1doot/pen/MWeBPQE very cute pen https://matthiasott.com/notes/wicked-design quick thoughts on 'wicked design' https://grumpy.website/ a catalogue of terrible user interface design decisions https://avanier.now.sh/work.html love this https://deianeira.co : great web design. wow vertically aligned logos, cool font, 'alter ego', quick journal https://neil.computer/notes/the-design-of-diskprices-com/ amazing minimal site with a few notes on making it the best it can be http://ericmotil.com/ https://web.archive.org/web/20191125141522/http://www.070shake.net/ an incredible site! [[https://themesberg.com/product/ui-kit/windows-95-ui-kit][Windows 95 UI Kit - Themesberg]] [[https://github.com/brainrape/windows-95-ui-kit][brainrape/windows-95-ui-kit: ? Windows 95 UI Kit made with Bootstrap 4 comp]] https://github.com/mit-pdos/noria [[https://ertdfgcvb.xyz/][inspirational site]] [[https://www.blobmaker.app/][Blobmaker - Make organic SVG shapes for your next design]] [[https://vanschneider.com/finding-consistency-in-your-ux-copy?mc_cid=2a96675e6c&mc_eid=654729b272][consistent microcopy makes for good product ux]] [[https://thedesignsquiggle.com/][the design squiggle, emblematic of the design process]] https://hot3eed.github.io/2020/06/22/snap_p2_deobfuscation.html love love love this website and the readme,[[file:cybersecurity.org][Cybersecurity]] [[https://shoelace.style/][shoelace]]: a forward thinking library of web components https://kristopolous.github.io/BOOTSTRA.386/ beautiful framework like bootstrap, but for DOS https://linus.zone/dev good web design resources! https://gerireid.com/forms.html good form design principles [[file:ethical-web.org][Ethical Web]] https://gerireid.com/forms.html incredible architecture navigation demo: [[file:three.org][Three]] https://pavellaptev.github.io/web-dark-ages/ web design trends over the last 20 years. the site map and guest book pages are really cool and seem fun to add : ) https://derolez.dev/ i actually love this guys work - even if i dont like how animated the front page is http://brandoncjohnson.com/ someone likes space - and threejs!!! [[file:three.org][Three]] https://blog.hubspot.com/marketing/best-personal-websites https://ertdfgcvb.xyz/ incredible piece of animation using characters https://www.r2design.pt/ https://tonsky.me/blog/monitors/ you need a better display to make sure that things are rendering correctly in 1080p. https://www.figma.com/community/file/822953707012850361 very nice design system. wish the company were better https://sean.fish/ its like an old computer! https://github.com/foundation/foundation-sites the most advanced front end in the world, or something * brutalism https://brutalist-web.design/ comes from 'raw concrete' french term. follow these guidelines well. https://www.ribbonfarm.com/2017/01/05/tendrils-of-mess-in-our-brains/ order is everywhere https://brutalistwebsites.com/?epik=dj0yJnU9UExtUjV0WndmaHpPMTZZTVNNRHUxYThnLVhWLXB4aU4mcD0wJm49bVZRVVd3ajVRYW1yWl9SS2MySE5sUSZ0PUFBQUFBR0FSSF9J