mkl 5 years ago

"Do not resell or redistribute the icons, even for free." But they gave them the MIT License, which explicitly allows those things...

  • mikolajdobrucki 5 years ago

    You're right, this didn't make any sense. I updated the README accordingly. Sorry for the confusion!

    • ivanhoe 5 years ago

      You also have a little typo in README, under License: "Attribution IN much appreciated", instead of IS

      • mikolajdobrucki 5 years ago

        Thanks a lot, next this will fix this one too!

    • HenryBemis 5 years ago

      Great work, and I will probably be using your icons on my app. Is there a Paypal 'donate' button (that I cannot find)?

  • bjelkeman-again 5 years ago

    Thanks to the person who added this as an issue on the repo. I was going to do it, but it was already done.

  • giornogiovanna 5 years ago

    Yeah, I think they'd be better served by something like `CC BY-ND 4.0`.

  • stephenr 5 years ago

    This is just bizarre. Picking “MIT” because it sounds cool?

    I cannot understand how the authors think this is valid.

jlg23 5 years ago

I only checked a few raw icons and I am impressed: They are fully stripped of superfluous markup introduced by SVG editors; that was something which I had to implement over and over again for customers' build pipelines.

Also, the possibility to download a custom styled set is great: With all other icon sets I ended up either modifying them myself in a text editor or received a bunch of modified files from the graphics person in the project - but bloated with markup I needed to strip afterwards (see first point).

  • scotth 5 years ago

    Are you familiar with svgo?

    • jlg23 5 years ago

      Yes, but my clients usually don't want to add node to their infrastructure (I do CL) and, after all, the basic cleaning of SVGs is simple: Filter XML with a whitelist of namespaces.

tribby 5 years ago

> Ikonate is the very first icon set of this kind designed to be fully accessible*

> * Ikonate is NOT accessible out of the box and will never be. We've done our best to follow the best accessibility practices while building this software, but it's your role to adjust it and make it truly accessible inside your project.

these are incompatible statements. the author should just not call it accessible.

also -- why "will never be"? there are ways to make it more accessible, if not perfect. one idea: turn the icons into a truetype GX variable font with a weight axis that increases as viewport size decreases using media queries. that would increase out of the box legibility considerably.

  • Nadya 5 years ago

    I handle ADA issues at work and deal with updating sites to adhere to WCAG 2.0. So perhaps I can offer my $0.02 and clear this up.

    It is actually impossible for anything to be accessible out-of-the-box, but they have been designed to be accessible and have sane defaults. Those statements do not contradict one another.

    For example, if you use a magnifying glass icon to mean "zoom" but their default title text for a magnifying glass is "search" then it is not out-of-the-box accessible even though it was designed to be fully accessible. They even mention this scenario (generically, not specifically) in their disclaimer.

    >E.g. all the titles and descriptions given to the icons should be treated as placeholders and changed in implementation depending on an actual role of each icon. In many cases, you may not need them altogether

    Having the placeholders there is questionably good - it would be better to have the attributes there but blank in my opinion. It will do more harm than good being wrong than being blank, but that's a difference in preference for implementation.

    • mikolajdobrucki 5 years ago

      You're right that placeholder may do more harm than good and it's questionable if it makes any sense. Still considered it a better option though at that point

      • darekkay 5 years ago

        As an accessibility advocate, I always highly appreciate accessibility-first libraries. Thank you :)

        I agree with Nadya. Wrong or false labels do in fact cause more harm than good. I understand that you want to provide sane default, but I would rather encourage people to edit the labels themselves (maybe add a message box somewhere).

        I've also tested an example icon with Firefox + NVDA (inline SVG), which leads to the following screen reader announcement:

            Add Icon of a plus sign enclosed in a circle  graphic
        
        This has multiple issues from the accessibility perspective:

        1. IF you are using a title + description, use aria-labelledby for the main label (= title) and aria-describedby for the description. Right now there is no separation and both labels will be read without a pause, making no sense (what is an "add icon of a plus sign .."?).

        2. I would advice against using a description altogether. A screen reader user does not care about how the icon looks. He/she cares about the action it performs. So here, "Add" (depending on the context) is more than enough. As a general tip: Screen reader users should have access to the same information as sighted users. That's why we don't describe decorative images for example (alt=""), because there is no information behind it.

        3. "Icon of" is unnecessary. As you can see in the NVDA output, when using "role=img" the user already knows it's an graphic. Hence, "Icon of" or "Image of" should not be used in image descriptions.

        4. Keep in mind, there are still some issues with SVGs and screen readers to think about [1]. Therefore I also prefer to use the labels on the enclosing elements (buttons, links) instead.

        I hope, you find my tips helpful. Keep up the good work!

        [1] https://haltersweb.github.io/Accessibility/svg.html

      • Nadya 5 years ago

        Would need data about whether or not people are more or less likely to

        1) Add text when it is missing but the attribute is there to serve as a reminder

        OR

        2) Change text when it is wrong

        Neither one is "wrong" but one might be better than the other.

        • mikolajdobrucki 5 years ago

          100% agree. Right then I was just blindly guessing ;)

