[LANDING] Quick fix, blog script overwrote this file.
This commit is contained in:
Eliseu Amaro
parent
0d8aa92234
commit
94e9fac122
230
index.html
230
index.html
|
|
@ -1,111 +1,137 @@
|
||||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
<!DOCTYPE html>
|
||||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
<html lang="en">
|
||||||
<meta http-equiv="Content-type" content="text/html;charset=UTF-8" />
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
||||||
<link rel="stylesheet" href="main.css" type="text/css" />
|
|
||||||
<link rel="stylesheet" href="blog.css" type="text/css" />
|
|
||||||
<link rel="alternate" type="application/rss+xml" title="Subscribe to this page..." href="feed.rss" />
|
|
||||||
<title>My fancy blog - My fancy blog</title>
|
|
||||||
</head><body>
|
|
||||||
</div></div></div>
|
|
||||||
<div id="template-wrapper"><div class="template-unit">
|
|
||||||
<h3><a class="ablack" href="updates-interface-and-accessibility.html">
|
|
||||||
Updates: Interface and accessibility
|
|
||||||
</a></h3>
|
|
||||||
<!-- bashblog_timestamp: #202109131730.12# -->
|
|
||||||
<div class="subtitle">September 13, 2021 —
|
|
||||||
John Smith
|
|
||||||
</div>
|
|
||||||
<!-- text begin -->
|
|
||||||
|
|
||||||
<p>Hello everyone! Throughout the past year there has been a lot of work in creating a polished, modern looking UI.
|
<head>
|
||||||
This update has been in the works for a long time… Many considerations had to be done, and given the current state of
|
<meta charset="utf-8">
|
||||||
modern browsers (and their over-reliance in JS) many more surfaced, leading to further testing and fixes.</p>
|
<meta name="viewport" content="width=device-width, initial-scale=0.86, maximum-scale=5.0, minimum-scale=0.86">
|
||||||
|
<meta name="description" content="GNU social; A free software social networking platform.">
|
||||||
|
<title>GNU social — a free software social networking platform</title>
|
||||||
|
<link rel="shortcut icon" href="favicon.ico">
|
||||||
|
<link rel="stylesheet" href="assets/css/style.css">
|
||||||
|
<link rel="stylesheet" href="assets/css/reset.css">
|
||||||
|
<link rel='stylesheet' type='text/css' href="assets/fonts/opensans/opensans.css">
|
||||||
|
</head>
|
||||||
|
|
||||||
<p>We hope you like it!</p>
|
<body>
|
||||||
|
<header class="header">
|
||||||
|
<div class="home-menu menu menu-horizontal menu-fixed">
|
||||||
|
<a class="menu-heading" href="https://gnusocial.rocks/">
|
||||||
|
<img src="https://www.gnusocial.rocks/assets/img/gnu-social-logo-invert.svg" alt="GNU social">
|
||||||
|
</a>
|
||||||
|
<ul class="menu-list">
|
||||||
|
<li class="menu-item menu-selected"><a href="#" class="menu-link">Home</a></li>
|
||||||
|
<li class="menu-item"><a href="v2/" class="menu-link">Version 2</a></li>
|
||||||
|
<li class="menu-item"><a href="v3/" class="menu-link">Version 3</a></li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<div class="body-wrapper">
|
||||||
|
<div class="splash-container">
|
||||||
|
<div class="splash">
|
||||||
|
<div class="splash-head">
|
||||||
|
<img src="assets/img/gnu-social-logo.svg" alt="GNU social">
|
||||||
|
<b>gnu</b>social
|
||||||
|
</div>
|
||||||
|
<p class="splash-subhead">
|
||||||
|
The free software social networking platform.
|
||||||
|
</p>
|
||||||
|
<!--
|
||||||
|
<a href="communities/" class="button button-primary">Join</a>
|
||||||
|
<a href="v2/" class="button button-primary">Version 2</a>
|
||||||
|
-->
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="content-wrapper">
|
||||||
|
<div class="content">
|
||||||
|
|
||||||
<h3>The prime directive</h3>
|
<h1 class="content-head">Features</h1>
|
||||||
|
|
||||||
<blockquote><p>Modern looking, consistent and accessible UI across all browsers.
|
<div class="g">
|
||||||
Non-JS version as the primary focus, <strong>JS is optional</strong> and should be regarded as such.</p></blockquote>
|
<div class="l-box u-1 u-md-1-2 u-lg-1-4">
|
||||||
|
|
||||||
<p>The Web is 95% typography, the art and technique of arranging type to make text more readable and pleasing.
|
<h3 class="content-subhead">
|
||||||
To achieve this, a textual hierarchy is fundamental, text should present a clear, readable structure to the reader.
|
Versatile
|
||||||
In much of the same fashion, the way we perceive Web pages relies upon the same fundamentals. As such, by focusing on the
|
</h3>
|
||||||
markup, we hope to achieve an accessible, fast and polished structure by which any browser and screen reader relies upon.</p>
|
<p>
|
||||||
|
GNU social supports both single-user and community modes and can be used in an intranet environment or as part of the wider Free Network.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div class="l-box u-1 u-md-1-2 u-lg-1-4">
|
||||||
|
<h3 class="content-subhead">
|
||||||
|
Accessible
|
||||||
|
</h3>
|
||||||
|
<p>
|
||||||
|
Follows AnyBrowser and A11Y guidelines. It runs virtually anywhere you can run a common piece of web software, such as WordPress or Drupal. JavaScript is optional.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div class="l-box u-1 u-md-1-2 u-lg-1-4">
|
||||||
|
<h3 class="content-subhead">
|
||||||
|
Customizable
|
||||||
|
</h3>
|
||||||
|
<p>
|
||||||
|
True to the Unix-philosophy of small programs to do a small job, GNU social can be easily expanded and customized via its simple plugin API.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div class="l-box u-1 u-md-1-2 u-lg-1-4">
|
||||||
|
<h3 class="content-subhead">
|
||||||
|
Privacy focused
|
||||||
|
</h3>
|
||||||
|
<p>
|
||||||
|
GNU social is part of the GNU project, it's 100% free software, with no malicious features or spyware.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="ribbon-wrapper">
|
||||||
|
<div class="ribbon">
|
||||||
|
<img alt="Decentralized social network." src="assets/img/connections-gordon-johnson-pixabay.svg">
|
||||||
|
<div class="ribbon-content">
|
||||||
|
<h1 class="content-head content-head-ribbon">Where can I join GNU social?</h1>
|
||||||
|
|
||||||
<h3>Features</h3>
|
<p>There are many kinds of GNU social server instances online right now!</p>
|
||||||
|
<p><a href="communities/">Click here</a> to see a list of popular GNU social sites you can join!</p>
|
||||||
|
<em><b>Disclaimer:</b> Please note that the GNU social development team is not responsible for
|
||||||
|
the operation or content of sites that run its software.</em>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<ul>
|
<div class="content-team">
|
||||||
<li>Accessible
|
<h1>Support the team making GNU social possible!</h1>
|
||||||
|
<div class="g">
|
||||||
|
<div class="l-box-lrg u-1 u-md-1-3">
|
||||||
|
<h3>Who makes GNU social?</h3>
|
||||||
|
<p>Many developers have been involved in the making of GNU social. It's hard to keep a precise record of so many valuable contributions.</p>
|
||||||
|
<p>Version 3 development is being maintained by <a href="https://www.diogo.site/">Diogo Cordeiro</a>, <a href="https://hsal.es/">Hugo Sales</a> and <a href="https://eliseuama.ro/">Eliseu Amaro</a>.</p>
|
||||||
|
<p>Version 2 development was maintained by <a href="https://www.diogo.site/">Diogo Cordeiro</a> with many important contributions from <a href="https://loadaverage.org/XRevan86">Alexei Sorokin</a> and the help of <a href="soc/">Summer of Code students</a>.</p>
|
||||||
|
<p>The project started with <a href="https://mat.tl/">Matt Lee</a> and StatusNet with <a href="https://en.wikipedia.org/wiki/Evan_Prodromou">Evan Prodromou</a>. It was since been maintained by <a href="http://mmn-o.se">Mikael Nordfeldth</a>.</p>
|
||||||
|
<p>A list of contributors is available <a href="https://code.undefinedhackers.net/GNUsocial/gnu-social/src/branch/experimental/CREDITS.md">here</a>.</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
<ul>
|
<div class="l-box-lrg u-1 u-md-1-3">
|
||||||
<li>Easy to use keyboard only navigation
|
<h3>Discuss</h3>
|
||||||
|
<p>Discuss the project on:<br>
|
||||||
|
XMPP: <a
|
||||||
|
href="xmpp:gnusocial@conference.bka.li?join">xmpp:gnusocial@conference.bka.li?join</a>,<br>
|
||||||
|
IRC: <a
|
||||||
|
href="ircs://irc.libera.chat:6697/#social">ircs://irc.libera.chat:6697/#social</a> or<br>
|
||||||
|
Matrix: <a
|
||||||
|
href="https://matrix.to/#/#social:libera.chat">#social:libera.chat</a>.</p>
|
||||||
|
<p>Contribute code, report bugs and request features on our <a href="https://notabug.org/diogo/gnu-social">repository</a>.</p>
|
||||||
|
<p>You can also ask for help on our <a href="https://lists.gnu.org/mailman/listinfo/social-discuss">mailing list</a>.</p>
|
||||||
|
<p>If you are a student you can also apply to <a href="/soc">GNU social's Summer of Code</a>.</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
<ul>
|
<div class="l-box-lrg u-1 u-md-1-3">
|
||||||
<li>Feedback on focused elements</li>
|
<h3>Tell Others</h3>
|
||||||
<li>Keyboard shortcuts to access main regions</li>
|
<p><a href="assets/tgz/logos.tar.gz">gs-logos.tar.gz</a> (14.2 kB)</p>
|
||||||
<li>Vi-like shortcuts</li>
|
</div>
|
||||||
</ul>
|
</div>
|
||||||
</li>
|
</div>
|
||||||
<li>Screen reader tested
|
</div>
|
||||||
|
</div>
|
||||||
<ul>
|
<footer class="footer l-box is-center">
|
||||||
<li>Notifies the user when focusing on key elements, such as the feed, notes and actions</li>
|
This site's source is <a href="https://code.undefinedhackers.net/GNUsocial/gnusocial.rocks">hosted here</a>.
|
||||||
<li>Brief description of navigation links</li>
|
</footer>
|
||||||
<li>Using semantic HTML whenever possible</li>
|
</body>
|
||||||
</ul>
|
</html>
|
||||||
</li>
|
|
||||||
<li>Special care given for styling solutions that could break accessibility</li>
|
|
||||||
<li>Colors and type sizes in accordance to W3C contrast guidelines
|
|
||||||
|
|
||||||
<ul>
|
|
||||||
<li>Chosen specifically blue-ish and grey-ish hues for faster page loading perception</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li>Fast, the content provided to the user really is just markup and some CSS rules
|
|
||||||
|
|
||||||
<ul>
|
|
||||||
<li>Optionally there will be some small use cases where JS makes sense (it’s the only thing modern browsers understand e.e)
|
|
||||||
|
|
||||||
<ul>
|
|
||||||
<li>For example, cropping your avatar before uploading a new one.</li>
|
|
||||||
<li>This is the only example until now.</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li>Dark and light default themes available (according to your system theme)</li>
|
|
||||||
<li>Graceful degradation for unsupported HTML elements</li>
|
|
||||||
<li>Achieving modern user interface patterns without JS</li>
|
|
||||||
<li>Various layout engines tested and work as they should
|
|
||||||
|
|
||||||
<ul>
|
|
||||||
<li>Qt WebEngine (Qutebrowser, Falkon, Otter Browser, etc…)</li>
|
|
||||||
<li>WebkitGTK (Epiphany, Midori, etc…)</li>
|
|
||||||
<li>Gecko (Firefox and derivatives)</li>
|
|
||||||
<li>Goanna (Palemoon, Basilisk, etc…)</li>
|
|
||||||
<li>Internet Explorer</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
|
|
||||||
<h3>Video</h3>
|
|
||||||
|
|
||||||
<h4>Keyboard tests</h4>
|
|
||||||
|
|
||||||
<iframe width="560" height="315" sandbox="allow-same-origin allow-scripts allow-popups" title="GNU social v3 Accessibility: Orca reading the Public feed" src="https://tube.tchncs.de/videos/embed/9a16e84c-4150-4849-ac63-019c9a3782d9" frameborder="0" allowfullscreen></iframe>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<p class="readmore"><a href="./updates-interface-and-accessibility.html">Read more...</a></p>
|
|
||||||
<div id="all_posts"><a href="all_posts.html">View more posts</a> — <a href="all_tags.html">All tags</a> — <a href="feed.rss">Subscribe</a></div>
|
|
||||||
</div>
|
|
||||||
<div id="footer">CC by-nc-nd <a href="http://twitter.com/example">John Smith</a> — <a href="mailto:john@smith.com">john@smith.com</a><br/>
|
|
||||||
Generated with <a href="https://github.com/cfenollosa/bashblog">bashblog</a>, a single bash script to easily create blogs like this one</div>
|
|
||||||
</div></div>
|
|
||||||
</body></html>
|
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue