Ai color management for web design
The color management settings inside of Adobe Illustrator is for the web design we need to use the RGB color space. We need to take a moment and talk about the color management settings inside of Adobe Illustrator. We already know that when designing for the web we need to use the RGB color space, but that doesn’t necessarily refer to the color management setting or profile that we should be using for our graphics. In any case, we need to be aware of the fact that even if we take the time to meticulously tweak our color management settings and really dial in our artwork colors, the chances are they are still going to look different on every screen that accesses them.
Once we go into Color Settings, we’ll have the ability to choose a settings profile from the top, and once you choose this, we can actually pick one that’s called North America Web/Internet. When you choose that, it’s going to say RGB and it’s going to be set to sRGB and then a few letters and numbers after that. When we hover over that, it’s going to tell we at the bottom in the description that this reflects the characteristics of the average PC monitor. This is the default color space for many scanners, low-end printers, and applications. It’s recommended for web work, but not pre-press work because of its limited color gamut.
In traditional design, we think of color as being a formula that’s comprised of different values of channels, like RGB for red, green, and blue; or CMYK for cyan, magenta, yellow, and black. On the web, it’s still RGB color, but it utilizes a system known as hexadecimal codes in order to display the color. Hex codes are six-digit values that range from 0 all the way to the letter F, and it refers to the amount of color present in the overall appearance of the object.
Create a new swatch, Client Blue Green. Hit OK. It adds that in. I always hover over these, just to make sure that it’s getting them correct. Sample the next, Client Light Yellow, hit OK; sample this one, Client Burnt Orange, hit OK. And then finally, this one is just white, but I’m going to sample it anyway, just in case there’s any values that I don’t see in there. Client White.
And each time I’m creating this new swatch, I’m careful to make sure that my Color Type is set to Process and that my Color mode is always on RGB, because when we are working with the web, we want to work in RGB color. So I hit OK. So once I do that, it’s going to add it up there. I can always move it. I just click and drag it down to these right here. If I want these in their own color group, that’s easy to do. I’ll just come here, create a new color group, and I’ll call this Client Swatches, and I’m going to hit OK. Now it threw a color in there for me already.
I want to be able to quickly get a hold of all of these icons so I can drag and drop them into any project that I might be working on. The answer to that is symbols. So in this movie we are going to take these icons and we are going to turn them into a symbol library which we can then use in any project we want going forward. In order to do this, I need to first bring up my Symbols panel, and my Symbols panel is actually located right over here in this little docked area of icons, and it’s got a little clover on it that says Symbols when I hover on it. If we can’t see our Symbols panel, just go to the Window menu and choose Symbols, and it should pop up wherever it is.
So using symbols inside of Illustrator is a great way to ensure that we can easily switch objects in and out, and change multiple objects all at once, simply by using a symbol that we save into our symbols library and then load up in any document as wish.