wodenokoto 5 years ago

Kinda related: It seems clipart died with Google image search and the only alternatives I can find are things like the noun project[1] or fontawesome[2] both of which require a subscription, rather than a purchase, and neither really fills that clip art use-case.

I'd love to purchase a clipart set like in the old 90's days of power point.

[1] https://thenounproject.com/accounts/pricing/

[2] https://fontawesome.com/pro

dlbucci 5 years ago

Really cool! I kinda wish I had thought of it :) Any thoughts to adding further parameterization to icons? Like altering the length of the handle of the magnifying glass or something?

  • docuru 5 years ago

    Hey, I share the project but I'm not the author, I just think it's pretty cool too

pzo 5 years ago

Nice collection. Would be nice to easily create icon with just any text similar to already included HDR icon to accommodate e.g. ISO, WB, I/O, HD etc

billfruit 5 years ago

I can't find a link to it, but I remember reading a discussion, that if you want icons/images for fixes known sizes and resolutions, it is better to have rasters than vectors: I think, mostly to do with scaling of line weights/widths, vector scaling of these often results in ungainly images while a raster of a given native resolution looks clearer/better more proportionate.

  • sjwright 5 years ago

    To the extent that might have ever been true, it would have been because of the limitations of very low resolution displays, or to work around limitations in the vector rasterizer.

    In any modern context, a vector is always preferable as it will generate the best output for an unlimited number of sizes, resolutions and contexts.

    • billfruit 5 years ago

      The question may have been the scaling of line widths in a linear fashion while using vector images, which isn't that pleasing to the eye, compared to a hand crafted raster with more eye pleasing line width for a give size/resolution. May for aesthetic reasons line widths may require to be scaling in a nonlinear way?

      Scaled vectors will have mathematically correct line widths, but to a human perception the line may appear to thick/thin for the image size, than which a raster artist would have used if they were creating a native raster of that size.

      • raphael_l 5 years ago

        But the scaling of bitmaps would have the same problems, wouldn't they? Or do you mean custom icons per given resolution/size?

        • billfruit 5 years ago

          I meant that custom unscaled raster icons per resolution/size looks better than a scaled vector image.

docuru 5 years ago

Thanks for all the feedback, I tweeted the author about HN link, and someone has created a thread on GitHub. Hopefully, it will help him clear things up about the license. I believe it is not his intention to confuse us. Anyway, it is a cool tool and big thumbs up for the author!

  • mikolajdobrucki 5 years ago

    Thanks a lot for the heads up! It's fixed, I already updated the README. Sorry for the confusion caused.

hgasimov 5 years ago

Obviously very nice looking icons. It would be even better to be able to download them as font. Then one can customise the icons later on his/her own website using CSS (text-color, background-colour, font-size, etc).

baxtr 5 years ago

I played around with it and have to say that this is just great. The only option that I did not understand since it didn't change anything was the "style" button. What is that for?

  • illuminati1911 5 years ago

    Rounding (or not) the edges/corners of the objects within the icon.

    • ltc5505 5 years ago

      Did the button work for you? It didn't for me.

      • X-Istence 5 years ago

        Set the size of the icons really large, and then switch between the options, it does affect them, but very very minimally.

kowdermeister 5 years ago

This is pretty neat, cool name, it goes to my loved bookmarks :)

One thing though I don't get is the 0 border width setting. Is that useful somehow?

  • Hendrikto 5 years ago

    Afaik, its a workaround for IE.

aasasd 5 years ago

Note that there's a vaguely popular site named ‘icons8’ on about the same topic, so some confusion might ensue in the future.

  • HenryBemis 5 years ago

    Heh, I wonder if Mikolaj will respond to this comment. I don't think it's a coincidence. Some spill-off traffic never hurts. Although the icon8 owner may frown upon this.

arusahni 5 years ago

There's a certain irony in having the link to the accessibility disclaimer be so hard to target.

Elect2 5 years ago

off-topic question: what library the site is using for these icons: https://imgur.com/a/GVVi3TQ , I really like 3d icons.

  • highesttide 5 years ago

    Those look like standard OS font emoji

    • tornadon 5 years ago

      More specifically the ones in that screenshot look like the versions you’d find on iOS/macOS. Just thought I’d mention it in case someone was viewing it with say an Android device it would look different [1].

      [1] https://emojipedia.org/hammer-and-pick/

shemeroni 5 years ago

Pretty cool. Will use it in my projects for sure. Thanks mikolajdobrucki :)

hgasimov 5 years ago

Oh, wow. Thanks a lot to the owner of this web site.

8lall0 5 years ago

Nice job! The spritesheet is the best!

mezod 5 years ago

what would be the most reasonable way to "fill" these icons?

  • nacs 5 years ago

    You'd have to do that manually with Adobe Illustrator/Sketch/Affinity Designer or some similar vector editing software.

    The Github has the raw SVGs you can download and edit.

    • mezod 5 years ago

      Thanks!

cpalmer6996 5 years ago

Can you hack my boyfriend gmail

cpalmer6996 5 years ago

Can you hack my boyfriends email