diff --git a/components/nav/NavFooter.vue b/components/nav/NavFooter.vue
index f50c9fe661c..54471406005 100644
--- a/components/nav/NavFooter.vue
+++ b/components/nav/NavFooter.vue
@@ -34,7 +34,7 @@ function toggleDark() {
       </CommonTooltip>
     </div>
     <div>
-      <NuxtLink to="/about" target="_blank">
+      <NuxtLink to="/about">
         About
       </NuxtLink>
       &middot;
diff --git a/components/settings/SettingsAbout.vue b/components/settings/SettingsAbout.vue
index 6234f06d1a2..739f0a4606b 100644
--- a/components/settings/SettingsAbout.vue
+++ b/components/settings/SettingsAbout.vue
@@ -6,7 +6,7 @@ const { t } = useI18n()
 
 const subtitle = t('about.subtitle')
 const administered_by = t('about.administered_by')
-const contact = t('about.contact', [instance.contact.email])
+const contact = t('about.contact', [`<a href="mailto:${instance.contact.email}">${instance.contact.email}</a>`])
 const server_rules = t('about.server_rules')
 const footer_about = t('about.footer_about')
 const footer_profiles_directory = t('about.footer_privacy_notice')
@@ -34,9 +34,7 @@ const footer_view_code = t('about.footer_view_code', [instance.version])
 
       <AccountCard :account="instance.contact.account" />
 
-      <div p-t-2>
-        {{ contact }}
-      </div>
+      <div p-t-2 class="content-rich" v-html="contact" />
     </div>
 
     <div m-b-5 b-t-1px p-t-5 class="content-rich" v-html="content" />