Web Assets & Sprites

[Jack Stronach]

Hello,

How would you go around creating an image asset like a navigation background or even a body background?

For example X10Hosting’s Free-Signup background image:
here

I notice it’s very short in width, if there is any specific or as specific as I can get of a tutorial out there, that would be great!

[Senff]

What do you mean, “how would you go around creating an image asset“? From scratch? You’re going to need an image editor like Photoshop or Gimp and create a new image with that.

If that’s what you meant…

[Jack Stronach]

I have Photoshop CC, my knowledge in CSS and HTML is quite advanced I just want to know the best method of doing it.

[Senff]

Creating an actual image does not require HTML or CSS.

[nixnerd]

I have Photoshop CC, my knowledge in CSS and HTML is quite advanced I just want to know the best method of doing it.

I personally WOULD NOT use Photoshop or GIMP. I would use Illustrator or Inkscape in this situation and do all graphics as SVG. That way, they will be MUCH cleaner, they’re guaranteed to be mathematically correct in terms of angles, curves, etc.

Once you’ve created a vector graphic in a vector program (like Illustrator or Inkscape), you can use the SVG directly in your webpage, with PNG as a fallback.

Cool thing about a vector is you can target it with CSS styles, as they’re actually just XML. Gives nav buttons a really sick custom touch.

[Jack Stronach]

Lol, yes… I know, I didn’t say it did, you’re not really answering my question are you, just pointing things out for me.

[Jack Stronach]

Thank you NIX, that was a very descriptive and helpful answer. Appreciate it :)

[Author]

Posts