I want to create a web-based board game like reversi. I created a similar game in python before but now I want to try to implement it using javascript/jquery/html/css.
The main thing I’m wondering about is how to set up the GUI for the board game in the browser? I have two ideas. One, create an html table structure containing 64 cells. Second, create 64 floating divs.
I realize that for the layout of a website, tables are unreliable and inconsistent across browsers but in the case of a game like this, would a tabular setup be easier to work with?
For something like reversi, I think a table is appropriate — beyond the visuals, it’s a decent semantic representation of the content, i.e. the state of the game board. (
<div>s wouldn’t perform the same job, as they don’t represent the relationship between rows and columns.)I’d expect a table to be as easy to work with as
<div>s: possibly slightly easier, as you don’t have to write any CSS to get the two-dimensional layout, although you might have to use slightly more code to generate the HTML, depending on how you’ve got the game modelled in code. (E.g. If you’ve already modelled the game as cells within rows, it’s easy. If not, you’ll have to keep track of that in code when generating the HTML.)