# web resources **Resources you can use to get started with web design.** > [!info]+ ### Start Here Here's a collection of stuff related to class and coding in general. Some of these sites are good for learning to code or for referencing coding languages. Some have tricks or techniques to get specific outcomes. > - [w3schools](https://www.w3schools.com/ "opens in new tab") - for learning and reference > - [A List Apart](https://alistapart.com/ "opens in new tab") - for people who build websites > - [SitePoint](https://www.sitepoint.com/ "opens in new tab") - great site. good books too > - [CSS Tricks](https://css-tricks.com/ "opens in new tab") - lots of good stuff here > - [Free Code Camp](https://learn.freecodecamp.org/ "opens in new tab") - good lessons and tutorials > - [Hackr.io](https://hackr.io/ "opens in new tab") - good lessons and tutorials > [!info]+ ### Playgrounds > In-browser coding environments. Usually have lots of great content made by other designers that you can use to improve your work. > - [Codrops](https://tympanus.net/codrops/ "opens in new tab") > - [Code Pen](https://codepen.io/ "opens in new tab") > - [JSFiddle](https://jsfiddle.net/ "opens in new tab") > - [CodeSandbox](http://cssdeck.com/ "opens in new tab") > - [CSS Deck](http://cssdeck.com/ "opens in new tab") > - [kodeWeave](https://michaelsboost.com/kodeWeave/ "opens in new tab") > - [Web Maker](https://webmaker.app/ "opens in new tab") > [!info]+ ### Browser Tools > Browsers display the code that you build. These built-in tools help you to explore code and tweak the results directly in the browser. > - [Firefox Developer Edition](https://www.mozilla.org/en-US/firefox/developer/ "opens in new tab") - an advanced version of Firefox with lots of specialty tools for building websites > - [Inspect Element in your browser](https://www.lifewire.com/get-inspect-element-tool-for-browser-756549 "opens in new tab") - tools to look at and modify a website's code > [!info]+ ### Newsletters > Newsletters are a good way to keep up on changes in the web world. Here are a few that I'm subscribed to… > - [Front End Focus](https://frontendfoc.us/ "opens in new tab") > - [CSS Weekly](https://css-weekly.com/ "opens in new tab") > - [Web Designer News](http://www.webdesignernews.com/ "opens in new tab") > - [Web Designer Depot](https://www.webdesignerdepot.com/ "opens in new tab") > [!info]+ ### Online Courses > Full and free courses to learn the basics of web design. These would be a supplement to what you are learning in class. > - [html and css course](http://www.teaching-materials.org/htmlcss-1day/ "opens in new tab") > - [learn to code](http://learn.shayhowe.com/html-css/ "opens in new tab") with shay howe > - [learn to code awesome websites](https://dash.generalassemb.ly/ "opens in new tab") from dash > - [html & css courses](https://www.codecademy.com/catalog/language/html-css "opens in new tab") on code academy > - [khan academy](https://www.khanacademy.org/ "opens in new tab") has a few web courses, including [intro to html & css course](https://www.khanacademy.org/computing/computer-programming/html-css "opens in new tab") > - [Learn HTML](https://web.dev/learn/html/) - covers the basics pretty well > - [HTML for people](https://htmlforpeople.com) - covers the basics in an easy to follow manner > [!info]+ ### HTML: HyperText Markup Language > Cheat-sheet reference guides to HTML > - [web.dev html reference](https://web.dev/learn/html) > - [w3schools html reference](https://www.w3schools.com/tags/default.asp "opens in new tab") > - [html cheatsheet](http://www.simplehtmlguide.com/cheatsheet.php "opens in new tab") > - [mozilla html reference](https://developer.mozilla.org/en-US/docs/Web/HTML/Reference "opens in new tab") > - [htmlreference.io](http://htmlreference.io/ "opens in new tab") > [!info]+ ### CSS: Cascading Style Sheets > Cheat-sheet reference guides to HTML > - [web.dev css reference](https://web.dev/learn/css) > - [w3schools css reference](https://www.w3schools.com/css/default.asp "opens in new tab") > - [codrops css reference](https://tympanus.net/codrops/css_reference/ "opens in new tab") > - [mozilla css reference](https://developer.mozilla.org/en-US/docs/Web/CSS/Reference "opens in new tab") > - [css reference.io](http://cssreference.io/ "opens in new tab") > > --- > > - <https://fffuel.co/css-selectors/> > - [a (more) modern CSS reset](https://andy-bell.co.uk/a-more-modern-css-reset/) > [!info]+ ### other stuff > > - <https://webstudio.is/> --- tags: #web #resources #guides home: [[! intro to web resources]]