Cómo optimizar los archivos SVG para su uso avanzado con CSS

Extracto de la transcripción automática del vídeo realizada por YouTube.

okay and I'm here to as a last minute kind of request to back on the excellent presentation by Sarah Sweden on SVG to make a long story short Sarah was originally going to talk about shapes and I was really going to talk about his Fiji and she got in and

I didn't quite get him but then she changed your mind so I'm gonna try and do a accessory top to that featuring a little bit of my own work and talking about some of the things that Sarah didn't have time to address but I would recommend that if

you're watching this now you go see Sarah's verse so you can get the basics from her but I'm going to start off from just a little bit of perspective so I am lovely story at Dublin on Twitter I have a blog called demosthenes dot info where I write

about web development and I'm a by trade I'm web development teacher that's what I do I teach full-time part-time night classes all the time that's what I do I'm also a writer I published through a press last year Pro css3 animation and

I'm also a contributing editor to Smashing Magazine I do their coding section so most of the requests for and offers of writers come for coding at least come through me for special magazine so it's VG s VG's been thought of and debated and worked

through as a kind of very often as this foreign thing thus foreign not terribly understandable kind of battle against and it's really not right we really shouldn't think of SVG and CSS as being enemies or even being frenemies they really are two parts

the same side so don't think of them as battling each other just think of them as one tool that's like a kick-ass light saber that's essentially the joined together and I'll show you ways in which both CSS and SVG and ultimately HTML can really

start to complement each other they're not oh it's only just as SVG or it's only just CS yes the two really do start to work to give him very interesting kinds of ways so I'm going to give a very quick little breakdown of a couple of things

that people need to do again Sarah covered a little bit of this but I'm going to do a in addition some of this is again from my blog but I'll give you your ELLs so Adobe Illustrator work for SVG production so very quickly if you know and most people

will be using Adobe Illustrator to get some sort of work out if you know that you're going to be using Adobe Illustrator for export to SVG then there's a couple of things that you do want to do you'll want to set up your canvas in pixels and that

seems kind of weird at the first because SVG is meant to be the scale free doesn't matter what kind of Units you use and that's true but it's easiest if you set up a canvas first in pixels because it's the easiest thing to relate to it doesn't

mean that your SVG is limited to a certain pixel dimension don't get that me here at all but it does help move things across work out where components are that sort of stuff the artboard that you make so whatever size of artboard you want to make is perfectly

fine but the artboard is going to become the view box of the SVG essentially although view box does a lot of things in SVG it's the visible area of your SVG so if you want to do things off canvas that's perfectly fine just make sure that your your

art your borders a certain size but if you want to make it larger later that's perfectly fine as well just be aware that the two will by default match up in Illustrator again you can change them SVG again in illustrator will set itself up to CMYK don't

make the mistake that generations of people have made when using these tools and setup for CMYK when you really want RGB in most cases so make sure it's RGB the thing to remember about making components in Illustrator is that as you make them the way that

I like to think about SVG is you're making drawings as data you're not just making pretty lines you're not just making curves you're making drawings as data so as you build things give them some sort of naming convention get any kind of naming

convention it's fine as long as you're consistent and you stick to it so stick to building something and name everything as you build it while it's not absolutely necessary to do so it becomes a whole lot easier later when you're trying to

then manipulate that as a purist VG simplify it's a couple of things as a rule I use the fewest number of points to create a shape again a lot of people will start to use point point point point point to try and get something on the screen don't do

that try and use the fewest number of numbers of points I try to avoid filters in adobe illustrator as they're not yet translated into SVG with the adobe illustrator xpg export so don't tend to do that don't stroke things if you don't have

[ ... ]

Nota: se han omitido las otras 2.459 palabras de la transcripción completa para cumplir con las normas de «uso razonable» de YouTube.