Appease crawlers and embbeders

`<meta>` tags have been added to relay information for websites trying
to pull information from the page (like discord) as well as web crawlers
to index the page.
This commit is contained in:
Wolvan 2022-01-30 17:46:59 +01:00
parent afc7bbad01
commit 59f1c7db6e
6 changed files with 63 additions and 10 deletions

View file

@ -4,6 +4,19 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{{ TITLE }}</title> <title>{{ TITLE }}</title>
<meta name="description" content="Simple, free and open source way to host polls for people to vote on. Create your own polls and share them with others!">
<meta property="og:type" content="website" />
<meta property="og:title" content="{{ TITLE }}" />
<meta property="og:description" content="Simple, free and open source way to host polls for people to vote on. Create your own polls and share them with others!" />
<meta property="og:url" content="{{ CANONICAL_HOST }}" />
<meta property="og:image" content="" />
<meta property="og:site_name" content="Poll.Horse" />
<meta content="#FFD756" data-react-helmet="true" name="theme-color" />
<link rel="canonical" href="{{ CANONICAL_HOST }}" />
<meta name=”robots” content=”index,nofollow”>
<link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Caveat:wght@400;500;700&display=swap" rel="stylesheet"> <link href="https://fonts.googleapis.com/css2?family=Caveat:wght@400;500;700&display=swap" rel="stylesheet">
@ -18,7 +31,7 @@
<body> <body>
<header> <header>
<h1>Poll.horse</h1> <h1>Poll.horse</h1>
<h3>Make voting on things simpler</h3> <h2>Make voting on things simpler</h2>
</header> </header>
<main> <main>
<section class="error {{ FORM_SUBMISSION_ERROR_SHOWN_CLASS }}"> <section class="error {{ FORM_SUBMISSION_ERROR_SHOWN_CLASS }}">

View file

@ -4,6 +4,19 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{{ TITLE }}</title> <title>{{ TITLE }}</title>
<meta name="description" content="{{ POLL_META_DESCRIPTION }}">
<meta property="og:type" content="website" />
<meta property="og:title" content="{{ TITLE }}" />
<meta property="og:description" content="{{ POLL_META_DESCRIPTION }}" />
<meta property="og:url" content="{{ CANONICAL_HOST }}" />
<meta property="og:image" content="" />
<meta property="og:site_name" content="Poll.Horse" />
<meta content="#FFD756" data-react-helmet="true" name="theme-color" />
<link rel="canonical" href="{{ CANONICAL_HOST }}" />
<meta name=”robots” content=”noindex,nofollow”>
<link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Caveat:wght@400;500;700&display=swap" rel="stylesheet"> <link href="https://fonts.googleapis.com/css2?family=Caveat:wght@400;500;700&display=swap" rel="stylesheet">
@ -27,7 +40,7 @@
<body> <body>
<header> <header>
<h1><a href="/">Poll.horse</a></h1> <h1><a href="/">Poll.horse</a></h1>
<h3>Make voting on things simpler</h3> <h2>Make voting on things simpler</h2>
</header> </header>
<main> <main>
<section class="error {{ FORM_SUBMISSION_ERROR_SHOWN_CLASS }}"> <section class="error {{ FORM_SUBMISSION_ERROR_SHOWN_CLASS }}">
@ -49,7 +62,7 @@
<a href="/{{ POLL_ID }}/r"><button type="button">Results</button></a> <a href="/{{ POLL_ID }}/r"><button type="button">Results</button></a>
</section> </section>
</form> </form>
<aside id="qrcode"><img src="{{ QR_CODE }}"></aside> <aside id="qrcode"><img alt="QR Code to voting page" src="{{ QR_CODE }}"></aside>
</section> </section>
</main> </main>
<footer> <footer>

View file

