chess board

[Tidds]

Hey all. I'm goin nuts. I want, using html code, to design a chess board
on a page. A proper chess board. Alternat black and white squares. 8 rows
by 8 colums. I can find variations of a chess board and the code for it
using google, but I understand I can design a chess board using the table
tag. Any ideas ? Or give me a direction. Pu-lease. Taaa everso in
advance.

 

[Matthias Gutfeldt]

Hey all. I'm goin nuts. I want, using html code, to design a chess board
on a page. A proper chess board. Alternat black and white squares. 8 rows
by 8 colums. I can find variations of a chess board and the code for it
using google, but I understand I can design a chess board using the table
tag. Any ideas ?

You don't say how you want to use the board, so I'm not sure which
solution is optimal for your case.

Basically, you create a table with eight rows and eight columns, and
then 'decorate' it to look like a chessboard.

Two possibilities are here:
<http://gutfeldt.ch/matthias/temp/chessboard.html>. The first version
requires CSS enabled, which might not be the case in all browsers. The
second version requires the display of images, which againt might not be
the case in all browsers.

A "pure" HTML version would be to define both height and width for the
table cells with the deprecated height and width attributes.

Another solution would be to create the chessboard as an image and use
that image as a background for the table with CSS.

I think the 'best' solution depends on the intended use, and how you
want to display the chess figures in that chessboard.


Matthias

 

[Sid Ismail]

: Hey all. I'm goin nuts. I want, using html code, to design a chess board
: on a page. A proper chess board. Alternat black and white squares. 8 rows
: by 8 colums. I can find variations of a chess board and the code for it
: using google, but I understand I can design a chess board using the table
: tag. Any ideas ?


Tables is html code. Is.

Sid

 

[Jay]

: Hey all. I'm goin nuts. I want, using html code, to design a chess board
: on a page. A proper chess board. Alternat black and white squares. 8 rows
: by 8 colums. I can find variations of a chess board and the code for it
: using google, but I understand I can design a chess board using the table
: tag. Any ideas ?


Tables is html code.

Which can be learned by visiting
http://www.w3schools.com/html/html_tables.asp.

If you don't know HTML yet then visit
http://www.w3schools.com/html/default.asp.

- J

 

[Jukka K. Korpela]

You don't say how you want to use the board, so I'm not sure which
solution is optimal for your case.

I don't know that either, but I could imagine someone wanting to present
chess positions - but then the real question would be how to present the
pieces. Images are an obvious choice, but then the question really boils
down to asking whether it's better to present it as one image (with a
relatively lengthy alt text that lists the pieces and their positions).
Using Unicode characters is tempting but maybe not a practical approach.
Separate images would hardly be a good approach, since it's less efficient
than the single image approach.

Basically, you create a table with eight rows and eight columns, and
then 'decorate' it to look like a chessboard.

Yes indeed. But maybe not with black color, maybe better with something dark
but not black, especially if you're going to put pieces on the board later.

Two possibilities are here:
<http://gutfeldt.ch/matthias/temp/chessboard.html>.

If you use a table, then it should probably be marked up as a structural
table, with a summary attribute and maybe a header row and column (with
letters a, b, ..., h and digits 1, 2, ..., 8).

 

[Isofarro]

I don't know that either, but I could imagine someone wanting to present
chess positions - but then the real question would be how to present the
pieces. Images are an obvious choice, but then the question really boils
down to asking whether it's better to present it as one image (with a
relatively lengthy alt text that lists the pieces and their positions).

Chess has its own notation about piece set-up called Forsyth Notation, so a
one image for the board can be summed up in Forsyth Notation shorthand by a
much shorter alt text - less than 64 (Start position:
rnbqkbnr/pppppppp/8/8/8/8/PPPPPPPP/RNBQKBNR). Its quite succinct notation,
and good chess players don't have too much problem picturing a position
with just the notation.

When I did my chess stuff a few years ago I opted for a one image per
square, and I had a library of all combinations of pieces and square
colours. The shortest alt text is 64 characters - one character per image,
and a bit difficult to follow. Although I didn't use a table, just eight
images followed by a BR - bad for accessibility and structure. I would do
things differently today though, like Jukka suggests below.

If you use a table, then it should probably be marked up as a structural
table, with a summary attribute and maybe a header row and column (with
letters a, b, ..., h and digits 1, 2, ..., 8).

Considering algebraic notation is the dominant form of chess notation, yes
its a good idea.

 

[Toby A Inkster]

Chess has its own notation about piece set-up called Forsyth Notation, so a
one image for the board can be summed up in Forsyth Notation shorthand by a
much shorter alt text - less than 64 (Start position:
rnbqkbnr/pppppppp/8/8/8/8/PPPPPPPP/RNBQKBNR).

So may I suggest an image with the Forsyth notation as alt text and a
fuller description linked to via the longdesc attribute, and a "d" link as
not many (any?) browsers support longdesc?

For those who fancy a challenge, how about a CGI script (or other
server-side script) that can generate such an image and description from a
query string of the Forsyth notation of a board?

I might have a go of writing something like that later this week.

 

[Jukka K. Korpela]

So may I suggest an image with the Forsyth notation as alt text and a
fuller description linked to via the longdesc attribute, and a "d" link
as not many (any?) browsers support longdesc?

If the Forsyth Notation that Isofarro mentions is widely known among
expected users, and I suppose it could be, then indeed it's suitable as alt
text. Users appreciate concise alt texts as long as they are informative
enough. I wonder if the page should contain a link to a description of the
notation (some existing Web page, I presume) in a manner that hides it from
visual browsing with graphics enabled:
<a href="..."><img src="dummy.gif" alt=
"Forsyth Notation - a description of the chess board notation used in this
page"></a>
with dummy.gif being a transparent single pixel GIF. It could confuse people
who tab on a graphic browser, though, but probably not seriously.
Alternatively, you could have a normal textual link to the explanation and
Forsythe Notations as normal document content e.g. to the right of the chess
board image. They hardly hurt people who see the image. In this approach,
the images would have alt="" of course.

Unfortunately e.g. the page
http://www.chesscorner.com/tutorial/basic/forsyth/forsyth.htm
is useless for such a purpose. It looks very nice, but it has a chess board
situations as images with _no_ alt texts or completely pointless alt texts,
so it wouldn't help those people who need it in this context.

For those who fancy a challenge, how about a CGI script (or other
server-side script) that can generate such an image and description from
a query string of the Forsyth notation of a board?

That would be an interesting exercise, and it would be essentially simpler
if you use Unicode characters for the pieces. (You could then take a screen
capture and create the single image to be used on an actual HTML page,
perhaps with a link to the cool Unicode version there.)

 

[Toby A Inkster]

For those who fancy a challenge, how about a CGI script (or other
server-side script) that can generate such an image and description from a
query string of the Forsyth notation of a board?

have fun!

http://www.goddamn.co.uk/tobyink/scratch/chess/

 

[Isofarro]

have fun!

http://www.goddamn.co.uk/tobyink/scratch/chess/

Nicely and quickly done! Why not also accept %2F (a url-encoded slash) as
well as a . - then you can use a form and paste in Forsyth notation.

 

[William Tasso]

have fun!

http://www.goddamn.co.uk/tobyink/scratch/chess/

good work, nicely delivered ;o)

 

[Matthias Gutfeldt]

have fun!

http://www.goddamn.co.uk/tobyink/scratch/chess/

Cool! This is really nice, and quite easy to use. Are you going to
develop it further?


Matthias

 

[Toby A Inkster]

Cool! This is really nice, and quite easy to use. Are you going to
develop it further?

I will probably add the %2F thing Isofarro mentioned. I haven't been
thinking straight recently (bad cold => lack of sleep => mushy brain), or
else I would have thought of that myself.

Other than that, there's not really much else that I could think of adding.

 

[Leif K-Brooks]

Chess has its own notation about piece set-up called Forsyth Notation, so a
one image for the board can be summed up in Forsyth Notation shorthand by a
much shorter alt text - less than 64 (Start position:
rnbqkbnr/pppppppp/8/8/8/8/PPPPPPPP/RNBQKBNR). Its quite succinct notation,
and good chess players don't have too much problem picturing a position
with just the notation.

Do most voice readers show the difference between capital and lower-case
letters, though?

 

[Toby A Inkster]

Do most voice readers show the difference between capital and lower-case
letters, though?

That is a very good point, although having considered it, I have come to
conclusion that there is no statisfactory aural presentation for a chess
board.

Representing a chess board is a 2-dimensional problem, so requires a
2-dimentional solution. Sound is inherantly 1-dimensional medium.

It seems to me that the only way for a blind (or severly sight impaired)
user to metaphorically get a feel for a chess board would be to literally
get a feel for it.

One way of doing this would be format all the "p"s and "Q"s in a <pre>
element and visit the page in Lynx attached to a braille terminal.

 

[Jukka K. Korpela]

That is a very good point,

When faced with a string of characters that does not constitute a word, a
speech renderer typically (and hopefully) switches to reading characters by
their names. We can just hope that there is at least a user option to select
a reading mode that reads lowercase "p" as different from uppercase "P".

although having considered it, I have come to
conclusion that there is no statisfactory aural presentation for a chess
board.

Do you mean that you cannot describe a chess board position over the phone?
I'm sure you can. It's just a matter of finding the best way - and the
criteria depend on the recipient and the medium used. The alt text discussed
_is_ a linearized description, a compact one.

Representing a chess board is a 2-dimensional problem, so requires a
2-dimentional solution. Sound is inherantly 1-dimensional medium.

The world has 3 dimensions if not more, and still we communicate here using
text, which is essentially linear sequences of characters - the line
structure is not particularly relevant (and can be described in terms of a
linear structure by treating newlines as special characters).

It seems to me that the only way for a blind (or severly sight impaired)
user to metaphorically get a feel for a chess board would be to literally
get a feel for it.

Actually even many people with normal vision are able to play "blind chess".
But I can't tell how a person who was born blind can "visualize" chess.

One way of doing this would be format all the "p"s and "Q"s in a <pre>
element and visit the page in Lynx attached to a braille terminal.

No, I don't think that would be an improvement, and Braille rendering
normally does not involve using Lynx.

 

[Isofarro]

Do you mean that you cannot describe a chess board position over the
phone?

There are a few ways - based mainly on the level of experience of the
players. One way is to refer to a well-known game and say - the position
after White's 22nd move. The second way is to identify patterns in the
arrangement of pieces - jargon like "isolated d-pawn", "kingside
fianchetto". The third way is to start from a known position and recite a
series of moves that lead to the required position. As the level of
experience reduces we start opting for listing the positions of all white
pieces, followed by Black's. Typically we use this for endgame positions
(where there are very few pieces on the board), For example:

White: Ke1, e4, d4
Black: Kh8, h7

(where a piece isn't mentioned, such as "e4", then it is taken to be a
pawn). There isn't a straightforward way of describing board positions over
the phone. Its typically a mixture of the above, and depends largely on the
number of pieces or how "standard" the position is.

Actually even many people with normal vision are able to play "blind
chess".

I've tried it a few times - did it once playing two blindfold games
simultaneously. I tried using patterns and move order to remember the
position, rather than try to remember the position of every piece.

Some grandmasters have done up to 28 games simultaneously blindfold - an
amazing feat. I think they do it by breaking up each position into
memorable patterns and how it differs (or matches) other known games.

Its been said by chess commentators that the level of mental effort used
during a high-level chess game (like a World Championship) on one move is
the equivalent of doing the New York Times crossword puzzle in your head. I
can't do crosswords, so that must be awesome.

But I can't tell how a person who was born blind can "visualize"
chess.

I've played one blind person, and watched a few others, in tournament
conditions. They use a braille chess set - pieces are pegged into the
board. Black squares are raised higher than the white ones. They feel the
pieces to identify each one, and the black pieces tend to have an extra
metallic bulge on the top for ease of identification. When playing my move
I had to recite the move to my opponent in algebraic, and they would make
that move on their board.

So I guess its a combination of memory, aurual, and touch.

 

[Toby A Inkster]

Do you mean that you cannot describe a chess board position over the phone?
I'm sure you can.

I didn't say that it couldn't be done -- just that any solution (that I
can think of) is unsatisfactory IMHO.

Perhaps my spacial awareness is not up to scratch.

 

[Greg Griffiths]

There is a series of web chess articles listed at
http://www.greggriffiths.org/books/