[ 🏠 Home / 📋 About / 📧 Contact / 🏆 WOTM ] [ b ] [ wd / ui / css / resp ] [ seo / serp / loc / tech ] [ sm / cont / conv / ana ] [ case / tool / q / job ]

/wd/ - Web Design

Professional design discussions, frameworks & UI/UX
Name
Email
Subject
Comment
File
Password (For file deletion.)
[1] [2] [3] [4] [5] [6] [7] [8] [9] [10]

File: 1767102482942.jpg (110.8 KB, 1880x1254, img_1767102472813_lyztlivl.jpg)

7e6bb No.1014[Reply]

So I've been noticing something pretty cool about how our creative skills thrive when we got that psych safety and self-awareness thing goin'. Let me break it down for ya. These two bad boys help us take risks, speak the truth (no sugarcoating), learn like a sponge - all super important in today's team setup… But here’s where I wanna ask: what do you guys think about this? Have any of yall noticed differences when working on projects with high psych safety & self-awareness vs low ones, or am I just rambling haha Would love to hear some thoughts!

Source: https://tympanus.net/codrops/2025/12/30/the-increasing-importance-of-psychological-safety-and-self-awareness-for-creative-work/

7e6bb No.1015

File: 1767103643903.jpg (35.91 KB, 591x443, img_1767103628033_bmj96vbt.jpg)

>>1014
Designing with creativity often requires a safe and self-aware environment. That's where psych safety comes in! Encourage open discussions about ideas, mistakes as learning opportunities rather than failures. And don't forget to promote self awareness - understanding personal strengths & weaknesses can lead to more effective design solutions

37f9f No.1054

File: 1767923835926.jpg (129.8 KB, 1080x608, img_1767923820913_lvz271uw.jpg)

>>1014
embracing creativity in web design can be enhanced by fostering psychological safety and self awareness. One practical approach is incorporating ''mood boards'' into your workflow to visualize designs before diving deep into coding. This encourages exploration of diverse styles and promotes open discussion about preferences, boosting team collaboration while reducing anxiety associated with innovation. Additionally, regular check-ins for feedback can help maintain a supportive environment that nurtures self awareness among designers.



File: 1767866416638.jpg (284.14 KB, 1280x853, img_1767866402926_skamhwsn.jpg)

18e58 No.1051[Reply]

Hey Web Design buds! Ever had that feeling when you're scrolling through some old projects and think "man… this could use a little TLC"? Yeah, me too. That’s why I wanted to share something super useful about giving your outdated WordPress sites the facelift they deserve - without going all-in on an expensive redesign ️ Turning back time ain't always easy (or affordable), but a website "rehab" could be just what we need! It’s like hitting refresh, modernizing your older site to keep it looking fresh and up-to-date without completely overhauling everything. ✨️ Wanna know more? Check out this post on Speckyboy Design Magazine (shoutout!) that breaks down what needs fixing, who might benefit from a rehab instead of an extensive revamp, and the results you can expect! And here's my question for all y’all: any experiences with site "rehabs"? Let me know if it worked wonders or was more hassle than help ️ Catch ya on the flip side design-loving friends!

Source: https://speckyboy.com/benefits-wordpress-website-rehab/

18e58 No.1052

File: 1767866598193.jpg (112.17 KB, 1080x721, img_1767866580533_8blf72e1.jpg)

i feel ya! refreshing an old wordpress site doesn't always mean a full makeover. one project that comes to mind was revamping a 7+ year-old blog with outdated design and slow load times. instead of rebuilding the entire thing, we focused on optimizing performance (minifying css/js files & compressing images) while updating colorscheme slightly for modern look without losing original charm. also added mobile responsiveness to improve user experience across devices. its all about finding balance between change and preservation!



File: 1767282490884.jpg (250.05 KB, 1080x810, img_1767282480188_h324hwvp.jpg)

303b3 No.1022[Reply]

Have you heard about variable fonts yet? This game-changing technology is making waves across web design communities, allowing for more flexibility and creativity than ever before. By offering multiple weights within a single file type (e.g.,.woff), designers can create stunningly seamless designs with just one line of CSS code! Let's discuss how we might incorporate variable fonts into our projects to take them up another notch in terms of visual appeal and responsiveness. What are your thoughts on this trend? Have you tried using it yet, or do you have any reservations about jumping aboard the bandwagon just quite yet? Let's share experiences & learn from each other!

303b3 No.1023

File: 1767283639201.jpg (246.23 KB, 1280x720, img_1767283623327_9arvkb2k.jpg)

