These books have been very helpful to me. They range from hard-core technical books to fluffy (but useful) design books. All of them have their place. The biggest mistake that newbies make is to equate knowledge of a tool with the ability to design. Graphic design is both an art and a discipline, and the fundamental principles are the same, whether you are designing a Web page, creating a print magazine ad, or designing a user interface for a program or Web site. A good understanding of those principles will enable you to create qualitatively better sites!
- Creating a Web Page with HTML • Elizabeth Castro • Project-oriented tutorial.
- 250 HTML and Web Design Secrets • Molly Holzschlag • While not an introductory text, this book will make anybody better by applying many of the principles and tips in here.
- Bulletproof Web Design • Dan Cederholm • Subtitled “Improving flexibility and protecting against worst-case scenarios with XHTML and CSS.”
- Web Standards Solutions: The Markup and Style Handbook • Dan Cederholm • Very standards-oriented approach to using CSS.
- CSS Mastery: Advanced Web Standards Solutions • Andy Budd • This is one of the best books I’ve read about advanced use of CSS. Budd is an excellent writer, and the material is top-notch. This not a beginning guide to CSS!
- Blog Design Solutions • Andy Budd, Simon Collison, Chris Davis, Michael Heilemann, John Oxton, David Powers, Richard Rutter, Phil Sherry • This book specifically talks about building blogs, in general and in particular for WordPress, Movable Type, Expression Engine, and Text Pattern. It also shows you how to write your own blogging system. This book requires knowledge of PHP and MySQL, on top of HTML and CSS. If you want to be hacking blogs, though, this is an excellent start.
- Eric Meyer on CSS • Eric Meyer • Subtitled “Mastering the Language of Web Design”, this example-based book will improve your ability to use CSS effectively. Eric is an excellent writer with a superb grasp of the material.
- Don’t Make Me Think • Steve Krug • This is more about design principles than anything. The basic idea is that you design your sites so that the target audience knows and expects what to do without having to explain or flail around.
- XML for the World Wide Web • Elizabeth Castro • A good introduction to XML.
- Designing CSS Web Pages • Christopher Schmitt • An excellent introduction to using Cascading Style Sheets (CSS) to design Web pages.
- The Zen of CSS Design • Dave Shea and Molly Holzschlag • In-depth examination of some of the superb examples from the CSS Zen Garden.
- The Art & Science of Web Design • Jeffrey Veen • Thorough and well-written.
- Web Redesign 2.0: Workflow That Works • Kelly Goto and Emily Cotler • An excellent design book, aimed at site redesign — but also useful for the first time. Very few books actually teach good processes, and this is one of the few.
- Site-Seeing: A Visual Approach to Web Usability • Luke Wroblewski • A superb design book.
- Design Whys: Designing Web Sites That Sell • Shayne Bowman and Chris Willis • Well-illustrated and well-written guide to building sites for other people.
- The Design of Sites • Douglas Van Duyne, James Landay, and Jason Hong • Subtitled “Patterns, Principles, and Processes for Crafting a Customer-Centered Web Experience”, this is a highly technical approach to Web design, based on the idea of “patterns” in programming. This is not for the weak of stomach!
- Designing Web Usability • Jakob Nielsen • This is an excellent computer science reference book about usability in Web design. Nielsen is one of the top experts in usability.
- jQuery in Action • Bear Bibeault & Yehuda Katz • This is a great introduction to using jQuery, including its Ajax capabilities.
- Foundations of AJAX • Ryan Asleson and Nathaniel Schutta • An advanced book on AJAX for programmers.
- PHP for the World Wide Web • Larry Ullman • Excellent first book for learning PHP, with some coverage of MySQL.
- The Elements of Typographic Style • Robert Bringhurst • A definitive text about typography, which is one of the great frustrations of the Web because of the lack of cross-platform font support. You’ll understand it better, and your designs will be better for having assimilated this book. That being said, it is dense and extremely detailed.
- Layout Index • Jim Krause • Hundreds of sample layouts—a great way to “write that first sentence” of your design.
- Graphic Design Cookbook • Leonard Koren and R. Wippo Meckler • Another excellent source with hundreds of layout examples of all kinds.
- PANTONE Guide to Communicating with Color • Leatrice Eiseman • Filled with color palettes for print applications, grouped by themes. Lots of good information about color perception, and color combinations that can easily be adapted to the Web.
- The Visual Display of Quantitative Information • Edward Tufte • This is the first of a series of books by Tufte. A superb writer, Tufte writes about how to display information in all forms. His choice of examples is superb—these books are a pleasure to flip through, even if you learn nothing! Tufte also coined the term chart junk for all of the unnecessary elements that get larded onto designs.
Top Sites for Web Developers
- Web Developer’s Handbook: an AWESOME Compendium of Links
- PositionIsEverything: a great resource
- Sitepoint has a Great Set of Articles
- Web Design from Scratch: tutorials
- 24Ways.org: populated by some heavy hitters like Clarke, Budd, Zeldman, etc
- Excellent source on SEO
- Very technical SEO info
- Google SEO Guide
- Interesting analysis of inbound links using Yahoo’s data
- SEO articles
- Search domain name, IP address
- Google Advanced Search stuff
- Google Zeitgeist
- Site Evaluation tool
- Site Traffic Comparisons
- Sitening.com SEO Analyzer
- WebsiteOptimization.com SEO Analyzer
- Quantcast.com SEO Analyzer
- ExactFactor.com SEO Analyzer
- SiteReportCard.com SEO Analyzer
- Websitegrader.com SEO Analyzer
- Awesome collection of SEO tools
- SEO articles
- SEO stuff
- About good SEO practices
- Summary of the top SEO blogs
- Overview of site SEO evaluation tools
- 12 Free SEO Tools
- SEO optimization
- SE tools for checking sites
- SEO Toolbox
- SEO Add-on for Firefox
- Awesome collection of SEO tools
- Keyword density checker
- About Google PageRank
- Great set of pointers for SE optimization
- Excellent SEO Blogs
- Excellent SEO Site
- SEO comparisons
Tools & Resources
Technical for Developers
Fun and Useful
Terms and Jargon
- When an asynchronous request for information is sent to the Web server, the response is not expected to return immediately. The requesting program sends the request to the server, and then continues on its business. When the server creates the response, it sends a message back to the browser with the answer, and the browser responds to the server as quickly as it can to get the data and display it (or whatever).
- Content Management System
- A Content Management System (CMS) uses templates to generate the pages of a dynamic site. A CMS is oriented at handling large amounts of data, often multimedia data. Two of the most popular Content Management Systems are Drupal and Joomla.
- Cascading Style Sheets (CSS) are the mechanism by which modern Web pages are formatted. Page components are formatted as overlapping and embedded boxes (the “Box Model”), where CSS allows you to specify the appearance, behavior, and position of all page elements. Styling can be applied at a number of levels, and the properties cascade down in order of precedence to individual elements in a page.
- Dynamic vs Static Web Pages
- Another useful distinction between pages is whether they are static or dynamic. Static pages are HTML files that do not change when served up from a user’s request; all requests receive a copy of the same “pure” HTML file on the server. Dynamic pages are ultimately HTML files when returned to a user, but some or all of that HTML is created on the fly by some back-end program that receives customer input. For example, such a program might read records from a database to create a table of your credit card transactions. The information from the database would be formatted as “pure” HTML, and then returned to the user as a standard HTML page. A handy way to tell whether a page is static or dynamic is to look at the URL. If the extension is .html, .htm, .shtml, .shtm, then the file is a static Web page. If the extension is pretty much anything else (such as .php, .asp, .jsp), then some program on the Web server is either creating or modifying the page before returning it to the user via the Web server. The home page of a site may not always show a full URL, since you can use www.domain-name.com without specifying any further file or path name.
- File Transfer Protocol (FTP) is a protocol used to transfer large blocks of data between servers on a network. Web development tools like GoLive and Dreamweaver use FTP (transparently, for the most part) to transfer files between your local hard drive and your ISP’s Web server. You will also find a command line interface to FTP in all operating systems. While convenient, most FTP programs do not offer the synchronize feature common to Web development systems, whereby the system automatically determines which files need to be updated.
- HyperText Markup Language is the basic markup language that describes Web pages, and allows for the integration of other services within a Web page. HTML is distinguished by pairs of tags, which are embedded in angle brackets. HTML files are plain text files, and can be opened and modified in any text editor. Because of the structured HTML, however, these pages can also be displayed with formatting in Web tools like GoLive and Dreamweaver.
- Hypertext Transfer Protocol (HTTP) is the protocol by which HTML files and other media are passed between Web browsers and Web servers.
- The basic idea behind Hypertext is creating relationships between elements, regardless of their type or location. Although most pre-Web hypertext systems used bidirectional links, the Web was built with unidirectional links to simplify the infrastructure (e.g., you can link to something without the system knowing on the other end, which greatly simplifies the implementation).
- Definition from Wikipedia: the Internet is a worldwide, publicly accessible network of interconnected computer networks that transmit data by packet switching using the standard Internet Protocol (IP). It is a "network of networks" that consists of millions of smaller domestic, academic, business, and government networks, which together carry various information and services, such as electronic mail, online chat, file transfer, and the interlinked Web pages and other documents of the World Wide Web.
- PHP: Hypertext Processor is a widely-used, public domain system used in conjunction with Web (HTTP) servers. Using PHP, programmers embed PHP commands in HTML pages. These HTML pages can contain any mix of HTML commands and PHP commands, since the PHP processor will turn the PHP commands into the resulting HTML. The Web server first hands these pages off to the PHP program, which then processes the PHP commands embedded in the file, and returns pure HTML to the Web server. PHP is often used in conjunction with MySQL, a public domain relational database system, to create dynamic pages. The WordPress blogging system uses PHP to create pages dynamically.
- Web 2.0
- This euphemism, coined by O’Reilly Media, describes a new wave of Web applications that are vastly more interactive than “traditional” Web applications, such as social networking sites. AJAX is the poster boy technique for Web 2.0, but there’s a lot going on there under the hype.
- Web Server
- A Web server is a program that responds to requests using the HTTP Protocol, usually on port 80. These responses are in the form of HTML pages and associated media. Some of these pages are static (the exact same page is returned every time when requested), whereas many of these HTML pages are created on request by a service running on the Web server. Web servers typically integrate other services, allowing Web designers to use these services to create dynamic pages. For example, Web servers use the PHP pre-processor to integrate data from MySQL databases.
- The World Wide Web is a virtual network overlaid on top of the Internet, using a protocol called HTTP to transfer information between Web servers and Web browsers. By adding a visual aspect to Internet traffic, the Web became the most pervasive communications medium in the modern world within a few years. WWW Servers are identified by unique domain names, known to the servers around the Internet, which route traffic between Web servers and their clients.
- The Internet and the World Wide Web (WWW) are not synonymous. The Internet is a collection of interconnected computer networks, linked by copper wires, fiber-optic cables, wireless connections, etc.; in contrast, the Web is a virtual collection of interconnected documents and other resources, linked by hyperlinks and URLs. The World Wide Web is merely a service accessible via the Internet, along with many other services including e-mail and FTP (file transfer).
- WYSIWYG is an acronym for “What You See Is What You Get”, and is typically applied to graphical user interfaces that shield the user from the underlying structure. The Design view of Dreamweaver and Codetch is a WYSIWYG editor.
- XHTML is the most rigorous form of HTML, using an XML schema as the basis for implementing an HTML parser. Using the XHTML doctype subjects your code to the most rigorous interpretation, but it also allows you to use the most up-to-date versions of HTML and CSS.
- eXtensible Markup Language (XML) is a markup language that allows you to create a schema that describes the data in your application. Many tools can manipulate XML these days, because it provides a common framework for describing the data entities in your own application, thereby allowing tools to interact with that data by knowing the schema.