Tracy Osborn - Hello Web Design: Design Fundamentals and Shortcuts for Non-Designers

by Tracy Osborn

San Francisco

HELLO WEB DESIGN. Copyright 2021 by Tracy Osborn.

All rights reserved. No part of this work may be reproduced or transmitted in any form or by any means, electronic or mechanical, including photocopying, recording, or by any information storage or retrieval system, without the prior written permission of the copyright owner and the publisher.

ISBN (print): 978-1-7185-0138-6

ISBN (ebook): 978-1-7185-0139-3

Publisher: William Pollock

Executive Editor: Barbara Yien

Production Editor: Michele Mangelli

Interior and Cover Design: Tracy Osborn

Copyeditor: Sally Peyrefitte

Compositor: Happenstance Type-O-Rama

Proofreader: Betsy Dietrich

For information on book distributors or translations, please contact No Starch Press, Inc. directly:

No Starch Press, Inc.

245 8th Street, San Francisco, CA 94103

phone: 1-415-863-9900;

www.nostarch.com

Library of Congress Control Number: 2020945051

No Starch Press and the No Starch Press logo are registered trademarks of No Starch Press, Inc. Other product and company names mentioned herein may be the trademarks of their respective owners. Rather than use a trademark symbol with every occurrence of a trademarked name, we are using the names only in an editorial fashion and to the benefit of the trademark owner, with no intention of infringement of the trademark.

The information in this book is distributed on an As Is basis, without warranty. While every precaution has been taken in the preparation of this work, neither the author nor No Starch Press, Inc. shall have any liability to any person or entity with respect to any loss or damage caused or alleged to be caused directly or indirectly by the information contained in it.

For my third book, it seems kind of redundant to thank my husband again, and yet here we are. Without him, this book (or any of my others) wouldnt exist. Andrey, thank you for being my #1 supporter and best friend.

Tracy Osborn is a designer, developer, and entrepreneur living in Toronto, Canada. Building websites since she was twelve, she always felt an affinity to computers, the internet, and what they bring us.

Tracy graduated with a BFA in Art & Design with a concentration in Graphic Design from California Polytechnic State University, San Luis Obispo, and worked as a web designer for five years before teaching herself programming and launching her first start-up, WeddingLovely.

She also speaks regularly at technology conferences, including keynotes at OReillys Fluent Conference 2016, EuroPython 2017, and DjangoCon US 2017.

This book has been a few years in the making. Thank you to everyone who has listened to my presentations, given me feedback, supported my ideas, and helped me make this book a reality.

In particular, thank you to everyone who took a monetary risk with me and backed the Hello Web Design Kickstarter campaign. With over 700 backers, this was my biggest campaign yet, and it means so much to me that folks are willing to support me with their dollars and cheer me on throughout the whole book production process.

Thank you as well to No Starch Press for taking a risk on me and adding this book to their collection. Hello Web Design will have more reach than I originally ever thought possible through their support, not to mention the countless hours they worked with me to improve the book and its content. Im truly grateful for their partnership.

Whenever I dipped my toe in the waters of the semantic web, I noticed there were two fundamentally different approaches. One approach was driven by the philosophy that absolutely everything in the universe should be theoretically describable. The other approach was far more lax, concentrating only on the popular use cases people, places, eventsand that was pretty much it. These few common items, so the theory went, accounted for about 80 percent of actual usage in the real world. Trying to codify the remaining 20 percent would result in a disproportionate amount of effort.

I always liked that approach. I think it applies to a lot of endeavours. Coding, sketching, cookingyou can get up to speed on the bare essentials pretty quickly and then spend a lifetime attaining mastery. But we dont need to achieve mastery at every single thing we do. Im quite happy to be just good enough at plenty of skills so that I can prioritize the things I really want to spend my time doing.

Perhaps web design isnt a priority for you. Perhaps youve decided to double-down on programming. That doesnt mean forgoing design completely. You can still design something pretty good... thanks to this book.

Tracy understands the fundamentals of web design so you dont have to. She spent years learning, absorbing, and designing, and now she has very kindly distilled down the 80 percent of that knowledge thats going to be the most useful to you.

Think of Hello Web Design as a book of cheat codes. Its short, to the point, and tells you everything you need to know to be a perfectly competent web designer.

Say hello to your little friend.

Jeremy Keith
Author of Resilient Web Design and cofounder ofClearleft

This is not your typical beginner design book.

Beginner books tend to assume you eventually want to become an expert. Programming books assume you want to get a job in programming or computer engineering; design books assume you want to become a full-fledged designer.

But what if you wanted to learn just enough design to enhance your existing career?

I believe in the power of improving your skill set beyond your current focus. My personal experiences dont fit into any single category I have a degree in Art & Design, I develop websites and apps using Python, and I have founded and managed a start-up. Knowing just enough in many areas has been crucial for my career.

Just as designers benefit from learning a little bit about programming, programmers (and marketers, and product managers, salesfolk, and so on) can benefit from learning a little bit about design. Even if you dont specialize in design, you will need to design at some point whether its working on slide decks, creating interfaces for programs and projects, or building a personal website. If you work with designers, a bit of design experience will give you a better foundation for communicating with them and understanding their work.

The purpose of Hello Web Design isnt to make you a designer its here to make you feel more comfortable doing design.

This book focuses solely on the visual stuff: youll find no HTML , CSS , or frontend development and code within. Were going to work on making your designs feel more beautiful and, almost more important, how to make them work better.

Design is about problem solving. Even in places where you feel like youre just making things prettier (like working on a slide deck), youre really working to make the information in your slide deck easier and more pleasurable to read and comprehend. In our web interfaces, we really want to make things feel more natural and easier to use good design is crucial to capturing and keeping new users and improving how successful our designs are.