mcharper / nextlify Goto Github PK

Using a screenreader it is not obvious that the links shown are actually menu items. Add role="menubar" and role="menuitem".

Switching between languages does not change URLs.

This is problematic because:

• it violates the principle that one resource has one unique address.
  • If a user copied the URL for a German page to send to a friend in Germany, the recipient would see an English page when visiting it
  • If the user bookmarks the URL for a German page, when they come back they'll see the English one
• if the translation was available to web crawlers then there might also be an SEO issue but it probably isn't, come to think of it, because of how I've implemented it ... raising a ticket for that ...

Possible calls to action:

• visit my LinkedIn profile
• download my CV (not currently an option)
• contact me (not currently an option!)
• find out more (about something)

How to make them crystal clear:

• use buttons
• use a contrasting colour for those
• make them the most prominent thing

Googlebot will never find my German version because:

• when visiting the site Googlebot will get the English version. It won't click on the button marked "Deutsch" so it won't get it that way.
• nothing else links to the German version and in fact it can't, because it doesn't have its own URL, so it won't find it that way

If a new user consents to analytical cookies, no data will be sent to GA until the next visit because the consent status does not have an event attached to load the GA code once consented.

(On the next visit, the consent setting in localstorage will indicate consent).

The Html lang attribute should reflect the language the current page is in otherwise:

• screenreaders won't use the right library and will pronounce stuff wrong
• user agents won't know whether to offer translation

It should change according to the current language.

In content files used to hold structured and unstructured content, HTML markup can be used in the unstructured part, but not in the structured front matter part. For example, in the below example, React is rendered on the page as React rather than as React in bold.

title: Home
leadParagraphs:

• header: Who are you?
  body: >
  A versatile full-stack developer with extensive industry experience. Over time I've gravitated more to the front end, preferring React and TypeScript.

Hamburger menu will be shown on a PC if the window is narrow enough. The user cannot tab to it though.