switching/social.html

267 lines
17 KiB
HTML
Raw Normal View History

2020-02-20 12:05:30 +00:00
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>У вас всегда есть выбор! — Cowctnb</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="css/base.css">
<link rel="stylesheet" href="css/menu.css">
<link rel="stylesheet" href="css/popup.css">
<link rel="stylesheet" href="css/btn.css">
<script src="js/popup.js"></script>
<script src="js/menu.js"></script>
</head>
<body>
<div class="topnav" id="rtopnav">
2020-02-21 09:19:29 +00:00
<a href="index.html">Главная</a>
<a href="mail.html">Почта</a>
<a href="im.html" >Мессенджеры</a>
<a href="social.html" class="active">Соцсети</a>
<a href="search.html">Поисковики</a>
2020-02-20 12:05:30 +00:00
<div class="dropdown">
<button class="dropbtn">Ещё
<i class="fa fa-caret-down"></i>
</button>
<div class="dropdown-content">
2020-02-21 09:19:29 +00:00
<a href="extra.html">Документы и агитматериалы</a>
<a href="info.html">Подробнее</a>
2020-02-20 12:05:30 +00:00
</div>
</div>
2020-02-20 14:36:50 +00:00
<a href="javascript:void(0);" style="font-size:15px;" class="icon" onclick="dropme()"></a>
2020-02-20 12:05:30 +00:00
</div>
<div class="textblock">
<h2>Социальные сети</h2>
<p>Ключевой инструмент взаимодействия в современной Сети. Познакомьтесь с альтернативами</p>
<div class="imgblock">
2020-02-21 08:40:25 +00:00
<img src="images/mastodon.png" width=40% style="float:none; margin:1%;"
2020-02-20 12:05:30 +00:00
onclick="openModal();currentSlide(1)" class="hover-shadow cursor"/>
2020-02-21 08:40:25 +00:00
<img src="images/mastodon3.png" width=40% style="float:none; margin:1%;"
2020-02-20 12:05:30 +00:00
onclick="openModal();currentSlide(3)" class="hover-shadow cursor"/>
2020-02-21 08:40:25 +00:00
<img src="images/mastodon2.png" width=80% style="float:none; margin:1%;"
onclick="openModal();currentSlide(2)" class="hover-shadow cursor"/>
2020-02-20 12:05:30 +00:00
<h3>#вместотвиттера Mastodon</h3>
<span>
<span>На данный момент — самая популярная из этичных социальных сетей с миллионами пользователей.
Больше всего напоминает Твиттер, только с большим лимитом символов и более гибким интерфейсом.
</span>
<p>
Ваша учётная запись в Мастодоне позволяет общаться с пользователями
других распределённых сетей — например Friendica (см. ниже), PixelFed
(взамен принадлежащего корпорации Facebook сервиса Instagram), PeerTube (аналог YouTube) и многих других.
Это объединение альтернативных соцсетей называется Fediverse (Федивёрс)
(от federation - федерация и universe - вселенная).
</p>
<p>
Вы можете зайти в Мастодон, зарегистрировавшись на одном из сайтов, указанных ниже,
можете использовать эту учётную запись в одном из приложений Mastodon для вашего мобильника.
</p>
</span>
<div class="textblock">
<h4>Где зарегистрироваться</h4>
<a class="Button" href="https://mastodon.ml">Russian Mastodon</a>
<a class="Button" href="https://phreedom.tk">Svoboda</a>
<a class="Button" href="https://embracing.space">Embracing Space</a>
<a class="Button" href="https://quey.org">Quey</a>
<a class="Button" href="https://lor.sh">LOR.sh</a>
<a class="Button" href="https://mastodon.org.ua">Ukrainian Mastodon</a>
<a class="Button" href="https://mstdn.netwhood.online">Network Neighborhood</a>
</div>
<div class="textblock">
<h4>Мобильные приложения</h4>
<a class="Button2" href="https://play.google.com/store/apps/details?id=app.fedilab.android"><IMG src="images/google.png" width="24" height="24">Fedilab (Платно)</a>
<a class="Button2" href="https://f-droid.org/packages/fr.gouv.etalab.mastodon/"><IMG src="images/fdroid.png" width="24" height="24">Fedilab (бесплатно)</a>
<a class="Button2" href="https://play.google.com/store/apps/details?id=jp.juggler.subwaytooter"><IMG src="images/google.png" width="24" height="24">Subway Tooter</a>
<a class="Button2" href="https://f-droid.org/en/packages/com.keylesspalace.tusky"><IMG src="images/fdroid.png" width="24" height="24">Tusky (F-Droid)</a>
<a class="Button2" href="https://play.google.com/store/apps/details?id=com.keylesspalace.tusky"><IMG src="images/google.png" width="24" height="24">Tusky (Google Play)</a>
<a class="Button2" href="https://itunes.apple.com/app/toot/id1229021451"><IMG src="images/apple.png" width="24" height="24">Toot!</a>
<a class="Button2" href="https://itunes.apple.com/app/mast/id1437429129"><IMG src="images/apple.png" width="24" height="24">Mast</a>
<a class="Button2" href="https://itunes.apple.com/app/amarok-for-mastodon/id1214116200"><IMG src="images/apple.png" width="24" height="24">Amaroq</a>
</div>
</div>
<div class="imgblock">
2020-02-21 08:40:25 +00:00
<img src="images/frendica.png" width=80% style="display:flex; margin:1%;"
2020-02-20 12:05:30 +00:00
onclick="openModal();currentSlide(4)" class="hover-shadow cursor"/>
<h3>#вместоВК Friendica</h3>
<span>
Альтернатива Вконтакте и Facebook, с теми же фишками, включая события и фотоальбомы
</span>
<p>
Также, как и Мастодон, Friendica создана из множества мелких сайтов,
связанных воедино посредством федерации. Мелкие сайты, составляющие
Френдику, называются "нодами".
</p>
<p>
Френдика также связана с Мастодоном, Диаспорой, PixelFed, PeerTube и
всеми остальными альтернативными соцсетями, так что завести друзей
в этих сетях не составит труда.
</p>
<div class="textblock">
<h4>Где зарегистрироваться</h4>
<a class="Button" href="https://nerdica.net">Nerdica</a>
<a class="Button" href="https://friendica.xyz">Friendica.XYZ</a>
<a class="Button" href="https://venera.social">Venera</a>
<a class="Button" href="https://loma.ml">Loma</a>
<h4>Мобильные приложения</h4>
<a class="Button2" href="https://play.google.com/store/apps/details?id=app.fedilab.android"><IMG src="images/google.png" width="24" height="24">Fedilab (Платно)</a>
<a class="Button2" href="https://f-droid.org/packages/fr.gouv.etalab.mastodon/"><IMG src="images/fdroid.png" width="24" height="24">Fedilab (бесплатно)</a>
</div>
</div>
<div class="imgblock">
<img src="images/pixelfed.png" width=50% style="float:left; margin:1%;"
onclick="openModal();currentSlide(5)" class="hover-shadow cursor"/>
<h3>#вместоinstagram PixelFed</h3>
<span>
Открытая распределённая альтернатива Instagram — с фильтрами, комментариями, лайками, репостами и так далее, но без рекламы и слежки.
</span>
<p>
Сеть состоит из мелких независимых сайтов, способных общаться между собой,
так что вы можете свободно фолловить людей с других сайтов PixelFed,
зарегистрировавшись на любом из них. И не важно, на маленьком или
крупном сервере вы зарегистрируетесь — вся сеть в вашем распоряжении.
Любые другие сети (например, Mastodon и Friendica) также доступны для взаимодействия
</p>
<p>
В отличие от Instagram, для использования PixelFed не нужно специальное приложение — оно работает
в любом браузере на компьютере, телефоне или планшете.
</p>
<div class="textblock">
<h4>Где зарегистрироваться</h4>
<a class="Button" href="https://pixelfed.de">pixelfed.de</a>
<a class="Button" href="https://pxlfd.me">pxlfd.me</a>
<a class="Button" href="https://pixelfed.tokyo">pixelfed.tokyo</a>
<a class="Button" href="https://pixelfed.se">pixelfed.se</a>
<h4>Мобильные приложения</h4>
<a class="Button2" href="https://play.google.com/store/apps/details?id=app.fedilab.android"><IMG src="images/google.png" width="24" height="24">Fedilab (Платно)</a>
<a class="Button2" href="https://f-droid.org/packages/fr.gouv.etalab.mastodon/"><IMG src="images/fdroid.png" width="24" height="24">Fedilab (бесплатно)</a>
</div>
</div>
<div class="imgblock">
<img src="images/peertube.png" width=50% style="float:left; margin:1%;"
onclick="openModal();currentSlide(6)" class="hover-shadow cursor"/>
<h3>#вместоyoutube PeerTube</h3>
<span>
PeerTube — открытая распределённая альтернатива YouTube (принадлежит Google).
Это соцсеть, приспособленная для распространения видео, без рекламы и слежки.
</span>
<p>
В отличие от YouTube, PeerTube состоит из множества независимых сайтов,
способных общаться между собой. Не имеет значения,
на каком вы зарегистрируетесь — вся сеть в вашем распоряжении.
Плюс вы можете встроить видео с PeerTube куда угодно (см. пример выше).
</p>
<p>
Ну и вишенкой на торте — PeerTube также использует стандарт ActivityPub,
и подписаться на ваш канал там смогут все пользователи PeerTube, Mastodon,
Friendica и так далее.
</p>
<div class="textblock">
<h4>Где зарегистрироваться</h4>
<a class="Button" href="https://open.tube">open.tube</a>
<a class="Button" href="https://video.tedomum.net">video.tedomum.net</a>
<a class="Button" href="https://peertube.linuxrocks.online">peertube.linuxrocks.online</a>
<a class="Button" href="https://share.tube">share.tube</a>
<h4>Мобильные приложения</h4>
<a class="Button2" href="https://play.google.com/store/apps/details?id=app.fedilab.android"><IMG src="images/google.png" width="24" height="24">Fedilab (Платно)</a>
<a class="Button2" href="https://f-droid.org/packages/fr.gouv.etalab.mastodon/"><IMG src="images/fdroid.png" width="24" height="24">Fedilab (бесплатно)</a>
<a class="Button2" href="https://f-droid.org/en/packages/net.schueller.peertube/"><IMG src="images/fdroid.png" width="24" height="24">Thorium</a>
<a class="Button2" href="https://play.google.com/store/apps/details?id=net.schueller.peertube"><IMG src="images/google.png" width="24" height="24">PeerTube Player</a>
</div>
</div>
</div>
<div id="myModal" class="modal">
<span class="close cursor" onclick="closeModal()">&times;</span>
<div class="modal-content">
<div class="mySlides">
<div class="numbertext">Mastodon</div>
<img src="images/mastodon.png" style="width:100%">
</div>
<div class="mySlides">
<div class="numbertext">Mastodon</div>
<img src="images/mastodon2.png" style="width:100%">
</div>
<div class="mySlides">
<div class="numbertext">Mastodon</div>
<img src="images/mastodon3.png" style="width:100%">
</div>
<div class="mySlides">
<div class="numbertext">Friendica</div>
<img src="images/frendica.png" style="width:100%">
</div>
<div class="mySlides">
<div class="numbertext">PixelFed</div>
<img src="images/pixelfed.png" style="width:100%">
</div>
<div class="mySlides">
<div class="numbertext">PeerTube</div>
<img src="images/peertube.png" style="width:100%">
</div>
<a class="prev" onclick="plusSlides(-1)">&#10094;</a>
<a class="next" onclick="plusSlides(1)">&#10095;</a>
<div class="caption-container">
<p id="caption"></p>
</div>
<div class="column">
<img class="demo cursor" src="images/mastodon.png" style="width:100%" onclick="currentSlide(1)" alt="Mastodon">
</div>
<div class="column">
<img class="demo cursor" src="images/mastodon2.png" style="width:100%" onclick="currentSlide(2)" alt="Mastodon">
</div>
<div class="column">
<img class="demo cursor" src="images/mastodon3.png" style="width:100%" onclick="currentSlide(3)" alt="Mastodon">
</div>
<div class="column">
<img class="demo cursor" src="images/frendica.png" style="width:100%" onclick="currentSlide(4)" alt="Friendica">
</div>
<div class="column">
<img class="demo cursor" src="images/pixelfed.png" style="width:100%" onclick="currentSlide(5)" alt="PixelFed">
</div>
<div class="column">
<img class="demo cursor" src="images/peertube.png" style="width:100%" onclick="currentSlide(6)" alt="PeerTube">
</div>
</div>
</div>
</div>
</body>
</html>