/    Sign up×
Community /Pin to ProfileBookmark

Restructuring site with lots of images/audio, requesting advice/direction

I’m not sure if this is the best place to be asking this. If not, maybe someone can point me in the right direction.

[B]Background:[/B]

I’m currently building a website for music students who want to work on training their ear. More specifically, the site consists of hundreds (eventually thousands) of recorded melodies for users to practice transcribing music into musical notation. Here’s what I have so far: [URL=”http://trainedear.net/”]http://trainedear.net/[/URL] (specifically: [URL=”http://trainedear.net/exercises.html”]http://trainedear.net/exercises.html[/URL])

Generally speaking, the way a user interacts with the site is as follows:

[LIST]

  • [*]

    the user is shown an image with preliminary information as well as audio players for the recording and other information


  • [*]

    the user then listens to the recording several times while writing it down on a piece of paper


  • [*]

    the user then clicks to swap the original image with a different image containing the answer


  • [/LIST]

    I’m using SoundManager2 for the audio players and a few bits of pilfered/modified/attributed javascript for a couple of other features.

    [B]The problem:[/B]

    Right now, I have all of the exercises on one overly large page. Even though none of the images are initially visible, I’m fairly certain they’re all still loading. Even if they weren’t, the page is very cumbersome (and intimidating to users) because of its size.

    Given the organization of the material, I could easily break the one page up into smaller pages, but I’m wondering if maybe I’m going about this all wrong.

    [B]The question:[/B]

    Would it be possible and/or preferable to structure this content some other way? Perhaps using javascript (or something else?) to write the HTML dynamically after the user selects a specific exercise from a drop-down list? Or something like that?

    If anyone has any ideas or advice, I’m all ears. I’m not looking for hand-holding, by the way (I’m fairly new to all this, but eager to jump in), just a bit of direction or maybe some Google search terms!

    [B]Further issues:[/B]

    I’m envisioning that I’ll be adding content to the site in the future. So I’d like to structure everything in such a way that it would be easily expanded.

    [B]Thanks![/B]

    to post a comment
    JavaScript

    0Be the first to comment 😎

    ×

    Success!

    Help @amount11777 spread the word by sharing this article on Twitter...

    Tweet This
    Sign in
    Forgot password?
    Sign in with TwitchSign in with GithubCreate Account
    about: ({
    version: 0.1.9 BETA 6.17,
    whats_new: community page,
    up_next: more Davinci•003 tasks,
    coming_soon: events calendar,
    social: @webDeveloperHQ
    });

    legal: ({
    terms: of use,
    privacy: policy
    });
    changelog: (
    version: 0.1.9,
    notes: added community page

    version: 0.1.8,
    notes: added Davinci•003

    version: 0.1.7,
    notes: upvote answers to bounties

    version: 0.1.6,
    notes: article editor refresh
    )...
    recent_tips: (
    tipper: @nearjob,
    tipped: article
    amount: 1000 SATS,

    tipper: @meenaratha,
    tipped: article
    amount: 1000 SATS,

    tipper: @meenaratha,
    tipped: article
    amount: 1000 SATS,
    )...