agosto 18, 2010

10 Essential Free E-Books for Web Designers

book design image

While many may still prefer print for long-form reading, e-books are gaining popularity as a worthy digital alternative. Aside from all the usual benefits of digitizing a book (faster searches, less page-flipping, linked pages, additional resources, etc.), e-books are a huge help to digital and online professionals.

There are now e-books available on almost every aspect of design, from planning your business and managing your time, to designing web applications. This post highlights 10 of the best free e-books for designers, with selections available as PDFs or in HTML.

Whether they’re meant to inspire or educate, let us know if you can recommend any other free e-books aimed at designers in the comments below.


1. Taking Your Talent To The Web


talenttoweb image

This detailed, intelligent guide is a how-to on transitioning from print to web by Jeffrey Zeldman. It was written for print designers whose clients want websites, print art directors who’d like to move into full–time web and interaction design, homepage creators who are ready to turn pro, and professionals who seek to deepen their web skills and understanding.

Even though it was written in 2001, much of the advice about transitioning from print to the web still holds true, and print designers and art directors are still scrambling to move into web and interaction design.


2. Web Designer’s Success Guide


success image

Web Designer’s Success Guide is the definitive resource for starting your own freelance web design business. Written by Kevin Airgid, a recognized designer who runs an interactive studio, the book offers step-by-step instructions on topics like transitioning from full-time to self-employment, marketing your freelance business, managing projects and pricing yourself appropriately.


3. Designing For The Web


designforweb image

A Practical Guide To Designing For The Web aims to teach core web development techniques based on the principles of graphic design. Written by recognized designer and author Mark Boulton, it is a stand-out amongst web design books with the right balance between practical and inspirational.

It features five sections: Getting Started, Research, Typography, Color and Layout. The focus is on learning graphic design theory, which you can then easily apply to your own designs.


4. Design Your Imagination


design imagination image

Design Your Imagination is a complete and comprehensive guide on website design for those new to the industry, although it may also prove helpful for experienced web designers as well. Almost every aspect of website design is exemplified in this e-book, which aims to help beginners hone their creativity.

This book features more than 28 chapters that deal with a broad array of subjects, from the history of web design through web design principles, planning, and more, all illustrated with practical examples.


5. Time Management For Creative People


creative people image

Compiled from a series of posts published on Business of Design Online by writer and creativity coach Mark McGuinness, this is an easily digestible guide to help professionals in the creative sector maximize their time and productivity.

Subtitled “Manage the Mundane – Create the Extraordinary,” this book is designed to help you maintain your creative focus while dealing with your other commitments. It includes plenty of practical time management tips tailored specifically for creative types.


6. Getting Real


getting real image

Getting Real is the business, design, programming, and marketing philosophy of 37signals, a developer of web-based software used by over one million people and businesses in 70 countries. With short, value-packed chapters, this book is an excellent guide for building web-based applications in a smarter, faster and easier way.


7. The Woork Handbook


woork handbook image

The Woork Handbook is focused around web design and programming and primarily deals with CSS, HTML, Ajax, web programming, Mootools, Scriptaculous and other topics about web design.

It is an excellent reference book on a range of subjects all drawn from a wealth of excellent articles published on Woork.


8. A Practical Guide To Web Typography


web typography image

Robert Bringhurst’s book, The Elements of Typographic Style, is on many a designer’s bookshelf, and is considered to be a classic in the industry. The renowned typographer Hermann Zapf calls the book “a must for everybody in the graphic arts, and especially for those just entering the field.”

In order to allay some of the myths surrounding typography on the web, this book has been structured as a walk through Bringhurst’s working principles, explaining how to accomplish each using techniques available in HTML and CSS. Practicality is ever present with workarounds, alternatives and compromises for less able browsers.


9. Integrating Accessibility Throughout Design


accessible design image

This e-book is a practical guide with advice on how to improve your websites, software, hardware, and consumer products, all with an eye on accessibility and avoiding future snags. Written by Shawn Henry, an outreach coordinator who promotes web accessibility for people with disabilities, it’s a straightforward and engaging resource.

The book covers the basics of improving accessibility in design projects with tips for comfortable interaction, having accessibility in a user-centered design process, examples of accessibility in user group profiles, personas, scenarios and much more.


10. Web Style Guide


webstyle guide image

An in-depth resource that offers information and instruction related to several areas of web development, including interface design, information architecture and usability.

The book explains established design principles and illustrates how they apply to projects whose primary concerns are information design and efficient search and navigation.

Beginner and advanced designers will find this to be one of the most practical guides available.


More Dev & Design Resources from Mashable:


