events/2023-10-22-multilingual-websites
Multi-Lingual Personal Websites was a pop-up IndieWeb meetup on Zoom held on 2023-10-22.
- Archived from: https://etherpad.indieweb.org/multilingual-websites
Participants
capjamesgSara Jakša
Anthony Ciccarello
jo
Pablo Morales- Add yourself here… (see this for more details)
Notes
- Representing two languages on a home page
- Content length is a factor
- Teaser sections in both languages that expands to the respective languages
- Static vs. dynamic: how does that impact implementation?
- progressive enhancement
- Idea: different avatar pictures for different languages :)
- 11ty i18n Docs have lots of recommendations
- https://developer.mozilla.org/en-US/docs/Web/CSS/:lang may be relevant?
- Is the point to intentionally show two languages or to use a browser-set default and fall back to a canonical language?
- How would you pick a default language?
- Accept-Language header -- some sites might not handle it properly?
- Have a "switch to English/Scots/..."
- Blog post with section on language switcher design
- Denote if translations are human written or machine written
- Have a notice that says how proficient one is
- Using multi-lingual websites as a way to practice languages
- Does one say "I wrote in X then translated into Y"
- Blogging in different languages to help keep more obscure languages alive?
- Motivations for writing blog posts in different languages
- Practice
- Expected readership? (i.e. writing about Germany politics for a German audience may mainly be read by Germans?)
- Some things can only be expressed in certain languages
- How should different language posts appear in a feed?
- Could have a hierarchy (prefer x translation of a post, then show y)
- Could have separate feeds per language
- Post types might affect what users are okay with viewing (e.g. photos)
- Feed readers could/should have language filtering options
- Users don't always know how to set their post language
- Open question: how well does language detection work on posts of microblog length?
- Authoring applications should suggest post languages
- Filtering based on language could cause you to miss posts
- Do you announce when you start writing content in a new language?
- Is there a box that shows up that says a post is available in multiple languages? Should this surface in a feed?
- Could have a disclaimer on post in a language you are not fluent in.
- Say when adding external links if the page is in a different language
- There is a HTML attribute for destination language -- hreflang on links
- Target hreflang with CSS to manipulate link appearance (i.e. put a German flag on a link if the link destination is in German)
- Intersperse different languages in a post to help you convey a point that is easier to convey in a post?
- "Internet English" - the dialect of English used on the web
- Convey American vs. British vs. other dialects on one's blog?
- Language switchers should be as soon in the page as possible
- Helpful for screen readers
- Helpful for visual users
- How do screen readers handle alternate languages? (open question)
- <link rel=alternate hreflang> indicates when a site is available in other languages
- Google Search Language documentation
- Languages may involve more localization (i.e. dates, "written by")
- Set og:locale if you are using open graph
- Set <html lang=en/es/...> on a page
- HTTP Accept-Language Header
- Anthony Ciccarello's phone sends "en-US,en;1=0.9,es-US;q=0.8,es;q=0.7"
- Netlify language header redirect documentation
- Eleventy and Netlify Internationalization blog post
Pablo Morales uses a language setting for individual posts to differentiate for readers, search engines, etc to know that the page itself is another language
- RSS feed filter example
- Datenstrom Extensions (language) https://github.com/datenstrom/yellow-extensions
- Datentrom Multilingual sites example https://datenstrom.se/yellow/help/how-to-customise-a-language
- Country codes
- Example of a disclosure box at the start of an article (for audience, but design could be relevant): https://jamesg.blog/2023/08/03/swicg/
- SEO guidance: https://developers.google.com/search/docs/specialty/international/managing-multi-regional-sites
- Direction rtl/ltr: https://www.w3.org/International/questions/qa-html-dir
- Material Design Bidirectionality Docs have some good examples of how direction should affect the UI
- Also have General Language Typography Docs
- CSS Logical Properties allows defining CSS based on the reading direction
- https://www.w3.org/International/articles/vertical-text/
Captions & Subtitles (language) - https://developer.mozilla.org/en-US/docs/Web/Guide/Audio_and_video_delivery/Adding_captions_and_subtitles_to_HTML5_video