Selasa, 12 April 2011

Smashing Newsletter #31: Colors for Your Code, Pixel Patterns With CSS ...

You received this email because you signed up for this newsletter.
Does everything look mixed up? View the online version. Annoyed? Unsubscribe at any time.

Table of Contents

1. Solarized: Precision Colors for Your Code
2. GuideGuide: Columns, Rows and Midpoints Panel for Photoshop
3. Programming Advice for JavaScript Developers
4. Plum, Grape, Lavender… or Just Purple?
5. Pixel Patterns With CSS
6. Roots: A New WordPress Starter Theme
7. Inspirational Books for Designers and Artists
8. The Art of the Title Sequence
9. New on Smashing Magazine
10. Smashing Network Highlights

Editorial: We Are Looking For A Trainee!

If you'd like to get a close look behind the curtains of Smashing Magazine, here is your chance. We are looking for a motivated trainee student who is keen to learn about online publishing and editorial work. You can gather first-hand experience from one of the most successful blogs by working side by side with Smashing Magazine's team.

Freiburg
The hometown of Smashing Magazine: Freiburg, Germany.

To find out what a traineeship at Smashing Magazine looks like, please have a look at the article from our first trainee, Jessica Bordeau. And if you are interested, please read up on the details about the internship and contact us. We look forward to your application!

1. Solarized: Precision Colors for Your Code

If you spend a lot of time writing code or using the command terminal, then you may have already found yourself needing to adjust the default colorization of code. How do you find the perfect balance of colors? Moreover, what if you'd like your whole team of developers to use a consistent, optimal color scheme? You need colors that are easily legible, while still providing enough contrast, both with the background and each other, so that the different parts of your mark-up are easily distinguishable.

Solarized: Precision Colors for Your Code

Enter Solarized. Solarized is a free custom palette of sixteen colors (including four background tones, four "content tones" and eight accent tones). The content and accent tones are visible on both the light and dark backgrounds and are based on established color theory principles. They've been tested on calibrated, uncalibrated and miscalibrated monitors and under various lighting conditions to be highly visible in different contexts. The schemes are currently available for Vim, Mutt, Xresources, iTerm2, OS X Terminal, Adobe Photoshop Palette, Apple Color Picket Palette and GIMP palette. (cc)

2. GuideGuide: Columns, Rows and Midpoints Panel for Photoshop

If you've been working with grids and InDesign for a while, then you may have wondered why Photoshop doesn't have a grid tool similar to InDesign's. But thanks to Cameron McEfee, such a tool now exists. GuideGuide is a columns, rows and midpoints panel for Photoshop CS4 and CS5. It features a midpoint-seeking function, and it enables you to create margins, rows and columns as desired. Punch in the numbers of rows and columns you need, set the gutter widths, click "Create Guides," and the grid will be created on the canvas using guides. The midpoint seeker provides you with three options: horizontal middle, vertical middle, and both horizontal and vertical middle. Both the midpoint-seeking function and the rows and columns function can be applied to whole documents as well as to selected elements.

GuideGuide: columns, rows and midpoints panel for Photoshop

The panel is reliable and easy to use. Just download the ZIP file, unzip it, and drop the GuideGuide folder in Applications -- Adobe Photoshop -- Plug-Ins -- Panels on a Mac, or Program Files -- Adobe Photoshop -- Plug-Ins -- Panels -- in Windows. Then restart Photoshop, and you'll find the panel ready to use in your extensions area. Alternatively, you could use Russel Brown's GuideGuide Installer (.zip) and check out the quick video tutorial (.mov) on using the tool. (sp)

3. Programming Advice for JavaScript Developers

Good code requires a good understanding of the basics of the language it is written in. With the advent of advanced JavaScript libraries such as jQuery, many developers jump straight into writing code using jQuery or its numerous plug-ins. However, learning more about the foundation of JavaScript itself might give you a better understanding of the concepts behind jQuery and the language itself.

Programming Advice for JavaScript Developers

JavaScript Garden is a growing collection of documentation about the quirkiest parts of JavaScript. It offers advice on avoiding common mistakes and subtle bugs, and it lays down performance issues and bad practices that JavaScript programmers might run into on their journey to the depths of the language. The resource is dedicated to professional developers rather than beginners, and it requires some basic knowledge of the language. Currently, the documentation is available in Russian, Chinese, Finnish and English. (tb)

Advertisement
Fontfuse Ad

4. Plum, Grape, Lavender… or Just Purple?

