Resources
Quinn maintains a list of links that might be helpful to English 313 students using Delicious, a social bookmarking site. The most recent links added to this list are displayed here on the English 313 site in the right-hand sidebar.
We will use this page to create a more thorough collection of links that will be helpful to anyone learning web design. Over the course of the semester, you should contribute at least five original links to this page. When you submit a link to me via email, let me know which category (or categories) should contain your link. Or, if you think we need a new category on this page, feel free to propose one.
Coding Basics
- HTML Goodies — A huge collection of tutorials on almost every aspect of web design. (Thanks, Tyler)
- HTML Dog — A general tutorial/reference site for HTML and CSS. Includes tutorials aimed at beginners with no experience, as well as complete references and examples for experienced coders. (Thanks, Isaiah)
- W3 Schools — Another general reference/ tutorial site, with a lot more information. Its a lot less accessible than HTML Dog in my opinion, but covers a lot more subjects. (Thanks, Isaiah)
- htmlite — Somewhere inbetween HTML Dog and W3 Schools. More topics covered (HTML, CSS, JavaScript, Perl, Php, MYSQL, etc) than HTML Dog, but easier to follow and with less detail than w3schools. (Thanks, Isaiah)
- WebsiteTips — A website loaded with links to various tips, tutorials, and resources for style sheets, color charts, design and layout, finding and editing images, marketing/advertising your website, usability, etc. (Thanks, Emily and Ngoc)
- Design Meltdown — “The goal of Design Melt Down has become to collect and categorize sites into classifications that you simply can’t search for. In addition it aims to provide additional links and resources to follow through and implement the given subject.” (Thanks, Kelly)
Cascading Style Sheets (CSS)
- The CSS Tutorial — A nice overview and explanation of CSS; also contains a video explaining style sheets. (Thanks, Ngoc)
- EchoEcho’s CSS Tutorial — A fairly comprehensive CSS tutorial; coveers layering, lists, cursors, etc. (Thanks, Ngoc)
Trends in Web Design
- A List Apart: For People Who Make Websites — A fantastic collection of articles on design, coding, best practices, etc. If you’re new to the site, start with the ALA Primer (part 1, part 2).
- Current Web Style, 2007 Edition (Thanks, Tracy)
- WebDesignerWall: 2008 Design Trends — This site has several links to the latest trends in web design as well as tutorials and tips on how to achieve those designs. (Thanks, Emily)
- Web Design from Scratch — Ben Hunt’s treasure trove of tips, articles, links, etc., related to web design. Some commercial content here, but a lot of it is free. (Thanks, Kelly)
Web Writing Tips
- Writing Well for the Web — A useful article explaining “quick and easy tips” on how to write well for the web. (Thanks, Emily)
- Web Writing Tips from Rutgers University (Thanks, Nate)
- A List Apart: 10 Tips on Writing the Living Web (Thanks, Nate)
- Sun Microsystems’ “Writing for the Web” — Contains some interesting articles on how to write effectively for your purposes; it also investigates the difference between writing for the web and on paper. (Thanks, Ngoc)
- Standards for Online Content Authors — Contains a useful and concise list of do’s and don’ts for writing and formatting content for the web. (Thanks, Ngoc)
- Writing for the Web — Simple but useful information on writing for the web; talks about content, style and formatting. (Thanks, Kelly)
Color
- Color Matters — A site that deals with everything you did or didn’t ever want to know about color, including color blindness, how to effectively use color on the web, and the basic principles of color theory. (Thanks, Nate)
- Best Color Tools for Web Designers — A nice collection of helpful web-based tools that might come in handy when you’re developing color schemes, etc. (Thanks, Kelly)
Images
- Planet Photoshop — Tutorials and resources for creating and manipulating images in Photoshop. Some of these techniques are quite advanced, but the video format makes them easy to follow. (Thanks, Tyler)
- Ten Online Photo Editors that You Definitely Need to Bookmark — Don’t have Photoshop? No problem! You can use one of these online photo editors instead. (Thanks, Andy)
- Free Webmaster Tutorials — Contains tutorials in a lot of categories, but the image software tutorials might be most helpful. (Thanks, Kelly)
Usability
- Website Usability Testing: Recommended Procedures — An excellent summary of how to plan and conduct a usability test. Much of this is discussed in Krug’s book, but this is a nice one-page recap. (Thanks, Devin)
- University of Texas’s Tips for Usability Testing — Covers several key concepts related to planning and executing usability tests. (Thanks, Tyler)
Software Programs
- Free Open-Source Alternatives to Adobe Creative Suite — Interested in Photoshop, Illustrator, InDesign, etc., but don’t have any money? Here’s a list of programs that might help. (Thanks, Andy)
- Free Adobe CS3 Alternatives — Another list/review of free programs that replicate the features of the Creative Suite. (Thanks, Andy)
- Pros and Cons of WYSIWYG Editors (Thanks, Devin)
Templates
Bare-bones templates (just page structure; no styling):
- IronMyers CSS Layouts
- Layout Gala
- Code Sucks CSS Layouts
- Little Boxes
- Intensivstation CSS Templates
- Max Design CSS Layouts
- CSS Tinderbox
- Blueprint CSS Framework
- Yahoo! CSS Grid Builder
Styled templates (more polished; harder to modify):
- Open Source Web Design
- Open Web Design
- Open Designs
- Free Web Templates (Thanks, Devin)
Still not satisfied? Try the Open Source Web Design Toolbox, a blog post with links to 100 free resources like the ones listed above.
Advanced Techniques
- CSS @ Ten: The Next Big Thing — A new approach to fonts on the web. Explains what Web Fonts are and how to use them. Definitely not for the faint of heart. (Thanks, Nate)
- Digg-like Navigation Bar Using CSS — Using only CSS (OK, there’s one line of PHP code), you can create a nice, rounded-corners horizontal menu. (Thanks, Isaiah)
- Loading Website Images in Parallel — A neat trick to speed up the loading time for pages that contain multiple images. (Thanks, Molly)
- Browsershots — Need to test your site on multiple platforms in hurry? Browsershots produces screenshots of what your site looks like in various browsers.
- Web Design Toolbox: 130+ New Tools to Make You a Better and Faster Designer — A dizzying list of resources designed to improve your design process. (Thanks, Andy)
- Strategic Design: 6 Steps For Building Successful Websites (Thanks, Andy)
- 12 Principles for Keeping Your Code Clean (Thanks, Andy)
Miscellaneous
- Super Client! — Tips for Working with Your Web Design Team — Something our clients should read before they start working with us. (Thanks, Devin)