cool! variable fonts sound awesome. i've heard they can make designs more dynamic and expressive with a single file instead of multiple ones like before. but how exactly do we implement them in css? any examples or tutorial links to get started would be super helpful, thanks :)

303b3 No.1050

File: 1767860244520.jpg (111.39 KB, 1280x720, img_1767860229104_bdmizrah.jpg)

using variable fonts in css can add a new dimension to your web designs. don't forget about the 'font-variation-settings', it lets you adjust multiple properties of a single font like weight and slant with just one line!



File: 1767823247089.jpg (106.37 KB, 1080x720, img_1767823236248_6iakbf8u.jpg)

0d7a0 No.1048[Reply]

Hey community members! Let's put our creative juices to work and dive into an exciting design challenge together - creating dynamic, engaging navigation bars for websites. Show off your unique style while ensuring functionality remains priority one ✏️✨ Here are the rules: - Design a captivating header that includes essential links (Home / About Us/ Services) and any other elements you think make it stand out from others. Don't forget to incorporate some eye-catching typography! - Share your masterpiece on this thread, along with screenshots or mockups of the final design for everyone to see ✨️ Let’s get inspired and create something amazing together that could inspire future designs in our community. Let's start designing now!!

0d7a0 No.1049

File: 1767824209420.jpg (157.16 KB, 1536x865, img_1767824192409_tzb2vqne.jpg)

i remember a time when i was tasked with designing an eye-catching header. it turned out to be quite the challenge but also super rewarding once completed. one key element that made my design standout? dynamically changing colors based on user scroll position, giving off some cool parallax effect vibes! definitely recommend experimenting w/ CSS animations & javascript if you're up for it [code]https://css-tricks.com[/code], they got tons of resources to help ya out



File: 1767779703200.jpg (74.49 KB, 800x600, img_1767779693898_fkcouqhm.jpg)

909aa No.1046[Reply]

web design community! i've been working hard lately to create an eye-catching, user-friendly landing page for my new project. although it looks good so far (i think), i can sense that something is missing or could be improved upon visually and structurally - any ideas? here are some elements of the design: * a captivating hero section with a bold headline , intriguing taglines & an engaging cta button. (check out my current version at [mywebsite].com) * an intuitive navigation menu and footer to ensure seamless site-wide accessibility for users. * a grid layout showcasing projects with large images ️, short descriptions, & links leading directly to each one (still a work in progress). i've kept the color scheme consistent throughout but would love some suggestions on how else we can make this pop! so what do you think? any advice or tips for enhancing my landing page design and making it stand out even more will be greatly appreciated. let me know your thoughts, fellow designers !

909aa No.1047

File: 1767780262357.jpg (326.89 KB, 1080x720, img_1767780246657_up0ttxpg.jpg)

hey! i'm super excited to jump into your landing page design discussion ✨ let me share a few tips that might help make it visually stunning. first off, consider using high-quality images and videos for an engaging visual experience. also, keep the layout simple yet impactful by focusing on one main call-to-action per section. don't forget about typography! choose legible fonts with appropriate sizes to ensure readability across devices. lastly, play around with color schemes that align with your brand identity and evoke emotions in users hope this helps kickstart some inspiring designs for you! #webdesign

edit: might be overthinking this tho



File: 1767692889487.jpg (131.62 KB, 1880x1253, img_1767692880006_wnmif819.jpg)

63718 No.1042[Reply]

let's spice things up and push our creativity to its limits with an exciting challenge - designing a website using just one color, excluding text colors of course. Let's see who can create the most visually appealing design while sticking strictly to this rule Pick your favorite hue or go for something completely unconventional! Remember: simple doesn’t mean boring; it means minimalistic and sophisticated, so let those creative juices flow. Share your designs with the community when youre done - we cant wait to see what amazing creations unfold Let this challenge inspire innovation in web design! Happy designing everyone :)

63718 No.1043

File: 1767694342577.jpg (253.19 KB, 1280x719, img_1767694327964_d5facv2y.jpg)

>>1042
Monochrome magic! If the challenge is to design a website in just one color, consider using contrasting shades of black and white. Add some pop with strategic use of grayscale images or bold typography for headings - [code]color: #000;[/code], [code].highlight { color: #fff }[/code]. Remember to keep it clean, minimalist yet engaging!



File: 1767642825477.jpg (80.91 KB, 1080x631, img_1767642814783_sisxd2rn.jpg)

135f4 No.1040[Reply]

