One of my client must be able to post News to both french and english language on his website. I would like to know how I should design the CMS to be the most convenient for the admin as possible.
Below is captures of what I thought would solve the problem but I doubt it's the best way to do it as I am no UX expert.
I would like your advices on that if possible.
Vertical workflow is more natural than horizontal unless the user is comparing content side-by-side. Moreover, horizontal arrangement requires users to have very wide monitors to work comfortably. Finally, there's no need to force users into a particular sequence of languages - let them decide what version is going to be posted first.
Thus, the mock-up will look like this:
Note that the radio buttons should be listed vertically despite the available space in the line (unless you have multiple columns of languages) and that the "Add translation" button should be placed closer to the editor than to the publishing controls.
Clicking "Add translation" (or whatever you want to call it) should duplicate the language selector and the editor controls right above the button so that the publishing controls stay separate from the editor.
You can populate English by default based on your users.
So we can move to top for other language option, then we populate the other editor options like below Image.
You can remove the "preview option" if you have "preview" button after the submit.
I've designed one that handles this case quite elegantly (see my profile). Typically when visiting a website you have the URL dictate the language of the website. This is necessary for good SEO as each page has it ensures each language version has its own unique URL. For example US English would be region prefixed with "/en-us/my-page" and France French would be "/fr-fr/my-page" or something like that. I can't remember the French ISO code so forgive my mistake, if so.
I do websites that have dynamic URLs so they are actually all going to the same source file for the second part of the URL after the language prefix yet they have a masking of the URL. For example, the two URLs that have "my-page" above will be mapped to a single "my-page.cshtml" code page that is handled. The region is determined by parsing the URL first directory as a parameter and using that as a prefix to any content ID that I pull. Say there is a title on each page. For the "my-page", you would have a title content id of "en-us-my-page-title" and another "fr-fr-my-page-title" for example.
What I did really has not been done before for programmatic websites. It removes the need for an admin altogether and combines visiting the website and navigating it as you normally would yet having the capability to edit it in place. It combines the usability of PageLime but in a feed-like, HTML5 way built for large-scale programmatic and dynamic websites. It's completely different. If you want to try building something that is truly a cut above, try that approach.
