Welcome to Web Design Primer!

This book was written for a one-semester course in web design for students in Ryerson’s Faculty of Communication and Design (FCAD) and may also be useful for high school, community college, or training center courses on beginning web design — or for anyone who wants to read the book and complete the tutorials on their own.

The goal of the book is to provide students with a reference on some of the latest web design practices that is short and to-the-point, low-cost, and readily accessible.

What You Will Need

To use this book and its companion site for a course similar to Ryerson’s, you will need:

• A computer, preferably with a large-screen display, for each student
• An HTML-editing program, such as Adobe Dreamweaver
• An image-editing program, such as Adobe Photoshop.
• An animation program, like Adobe Flash or Edge, Tumult Hype, or similar. If using Flash, Google’s free “Swiffy” plugin enables exporting HTML5 that will work on iOS devices.
• Optionally, a server where students’ work can be uploaded to and viewed on the web. In this case, a file-transfer utility like “FileZilla” may also be useful.

Acknowledgments

The authors would like to thank eCampusOntario, a not-for-profit centre of excellence and global leader in the evolution of teaching and learning through technology, for supporting and funding this project.

We would not have been able to complete it without the generous assistance of Dr. Wendy Freeman, Director of eLearning; and Tanya Pubuda, Ryerson eLearning Associate; along with librarians from the Ryerson Library, including Ann Ludbrook, Copyright and Scholarly Engagement Librarian; Sally Wilson, Web Services Librarian; and Fangmin Wang, Head of Library Information Technology Services.

Our colleague Prof. Dr. Jörg Westbomke of Ryerson’s exchange partner university, the Hochschule der Medien in Stuttgart, Germany, contributed material for the responsive design and search engine optimizations section of Chapter 4. Similarly colleague Prof. Jason Lisi of the School of Graphic Communications Management contributed material on non-destructive editing in Photoshop for Chapter 15. Thanks to Dr. Abhay Sharma for sharing his idea for the iPhone app, “Fruit Salad.”

Thanks to the software publishers who granted permission to show screen captures of their programs in the book, including Adobe® Systems Inc. (Photoshop®, Dreamweaver®, and DNG Converter), Apple Computer (Xcode, iMovie, Safari), Tumult (Hype), The Mozilla Project (Firefox browser), and Google (Chrome browser). These software programs and their screen captures are subject to copyright by their respective publishers and are not part of the Creative Commons license that applies to this book [Attribution-NonCommercial-ShareAlike 4.0 International (CC BY-NC-SA 4.0)].

We are grateful to the students in the Masters in Digital Media program, class of 2019, who contributed material and support for the project, including Reuben Kiblitsky, Shelly Sicat, and Eleanor Beale; and Graphic Communications Management fourth-year student Humaira Imtiyaz, who also wrote material and helped design parts of the book.

About the Authors

Richard Adams is Associate Professor in Ryerson’s School of Graphic Communications Management, where he teaches document design, web design, and color management. After completing his Ph.D. at Cornell University and working with scientific publications, he later returned for an M.S. in Printing Technology at Rochester Institute of Technology. He has taught at several universities and was a research scientist at the Graphic Arts Technical Foundation (now the Printing Industries of America). At Ryerson he completed the Certificate in Web Design from the Chang School of Continuing Education.

Ahmed (Am) Sagarwala is Manager of Industry Relations at Ryerson’s Master of Digital Media, where he works with students in the graduate program. As an instructor, he teaches courses on digital literacy, design, and programming. He is also the president of Artform, a web technologies firm located in the Greater Toronto Area. He has his bachelor’s degree from Ryerson University’s School of Graphic Communications Management and a Master’s in Digital Media. He is currently researching and developing a web energy disaggregation platform and loves ASCII art.