@ -4,6 +4,19 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{{ TITLE }}</title> <title>{{ TITLE }}</title>
<meta name="description" content="{{ POLL_META_DESCRIPTION }}">
<meta property="og:type" content="website" />
<meta property="og:title" content="{{ TITLE }}" />
<meta property="og:description" content="{{ POLL_META_DESCRIPTION }}" />
<meta property="og:url" content="{{ CANONICAL_HOST }}" />
<meta property="og:image" content="" />
<meta property="og:site_name" content="Poll.Horse" />
<meta content="#FFD756" data-react-helmet="true" name="theme-color" />
<link rel="canonical" href="{{ CANONICAL_HOST }}" />
<meta name=”robots” content=”noindex,nofollow”>
<link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Caveat:wght@400;500;700&display=swap" rel="stylesheet"> <link href="https://fonts.googleapis.com/css2?family=Caveat:wght@400;500;700&display=swap" rel="stylesheet">
@ -21,7 +34,7 @@
<body> <body>
<header> <header>
<h1><a href="/">Poll.horse</a></h1> <h1><a href="/">Poll.horse</a></h1>
<h3>Make voting on things simpler</h3> <h2>Make voting on things simpler</h2>
</header> </header>
<main> <main>
<section class="poll-id">ID: {{ POLL_ID }}</section> <section class="poll-id">ID: {{ POLL_ID }}</section>
@ -37,7 +50,7 @@
<a href="/{{ POLL_ID }}"><button type="button" id="submit-button">Vote</button></a> <a href="/{{ POLL_ID }}"><button type="button" id="submit-button">Vote</button></a>
</section> </section>
<aside id="chart"></aside> <aside id="chart"></aside>
<aside id="qrcode"><img src="{{ QR_CODE }}"></aside> <aside id="qrcode"><img alt="QR Code to voting page" src="{{ QR_CODE }}" crossorigin></aside>
</section> </section>
</main> </main>
<footer> <footer>

View file

