Blog - Firenibbler Studios

The latest and Greatest from Firenibbler Studios

What are the best resolutions for your HTML5 game?

Spread the love
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  

Hello everyone, I have had multiple people ask me what the best resolution for their online game is, and the answer is, it depends. Online games have a unique problem of choosing the resolution for your players, instead of matching it to their screen. Of course, there are many ways to match a resolution to a screen in HTML5, but many games don’t have the option.


(adsbygoogle = window.adsbygoogle || []).push({});

When a game is on most gaming websites, people expect the game to fit in with the content of the rest of the page. With that in mind, game developers often need to find just the perfect resolution for each of their online games. Today, I will be going over the pros and cons of building your game for many of the most popular resolutions used for online games.

480 X 320

480 X 320 is one of the most popular resolutions for mobile games, as it can match the screen size fairly well, and you don’t need to worry about performance all that much, as the screen size is too small. It is also okay for desktop and laptop based games that need to fin into a smaller area.

640 X 480

640 X 480 is a great resolution for smaller web games for desktop and laptops. It is still a little small, so will also work for most phones. You can easily scale the canvas to another size to achieve a full screen effect. Because it is so small, there is often very few problems rendering it.

800 X 600

800 X 600 is another resolution that is good for PC gaming. This resolution is mostly used when using games as web content as it is hard to scale to match a good resolution. It is much less friendly to mobile gaming as there are significantly more pixels to render then the previous two resolutions.

960 X 640

900 X 640 is a good smaller resolution for going full screen. It will also fit into most websites so long as there is ample room on each side of the game. This resolution is far too big for most mobile devices to handle. This resolution is also a wider screen resolution so will more easily fit on laptop screens.

1280 X 720

1280 X 720 is the same size as a lower quality HDTV This resolution is best if you plan for your game to go full screen. It would not fit well in most websites unless it has a dedicated page. It also scales well to most laptop and TV screens. This is the largest resolution most HTML5 games currently built will be able to support before frame rate will start dropping on most laptops.

 

1 Comment

  1. Nice observations/tips, thanks.

Leave a Reply

Your email address will not be published.

*