Gender and color is a topic that has been debated for decades. The infographics on "Gender and Color" take a close look at the results of studies of the issue, with the aim of identifying certain colors as feminine or masculine. The results imply certain general conclusions about the color tastes of men and women. It turns out that blue is quite popular with both men and women alike. Why is that? Blue is often associated with clean water, blue sky, authority and truth: how much more persuasive could it be?

Plum, Grape, Lavender - or simply Purple?

Take your time skimming the infographics on the website. Check out where your favorite color ranks. Do you agree with the names and categories given to colors by males and females? Let us know on Twitter (please use the hashtag #smcolor)! (sp)

5. Pixel Patterns With CSS

Pixel patterns can add interest to a design element, whether it's the background of a website or a particular item. Interestingly, creating patterns with CSS (i.e. without images) is apparently possible. The tricky part is that doing this manually is not exactly easy.

Pixel Patterns with CSS

Patternify changes all that. Sacha Greif's tool lets you create patterns with up to 10 square pixels with multiple colors. A few patterns are built in (including wavy lines, dotted lines and basketweave) that you can use or adapt. To use the tool, just draw your pattern on the grid (use the cursors to limit the drawing surface and control the tiling), and download either the CSS or PNG file. You can also get a short unique URL to share with other pattern addicts. (cc)

6. Roots: A New WordPress Starter Theme

Plenty of WordPress starter themes are out there, yet most of them use HTML4 or XHTML. If you'd like to make your theme more semantic and make the CSS easier to maintain, you could give HTML5 a try. In fact, we've already converted WordPress 3.0's default TwentyTen theme to HTML5, but you could go even further.

Roots: A New WordPress Starter Theme

As far as the Roots WordPress theme, in fact. Roots comes in several flavors: HTML5 Boilerplate, Blueprint CSS or 960.gs, and Starkers. When activated in a fresh WordPress installation, it gives you dummy content to work with, and it is ideal for blogs and brochure websites. The designers have also built in features to make WordPress' code output cleaner, including moving static theme assets to the website's root and heavily modifying wp_head. Don't forget to add an HTML5 shiv for users with older versions of IE, so that they can experience the full website, too. (cc)

Advertisement
Business Catalyst Ad

7. Inspirational Books for Designers and Artists

When it comes to finding inspiration, every little bit helps. One way is to have a good library at home. The books don't all have to feature appealing pictures or works by other artists. What about books with good stories that plant ideas in our minds? On Designers & Books, you will find short reviews of 797 books, presented by 60 designers from different disciplines and different countries. Each designer introduces one or more books that have influenced their ideas and values. Furthermore, you'll find members who have created must-read lists for different disciplines in design.

Inspirational books for designers and artists

As you read through the write-ups, you can easily add your favorites to a reading list and email it to yourself or print it out. Designers are regularly added to the website, and you can follow the blog to avoid missing out on any. So, if you have some space left on your bookshelf, let yourself be inspired by the great choice offered on this website. (as)

8. The Art of the Title Sequence

This Web resource of film and television title designs from around the world is free to the public and updated monthly. The Art of the Title Sequence is dedicated to the brief history of title design, and it features opening titles for film and television. High-resolution thumbnails from the titles are presented, the works are extensively cataloged, and the variety of tools allow you to compare, analyze and view items in new and experimental ways.

The Art of the Title Sequence

The works, which are intended to foster creativity, are accompanied by stills and video links, interviews, creator notes and user comments. Also, check out A Brief History of Title Design Video, a short film that features some memorable and remarkable title designs. Hats off to all the designers who have created and are still creating excellent title sequences! (ik)

eBook Special: 25% Discount on "Mobile Design for iPhone and iPad"

Smashing eBook #4

Over the past few years, mobile web usage has increased to a point that web designers no longer can afford to ignore it. As a result, web designers have a growing need to be educated in this area and to be ready to design websites that accommodate this audience. This e-book is dedicated to Mobile Design for iPhone and iPad and it contains more than 300 pages with articles that have appeared on Smashing Magazine. Available as a PDF, ePub and Mobipocket.

Buy the eBook with 25% discount!

Here is your coupon code for the discount: 9RoiHDaxg
(The code is valid until 15th April 2011)

Once you've put the eBook into your shopping cart, just enter the code above into the field "Discount Codes" and click the yellow button "Apply Coupon". Proceed to Checkout or continue shopping. The discount will be applied once you've finished shopping.

9. New on Smashing Magazine

10. Smashing Network Highlights

Tidak ada komentar:

Posting Komentar