Useful HTML/CSS links
Max Brockman's Code Fellows UX Dev Journey
Super Useful links for Front End Web Development!
I've been in Code Fellow's Front-End UX Developer accelerator for a couple weeks now, and some of the most useful info I've learned is a vast library of really great websites that talk about web design. This is a really short list right now, but I will be updating this as frequently as possible. ALSO I would love for anyone reading this to add a link to something they've found useful in the comments section. Just put it up there, because you never know how much you can help someone in a bind. ~Max
<ul><li><a href="http://learn.shayhowe.com/">A practical guide to HTML and CSS</a> is written by Shay Howe. It's a great starting point for anyone who wants to know where they stand on their coding skillz.</li>
<li><a href="http://daneden.github.io/animate.css/" target="blank">Animate.css</a> is a great page that shows you the code for the animations that you want using only CSS.</li>
<li><a href="http://caniuse.com/" target="blank">CanIuse.com</a> is a fantastic resource that uses JSON files that are constantly updated in order to show you which browsers and their versions support your HTML/CSS features.</li>
<li><a href="http://css-tricks.com/snippets/css/a-guide-to-flexbox/">Flex-Box</a> is the solution to all of your CSS positioning problems. Can I please just make header with some elements that are responsive to size and are easy to center? Now you can.</li>
<li><a href="http://code.tutsplus.com/tutorials/the-30-css-selectors-you-must-memorize--net-16048">30 CSS Selectors you must memorize</a> is an incredibly useful list of advanced CSS selectors that you can use to make your layout infinitely sexier and well written.</li>
<li><a href="http://css-tricks.com/" target="blank">CSS-Tricks</a> is a really useful and constantly updated page about CSS...tricks...</li>
<li><a href="http://csswizardry.com/" target="blank">CSS Wizardry</a> Harry Roberts is a big player in the front-end world. Look what he has to say. It's probably important.</li>
<li><a href="http://pumpula.net/p/apps/css-vocabulary/">CSS Vocabulary<a/> Uses awesome tech to highlight all the vocab of selectors you could possibly need. This is an AWESOME tool.</li>
<li><a href="http://css-tricks.com/dom/">Document Object Model or the DOM, what's that?</a> This is Chris Coyier's nice explanation of what the DOM actually is.</li>
<li><a href="http://media.smashingmagazine.com/wp-content/uploads/images/html5-cheat-sheet/html5-cheat-sheet.pdf" target="blank">HTML5 Cheat Sheet</a> list of html5 tags. Could be very useful for writing semantically correct HTML.</li>
<li><a href="http://gsnedders.html5.org/outliner/">HTML5 Outliner</a> is a tool that you paste your HTML into and it breaks it down into a reader generated outline. This is a great tool for judging how <strong>semantically</strong> correct your HTML actually is!</li>
<li><a href="http://learnlayout.com/">LearnLayout.com</a> teaches you the deceptively difficult world of using CSS for layout. Go through the 19 steps 19 times, then you should be ok.</li>
<li><a href="http://lab.maltewassermann.com/viewport-resizer/" target="blank">Resizer</a> is an awesome tool created by <a href="https://twitter.com/maltewassermann" target="blank">Malte Wassermann</a> to show adjustable screen sizes. This lends its self to responsive web design nicely.</li>
<li><a href="http://css-tricks.com/responsive-data-tables/" target="blank">Responsive Tables</a> a css-tricks article on creating responsive tables that look great on mobile and comp.</li>
<li><a href="http://smacss.com/">Scalable and Modular Architecture for CSS</a> is an approach to web development written by Jonathan Snook. It's a quick read that's worth it.</li>
<li><a href="http://screensiz.es/phone" target="blank">Screen Sizes</a> a list of screen sizes for every relevant device out there!</li>
<li><a href="http://csslint.net/" target="blank">CSS Lint</a> is an awesome tool for cleaning up your CSS. Redundancy is the enemy here. We're learning to completely utilize our code for efficiency and readability for both human and machine.</li>
<li><a href="http://sassmeister.com/">Sass Meister</a> is a project that our fearless leader <a href="https://twitter.com/anotheruiguy">Dale Sande</a> is a major part of. Very valuable tool if your using Sass to write CSS.</li>
</ul>
Written by Max Brockman
Related protips
Have a fresh tip? Share with Coderwall community!
JavaScript on a page runs with the privileges of that origin. One altered library, tag manager, or snippet can read inputs, change what people see, and call your APIs as the user.
Security insights from Cside