DEV Community

Cover image for A Web Design Crash Course: From one non-designer to another

A Web Design Crash Course: From one non-designer to another

Ali Spittel on August 20, 2018

I will preface this by saying that I'm not professionally a designer. That being said, I like building pretty things and have had some success with...
Collapse
 
ben profile image
Ben Halpern •

I really needed the section on colors. This is really brilliant.

Collapse
 
milkstarz profile image
malik •

This is a really great post!! I always share the CRAP principles with new developers when getting started designing anything.

Thanks for making this guide, definitely gonna share

Collapse
 
alexfogaca96 profile image
Álex Fogaça •

Being able to put on paper these things that affect your experience is really great! I always tend to doubt my intuition as "hmm.. it seems difficult to read, but I don't know anything about colors" :v

Thanks again!!

Collapse
 
j0shyap profile image
Josh Yap •

Ali, the last few things saved in my pocket app have been your content! Really appreciate all of your work as a budding developer overwhelmed by resources. Hope I can hear your talks in person someday and get to meet you.

Collapse
 
aspittel profile image
Ali Spittel •

Thank you so much, that means a lot!!!

Collapse
 
jeremy profile image
Jeremy Schuurmans • • Edited

Agreed. This is really great. The checklist is fantastic and I'll definitely be using it in the near future!

Collapse
 
natamykhailova profile image
Mykhailova Nataliya •

Very great course. Choosing a type of website to develop remains.

Read an article about types of website and what idea you should enclose in them and you will choose yours weblium.com/blog/types-of-websites...

Collapse
 
bitwombat profile image
Bit Wombat • • Edited

I'm not seeing the text shadow in the example image... am I missing something?

Would be useful if all examples' outputs were the actual HTML/CSS instead of an image so I could check for myself and also change the parameters!

Collapse
 
Sloan, the sloth mascot
Comment deleted
Collapse
 
aspittel profile image
Ali Spittel •

Thanks! Good catch!

Collapse
 
yemolai profile image
Romulo G Rodrigues •

Whoa! This is an amazing extensive article. I loved it! :D

Collapse
 
sudiukil profile image
Quentin Sonrel •

This is brilliant Ali, as always, thanks :)

I needed that kind of article, even though I don't suck at it, design is clearly not my strong suit.

Collapse
 
aspittel profile image
Ali Spittel •

Good catch thanks! I originally had Fira Code then moved it over. Oops!

Collapse
 
yaser profile image
Yaser Al-Najjar • • Edited

Nice list... for the colors I love using this tool, makes it easier for me to pick colors fast: color.adobe.com/create/color-wheel/

My favorite "styling" framework: bulma.io

Collapse
 
muhfaridzia profile image
Muhammad Farid Zia •

Awesome, thanks 😀

Collapse
 
karltaylor profile image
Karl Taylor •

I had no idea about word spacing! Thanks a lot

Collapse
 
ochoadev profile image
Luis A. Ochoa R. •

Such a great post. Thank you Ali!

Collapse
 
dechamp profile image
Petry DeChamp Richardson •

Great article!!! It was simple and to the point. Thank you.

Collapse
 
rolandixor profile image
Roland Taylor •

Clap, clap, clap.

Collapse
 
juankortiz profile image
juankOrtiz •

Colors allways seemed like a dificult thing to resolve. Great advices, thank you.

Collapse
 
kushal-niroula profile image
Kushal Niroula •

Color is something I always seem to mess up. Thanks for the article. Nice write up!

Collapse
 
rhymes profile image
rhymes •

Thank you, thank you, thank you for this :-)

Very useful!

Collapse
 
gergelypolonkai profile image
Gergely Polonkai •

That’s an awesome list, thanks for putting it together!

Also, change the double hashmark to an asterisk, and you have an Org checklist (for Emacs fans ;)

Collapse
 
oumancode profile image
Julio Vieira • • Edited

Thank you, this is awesome. I'm loving it!