Great addition by the bootstrap team. I think the lasting success of Font Awesome shows that this could potentially be a revenue angle for the bootstrap team as well, in addition to the fact they just put out some great first party icons!
There is a small downside here in that they are as of this alpha release (alpha.1) svg only, so they don’t fallback to a font icon, which may or may not be desirable. I know generally SVG is preferred (in part to accessibility concerns, IIRC, as well as being easier to style and of course SVGs scale well for sizing concerns)
“It all comes down to browser support. If you can go IE 9+ / Android 3+, inline SVG is better at pretty much everything than icon fonts. If you need the deeper browser support, I feel like an inline SVG fallback would be too big of a pain to be worth it (maintaining a PNG copy, inserting an additional element to display PNG version, hiding SVG element… it’s weighty).”
Giving inline SVGs a full green score on “weird failures” isn’t right.
For example, plenty of SVG features, like masks and patterns, use references to ID attributes to compose the effect. If you include multiple inline SVGs on the same page, you now need to make sure that none of them use the same ID for an element, or else your masks can break in unexpected and hard-to-debug ways as some browsers get confused about which element you intended to use as a mask.
If you’re exporting your SVG from a graphics program it’s not unlikely that they’re generating IDs by the same deterministic method on every export, creating such ID collisions that you’re unaware of.
Now that's a coincidence... Just 5 minutes ago I was checking out the Bootstrap 5 alpha site (which is really great; just check out what it offers) and stumbled upon the Bootstrap icons project! Great stuff!
> Bootstrap Icons are SVGs, so they scale quickly and easily and can be styled with CSS.
Does this sentence actually refer to image icons in an implicit comparison? Or is there a lot more to SVG (for an end user who may not modify the underlying paths and design)?
I’ve been using Fontawesome for several years and my font declaration includes popularly supported font formats like WOFF2, WOFF, etc. The reason I even chose a font icon set was to easily scale and style it with CSS. It’s been working quite well for standard and common icons. Getting it cached by the browser is also easy with standard caching headers.
I'm sure that as this is developed it will get easier, but looking over the docs at the various ways to use these makes, for example, Font Awesome look like a walk in the park. The font based icon solutions using just CSS classes is fantastic not to mention it respects font sizing, colors, etc. The SVG Font Awesome components for the various front end frameworks are typically a breeze to drop in and start using as well. As it stands, going strictly off the docs regarding usage, this looks like more of a chore to use and fit in with text flow and styling.
There’s trade offs to all approaches though that is the easiest way to use them without too many downsides. I think CSS Tricks article on this does a good job explaining the different ways to use SVG
I like using the object tag for caching but it does have the downside of either having to inline style the svgs or load a style sheet separately for each one
I do agree that getting all the awesomeness of FA for free was better, but I think that we have to agree that the quality and the scope of the project involved (and still involves) a ton of work. So it is just fair that the developer(s) of such great work is (are) remunerated for their time spent on the project.
Having this in mind, I think that FA has found a very nice equilibrium between paid and free.
Back to bootstrap, I'm impressed by their work, and this addition is yet another confirmation that the bootstrap team is awesome (pun not intended!)
You're being downvoted, but I find myself mostly agreeing with you -- FontAwesome was much more open and accessible in the early years, but have now been monetizing presumably rather successfully after their $1m+ Kickstarter campaign:
I guess I never really noticed in the corporate world because my old company would just pay the modest price for icon licenses, but on my own, I find myself a bit more weary to purchase a $99/year subscription just to play around with some of their nicer icons with my personal coding projects.
On the other hand, I do appreciate all the free icons they offer and how easy it is to access them!