How To Build Your Portfolio Website From Scratch!: Step-By-Step Training, Using Responsive HTML5, CSS3, Jquery & Photoshop Mark H Webster Author

This book is primarily designed be used in a classroom, though it can be, and is frequently, used for self paced learning. In my college classrooms, this is two 5 credit classes, or 22 six hour days of student work. This book alone will not make you a web developer. Though it could be a great first book, especially if you prefer building things in a sequential fashion, as opposed to reading about concepts. My students have told me repeatedly over the years that this book is better than anything they can find in a bookstore. I wrote it because I was unable to find a textbook that built a functional, but also pretty, website from scratch. You can buy books that teach how to write the code, but skip most of the design. You can also buy books that teach you the design, but skip, or give you the harder code pre-written. I’ve written this book to do it all. We will start with some very simple code and gradually add complexity and beauty. As we build out the code, we will take time to do interface design work, including graphic slicing in Photoshop and Illustrator. We’ll build a series of increasingly complex mobile friendly web sites. Each time I introduce a new HTML element or CSS style sheet rule I explain why I’m doing it, and demonstrate what it does. As you work along with the book, you will see your webpage unfold in front of you. I cover FTP uploading to a remote server using three different platforms: Filezilla, CPanel and Dreamweaver. We will do 3 complete menu systems, including a drop down menu controlled, on mobile devices, with a hamburger toggle button, which we will program with Jquery. We will build a search engine friendly resume page that is not only pretty, but fully responsive. We will build several versions of a Masonry style thumbnail gallery featuring mobile friendly Photoswipe powered animations to the full size images. With Flexbox, we will build the Holy Grail of web design: two fixed width side columns (with action boxes) with a liquid expanding center column, and we’ll make it responsive. I will cover responsive video and I’ll demonstrate how to use PHP includes to simplify navigation menu changes across the website. One last thing: included in the download files is my free custom Wordpress theme. With the skills you will have after working through this book, you can install my theme on an existing Wordpress site and suddenly it will look just like the site from this book. But now it’s running in Wordpress with all the back end power that brings. You can see that theme running on my blog on my personal website.The book includes lesson files with all the finished code for each project. This includes images, Jquery / JavaScript files and libraries. For those that have Adobe software I’ve included the Photoshop and Illustrator files I use for mocking up and slicing interface elements, as well as the exported images.Chapters:Project 1 Create a webpage with images in NotepadProject 2 - Upload index and gallery onlineProject 3 - Masonry GalleryProject 4 - Contact & Resume pagesProject 5 - Animation page & animated bannerProject 6 - Columns with FlexBoxProject 7 - Gallery Animations - MobileProject 8 - Responsive ColumnsProject 9 - Hamburger menu for mobileProject 10 - Menu Remodel - FlatProject 11 - Menu Remodel - FlexboxProject 12 - Externalize JavaScriptProject 13 - Responsive VideoProject 14 - Dynamic Footer - Library ItemProject 15 - PHP includes