As the title states, this is a list of web design and development resources! What are your favorite design and development tools? CSS Flexbox CSS-Tricks – A Complete Guide to Flexbox CSS Grid CSS-Tricks: A Complete Guide to Grid Colors WebAim – Color Contrast Checker Coolors – Color Palette Generator Huemint – Color Palette Generator… Continue reading Big List of Web Design & Development Resources
Blog Posts
Featured Website: Laws of UX
Laws of UX is a fantastic website that makes “complex psychology heuristics” easier for designers to understand. The site explains common cognitive biases, gestalt principles, and heuristics that affect how users interact with user interfaces. Images are used to make heuristics easier to understand and memorable. The site also provides an overview and key takeaways… Continue reading Featured Website: Laws of UX
Featured Website: Dopely Colors
Dopely colors is a handy website for choosing brand colors, creating color palettes and more. The website features the following tools: palette generator gradient generator color converter (converts colors between HEX, RGB, CMYK, HSL, HWB, and NCOL values) color toner (displays shades, tints, and tones for a given color) color wheel (allows users to pick… Continue reading Featured Website: Dopely Colors
5 Overlooked HTML Tags
In “5 HTML Tags You Probably Didn’t Know About,” Gianmarco Ebeling identifies 5 HTML tags that are useful but often overlooked. <kbd> – used to represent a key on a keyboard. The browser’s monospaced font displays the text surrounded by these tags. If you wanted to write a message to users instructing them to use… Continue reading 5 Overlooked HTML Tags
Wireframes for People That Can’t Draw Well
Creating a wireframe on paper is an intimidating task for people who can’t draw well. “How to Draw a Wireframe (Even if You Can’t Draw)” by Kelley Gordon breaks down the process of creating wireframes on paper for those of us that aren’t artistically gifted. Gordon shows that most elements that appear in a wireframe can be… Continue reading Wireframes for People That Can’t Draw Well
Featured Website: The A11Y Project
The A11Y Project is an irreplaceable website whose goal is to make websites (and other digital resources) accessible. The website provides comprehensive checklists created using Web Content Accessibility Guidelines (WCAG). It also has a list of resources that includes software, books, blogs, and online tools developers can use to improve their websites’ accessibility. Finally, the A11Y… Continue reading Featured Website: The A11Y Project
Challenges & Design Briefs
Improving as a web designer or developer takes practice, and it can be challenging to think of new projects on your own. Here are some websites that provide design briefs or daily challenges that you can use to level up your skills or show off in your portfolio. Brief Generators: goodbrief – generates randomized design… Continue reading Challenges & Design Briefs
What Should Be Included in a Portfolio?
Learn to Code with Me has written a helpful article, “27 Things to Include on Your Online Web Developer Portfolio” about creating a web design/developer portfolio for those just starting out. The article includes a list of 27 things that a beginner’s portfolio should have: A custom logo and tagline A killer site design Relevant… Continue reading What Should Be Included in a Portfolio?
What is BEM?
As I’ve begun implementing more complicated layouts with CSS, I’ve encountered a problem: naming CSS classes and ids meaningfully can be difficult. Names that aren’t descriptive enough to inform you of their purpose force you to figure out what they do, which isn’t always a good use of time. Furthermore, working on someone else’s project… Continue reading What is BEM?
Should You Use Pure Black for Text and Backgrounds?
The Digital Accessibility Office of UNC Chapel Hill defines color contrast as “the difference in brightness between foreground and background colors.” You might think that using pure black (with a hex value of #000000) on a white background might provide the highest level of contrast and, subsequently, readability for website visitors. However, a 2018 study… Continue reading Should You Use Pure Black for Text and Backgrounds?