Pin Me

Web Development Tool: Adobe Illustrator

written by: Ariala•edited by: Linda Richter•updated: 10/29/2008

Ever work in a web design program and wish you could create cool headers and graphics like you see on some web pages? Well, it's easy with Adobe Illustrator at your fingertips.

  • slide 1 of 6

    Anyone who has ever created a website in a program like FrontPage knows the limitations involved in creating cool illustrations and headers. Sure, you can choose from a number of themes in FrontPage, but to really get creative, all web designers should know how to use Adobe Illustrator.

  • slide 2 of 6

    web header Adobe Illustrator is the perfect tool for creating attractive web headers, side tables and other graphics, logos, fonts and special accents to use throughout your website. Illustrator lets you create crisp graphics at the exact size and proportion you need. Something to keep in mind when creating graphics for websites is to save the graphics in RGB instead of CMYK. The latter is for print, while RGB is web use.

  • slide 3 of 6

    Adobe Illustrator: Sketching Your Way to “Cool”

    If you’re after free form headers, fonts or graphics, Illustrator has brush tools that let you sketch away and be as creative as you want. There are feature tools with advanced path controls that are intuitive and let you create jpg images perfect for your website. Be sure to size them down to the exact size you need to keep loading time down.

  • slide 4 of 6

    Adobe Illustrator and Photoshop

    Adobe Illustrator and Photoshop work hand in hand. These two programs now share the same color management system so that everything is consistent from one program to the next. In the past, when creating the perfect image color in Illustrator, the quality of color dropped in Photoshop. This is no longer the case. The two applications now allow you to jump from one to the other without losing the integrity of the color or image in any way. Illustrator and Photoshop can both be purchased online from Adobe.

  • slide 5 of 6

    Shading and Other Cool Effects

    Adobe Illustrator lets you ad real-to-life shading effects to your graphics using the Gradient Mesh feature. This helps you create 3-D like graphics and images perfect for web use. You can also use Illustrator to create very cool navigation headers with shading, special patterns and perfect colors. Once you have the look you’re after, turn the object into a jpg file. From there, take the header into Frontpage (or your web design program) and highlight the words or graphics you want to turn into a navigation link. It’s simple and attractive, perfect for any website.

  • slide 6 of 6

    Illustrator Tutorials

    Like any program, Illustrator has so many awesome features and tools. The best thing to do is go through several Illustrator tutorials online, as well as study graphics you like really like. From there, learn the techniques used to create them and format them into the correct shapes and sizes for your websites. Once you get the hang of it, you’ll love using Adobe Illustrator as a web tool, and wonder how you ever did without!