The BEST books to learn web development (and design)

one of our students marco came to me and and said he'd found a bunch of questions online asking about which were the best books for learning html and css and i think javascript and so i was thinking well you know i have opinions on that and i can make a little video about it and then he can share the video to help answer those people's questions so i brought in a bunch of books a pretty big bag of books as you can see here these are just some books i've collected over the years and i thought i would just kind of go over them in order i certainly don't have all of the books and there's a lot of a lot of books but i'm going to try to put these into two piles because i kind of think that learning html and css is sort of its own world whereas learning javascript is kind of its own world and then you sort of put them together and then they yeah that's so that's that but clearly there's there's you know there's been thousands of books or at least hundreds of books on css and html over the years so learning html is kind of a weird thing because people um it's a weird-looking language or you know what you could argue that it's not a language if you want or whatever you want to do but the point is it's it's syntax is unlike other languages and because of that there's this sort of starting tag and this sort of ending tag people tend to memorize it and just copy what they see instead of really create a mental or conceptual model that's my friend joe and so this causes a lot of problems i think but that's how traditionally it's been taught as a look look what i'm doing copy this so one of the first books on html and css i got was probably the second edition of this book but um designing with web standards by good old jeffrey zeldman and ethan marcotte and this is a really important book i recently bought it again to i think i usually buy books and then read them and then give them to a friend in the hopes that they'll be able to learn from them but nowadays since i'm teaching these classes and stuff like that i keep all the books and i organize them and i have lots and lots of notes in them so i can reference them and share it with people but this book so this book is really really good it's probably one of the most important books uh for all html uh and css in history but also it's it's not that it's outdated but it's that a lot of the things that it's talking about like all the browser differences and the need to create shared web standards between all the browsers and between all the people who are writing html and css is well it's just not the book i would go to right now i'll have to make an entire video on this book later and why you know maybe it's history of why it's so important but it's really good to have if you are already if you would like to look at the history of how some of these decisions were made and it's just really it was really fun to read it again for sure but i wouldn't recommend you just like go pick this up as your first introduction to html what else we got okay here's this book html and css um and i bought this book because i saw i already knew how to program pretty well and i already knew html and css very well but i saw this in barnes noble when i was just waiting for a friend to hurry up and it's so beautiful it's just such a beautiful book you know it tells you the opening tag and the closing tag and it's all beautiful but the problem that i have with this book is that it just it that it does that it says here's the opening tag this is how html works there's tags there's an opening tag there's a closing tag so you put the tags like this and then you put ids and then you put classes and to me that's a way to copy and learn how to write things but it's not a way to learn how to think about things it's not a learn way to learn how to think about the fact that web documents are about hierarchy and they're really kind of copying word documents and essays and books and things like that and and getting a solid core foundational understanding of hierarchy and basically understanding why you write html how the computer is going to read the html how the other humans are going to need to also read the html as authors how it's going to be painted to the screen and how all of these sort of key value pairs behind the scenes work to me is a lot more important than memorizing there's a tag at the front and a tag at the back and i think as beautiful as this book is i think that it kind of teaches that way but if you do get a hold of this book if somebody has this book lying around it's certainly worth reading i just i just think it's just a little off but it's it's really cool it's a good book another more recent book is this form design patterns there's lots of good books on forms from the past this one takes a a very contemporary look at how we're talking how the conversation around web accessibility and how keeping things lean and really using html for its qualities instead of trying to replace them with all these javascript things on top of it this isn't just only about html this is specifically about forms so it gets a little too specific and it's maybe for later in your career when you're making a lot of forms and when you've learned a lot more html so i don't think this book is really the right book to start with either then i got this book recently this css book and everyone means well in all of these books they do they sure do and i you know i know css really well and i teach css all the time i help people with css daily on stack overflow and in discord and through all sorts of different forums and friends and things so i talk about css a lot and i teach css to a lot of people and i worked on css every day for the last 10 years or so for hours and hours and hours and uh i just i don't think i think this book again i think that it's teaching you here's how to do css here's the order of how it's you know ids are more important than classes so those are going to win out in the cascade and blah blah blah blah again i think that that those that's a certain way to think about it but i don't think it's the most useful way to think about it and i also don't think that it connects to html like you kind of have to learn these things together html is describing the content css is making very strong suggestions about how this content should be displayed visually i read the whole thing cover to cover to make sure that i'm not missing anything or that there's not already some amazing book that does everything i'm trying to teach perfectly this one didn't do it but if you have it and you want to read it i still think you'd learn a lot from it okay so html css there's lots and lots and lots of css books and i've i've read and looked over a lot of them let's see what some other html type things this book chris coyer's book practical svg it's not really html but i use svg a lot and it's kind of an xml format so it's sort of html-ish and it's really good that's super useful but it's more it's it's technical right like it doesn't i you don't really need to understand the conceptual importance of hierarchy and stuff this is kind of like its own little world of little graphics and numbers and stuff like that so this is a resource that could be used at any time in your career and any time that you want to start using svgs in your work more regularly and you know you want to learn all the ins and outs of that big fan more recently there's this get ready for css grid layout from rachel andrew and you know everyone on the internet can tell you there's free you can read it for free everywhere you can learn grid go learn grid go on grid and that's true there are free things everywhere you know they're not really free because they're selling your attention for ads and things like that while you're there but my point is out of all the millions of free things you could look at that could take you tons of hours of finding stuff out i watched all the youtube videos saying grid's going to change everything grid grid and i fought grid for a long time i said listen the browser support is not good enough yet i don't need to put it in my work it's confusing it's the syntax is ugly i can do everything with flexbox why do it but this book right here i bought it because you know i like to give my money to people uh because they spend all this time like simplifying it for me like i read this book begrudgingly and by the end of it i just knew what css grid was and now i love it and it's you just kind of have to use the parts of it that work for you and write it in a way that is readable and fun and intuitive and then then you'll you'll get all the benefits of it and yeah everyone jumps out of the nearby bush and screams don't pay for anything you can you can read the documentation you can there's a blog post you can watch a tutorial you can do all this stuff for free don't don't ever pay anybody in this industry to actually make something and put all their time and heart and energy into creating something to help you and don't ever pay them right because we as our own practitioners don't want to ever be paid or something i'm not really sure where the logic is there so these little books you know 10 bucks 20 bucks here or there can save you 20 hours of confusion and work it's like they are free it's like they're giving you hundreds and hundreds of dollars worth of your time back to you so don't be cheap so that's html and css there's a whole bunch of books about it and there are tons and tons of documentation and everyone in the world apparently who learns css or html immediately goes out and writes a blog post like hey i just learned it i can now teach it i can go teach you everything i learned by just basically retyping the docs i just saw not really sure what the point of that is but all of those things no matter how good they are miss the core reasons for writing html and i think that that will stick with you your whole career i think people will write html as that annoying thing they have to do to get stuff on the page so they can write javascript when really html itself and content strategy and you know architecture of information architecture and all that stuff if you think about it while you're writing the html while you're working small screen to big screen while you're negotiating how much space you have and what kind of content needs to be shown there and how to get your story across and and you know how to have uh be optimized for search engines to crawl it and for everything to be interlinked all like the internet is supposed to be that's what's important that's if you learn that then you can learn html and see it as just a toolbox of stuff to help you get to your goal which i'll talk about a little further on okay so html css we talked about that a little put that aside compartmentalize that for a second and let's talk about javascript books this is a pretty famous javascript book javascript the good parts but i didn't get that book first i'm pretty sure i got this eloquent javascript book and this book is known for being you know a really great book a lot of people swear by it it's actually fully available online i think just in a git hub repo and you could read it there i like to buy things because i can you know make little marks in them and stuff like that and so i was really digging it i was getting i was like this is so funny there's all this story of this this like werewolf squirrel and and it's really personable and it's great and it gets to this part where it starts talking about like a lot of math though and you know maybe it's just me but at that part i just i had a hard time with it it it started to get started to feel really confusing and so i don't think there is a best book i think there's a best book for each person some people might think this is the best book for them and that's great i think it's really it's i think it it's it's just not written for me it's it's a little bit off for me and so at the same time i think i bought this other book i probably brought the first edition i'm not sure but this secrets of the javascript ninja and you know how i don't like talking about programming as it's for ninjas or rock stars but we'll forgive them on this one book secrets of the javascript ninja feels like it's another version of this like they both cover all the same stuff but like this one feels like it's a little bit for the math minded and this one's a little bit for a different type of person this book tells you an introduction then it tells you like another introduction and it tells you a little bit about it then it goes back over it like each concept it will it reiterates itself a lot so if you already know everything about javascript this might seem a little redundant but if you're learning it's really helpful because it gets the idea in your head and then you're thinking about it you try some stuff this has lots of challenges this has lots of challenges this has like an actual editor that you can use online and run your code this doesn't but i think having an editor to run your code online is bad for you you should be using it in a real developer environment like you're going to be in real life so i'm not going to say this book is better than this book but i like this book better for me because it kind of speaks my language and i just i really got a lot out of it and it's also it's all updated i think they both are but this one's updated with all the newest coolest javascript stuff and it's just really easy and relatable to me so if you get a chance you could probably look at like the first chapter of both of these and sort of decide which one is in your tone of voice that you like now beyond that there's this one javascript the good parts which is this classic but more than that it's like a bigger concept which is that javascript was you know made in or maybe you don't know it was made in 10 days under a lot of pressure from the browser companies and it's not exactly perfect and so douglas crawford likes to talk about how horrible things are but this book the concept behind it is don't use the problem areas just stick with the happy path like all the things that work well that don't have weird edge case scenarios and you'll be good and i think that that is a really good concept to learn even if you don't like javascript or you don't like that douglas crawford decided to write json so that it has to have no closing no ending sometimes i don't know how what the sentence was before i make a messed up sentence and then i don't know how to just finish the sentence but then i'd have to stop it and rewind it yeah it's a lot of work to make these things okay anyway javascript the good parts here is written by a crotchety old man named douglas crawford who's awesome hi mom how's it going another really good book since we're talking about books we're talking about like starting books to learn there's 20 other javascript books i would recommend depending on what part of your journey you're on so what we're talking about here these three eloquent javascript in case i didn't say it allowed eloquent javascript secrets of the javascript ninja second edition javascript the good parts and then up and going with javascript this is kind of like the introduction this is by kyle simpson who takes where everybody has left off and and and really explains javascript in in a uh i guess i'll say unique way but he explains it in the way it should be taught whereas variables are not boxes that hold information that's just not true that's not how it works what you do is you save some data in memory and then if you don't have any way to call upon it then it just gets trash collected so you got your data up here in memory and you have to like tie a string to it basically i mean he doesn't say it like that but you know it's like a balloon almost you're using the name of the variable to be able to talk about this piece of data that's in memory and so it's not just this simplified version of of uh you put some information in a box that's not how variables in javascript work and so he goes through the entire conversation that the interpreter has which is you know oh here's some data that's nice oh here's a you know a reference that we're creating a variable and then here oh let's point this data to let's point the the reference variable to the data and so you know now we have a way to to reference this data in memory and and when you go through this you he'll you know he explains it a million times better than that it it can be could be too complicated for you but this is the up and going one and i really think about uh and i really think that being able to understand how the interpreter thinks through this and how how javascript works will save you a lot of pain in the future i mean i did not learn it this way and then i had to work back through learning relearning javascript basically later in my career and if you can get some of these basics down early and then marry it with this stuff that's a really good start then kyle also has all of these other books that get into much more detail maybe depending on where you are in your career async and performance not might not be right for you or types in grammar or something might might be too specific so these are kind of i would say you go with this up and going as an introduction to the language and then you start to look at these later as you're using the language and you have more understanding of it and and what you're working with so that these things you can actually apply them to what you're building but these are also available free on the internet if you want to read them in digital form but again i like to buy them i like to write in them i like to pass them along to friends i like to lay them sitting next to me while i'm using my computer because it's hard to read apple books or kindle or whatever while you're working on something and i like to read them in bed another big huge part of books is that you're at the computer all day you don't want to be at the computer when you're not working when you're when you're studying and all that sort of stuff so a huge part of books is i can take this book and casually go and read on the couch get out of computer land you know i don't have little messages coming to me i don't have a little notation saying you know somebody said something in a chat room and blah blah blah you could take this to the park you could take a book to the park so that's another reason why i'd say just buy the kyle simpson's books there's a new there's a new version of them out now and you should just buy them have them around talk to them with your friends at lunch anyway so those these are the the kind of the beginner javascript books that are available i'm not telling you these are the right way to go yet i'm still getting there okay but that concludes our introductory to javascript books options area and you know i'll make another video about the other 20 javascript books you might want to deal with later but i want you to take what i've said now we we talked about javascript books introductory we talked about css and html books introductory and i've sort of said that they i think there's a problems with all of these books or a lot of these books and i want to explain what that is now because this isn't me just trying to be a jerk and say these books are terrible or anything they're all great books but what i would like to talk about is what i think people should be learning before they start coding before they start just writing code and stuff because programming is really just baby talking to the computer and really we need to be able to know how to talk to ourselves and humans and understand what the goals of all these projects are and how we get there in a bigger picture way before we start getting in there and coding things you know what if you were building a house and you just went and started cementing everything up or like okay let's get this plumbing put in like it doesn't you got to know more about a house before you just start going and doing electrical everywhere so what i think is pretty much the best book ever is this book the elements of user experience now i didn't find out about this book until i don't know 2016 or something but when i started reading it i was i was just i was thinking these are all the things i learned the hard way from working in all these different companies you know working in a small design shop working in a startup working by myself doing freelancing working at a corporate place working at a fast-paced agency and all this stuff and all these things i thought just like weren't working for the team you know nobody was talking to each other there's kind of like waterfall of stuff happening and then the coders just have to come in at the end and like hopefully clean up the mess and anyway this i'm not saying uh that i i thought of all these things but what i'm saying is that throughout your career you might actually come to all these conclusions on your own but mr jesse james garrett here i think this was written in 2000 so he was like he noticed all these things a long time ago and man i think the first edition 2002 if if we all read this at the beginning i think that would be really great the secret of this book is kind of like he wrote this he drew out this big chart and that sort of started this book and uh the chart really spoke to a lot of people let me see if i could just find it really quick it says like surface skeleton structure scope strategy and i like to think you can turn it upside down and then you get strategy like it's a to-do list now instead of a layered cake of of all of the conceptual models or you know mental models of how these things line up together if you turn it over instead of the core being strategy it's like strategy let's do that first to my mind everyone should read the elements of user experience even if it doesn't totally all click just get your mind going it's it's fun it's short it's fun to read it has lots of little diagrams and things and and this will get you set up to start thinking like a designer before like a not a visual designer a designer designer a person who designs programs or designs goals and all the things that we need to do to be you know people who do this so the elements of user experience read it it's short just buy it it's short thank jesse for his hard work of putting this together and you are going to have such a better understanding of why we are making things and so when you go to read a book on html or you go to read a book on javascript you're going to understand those are just tools to make this stuff happen now beyond this there's this other book by steve krug called don't make me think this book is all about i mean it's everything it's all about web usability use all these buzzwords we talk about today right user experience user interfaces content strategy and it's just you know he's he's very humble don't make me think make web interfaces that are easy for people to use web interfaces that people can go and use and here's all the ways to do it look at how newspapers work look at look at uh how you group content together so it's easy to see how to make all the things available and and tell a story of like what the user might want to do on this site so if you start thinking about these which again are both short fun books you can put them on the couch read them over and over again if you get these together you're well on your way of thinking like a user experience designer like a content strategy person and then there's some other books you could read about all sorts of stuff as far as um information architecture and you know research all these a list of part books you know from this company that you should read like i'll talk about in another video so start with these these will get your mind ready for the next part now the next part this book exercises for programmers it is 57 challenges and it is language agnostic which means it doesn't matter really what language you use there's all sorts of different languages for the web but in our case we're talking about html css and javascript so if you take this book the first couple chapters are explaining how to break down problems how to partial out in your mind what how things are like how things are concerned can i make these little tiny functions that do things and then connect them together what type of information do we need to feed the computer what type of information do we need to get back from the computer how do we show things on the screen and so all of a sudden you're like okay html and css and javascript i'm going to need that stuff now this isn't a book but if you go to mozilla developer network they have some really great well curated documentation and references for all of the html elements all of the css properties like color background color different flex and grid layout stuff so they think of them as toolboxes when you need to make a header for your document and these will get you ready to know like what that means right i want to put something at the top of this document that we're creating or it asks you in this book to do something then you dive into the mozilla developer network resources and you say oh which html element is this is best fits this oh i can read about that okay great i need to make this element this html element move this way or look this way let me look at the css stuff oh which which css rules are going to fit so both of those are just big toolboxes that you can use and these are about understanding to how to figure out what to make for what reasons and then you reach for the tools so these are the books that i consider even though they're not html and css books these are the best books for html and css to learn them then i'd pepper in these babies right here you know buy one of these and read it along with it while you're learning while you're using exercises for programmers while you're using the mozilla developer documentation go and read on the side for fun some of these javascript books and maybe in there you'll say oh wow this is a cool way of filtering lists there's an exercise in here that was talking about filtering lists maybe this would be a fun way to do it the other thing you should do is get a friend or a like you know a mentor or somebody who you know or pay somebody or find a couple friends who all want to learn this at the same time and with these books right here you know i mean i would i mean you know i like this one the best but that's just me these four books here and the mozilla developer network resources that is the magic that's the best books i think for you if you want to learn web development and i don't know what's that 120 i mean sure it's not free but that's nothing that's crazy that will save you probably 60 000 of your time and effort in trying to learn this stuff and then you won't learn it all terribly which is another great thing because every time you learn a bad habit from copying a tutorial and copying a tutorial and using some bootstrap and copying this and copying that that you're going to end up in stack overflow asking a question like why doesn't my box fit in the box and you're going to your whole conceptual model for what and why we make things on the web is going to be distorted and probably stuck like that forever so find some friends get this collection of books follow the challenges there's lots of places on the internet you can ask for help stack overflow is not one of them you should not be asking for help on stack overflow until you can complete this entire book that's what i think if you can complete this book you're allowed to ask questions on stack overflow but make sure you understand how it works it's not for saying why does my code not work it's for asking a question that is universal and timeless that can actually be answered and that is helpful for everyone in the world that's why people on stack overflow are so snippy when when you're new and you go to stack overflow that's not what it's for if you want help with javascript go to the javascript discord look that up on the web and if you want help i'll put a note in the thing and if you want help with html and css join the css discord you can ask questions like why doesn't my box go in my box there and people won't jump down your throat so that's the end those are the books if you ever want to talk about it you can reach out to me directly i give out free career advice multiple slots a day and i hope that these books help you and i hope that you choose to use these books instead of find some sort of uh quick tutorial copy paste stuff because you're going to be the people building the stuff for the web that i have to deal with for the rest of my life and so please do a good job it's very important that you build things well and with understanding of all the tools and how they affect people and with accessibility in mind and just do a really good job and that you act as a gatekeeper for all of the crap that all of the business people in the in the world want to build so take responsibility for what you put into the world those are my suggestions all right let me just add a few notes because as much as i love these books i'm not saying that there aren't some amazing online resources i already talked about the mozilla developer network references for html css and javascript but there's lots of other things like for example css tricks is a website all devoted to all of the neat tricks you can do with css and it has a whole almanac and it has a really good flexbox and grid cheat sheet that's really great i actually learned programming basically from a chris coyer wordpress course back in like 2002 or something which is really great and his way of teaching where he went to go make a wordpress website but he first made the html page and explained walked through oh i'm putting this here because of this reason and these are where i want my widgets to be and this is how i'm going to show them my widgets because they're going to want to see all these different that it was a widget company was the website but here's all the products we're showing and here's where the navigation is going to be you know he walked through it with such care and intention and really did a lot of what these don't make me think and what elements of user experience did by just showing his professionalism and his experience and then he took that html page and then he showed you how you could make a dynamic wordpress theme out of it instead of talking like wordpress theme is one whole other thing and html is some other thing he was able to weave why we're making the page how we're making the page and then how we now make that page dynamic and i think that learning from that video on lynda.com definitely set me up for success as far as how i think about learning all these things and how i think about and how i teach people these things nowadays so there's lots of online courses and things that can be super helpful it's true i think that sometimes those can be taken in tandem with these books but more and more what i'm seeing is these fast track quick learn all about complex javascript frameworks uh toss in bootstrap and the css frameworks to get this half finished code from somewhere put it all together get it up from github and it's just all of a sudden as a new person here you're having to deal with the the framework and the build tools and everything of like an enterprise level application and i think that it's really harmful to the student and then in turn harmful to the industry which is and then in turn harmful to humanity because we have got a thousands of business students who are doing what they get taught in school which is figure out the bottom line and make as much money as possible we've got a lot of coding students who learned how to like code up whatever they're told and they do whatever the business person tells them to do and then we get a bunch of in the world also on the other hand think about it like this there's two ways of teaching there's a way of teaching that's easy for the teacher so if i give you a bunch of automated tests and you go learn how to use github repositories and version control and you learn how to run node build tools then it's really easy for me as a teacher to just give you a bunch of stuff and then you know let you do it on your own but on the other hand there's what is the best way to teach the student and that's what i'm interested in you know not even not even for my teaching personally not for my business but for everyone i think everybody needs to refocus on what is going to teach the student to be the best that they can be and so i'll just leave you with that [Music] [Music] you

Channel: Perpetual Education

Views: 1,363

Keywords:

Id: bnbS1enub2Q

Length: 37min 26sec (2246 seconds)

Published: Fri Aug 07 2020