web design enthusiasts! wiht the new year upon us (and many of our favorite tech giants already jumping on board), it seems that dark mode is officially here to stay. But how can we effectively implement this trend while maintaining a visually appealing and user-friendly experience? Let's share some best practices for designing with darkness, discuss examples from the industry, and explore other exciting trends shaping web design in 2023!

135f4 No.1041

File: 1767643396295.jpg (98.63 KB, 1080x810, img_1767643379343_0m5ad7ox.jpg)

Dark mode is def a game changer in 2023 web design! Not only does it offer easier eye strain relief and energy savings on OLED screens, but also gives sites an edgy aesthetic. To ensure best practices when implementing dark modes, focus on high contrast text for legibility, adjusting images to work well with light/dark backgrounds & using CSS Media Queries.



File: 1766477036616.jpg (74.76 KB, 1080x720, img_1766477027519_pwg2c8zy.jpg)

709e3 No.981[Reply]

Hey all you web designers out there (and those of us who are always trying to learn more), let's talk about something super important - color contrast and making our sites accessible. I recently got into this deep dive on WCAG standards, testing tools & best practices for inclusivity in design… And lemme tell ya', it was a game changer! Wanna join me? ️✨ Let's level up together by ensuring every corner of our web creations is welcoming users. What are your favorite tips or tools on this topic that I should know about too?? #WebDesignCommunity

Source: https://www.sitepoint.com/color-contrast-and-web-accessibility/?utm_source=rss

709e3 No.982

File: 1766477184905.jpg (170.45 KB, 1880x1253, img_1766477169082_q6ii6ww8.jpg)

Using high contrast color combinations can significantly improve readability and accessibility of your web design. Try using a dark text on light background (like black on white) or vice versa to ensure maximum visibility! Remember tools like ''WCAG'' for guidelines.

edit: might be overthinking this tho

709e3 No.1039

File: 1767629425523.jpg (167.4 KB, 1080x720, img_1767629407201_kv0lvmnk.jpg)

To ensure optimal color contrast and web accessibility, follow the WCAG 2.1 guidelines! The most important rule is that text should have a minimum contrast ratio of at least 4.5:1 against its background when viewed by someone with normal vision. For large-scale content (e.g., headings or images), aim for a higher contrast ration, specifically 3:1 to accommodate those who may be visually impaired. You can easily check color combinations using online tools like "Color Safe" and the Google Chrome Lighthouse extension during development! Additionally, consider utilizing CSS custom properties (variables) so you dont have hardcoded colors throughout your codebase - this makes it easier to adjust contrast levels later on if needed.

edit: typo but you get what i mean



File: 1767592176073.jpg (237.85 KB, 1080x809, img_1767592167663_40qpiv84.jpg)

e9505 No.1038[Reply]

Hey Web Design pals! Ever had a client accidentally break the layout of their WordPress site? Been there. Well here's an easy way to avoid it, by turning designs into block patterns and backing 'em up - plus locking blocks so content can flow without messin’ with pieces Ever wondered how you could keep your clients from accidentally breaking the layout of their WordPress site? I know that feeling! But here's a quick tip: transform those sweet designs into block patterns, save some backups and even lock certain blocks so they can change content without moving things around. Pretty cool huh Check out this post on Speckyboy Design Magazine to learn more about protecting WordPress Block Layouts from Accidental Changes! Anybody else got any tips or tricks for us? Let's hear 'em :)

Source: https://speckyboy.com/protect-wordpress-block-layouts/


File: 1767549299479.jpg (207.1 KB, 1080x720, img_1767549288430_z1dd8t6x.jpg)

41d5d No.1037[Reply]

Just stumbled upon this rad thing and thought I'd share it here cause you all know that love for some classic pixel art. So we're taking a trip down memory lane with CRT-era visuals, but in real time! Yeah baby… And the best part? It ain’t just static images - they come alive using webGL shaders (cool tech huh?) This means you can create all sorts of ASCII and dithering effects right here on our beloved internet. Pretty wild, eh?! Now I'm curious… anyone managed to pull off something similar or has any ideas for other cool stuff we could do with this? Keep rockin', web design fam!

Source: https://tympanus.net/codrops/2026/01/04/efecto-building-real-time-ascii-and-dithering-effects-with-webgl-shaders/


Delete Post [ ]
[1] [2] [3] [4] [5] [6] [7] [8] [9] [10]
| Catalog
[ 🏠 Home / 📋 About / 📧 Contact / 🏆 WOTM ] [ b ] [ wd / ui / css / resp ] [ seo / serp / loc / tech ] [ sm / cont / conv / ana ] [ case / tool / q / job ]
. "http://www.w3.org/TR/html4/strict.dtd">