• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
0

What is better for web, bitmap or vector?

Participant ,
Jan 25, 2023 Jan 25, 2023

Copy link to clipboard

Copied

So I try to avoid bitmaps at all costs, because I want my graphics to look good on any screen size. Bitmaps can be heavy in file size too.

 

But what is better for the browser? I have animated graphics running 60fps and 30fps. The 60fps run extremly smooth, the 30fps are kinda janky. Both 30fps and 60fps lag sometimes, almost always on safari.

 

30fps graphic, janky slider: https://kartent-graphic-proef.marked-design.nl/

60fps graphic, really smooth: https://bikeflip.msgv.nl/

 

So two questions:

1. Is a 60fps animation something to always avoid for web?

2. Should I use bitmaps or vectors?

TOPICS
How to , Performance

Views

158

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Jan 25, 2023 Jan 25, 2023

Copy link to clipboard

Copied

24 or 30 frames is the best way to go, it's pretty much the standard. Vectors are always better than bitmaps. Vector will keep your files lighter. That's why Animate is so great because it works with vectors. 

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Jan 25, 2023 Jan 25, 2023

Copy link to clipboard

Copied

...and vectors scale without loss of fidelity (as you know). 

 

and in animate it's easy to convert a bitmap to a vector (modify>bitmap>trace bitmap).

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Jan 30, 2023 Jan 30, 2023

Copy link to clipboard

Copied

Hi.

 

1 - I always target everything I do at 60 fps. It's the standard and what feels most natural for the users.

2 - It's very likely that users will access your content on mobile devices. And for mobile devices bitmaps are the best option. It's good to present sharp vectors but it's even better to deliver an acceptable performance.

 

Of course these are my opinions.

 

Regards,

JC

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Jan 30, 2023 Jan 30, 2023

Copy link to clipboard

Copied

Thanks for the tip! I often make for desktop and mobile. So I keep the bitmaps in mind.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Jan 30, 2023 Jan 30, 2023

Copy link to clipboard

Copied

LATEST

Awesome!

 

So just let us know if you need further assistance.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines