[PLUG] Web site programming

[John Jason Jordan]

Consider this a question from a total dumbass who knows zero about
website creation.

I want to create a website that will function as an electronic version
of flash cards. There would be a list of questions, each with a
drop-down selection tool. When the student has finished selecting the
answers for the page, there will be a button for "check answers."
Clicking on the button would then present the student with the
drop-downs showing the correct answer, and if the student selected the
wrong answer, it would show the correct answer in red. Perhaps a little
score box with a percentage correct would be nice as well.

There would be several hundred questions. Each time the student opened
the page it would present 20-30 or so selected at random from the
several hundred. Thus, the student would always be presented with a new
set of questions. The student could use the website to practice until
they finally get an acceptable score.

There is an additional problem to surmount: The drop-downs and some of
the text on the page must be displayed in a font that has a complete
set of characters for the International Phonetic Alphabet (IPA). There
are several available that are open source and freely distributable
(Junicode comes to mind). The problem I have discovered is that many
peoples' browsers do not display the characters properly. I have never
had a problem on my Linux computer, but I think it is because Firefox
and Opera both installed themselves with UTF-8 in the settings by
default. Or maybe it's because Ubuntu set UTF-8 as the default for the
whole operating system. I just know it works and I never had to mess
with anything to get it to work. I note at PSU computer labs the
browsers are set to Western-something, and they do not always display
the characters properly. Whatever it takes to get the students'
browsers to display the characters properly must be added as an
instruction page. That means that I need to figure out what settings
need to be fixed for each popular browser on each popular OS.

The first set of problems would contain questions like:

1. voiced alveolar stop        [ ]  <-- drop-down with IPA characters
2. voiceless velar fricative   [ ]  etc.

Other than needing the display the IPA characters correctly, I'm pretty
sure this is just a matter of tying a database with fields for the
"question" and for the IPA characters to the page. I have no idea how
this is done, but I assume I can learn it. However, I also want to make
a similar page where the "question" is a sound file, using the same IPA
character drop-downs as above. This may be a bigger problem. I know it
is possible to have sounds on a website -- there are lots of them out
there that I have been using. However, would it be possible to tie
several hundred sound files in a database for the questions, so that
the sound files would be presented randomly? In other words, in the
example above, instead of "voiced alveolar stop" and "voiceless velar
fricative" I want icons for sound files to be displayed. The student
would click on the icon, the sound clip would play in whatever plugin
they have installed in their browser, then the student would select the
correct IPA character from the drop-down. When finished the student
would click on the "check answers" button, etc.

I'm assuming that I have a long learning curve ahead of me to figure
out how to do all of this. But before I decide to spend winter break
learning website creation with databases, is the above possible? And
does anyone have hints for how to get browsers to display the
characters correctly?