fedi/im.html
2022-05-16 16:28:52 +03:00

244 lines
12 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE HTML>
<html>
<head profile="https://fedi.life">
<link rel="icon"
type="image/png"
href="favicon.png" />
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>У вас всегда есть выбор! — Мессенджеры</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="css/picnic.min.css">
<style>aside a.top {
font-size: 0;
position: fixed;
bottom: 0;
font-weight: bold;
width: 180px;
padding: .6em 0;
margin-bottom: 0;
border-radius: .3em .3em 0 0;
transition: all .3s ease;
}
aside a.top.visible {
font-size: 1em;
}
aside .links a.button {
text-align: left;
}
@media all and (max-width: 1000px) {
aside a.pseudo.top {
background: rgba(255, 255, 255, .8);
width: 100%;
left: 0;
text-align: center;
z-index: 100;
}
}
.documentation article > h2 {
margin: -2em 0 .6em;
padding: 3em 0 0;
line-height: 1;
}
.documentation article > h3 {
margin-bottom: .6em;
}
.documentation aside h2 {
margin-top: 0;
padding: 1.25em 0;
line-height: 1;
}
.documentation aside a.pseudo {
color: #0074D9;
margin: 0;
}
.documentation > section {
background: #fff;
text-align: left;
width: 90%;
max-width: 960px;
margin: 0 auto;
padding: 80px 0 0;
}
.documentation article > h1 {
margin: 0;
padding: 0.6em 0;
font-size: 2em;
line-height: 1.5;
}
.documentation aside a.button {
display: block;
}
.documentation pre[class*="language-"] {
margin-top: 10px;
margin-bottom: 40px;
}
.documentation .index pre {
margin: 0;
font-size: .9em;
}
</style>
</head>
<body>
<nav class="fedi">
<a href="https://fedi.life" class="brand">
<img class="logo" src="images/logo.webp" />
<span>Fedi.Life</span>
</a>
<!-- responsive-->
<input id="bmenub" type="checkbox" class="show">
<label for="bmenub" class="burger pseudo button">меню</label>
<div class="menu">
<a href="im.html" class="pseudo button">Мессенджеры</a>
<a href="social.html" class="pseudo button">Соцсети</a>
<a href="mail.html" class="pseudo button">Почта</a>
<a href="search.html" class="pseudo button">Поиск</a>
<a href="extra.html" class="pseudo button">Допматериалы</a>
<a href="info.html" class="pseudo button">Подробнее</a>
</div>
</nav>
<main id="home" class="documentation">
<section class="flex">
<article class="four-fifth-1000">
<header><h3>Децентрализованные мессенджеры<h3></header>
<p>Способы быстро списаться и созвониться с нужным человеком. Общение через сеть должно быть безопасным, приватным и неподцензурным. И вот сервисы, которые вам помогут в этом:
</p>
</article>
<article class="card four-fifth-1000">
<header><h3>XMPP (он же Джаббер) — на замену WhatsApp/Viber/Telegram</h3></header>
<center><label for="modal_jab"><img src="images/conversejs.webp" width="80%"></label> </center>
<div class="modal">
<input id="modal_jab" type="checkbox" />
<label for="modal_jab" class="overlay"></label>
<article>
<header>
<h3>Jabber</h3>
<label for="modal_jab" class="close">&times;</label>
</header>
<section class="content">
<img src="images/conversejs.webp" width="100%">
</section>
</article>
</div>
<span>
Широко используемый свободный и открытый стандарт интернет-сообщений.
Весьма прост в использовании — устанавливаем приложение, регистрируем аккаунт, общаемся.
<p>
В силу распределённости протокола, количество мест, где можно зарегистрироваться,
огромно. Независимо от того, на каком сервере вы регистрируетесь -
все пользователи доступны для вас.
</p>
</p>
<center>
<div class="tabs two">
<input id='tab-1' type='radio' name='tabgroupB' checked />
<label class="pseudo button toggle" for="tab-1">Где зарегистрироваться</label>
<input id='tab-2' type='radio' name='tabgroupB'>
<label class="pseudo button toggle" for="tab-2">Приложения</label>
<div class="row">
<div><center><a class="button" href="https://404.city/">404.city</a>
<a class="button" href="https://www.shad0w.io/register.php">Shad0w</a>
<a class="button" href="https://5222.de/register/">5222.de</a>
<a class="button" href="https://e2e.ee/en/gst/">E2E</a>
</center></div>
<div><center><a class="button" href="https://conversejs.org/fullscreen.html">ConverseJS</a></button>
<br>
<a class="button" href="https://f-droid.org/en/packages/eu.siacs.conversations/"><img src="images/fdroid.webp"> Conversations</a></button><br>
<a class="button" href="https://play.google.com/store/apps/details?id=im.blabber.messenger"><img src="images/google.webp"> blabber.im</a></button>
<a class="button" href="https://apps.apple.com/app/tigase-messenger/id1153516838"><img src="images/apple.webp"> Siskin IM</a></button>
</center></div>
</div>
</div>
</center>
</article>
<article class="card four-fifth-1000">
<header><h3>Jitsi Meet и Jami — на замену Skype</h3></header>
<center><label for="modal_meet"><img src="images/jitsi2.jpg" width="80%"></label> </center>
<div class="modal">
<input id="modal_meet" type="checkbox" />
<label for="modal_meet" class="overlay"></label>
<article>
<header>
<h3>Jitsi Meet</h3>
<label for="modal_meet" class="close">&times;</label>
</header>
<section class="content">
<img src="images/jitsi2.jpg" width="100%">
</section>
</article>
</div>
<span>
Свободные открытые приложения для чатов и видеозвонков, разрабатываемые командами добровольцев.
<p>
Jitsi чрезвычайно просто в использовании — регистрация не требуется, нужно придумать название комнаты чата и
послать полученную ссылку всем участникам. Можно использовать вебсайт либо мобильные приложения.
</p>
<p>
В Jami дела обстоят схожим образом — каждому пользователю выдаётся уникальный код,
которым можно поделиться с другими участниками (аналог номера аськи/телефона...)
</p>
<center>
<div class="tabs two">
<input id='tab-11' type='radio' name='tabgroupC' checked />
<label class="pseudo button toggle" for="tab-11">Приложения</label>
<input id='tab-21' type='radio' name='tabgroupC'>
<label class="pseudo button toggle" for="tab-21">Мобильные приложения</label>
<div class="row">
<div><center>
<a class="button" href="https://meet.jit.si/">Jitsi (Web)</a></button>
<br>
<a class="button" href="https://jami.net/download-jami-linux/"><img src="images/linux.webp">Jami (Linux)</a></button>
<a class="button" href="https://jami.net/download-jami-windows/"><img src="images/windows.webp">Jami (Windows)</a></button>
<a class="button" href="https://jami.net/download-jami-macos/"><img src="images/apple.webp">Jami (MacOS)</a></button>
</center></div>
<div>
<center><a class="button" href="https://f-droid.org/packages/org.jitsi.meet"><img src="images/fdroid.webp">Jitsi (F-Droid)</a></button>
<a class="button" href="https://play.google.com/store/apps/details?id=cx.ring"><img src="images/google.webp">Jitsi (G-Play)</a></button>
<a class="button" href="https://apps.apple.com/app/jitsi-meet/id1165103905"><img src="images/apple.webp">Jitsi (iOS)</a></button>
<br>
<a class="button" href="https://f-droid.org/packages/cx.ring"><img src="images/fdroid.webp">Jami (F-Droid)</a></button>
<a class="button" href="https://play.google.com/store/apps/details?id=cx.ring"><img src="images/google.webp">Jami (G-Play)</a></button>
<a class="button" href="https://apps.apple.com/app/ring-a-gnu-package/id1306951055"><img src="images/apple.webp">Jami (iOS)</a></button>
</center></div>
</div>
</div>
</center>
</article>
</article>
</section>
</main>
<section>
<hr>
<center>
<a href="https://phreedom.club/~tolstoevsky"><img src="images/ava-min.webp" width=32px></a>&nbsp;|&nbsp;Created with <a href="https://picnicss.com/">PicniCSS</a>&nbsp;|&nbsp; with <a href="https://phreedom.club/tt/landing.html">Trivial Technology</a> in mind.
</center>
</section>
</body>
</html>