today i learned: svg files are literally just html code
-
It's both of those things
Schrödinger's SVGs?
-
Schrödinger's SVGs?
Yeah, it depends on if you view source
-
what the heck!! that is so wild, mind blowing, i know the main difference between raster graphics and vector graphics was the quality but not more, i had no idea svg files actually used html code and pretty much could be modified using only text and amazing code woa!!! this opens up the possibility for so many things on linux i think, for example, on a linux distro, we could modify the desktop environment and make it waaaaay lighter by getting rid of jpg or png icons and just using pure svg on it. svg can be given a lot of attributes like movement, mouse hovering, change color, change anything. and most svg files are still under a megabyte. wow.. please let me know other fun facts about svg or eps files. i really like doing graphic design on linux and inkscape.
No, SVG files are not HTML.
Please change this post title (currently "today i learned: svg files are literally just html code"), to avoid spreading this incorrect factoid!
I suggest you change it to "today i learned: svg files contain code in an html-like language" or something like that.
XML and HTML have many similarities, because they are both are descendants of SGML. But, as others have noted in this thread, HTML is also not XML. (Except for when it's XHTML...)
Like HTML, SVG also can use CSS, and, in some environments (eg, in browsers, but not in Inkscape) also JavaScript. But, the styles you can specify with CSS in SVG are quite different than those you can specify with CSS in HTML.
Lastly, you can embed SVG in HTML and it will work in (modern) browsers. You cannot embed HTML in SVG, however.
-
what the heck!! that is so wild, mind blowing, i know the main difference between raster graphics and vector graphics was the quality but not more, i had no idea svg files actually used html code and pretty much could be modified using only text and amazing code woa!!! this opens up the possibility for so many things on linux i think, for example, on a linux distro, we could modify the desktop environment and make it waaaaay lighter by getting rid of jpg or png icons and just using pure svg on it. svg can be given a lot of attributes like movement, mouse hovering, change color, change anything. and most svg files are still under a megabyte. wow.. please let me know other fun facts about svg or eps files. i really like doing graphic design on linux and inkscape.
I made an interactive map: drew in Inkscape, gave the interactive elements numbers for ids, then substituted the id='xxx' in vim with the php code and js function calls, picking up the number from the id tag and inserting it appropriately in php code and function arguments. 250 interactive elements taken care of in a single vim substitute. My bestest development power move yet
-
what the heck!! that is so wild, mind blowing, i know the main difference between raster graphics and vector graphics was the quality but not more, i had no idea svg files actually used html code and pretty much could be modified using only text and amazing code woa!!! this opens up the possibility for so many things on linux i think, for example, on a linux distro, we could modify the desktop environment and make it waaaaay lighter by getting rid of jpg or png icons and just using pure svg on it. svg can be given a lot of attributes like movement, mouse hovering, change color, change anything. and most svg files are still under a megabyte. wow.. please let me know other fun facts about svg or eps files. i really like doing graphic design on linux and inkscape.
for example, on a linux distro, we could modify the desktop environment and make it waaaaay lighter by getting rid of jpg or png icons and just using pure svg on it.
this has largely happened; if you're on a dpkg-based distro try running this command:
dpkg -S svg | grep svg$ | sort
...and you'll see that your distro includes thousands of SVG files
::: spoiler explanation of that pipeline:
dpkg -S svg
- this searches for files installed by the package manager which contain "svg" in their pathgrep svg$
- this filters the output to only show paths which end with svg; that is, the actual svg files. the argument to grep is a regular expression, where$
means "end of line". you can invert the match (to see the pathsdpkg -S svg
found which only contain "svg" in the middle of the path) by writinggrep -v svg$
instead.- the
sort
command does what it says on the tin, and makes the output easier to read
you can run
man dpkg
,man grep
, andman sort
to read more about each of these commands.
::: -
I made an interactive map: drew in Inkscape, gave the interactive elements numbers for ids, then substituted the id='xxx' in vim with the php code and js function calls, picking up the number from the id tag and inserting it appropriately in php code and function arguments. 250 interactive elements taken care of in a single vim substitute. My bestest development power move yet
What was the map used for?
-
what the heck!! that is so wild, mind blowing, i know the main difference between raster graphics and vector graphics was the quality but not more, i had no idea svg files actually used html code and pretty much could be modified using only text and amazing code woa!!! this opens up the possibility for so many things on linux i think, for example, on a linux distro, we could modify the desktop environment and make it waaaaay lighter by getting rid of jpg or png icons and just using pure svg on it. svg can be given a lot of attributes like movement, mouse hovering, change color, change anything. and most svg files are still under a megabyte. wow.. please let me know other fun facts about svg or eps files. i really like doing graphic design on linux and inkscape.
Ommigod, these kids
SVG comes XML (a more coherent/simple version of the SGML that is behind HTML), and specifically from a time where people took XML and made it hyper-complicated with a flurry of extensions and specifications (look up "xml namespaces" "xslt" "xml schema").
The most apparent difference between SGML and XML is than in the former you write tags like <br> without a corresponding </br>, and in the latter you have to close them like <br/> (which is shorthand for <br></br>).
So... today you learned that what you learned earlier today was close to truth, but not true
PS: A lot of document formats are undercover/zipped XML (eg. the libre office documents, IIRC microsoft's .xlsx and .docx). This is not dissimilar to how json/yaml are widely used today.
-
for example, on a linux distro, we could modify the desktop environment and make it waaaaay lighter by getting rid of jpg or png icons and just using pure svg on it.
this has largely happened; if you're on a dpkg-based distro try running this command:
dpkg -S svg | grep svg$ | sort
...and you'll see that your distro includes thousands of SVG files
::: spoiler explanation of that pipeline:
dpkg -S svg
- this searches for files installed by the package manager which contain "svg" in their pathgrep svg$
- this filters the output to only show paths which end with svg; that is, the actual svg files. the argument to grep is a regular expression, where$
means "end of line". you can invert the match (to see the pathsdpkg -S svg
found which only contain "svg" in the middle of the path) by writinggrep -v svg$
instead.- the
sort
command does what it says on the tin, and makes the output easier to read
you can run
man dpkg
,man grep
, andman sort
to read more about each of these commands.
:::for alpine linux users:
apk info -L $(apk info) | grep -v contains | grep 'svg'
-
what the heck!! that is so wild, mind blowing, i know the main difference between raster graphics and vector graphics was the quality but not more, i had no idea svg files actually used html code and pretty much could be modified using only text and amazing code woa!!! this opens up the possibility for so many things on linux i think, for example, on a linux distro, we could modify the desktop environment and make it waaaaay lighter by getting rid of jpg or png icons and just using pure svg on it. svg can be given a lot of attributes like movement, mouse hovering, change color, change anything. and most svg files are still under a megabyte. wow.. please let me know other fun facts about svg or eps files. i really like doing graphic design on linux and inkscape.
Oooh, neat! [Cunningham's Law] (https://en.m.wikipedia.org/wiki/Ward_Cunningham#Cunningham's_Law) in action!
-
what the heck!! that is so wild, mind blowing, i know the main difference between raster graphics and vector graphics was the quality but not more, i had no idea svg files actually used html code and pretty much could be modified using only text and amazing code woa!!! this opens up the possibility for so many things on linux i think, for example, on a linux distro, we could modify the desktop environment and make it waaaaay lighter by getting rid of jpg or png icons and just using pure svg on it. svg can be given a lot of attributes like movement, mouse hovering, change color, change anything. and most svg files are still under a megabyte. wow.. please let me know other fun facts about svg or eps files. i really like doing graphic design on linux and inkscape.
No, it's XML. It's an ancestor of HTML and, unlike HTML, it can be losslessly converted.
-
I'm not sure that lossy compression on vectors is strictly impossible.
You can do things like store less colour information and simplify splines so that curves are less complex.
True, in fact I've done so myself (simplifying a curve resulting of hand sketching). Still I'd argue that's not the normal expected behavior of storing the vector file but rather explicitly modifying it.
-
What was the map used for?
It's a map of fairground lots for a service that takes bookings, bills the customer and deals with providing relevant safety info to authorities. In use again this season
-
for example, on a linux distro, we could modify the desktop environment and make it waaaaay lighter by getting rid of jpg or png icons and just using pure svg on it.
this has largely happened; if you're on a dpkg-based distro try running this command:
dpkg -S svg | grep svg$ | sort
...and you'll see that your distro includes thousands of SVG files
::: spoiler explanation of that pipeline:
dpkg -S svg
- this searches for files installed by the package manager which contain "svg" in their pathgrep svg$
- this filters the output to only show paths which end with svg; that is, the actual svg files. the argument to grep is a regular expression, where$
means "end of line". you can invert the match (to see the pathsdpkg -S svg
found which only contain "svg" in the middle of the path) by writinggrep -v svg$
instead.- the
sort
command does what it says on the tin, and makes the output easier to read
you can run
man dpkg
,man grep
, andman sort
to read more about each of these commands.
:::Is this the same as
pacman -Ql
? -
It's a map of fairground lots for a service that takes bookings, bills the customer and deals with providing relevant safety info to authorities. In use again this season
Yo that’s super cool! My nerd brain went straight to a virtual table top map for D&D
-
litghter, as in smaller, yess. but keep in mind, that vector graphics need to be rendered, wich depending on circumstance and graphic might become inefficient.
i never crunched the numbers, but basically youre outsourcing the generation of a rastergraphic to those who open up your website.
Though this also has advantages - not only will they be drawn at an appropriate resolution, they can also be styled & modified by the user. If I'm using Dark Reader and your icons are SVGs using
currentColor
, they'll render with the same color as other text. The best you can do for raster graphics is inverting them. -
what the heck!! that is so wild, mind blowing, i know the main difference between raster graphics and vector graphics was the quality but not more, i had no idea svg files actually used html code and pretty much could be modified using only text and amazing code woa!!! this opens up the possibility for so many things on linux i think, for example, on a linux distro, we could modify the desktop environment and make it waaaaay lighter by getting rid of jpg or png icons and just using pure svg on it. svg can be given a lot of attributes like movement, mouse hovering, change color, change anything. and most svg files are still under a megabyte. wow.. please let me know other fun facts about svg or eps files. i really like doing graphic design on linux and inkscape.
for example, on a linux distro, we could modify the desktop environment and make it waaaaay lighter by getting rid of jpg or png icons and just using pure svg on it.
Isn't that how it already works? GNOME system icons are all SVG - that's what allows them to change colors when you change themes or switch between light and dark mode.
-
XML is a super-set of XHTML's spec.
That's a weird way of saying XHTML is an application of XML.
You can phrase it however you like?
?
-
for example, on a linux distro, we could modify the desktop environment and make it waaaaay lighter by getting rid of jpg or png icons and just using pure svg on it.
Isn't that how it already works? GNOME system icons are all SVG - that's what allows them to change colors when you change themes or switch between light and dark mode.
i didn't know that, is that the same in xfce??
-
No, SVG files are not HTML.
Please change this post title (currently "today i learned: svg files are literally just html code"), to avoid spreading this incorrect factoid!
I suggest you change it to "today i learned: svg files contain code in an html-like language" or something like that.
XML and HTML have many similarities, because they are both are descendants of SGML. But, as others have noted in this thread, HTML is also not XML. (Except for when it's XHTML...)
Like HTML, SVG also can use CSS, and, in some environments (eg, in browsers, but not in Inkscape) also JavaScript. But, the styles you can specify with CSS in SVG are quite different than those you can specify with CSS in HTML.
Lastly, you can embed SVG in HTML and it will work in (modern) browsers. You cannot embed HTML in SVG, however.
ok thank you very much!!
-
technically HTML is not XML.. XHTML is, but HTML can be invalid XML.
It annoys me that you aren't supposed to close input tags. At least browsers tolerate self closing them even if it is out of spec.