12 Beginner Tutorials for Getting Started With Photoshop
40+ Web Design and Development Resources for Beginners
10 Free and Fun Twitter Bird Icons for your Website
11 Ways to Speed Up WordPress
10 Free Wireframing Tools for Designers

Image courtesy of iStockphoto, iamspartacus9

More About: accessibility, book, design, designers, developer, e-book, help, how to, List, Lists, resource, web design, Web Development

For more Dev & Design coverage:


febrero 24, 2010

10 Essential Chrome Extensions for Web Developers

This series is supported by Rackspace, the better way to do hosting. Learn more about Rackspace’s hosting solutions here.

As a web developer, you’re probably among the earliest adopters of new browser technologies. Google’s relatively new Chrome browser is one of those products that developers jumped all over as soon as it became available, but its initial lack of extensions was a dealbreaker for many.

Now extensions are supported in Chrome and some of the tools you’re accustomed to using in Firefox have become available, plus a few unique to Chrome. We’ve compiled a list of ten of the most useful Chrome extensions for web developers right here; if you use these extensions, you might even be able to make Chrome your main workhorse. Maybe!

Look at the list and give it a try — and if there are any great ones that we missed, be sure and share them with us and the other readers in the comments.


1. Firebug Lite


Arguably the most popular Firefox extension for web developers, Firebug lets you look at and edit the HTML, CSS and JavaScript of any page on the fly without leaving your browser. Firebug Lite is a scaled-down version of Firebug made for Chrome. You can inspect a page for errors then quickly edit to fix them.

Though Firebug Lite doesn’t have all the same features as Firebug, it has most of the essentials, and there’s a console interface for power users.


2. IE Tab


Microsoft’s Internet Explorer web browser is not at all popular with web developers, but it’s by far the most popular browser for the general population. With IE Tab you can open any website in a tab that’s actually running Internet Explorer instead of Chrome. You can make sure your website runs correctly for those millions of people who aren’t using Firefox, Safari, Chrome, or Opera.


3. Eye Dropper


With EyeDropper, you can find useful information on any color on a website you’re viewing in Chrome. Click the extension button and a color wheel interface drops down. From there, you can click the color picker button, then click anywhere on the site to see where the color for that pixel falls in the wheel, what its RGB levels are, and what its HTML color code is.


4. Chrome SEO


Tapping the Chrome SEO button after the extension has been installed will give you website information that’s important for search engine optimization. You can check backlinks, traffic measures like the Alexa Rank and Google PageRank, popularity on social bookmarking sites like Delicious, and more.


5. Lorem Ipsum Generator


The Lorem Ipsum Generator extension will generate filler text for your websites so you can make sure your formatting works well without wasting time typing several paragraphs of text. This extension is lightweight and minimalistic, so it’s easy to use and it won’t take up a lot of memory. That means it’s easy to pop in and out of as needed.


6. Resolution Test


Resolution Test’s purpose is right there in the name — it re-sizes the browser window to show what your website will look like at various popular screen resolutions. As a web developer, you probably have a very high-resolution display. Good for you! But most of the visitors to your site don’t; this extension will help you make sure the site’s formatting looks ok to them.


7. Speed Tracer


Speed Tracer uses the browser’s built-in metrics tools to record how much time your web application is spending on various tasks so you can find out what the hang-up is if your site is running slowly. It can tell you how much time the browser is spending interpreting layout, Javascript, and other details.

The only downside to this useful tool is that for it to work, you have to run the browser with the command line flag “–enable-extension-timeline-api.” But if you’re a developer, that’s probably not a big issue, right?


8. MeasureIt!


MeasureIt! is pretty straightforward — it gives you the dimensions (pixel width and height) of any element present in a website you’re looking at. Like a lot of the other extensions on this list, it was previously available for Firefox.


9. Pendule


Pendule pops up an easy-to-use, well-laid-out control panel full of miscellaneous tasks helpful to developers. Examples include reloading or disabling CSS, viewing JavaScript scripts, hiding images, a color picker, a display ruler, viewing source, and several script validators. It works well as your basic, catch-all web developer’s extension.


10. BuiltWith


BuiltWith gives you a profile of the website you’re hanging out at, including a list of all the technologies it can find there. It will tell you what widgets the site is using, which analytics tracker the webmaster is using, which frameworks are present, which advertising platforms are in use, and so on.


Series supported by Rackspace

rackspace

Rackspace is the better way to do hosting. No more worrying about web hosting uptime. No more spending your time, energy and resources trying to stay on top of things like patching, updating, monitoring, backing up data and the like. Learn why.


Reviews: Chrome, Delicious, Firefox, Google, Internet Explorer, Opera, Safari

Tags: development, extensions, Google, google chrome, rackspace, web development series