@ -21,6 +21,10 @@ body {
font-family: 'Caveat', cursive; font-family: 'Caveat', cursive;
} }
h2 {
font-size: 1.17em;
}
input[type="text"] { input[type="text"] {
width: 100%; width: 100%;
height: 100%; height: 100%;
@ -197,7 +201,7 @@ main .notepad .poll-footer button {
height: 50px; height: 50px;
border-radius: 10px; border-radius: 10px;
border: none; border: none;
background-color: #a8a8a8; background-color: #404040;
cursor: pointer; cursor: pointer;
font-size: 1.25em; font-size: 1.25em;
transition: background-color 0.2s; transition: background-color 0.2s;
@ -206,7 +210,7 @@ main .notepad .poll-footer button {
} }
main .notepad .poll-footer input[type="submit"]:hover, main .notepad .poll-footer input[type="submit"]:hover,
main .notepad .poll-footer button:hover { main .notepad .poll-footer button:hover {
background-color: #b6b6b6; background-color: #707070;
} }
#submit-button { #submit-button {

View file

@ -58,9 +58,9 @@ const defaultReplacements = {
"DEVELOPER_CONTACT_INFO": "developer@poll.horse", "DEVELOPER_CONTACT_INFO": "developer@poll.horse",
"FOOTER_COPYRIGHT": `© ${ (new Date()).getFullYear() } Based Department`, "FOOTER_COPYRIGHT": `© ${ (new Date()).getFullYear() } Based Department`,
"FOOTER_LINKS": ` "FOOTER_LINKS": `
<li><a href="https://github.com/Wolvan/poll.horse" target="_blank">Github Repo</a></li> <li><a href="https://github.com/Wolvan/poll.horse" target="_blank" rel="noreferrer">Github Repo</a></li>
<li><a href="https://www.mppp.horse/" target="_blank">/mppp/ - Mass Production plushies</a></li> <li><a href="https://www.mppp.horse/" target="_blank" rel="noreferrer">/mppp/ - Mass Production plushies</a></li>
<li><a href="https://www.pon3.stream/" target="_blank">Pon3.Stream</a></li> <li><a href="https://www.pon3.stream/" target="_blank" rel="noreferrer">Pon3.Stream</a></li>
`, `,
"SYSTEM_VERSION": ((): string => { "SYSTEM_VERSION": ((): string => {
try { try {
@ -149,6 +149,8 @@ export default function init(router: Router): void {
"BACKEND_BASE_PATH": (program.opts().backendBaseUrl || ""), "BACKEND_BASE_PATH": (program.opts().backendBaseUrl || ""),
"POLL_OPTION_VOTES": Buffer.from(JSON.stringify(Object.entries(poll.votes))).toString("base64"), "POLL_OPTION_VOTES": Buffer.from(JSON.stringify(Object.entries(poll.votes))).toString("base64"),
"QR_CODE": `https://chart.googleapis.com/chart?cht=qr&chs=190x190&chld=L|1&chl=${ encodeURIComponent(`${ req.protocol }://${ req.headers.host }/${ id }`) }`, "QR_CODE": `https://chart.googleapis.com/chart?cht=qr&chs=190x190&chld=L|1&chl=${ encodeURIComponent(`${ req.protocol }://${ req.headers.host }/${ id }`) }`,
"CANONICAL_HOST": req.protocol + "://" + (req.headers.host || "") + "/" + id + "/r",
"POLL_META_DESCRIPTION": xss(poll.title || "Simple, free and open source way to host polls for people to vote on. Create your own polls and share them with others!").substring(0, 150),
"CORS_SCRIPT_NONCE": res.locals.cspNonce "CORS_SCRIPT_NONCE": res.locals.cspNonce
}); });
} catch (error) { } catch (error) {
@ -187,6 +189,8 @@ export default function init(router: Router): void {
"FORM_SUBMISSION_ERROR": xss(req.query.error + ""), "FORM_SUBMISSION_ERROR": xss(req.query.error + ""),
"FORM_SUBMISSION_ERROR_SHOWN_CLASS": req.query.error ? "error-visible" : "", "FORM_SUBMISSION_ERROR_SHOWN_CLASS": req.query.error ? "error-visible" : "",
"QR_CODE": `https://chart.googleapis.com/chart?cht=qr&chs=190x190&chld=L|1&chl=${ encodeURIComponent(`${ req.protocol }://${ req.headers.host }/${ id }`) }`, "QR_CODE": `https://chart.googleapis.com/chart?cht=qr&chs=190x190&chld=L|1&chl=${ encodeURIComponent(`${ req.protocol }://${ req.headers.host }/${ id }`) }`,
"CANONICAL_HOST": req.protocol + "://" + (req.headers.host || "") + "/" + id,
"POLL_META_DESCRIPTION": xss(poll.title || "Simple, free and open source way to host polls for people to vote on. Create your own polls and share them with others!").substring(0, 150),
"CORS_SCRIPT_NONCE": res.locals.cspNonce "CORS_SCRIPT_NONCE": res.locals.cspNonce
}); });
} catch (error) { } catch (error) {
@ -221,6 +225,7 @@ export default function init(router: Router): void {
"FORM_OPTION_DIVS": pollOptionDivs, "FORM_OPTION_DIVS": pollOptionDivs,
"MAX_POLL_OPTIONS": MAX_POLL_OPTIONS, "MAX_POLL_OPTIONS": MAX_POLL_OPTIONS,
"MAX_CHARACTER_LENGTH": MAX_CHARACTER_LENGTH, "MAX_CHARACTER_LENGTH": MAX_CHARACTER_LENGTH,
"CANONICAL_HOST": req.protocol + "://" + (req.headers.host || ""),
"CORS_SCRIPT_NONCE": res.locals.cspNonce "CORS_SCRIPT_NONCE": res.locals.cspNonce
}); });
}); });

View file

@ -78,6 +78,11 @@ async function main(): Promise<void> {
await frontend.default(frontendRouter); await frontend.default(frontendRouter);
app.use("/static", express.static(resolve(__dirname, "../frontend/static"))); app.use("/static", express.static(resolve(__dirname, "../frontend/static")));
app.get("/robots.txt", (req, res) => res.send(`
User-Agent: *
Allow: /$
Disallow: /
`));
app.use("/", frontendRouter); app.use("/", frontendRouter);
} }