├── CNAME ├── images ├── stop.png ├── banner.jpg ├── pic01.jpg ├── pic02.jpg ├── pic03.jpg ├── pic04.jpg ├── quelle.png ├── teilen.png ├── ersteHand.png ├── fakechat.png ├── idontcare.jpg ├── introbild.jpg ├── stimmtdas.jpg ├── Hintergrund.png ├── i-dont-care.png ├── introklein.jpg ├── istmiregal.png ├── kontextbild.jpg ├── rausfinden.png ├── screenshot.png ├── screenshot2.png ├── screenshot3.png ├── divers-kisten.png ├── ichwillswissen.png ├── wikipediatrick.jpg ├── Wortbildmarke_RGB.png ├── headline-checker.png ├── linnemann-tweet.jpeg ├── meineQuelleundich.png ├── Wortbildmarke_90px.png ├── ebildungslabor 90px.png ├── wen-interessierts_.png ├── zur├╝ckzumUrsprung.png └── WMDE_Logo_vertikal_black 90px.png ├── README.md ├── assets ├── webfonts │ ├── fa-brands-400.eot │ ├── fa-brands-400.ttf │ ├── fa-solid-900.eot │ ├── fa-solid-900.ttf │ ├── fa-solid-900.woff │ ├── fa-brands-400.woff │ ├── fa-brands-400.woff2 │ ├── fa-regular-400.eot │ ├── fa-regular-400.ttf │ ├── fa-regular-400.woff │ ├── fa-solid-900.woff2 │ └── fa-regular-400.woff2 ├── css │ ├── images │ │ ├── close.svg │ │ ├── bars.svg │ │ └── arrow.svg │ └── noscript.css ├── sass │ ├── noscript.scss │ └── libs │ │ ├── _functions.scss │ │ ├── _mixins.scss │ │ ├── _vars.scss │ │ ├── _html-grid.scss │ │ ├── _breakpoints.scss │ │ └── _vendor.scss ├── js │ ├── jquery.scrolly.min.js │ ├── browser.min.js │ ├── main.js │ ├── jquery.scrollex.min.js │ ├── breakpoints.min.js │ └── util.js └── LICENSE.txt ├── test1.html ├── test2.html ├── zusammenfassung.html ├── ursprung2.html ├── beispiel2.html ├── beispiel1.html ├── quelle2.html ├── intro.html ├── beispiel3.html ├── hintergrund.html ├── quelle.html ├── loesung1.html ├── loesung3.html ├── informationen.html ├── ursprung.html ├── stopp.html ├── loesung2.html ├── impressum.html ├── kontext.html ├── index.html └── LICENSE /CNAME: -------------------------------------------------------------------------------- 1 | fakten.wikimedia.de -------------------------------------------------------------------------------- /images/stop.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wmde/faktenpruefenimnetz/master/images/stop.png -------------------------------------------------------------------------------- /images/banner.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wmde/faktenpruefenimnetz/master/images/banner.jpg -------------------------------------------------------------------------------- /images/pic01.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wmde/faktenpruefenimnetz/master/images/pic01.jpg -------------------------------------------------------------------------------- /images/pic02.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wmde/faktenpruefenimnetz/master/images/pic02.jpg -------------------------------------------------------------------------------- /images/pic03.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wmde/faktenpruefenimnetz/master/images/pic03.jpg -------------------------------------------------------------------------------- /images/pic04.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wmde/faktenpruefenimnetz/master/images/pic04.jpg -------------------------------------------------------------------------------- /images/quelle.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wmde/faktenpruefenimnetz/master/images/quelle.png -------------------------------------------------------------------------------- /images/teilen.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wmde/faktenpruefenimnetz/master/images/teilen.png -------------------------------------------------------------------------------- /images/ersteHand.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wmde/faktenpruefenimnetz/master/images/ersteHand.png -------------------------------------------------------------------------------- /images/fakechat.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wmde/faktenpruefenimnetz/master/images/fakechat.png -------------------------------------------------------------------------------- /images/idontcare.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wmde/faktenpruefenimnetz/master/images/idontcare.jpg -------------------------------------------------------------------------------- /images/introbild.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wmde/faktenpruefenimnetz/master/images/introbild.jpg -------------------------------------------------------------------------------- /images/stimmtdas.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wmde/faktenpruefenimnetz/master/images/stimmtdas.jpg -------------------------------------------------------------------------------- /images/Hintergrund.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wmde/faktenpruefenimnetz/master/images/Hintergrund.png -------------------------------------------------------------------------------- /images/i-dont-care.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wmde/faktenpruefenimnetz/master/images/i-dont-care.png -------------------------------------------------------------------------------- /images/introklein.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wmde/faktenpruefenimnetz/master/images/introklein.jpg -------------------------------------------------------------------------------- /images/istmiregal.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wmde/faktenpruefenimnetz/master/images/istmiregal.png -------------------------------------------------------------------------------- /images/kontextbild.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wmde/faktenpruefenimnetz/master/images/kontextbild.jpg -------------------------------------------------------------------------------- /images/rausfinden.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wmde/faktenpruefenimnetz/master/images/rausfinden.png -------------------------------------------------------------------------------- /images/screenshot.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wmde/faktenpruefenimnetz/master/images/screenshot.png -------------------------------------------------------------------------------- /images/screenshot2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wmde/faktenpruefenimnetz/master/images/screenshot2.png -------------------------------------------------------------------------------- /images/screenshot3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wmde/faktenpruefenimnetz/master/images/screenshot3.png -------------------------------------------------------------------------------- /images/divers-kisten.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wmde/faktenpruefenimnetz/master/images/divers-kisten.png -------------------------------------------------------------------------------- /images/ichwillswissen.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wmde/faktenpruefenimnetz/master/images/ichwillswissen.png -------------------------------------------------------------------------------- /images/wikipediatrick.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wmde/faktenpruefenimnetz/master/images/wikipediatrick.jpg -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # faktenpruefenimnetz 2 | Originally hosted at fakten.wikimedia.de now at https://faktencheck.zlb.de 3 | -------------------------------------------------------------------------------- /images/Wortbildmarke_RGB.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wmde/faktenpruefenimnetz/master/images/Wortbildmarke_RGB.png -------------------------------------------------------------------------------- /images/headline-checker.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wmde/faktenpruefenimnetz/master/images/headline-checker.png -------------------------------------------------------------------------------- /images/linnemann-tweet.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wmde/faktenpruefenimnetz/master/images/linnemann-tweet.jpeg -------------------------------------------------------------------------------- /images/meineQuelleundich.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wmde/faktenpruefenimnetz/master/images/meineQuelleundich.png -------------------------------------------------------------------------------- /images/Wortbildmarke_90px.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wmde/faktenpruefenimnetz/master/images/Wortbildmarke_90px.png -------------------------------------------------------------------------------- /images/ebildungslabor 90px.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wmde/faktenpruefenimnetz/master/images/ebildungslabor 90px.png -------------------------------------------------------------------------------- /images/wen-interessierts_.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wmde/faktenpruefenimnetz/master/images/wen-interessierts_.png -------------------------------------------------------------------------------- /images/zur├╝ckzumUrsprung.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wmde/faktenpruefenimnetz/master/images/zur├╝ckzumUrsprung.png -------------------------------------------------------------------------------- /assets/webfonts/fa-brands-400.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wmde/faktenpruefenimnetz/master/assets/webfonts/fa-brands-400.eot -------------------------------------------------------------------------------- /assets/webfonts/fa-brands-400.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wmde/faktenpruefenimnetz/master/assets/webfonts/fa-brands-400.ttf -------------------------------------------------------------------------------- /assets/webfonts/fa-solid-900.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wmde/faktenpruefenimnetz/master/assets/webfonts/fa-solid-900.eot -------------------------------------------------------------------------------- /assets/webfonts/fa-solid-900.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wmde/faktenpruefenimnetz/master/assets/webfonts/fa-solid-900.ttf -------------------------------------------------------------------------------- /assets/webfonts/fa-solid-900.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wmde/faktenpruefenimnetz/master/assets/webfonts/fa-solid-900.woff -------------------------------------------------------------------------------- /assets/webfonts/fa-brands-400.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wmde/faktenpruefenimnetz/master/assets/webfonts/fa-brands-400.woff -------------------------------------------------------------------------------- /assets/webfonts/fa-brands-400.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wmde/faktenpruefenimnetz/master/assets/webfonts/fa-brands-400.woff2 -------------------------------------------------------------------------------- /assets/webfonts/fa-regular-400.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wmde/faktenpruefenimnetz/master/assets/webfonts/fa-regular-400.eot -------------------------------------------------------------------------------- /assets/webfonts/fa-regular-400.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wmde/faktenpruefenimnetz/master/assets/webfonts/fa-regular-400.ttf -------------------------------------------------------------------------------- /assets/webfonts/fa-regular-400.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wmde/faktenpruefenimnetz/master/assets/webfonts/fa-regular-400.woff -------------------------------------------------------------------------------- /assets/webfonts/fa-solid-900.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wmde/faktenpruefenimnetz/master/assets/webfonts/fa-solid-900.woff2 -------------------------------------------------------------------------------- /assets/webfonts/fa-regular-400.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wmde/faktenpruefenimnetz/master/assets/webfonts/fa-regular-400.woff2 -------------------------------------------------------------------------------- /images/WMDE_Logo_vertikal_black 90px.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wmde/faktenpruefenimnetz/master/images/WMDE_Logo_vertikal_black 90px.png -------------------------------------------------------------------------------- /assets/css/images/close.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /assets/css/images/bars.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /assets/css/images/arrow.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /assets/css/noscript.css: -------------------------------------------------------------------------------- 1 | /* 2 | Spectral by HTML5 UP 3 | html5up.net | @ajlkn 4 | Free for personal and commercial use under the CCA 3.0 license (html5up.net/license) 5 | */ 6 | 7 | /* Banner */ 8 | 9 | body.is-preload #banner h2 { 10 | -moz-transform: none; 11 | -webkit-transform: none; 12 | -ms-transform: none; 13 | transform: none; 14 | opacity: 1; 15 | } 16 | 17 | body.is-preload #banner h2:before, body.is-preload #banner h2:after { 18 | width: 100%; 19 | } 20 | 21 | body.is-preload #banner .more { 22 | -moz-transform: none; 23 | -webkit-transform: none; 24 | -ms-transform: none; 25 | transform: none; 26 | opacity: 1; 27 | } 28 | 29 | body.is-preload #banner:after { 30 | opacity: 0; 31 | } -------------------------------------------------------------------------------- /assets/sass/noscript.scss: -------------------------------------------------------------------------------- 1 | @import 'libs/vars'; 2 | @import 'libs/functions'; 3 | @import 'libs/mixins'; 4 | @import 'libs/vendor'; 5 | @import 'libs/breakpoints'; 6 | @import 'libs/html-grid'; 7 | 8 | /* 9 | Spectral by HTML5 UP 10 | html5up.net | @ajlkn 11 | Free for personal and commercial use under the CCA 3.0 license (html5up.net/license) 12 | */ 13 | 14 | /* Banner */ 15 | 16 | body.is-preload { 17 | #banner { 18 | h2 { 19 | @include vendor('transform', 'none'); 20 | opacity: 1; 21 | 22 | &:before, &:after { 23 | width: 100%; 24 | } 25 | } 26 | 27 | .more { 28 | @include vendor('transform', 'none'); 29 | opacity: 1; 30 | } 31 | 32 | &:after { 33 | opacity: 0; 34 | } 35 | } 36 | } -------------------------------------------------------------------------------- /assets/js/jquery.scrolly.min.js: -------------------------------------------------------------------------------- 1 | /* jquery.scrolly v1.0.0-dev | (c) @ajlkn | MIT licensed */ 2 | (function(e){function u(s,o){var u,a,f;if((u=e(s))[t]==0)return n;a=u[i]()[r];switch(o.anchor){case"middle":f=a-(e(window).height()-u.outerHeight())/2;break;default:case r:f=Math.max(a,0)}return typeof o[i]=="function"?f-=o[i]():f-=o[i],f}var t="length",n=null,r="top",i="offset",s="click.scrolly",o=e(window);e.fn.scrolly=function(i){var o,a,f,l,c=e(this);if(this[t]==0)return c;if(this[t]>1){for(o=0;o0:!!("ontouchstart"in window),e.mobile="wp"==e.os||"android"==e.os||"ios"==e.os||"bb"==e.os}};return e.init(),e}();!function(e,n){"function"==typeof define&&define.amd?define([],n):"object"==typeof exports?module.exports=n():e.browser=n()}(this,function(){return browser}); 3 | -------------------------------------------------------------------------------- /assets/js/main.js: -------------------------------------------------------------------------------- 1 | /* 2 | Spectral by HTML5 UP 3 | html5up.net | @ajlkn 4 | Free for personal and commercial use under the CCA 3.0 license (html5up.net/license) 5 | */ 6 | 7 | (function($) { 8 | 9 | var $window = $(window), 10 | $body = $('body'), 11 | $wrapper = $('#page-wrapper'), 12 | $banner = $('#banner'), 13 | $header = $('#header'); 14 | 15 | // Breakpoints. 16 | breakpoints({ 17 | xlarge: [ '1281px', '1680px' ], 18 | large: [ '981px', '1280px' ], 19 | medium: [ '737px', '980px' ], 20 | small: [ '481px', '736px' ], 21 | xsmall: [ null, '480px' ] 22 | }); 23 | 24 | // Play initial animations on page load. 25 | $window.on('load', function() { 26 | window.setTimeout(function() { 27 | $body.removeClass('is-preload'); 28 | }, 100); 29 | }); 30 | 31 | // Mobile? 32 | if (browser.mobile) 33 | $body.addClass('is-mobile'); 34 | else { 35 | 36 | breakpoints.on('>medium', function() { 37 | $body.removeClass('is-mobile'); 38 | }); 39 | 40 | breakpoints.on('<=medium', function() { 41 | $body.addClass('is-mobile'); 42 | }); 43 | 44 | } 45 | 46 | // Scrolly. 47 | $('.scrolly') 48 | .scrolly({ 49 | speed: 1500, 50 | offset: $header.outerHeight() 51 | }); 52 | 53 | // Menu. 54 | $('#menu') 55 | .append('') 56 | .appendTo($body) 57 | .panel({ 58 | delay: 500, 59 | hideOnClick: true, 60 | hideOnSwipe: true, 61 | resetScroll: true, 62 | resetForms: true, 63 | side: 'right', 64 | target: $body, 65 | visibleClass: 'is-menu-visible' 66 | }); 67 | 68 | // Header. 69 | if ($banner.length > 0 70 | && $header.hasClass('alt')) { 71 | 72 | $window.on('resize', function() { $window.trigger('scroll'); }); 73 | 74 | $banner.scrollex({ 75 | bottom: $header.outerHeight() + 1, 76 | terminate: function() { $header.removeClass('alt'); }, 77 | enter: function() { $header.addClass('alt'); }, 78 | leave: function() { $header.removeClass('alt'); } 79 | }); 80 | 81 | } 82 | 83 | })(jQuery); -------------------------------------------------------------------------------- /assets/js/jquery.scrollex.min.js: -------------------------------------------------------------------------------- 1 | /* jquery.scrollex v0.2.1 | (c) @ajlkn | github.com/ajlkn/jquery.scrollex | MIT licensed */ 2 | !function(t){function e(t,e,n){return"string"==typeof t&&("%"==t.slice(-1)?t=parseInt(t.substring(0,t.length-1))/100*e:"vh"==t.slice(-2)?t=parseInt(t.substring(0,t.length-2))/100*n:"px"==t.slice(-2)&&(t=parseInt(t.substring(0,t.length-2)))),t}var n=t(window),i=1,o={};n.on("scroll",function(){var e=n.scrollTop();t.map(o,function(t){window.clearTimeout(t.timeoutId),t.timeoutId=window.setTimeout(function(){t.handler(e)},t.options.delay)})}).on("load",function(){n.trigger("scroll")}),jQuery.fn.scrollex=function(l){var s=t(this);if(0==this.length)return s;if(this.length>1){for(var r=0;r=i&&o>=t};break;case"bottom":h=function(t,e,n,i,o){return n>=i&&o>=n};break;case"middle":h=function(t,e,n,i,o){return e>=i&&o>=e};break;case"top-only":h=function(t,e,n,i,o){return i>=t&&n>=i};break;case"bottom-only":h=function(t,e,n,i,o){return n>=o&&o>=t};break;default:case"default":h=function(t,e,n,i,o){return n>=i&&o>=t}}return c=function(t){var i,o,l,s,r,a,u=this.state,h=!1,c=this.$element.offset();i=n.height(),o=t+i/2,l=t+i,s=this.$element.outerHeight(),r=c.top+e(this.options.top,s,i),a=c.top+s-e(this.options.bottom,s,i),h=this.test(t,o,l,r,a),h!=u&&(this.state=h,h?this.options.enter&&this.options.enter.apply(this.element):this.options.leave&&this.options.leave.apply(this.element)),this.options.scroll&&this.options.scroll.apply(this.element,[(o-r)/(a-r)])},p={id:a,options:u,test:h,handler:c,state:null,element:this,$element:s,timeoutId:null},o[a]=p,s.data("_scrollexId",p.id),p.options.initialize&&p.options.initialize.apply(this),s},jQuery.fn.unscrollex=function(){var e=t(this);if(0==this.length)return e;if(this.length>1){for(var n=0;n length($list) { 17 | @warn "List index is #{$index} but list is only #{length($list)} item long for `remove-nth`."; 18 | } 19 | @else { 20 | 21 | $result: (); 22 | $index: if($index < 0, length($list) + $index + 1, $index); 23 | 24 | @for $i from 1 through length($list) { 25 | 26 | @if $i != $index { 27 | $result: append($result, nth($list, $i)); 28 | } 29 | 30 | } 31 | 32 | } 33 | 34 | @return $result; 35 | 36 | } 37 | 38 | /// Gets a value from a map. 39 | /// @author Hugo Giraudel 40 | /// @param {map} $map Map. 41 | /// @param {string} $keys Key(s). 42 | /// @return {string} Value. 43 | @function val($map, $keys...) { 44 | 45 | @if nth($keys, 1) == null { 46 | $keys: remove-nth($keys, 1); 47 | } 48 | 49 | @each $key in $keys { 50 | $map: map-get($map, $key); 51 | } 52 | 53 | @return $map; 54 | 55 | } 56 | 57 | /// Gets a duration value. 58 | /// @param {string} $keys Key(s). 59 | /// @return {string} Value. 60 | @function _duration($keys...) { 61 | @return val($duration, $keys...); 62 | } 63 | 64 | /// Gets a font value. 65 | /// @param {string} $keys Key(s). 66 | /// @return {string} Value. 67 | @function _font($keys...) { 68 | @return val($font, $keys...); 69 | } 70 | 71 | /// Gets a misc value. 72 | /// @param {string} $keys Key(s). 73 | /// @return {string} Value. 74 | @function _misc($keys...) { 75 | @return val($misc, $keys...); 76 | } 77 | 78 | /// Gets a palette value. 79 | /// @param {string} $keys Key(s). 80 | /// @return {string} Value. 81 | @function _palette($keys...) { 82 | @return val($palette, $keys...); 83 | } 84 | 85 | /// Gets a size value. 86 | /// @param {string} $keys Key(s). 87 | /// @return {string} Value. 88 | @function _size($keys...) { 89 | @return val($size, $keys...); 90 | } -------------------------------------------------------------------------------- /assets/js/breakpoints.min.js: -------------------------------------------------------------------------------- 1 | /* breakpoints.js v1.0 | @ajlkn | MIT licensed */ 2 | var breakpoints=function(){"use strict";function e(e){t.init(e)}var t={list:null,media:{},events:[],init:function(e){t.list=e,window.addEventListener("resize",t.poll),window.addEventListener("orientationchange",t.poll),window.addEventListener("load",t.poll),window.addEventListener("fullscreenchange",t.poll)},active:function(e){var n,a,s,i,r,d,c;if(!(e in t.media)){if(">="==e.substr(0,2)?(a="gte",n=e.substr(2)):"<="==e.substr(0,2)?(a="lte",n=e.substr(2)):">"==e.substr(0,1)?(a="gt",n=e.substr(1)):"<"==e.substr(0,1)?(a="lt",n=e.substr(1)):"!"==e.substr(0,1)?(a="not",n=e.substr(1)):(a="eq",n=e),n&&n in t.list)if(i=t.list[n],Array.isArray(i)){if(r=parseInt(i[0]),d=parseInt(i[1]),isNaN(r)){if(isNaN(d))return;c=i[1].substr(String(d).length)}else c=i[0].substr(String(r).length);if(isNaN(r))switch(a){case"gte":s="screen";break;case"lte":s="screen and (max-width: "+d+c+")";break;case"gt":s="screen and (min-width: "+(d+1)+c+")";break;case"lt":s="screen and (max-width: -1px)";break;case"not":s="screen and (min-width: "+(d+1)+c+")";break;default:s="screen and (max-width: "+d+c+")"}else if(isNaN(d))switch(a){case"gte":s="screen and (min-width: "+r+c+")";break;case"lte":s="screen";break;case"gt":s="screen and (max-width: -1px)";break;case"lt":s="screen and (max-width: "+(r-1)+c+")";break;case"not":s="screen and (max-width: "+(r-1)+c+")";break;default:s="screen and (min-width: "+r+c+")"}else switch(a){case"gte":s="screen and (min-width: "+r+c+")";break;case"lte":s="screen and (max-width: "+d+c+")";break;case"gt":s="screen and (min-width: "+(d+1)+c+")";break;case"lt":s="screen and (max-width: "+(r-1)+c+")";break;case"not":s="screen and (max-width: "+(r-1)+c+"), screen and (min-width: "+(d+1)+c+")";break;default:s="screen and (min-width: "+r+c+") and (max-width: "+d+c+")"}}else s="("==i.charAt(0)?"screen and "+i:i;t.media[e]=!!s&&s}return t.media[e]!==!1&&window.matchMedia(t.media[e]).matches},on:function(e,n){t.events.push({query:e,handler:n,state:!1}),t.active(e)&&n()},poll:function(){var e,n;for(e=0;e', '%3E'); 70 | $svg: str-replace($svg, '&', '%26'); 71 | $svg: str-replace($svg, '#', '%23'); 72 | $svg: str-replace($svg, '{', '%7B'); 73 | $svg: str-replace($svg, '}', '%7D'); 74 | $svg: str-replace($svg, ';', '%3B'); 75 | 76 | @return url("data:image/svg+xml;charset=utf8,#{$svg}"); 77 | 78 | } -------------------------------------------------------------------------------- /assets/sass/libs/_vars.scss: -------------------------------------------------------------------------------- 1 | // Misc. 2 | $misc: ( 3 | max-spotlights: 10, 4 | max-features: 10, 5 | z-index-base: 10000 6 | ); 7 | 8 | // Duration. 9 | $duration: ( 10 | transitions: 0.2s, 11 | menu: 0.5s, 12 | fadein: 3s 13 | ); 14 | 15 | // Size. 16 | $size: ( 17 | element-height: 2.75em, 18 | element-margin: 2em, 19 | letter-spacing: 0.075em, 20 | letter-spacing-alt: 0.225em 21 | ); 22 | 23 | // Font. 24 | $font: ( 25 | family: ('Open Sans', Helvetica, sans-serif), 26 | family-fixed: ('Courier New', monospace), 27 | weight: 400, 28 | weight-bold: 600, 29 | weight-extrabold: 800 30 | ); 31 | 32 | // Palette. 33 | $palette: ( 34 | bg: #2e3842, 35 | fg: #fff, 36 | fg-bold: #fff, 37 | fg-light: rgba(255,255,255,0.5), 38 | border: #fff, 39 | border-bg: rgba(144,144,144,0.25), 40 | border2: #fff, 41 | border2-bg: rgba(144,144,144,0.5), 42 | 43 | accent1: ( 44 | bg: #21b2a6, 45 | fg-bold: #ffffff, 46 | fg: mix(#21b2a6, #ffffff, 25%), 47 | fg-light: mix(#21b2a6, #ffffff, 40%), 48 | border: rgba(0,0,0,0.125), 49 | border-bg: rgba(255,255,255,0.075), 50 | border2: rgba(0,0,0,0.25), 51 | border2-bg: rgba(255,255,255,0.2) 52 | ), 53 | 54 | accent2: ( 55 | bg: #00ffcc, 56 | fg-bold: #ffffff, 57 | fg: mix(#00ffcc, #ffffff, 25%), 58 | fg-light: mix(#00ffcc, #ffffff, 40%), 59 | border: rgba(0,0,0,0.125), 60 | border-bg: rgba(255,255,255,0.075), 61 | border2: rgba(0,0,0,0.25), 62 | border2-bg: rgba(255,255,255,0.2) 63 | ), 64 | 65 | accent3: ( 66 | bg: #00f0ff, 67 | fg-bold: #ffffff, 68 | fg: mix(#00f0ff, #ffffff, 25%), 69 | fg-light: mix(#00f0ff, #ffffff, 40%), 70 | border: rgba(0,0,0,0.125), 71 | border-bg: rgba(255,255,255,0.075), 72 | border2: rgba(0,0,0,0.25), 73 | border2-bg: rgba(255,255,255,0.2) 74 | ), 75 | 76 | accent4: ( 77 | bg: #76ddff, 78 | fg-bold: #ffffff, 79 | fg: mix(#76ddff, #ffffff, 25%), 80 | fg-light: mix(#76ddff, #ffffff, 40%), 81 | border: rgba(0,0,0,0.125), 82 | border-bg: rgba(255,255,255,0.075), 83 | border2: rgba(0,0,0,0.25), 84 | border2-bg: rgba(255,255,255,0.2) 85 | ), 86 | 87 | accent5: ( 88 | bg: #505393, 89 | fg-bold: #ffffff, 90 | fg: mix(#505393, #ffffff, 25%), 91 | fg-light: mix(#505393, #ffffff, 40%), 92 | border: rgba(0,0,0,0.125), 93 | border-bg: rgba(255,255,255,0.075), 94 | border2: rgba(0,0,0,0.25), 95 | border2-bg: rgba(255,255,255,0.2) 96 | ), 97 | 98 | accent6: ( 99 | bg: #ed4933, 100 | fg-bold: #ffffff, 101 | fg: mix(#ed4933, #ffffff, 25%), 102 | fg-light: mix(#ed4933, #ffffff, 40%), 103 | border: rgba(0,0,0,0.125), 104 | border-bg: rgba(255,255,255,0.075), 105 | border2: rgba(0,0,0,0.25), 106 | border2-bg: rgba(255,255,255,0.2) 107 | ), 108 | 109 | accent7: ( 110 | bg: #ffffff, 111 | fg-bold: #2E3842, 112 | fg: #4E4852, 113 | fg-light: #8E8892, 114 | border: #dfdfdf, 115 | border-bg: rgba(0,0,0,0.0375), 116 | border2: #bfbfbf, 117 | border2-bg: rgba(0,0,0,0.1) 118 | ) 119 | ); -------------------------------------------------------------------------------- /assets/sass/libs/_html-grid.scss: -------------------------------------------------------------------------------- 1 | // html-grid.scss v1.0 | @ajlkn | MIT licensed */ 2 | 3 | // Mixins. 4 | 5 | /// Initializes the current element as an HTML grid. 6 | /// @param {mixed} $gutters Gutters (either a single number to set both column/row gutters, or a list to set them individually). 7 | /// @param {mixed} $suffix Column class suffix (optional; either a single suffix or a list). 8 | @mixin html-grid($gutters: 1.5em, $suffix: '') { 9 | 10 | // Initialize. 11 | $cols: 12; 12 | $multipliers: 0, 0.25, 0.5, 1, 1.50, 2.00; 13 | $unit: 100% / $cols; 14 | 15 | // Suffixes. 16 | $suffixes: null; 17 | 18 | @if (type-of($suffix) == 'list') { 19 | $suffixes: $suffix; 20 | } 21 | @else { 22 | $suffixes: ($suffix); 23 | } 24 | 25 | // Gutters. 26 | $guttersCols: null; 27 | $guttersRows: null; 28 | 29 | @if (type-of($gutters) == 'list') { 30 | 31 | $guttersCols: nth($gutters, 1); 32 | $guttersRows: nth($gutters, 2); 33 | 34 | } 35 | @else { 36 | 37 | $guttersCols: $gutters; 38 | $guttersRows: 0; 39 | 40 | } 41 | 42 | // Row. 43 | display: flex; 44 | flex-wrap: wrap; 45 | box-sizing: border-box; 46 | align-items: stretch; 47 | 48 | // Columns. 49 | > * { 50 | box-sizing: border-box; 51 | } 52 | 53 | // Gutters. 54 | &.gtr-uniform { 55 | > * { 56 | > :last-child { 57 | margin-bottom: 0; 58 | } 59 | } 60 | } 61 | 62 | // Alignment. 63 | &.aln-left { 64 | justify-content: flex-start; 65 | } 66 | 67 | &.aln-center { 68 | justify-content: center; 69 | } 70 | 71 | &.aln-right { 72 | justify-content: flex-end; 73 | } 74 | 75 | &.aln-top { 76 | align-items: flex-start; 77 | } 78 | 79 | &.aln-middle { 80 | align-items: center; 81 | } 82 | 83 | &.aln-bottom { 84 | align-items: flex-end; 85 | } 86 | 87 | // Step through suffixes. 88 | @each $suffix in $suffixes { 89 | 90 | // Suffix. 91 | @if ($suffix != '') { 92 | $suffix: '-' + $suffix; 93 | } 94 | @else { 95 | $suffix: ''; 96 | } 97 | 98 | // Row. 99 | 100 | // Important. 101 | > .imp#{$suffix} { 102 | order: -1; 103 | } 104 | 105 | // Columns, offsets. 106 | @for $i from 1 through $cols { 107 | > .col-#{$i}#{$suffix} { 108 | width: $unit * $i; 109 | } 110 | 111 | > .off-#{$i}#{$suffix} { 112 | margin-left: $unit * $i; 113 | } 114 | } 115 | 116 | // Step through multipliers. 117 | @each $multiplier in $multipliers { 118 | 119 | // Gutters. 120 | $class: null; 121 | 122 | @if ($multiplier != 1) { 123 | $class: '.gtr-' + ($multiplier * 100); 124 | } 125 | 126 | &#{$class} { 127 | margin-top: ($guttersRows * $multiplier * -1); 128 | margin-left: ($guttersCols * $multiplier * -1); 129 | 130 | > * { 131 | padding: ($guttersRows * $multiplier) 0 0 ($guttersCols * $multiplier); 132 | } 133 | 134 | // Uniform. 135 | &.gtr-uniform { 136 | margin-top: $guttersCols * $multiplier * -1; 137 | 138 | > * { 139 | padding-top: $guttersCols * $multiplier; 140 | } 141 | } 142 | 143 | } 144 | 145 | } 146 | 147 | } 148 | 149 | } -------------------------------------------------------------------------------- /test1.html: -------------------------------------------------------------------------------- 1 | 2 | 7 | 8 | 9 | Fakten prüfen im Netz 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 40 | 41 | 42 |
43 | 44 |
45 |
46 | 47 |
48 | 49 | 50 | 51 |

52 | Zwischen-Test zur Reflexion 53 |

54 | 55 |

Mit diesem Selbst-Test zur Reflexion kannst Du Dein bisheriges Verständnis überprüfen.

56 | 57 |

58 | 59 | 60 |

61 | 62 |

Bist Du zufrieden?

63 | 64 |

68 |

69 | 70 | 71 | 72 |
73 |
74 |
75 | 76 | 77 | 84 | 85 |
86 | 87 | 88 | 89 | 90 | 91 | 92 | 93 | 94 | 95 | 96 | 97 | 98 | -------------------------------------------------------------------------------- /test2.html: -------------------------------------------------------------------------------- 1 | 2 | 7 | 8 | 9 | Fakten prüfen im Netz 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 40 | 41 | 42 |
43 | 44 |
45 |
46 | 47 |
48 | 49 | 50 | 51 |

52 | Selbstüberprüfung zu den 4 Tipps 53 |

54 | 55 |

Mit diesem Test kannst Du überprüfen, ob es noch offene Fragen zu den vier vorgestellten Tipps gibt oder ob du dich schon bereit fühlst, sie auch praktisch auszuprobieren.

56 | 57 |

58 | 59 | 60 |

61 | 62 |

Alle Fragen beantwortet? Dann folgen als nächstes drei Praxisbeispiele, bei denen du die vier Tipps selbst anwenden kannst.

63 |

64 |

69 |

70 | 71 | 72 | 73 |
74 |
75 |
76 | 77 | 78 |
79 | 80 | 81 | 85 |
86 | 87 |
88 | 89 | 90 | 91 | 92 | 93 | 94 | 95 | 96 | 97 | 98 | 99 | 100 | -------------------------------------------------------------------------------- /zusammenfassung.html: -------------------------------------------------------------------------------- 1 | 2 | 7 | 8 | 9 | Fakten prüfen im Netz 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 40 | 41 | 42 |
43 | 44 |
45 |
46 | 47 |
48 | 49 |

Ausblick

50 | 51 |

Zusammenfassung 52 | 53 |

Herzlichen Glückwunsch, dass du 'Fakten prüfen im Netz' bis hierhin durchgesehen hast. Die Herausforderung ist nun, die vier Tipps zu Handlungsroutinen werden zu lassen.

54 | 55 |

Unser Vorschlag dazu: Wenn du das nächste Mal mit Informationen konfrontiert bist, dann versuche sie anhand einzelner oder aller vier Tipps für dich einzuordnen, bevor du dich weiter damit auseinandersetzt. Mit jeder Anwendung werden die vier Tipps dann mehr und mehr zu einer Gewohnheit für dich. Bald wirst du schon gar nicht mehr lange darüber nachdenken, sondern sie selbstverständlich verwenden.

56 | 57 | 58 |

Wenn Dir das Angebot 'Fakten prüfen im Netz' gefällt, dann informiere gerne auch dein Umfeld darüber. 59 | 60 |

65 |

66 | 67 | 68 | 69 |
70 |
71 |
72 | 73 | 74 |
75 | 76 | 77 | 81 |
82 | 83 |
84 | 85 | 86 | 87 | 88 | 89 | 90 | 91 | 92 | 93 | 94 | 95 | 96 | -------------------------------------------------------------------------------- /ursprung2.html: -------------------------------------------------------------------------------- 1 | 2 | 7 | 8 | 9 | Fakten prüfen im Netz 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 40 | 41 | 42 |
43 | 44 |
45 |
46 | 47 |
48 | 49 | 50 |

Tipp 4: Zurück zum Original - mit der Bilder-Rückwärtssuche

51 | 52 | 53 |

Wenn du ein Bild zum Original zurückverfolgen willst, dann kannst du dazu die Bilder-Rückwärtssuche (auch als 'umgekehrte Bildersuche' bekannt) nutzen. Hiermit wird dir angezeigt, wo das Bild ansonsten noch im Netz auftaucht. Das ist meist zielführender als eine eigenständige Überprüfung des Bildes an sich. Dieser Screencast zeigt dir, wie's geht: 54 |

55 | 56 |

Mit dem vierten Tipp 'Zurück zum Original' hast du alle vier Tipps für eine umfassende Faktenprüfung kennengelernt. Nun geht es darum, diese zu Handlungsroutinen werden zu lassen. Wir haben dir dazu einige Praxisbeispiele zur Reflexion vorbereitet. Zuvor erhältst du aber die Möglichkeit zur Selbstüberprüfung und zur Wiederholung.

57 |

58 | 59 |

64 | 65 | 66 |

67 | 68 | 69 | 70 |
71 |
72 |
73 | 74 | 75 |
76 | 77 | 78 | 82 |
83 | 84 |
85 | 86 | 87 | 88 | 89 | 90 | 91 | 92 | 93 | 94 | 95 | 96 | 97 | -------------------------------------------------------------------------------- /beispiel2.html: -------------------------------------------------------------------------------- 1 | 2 | 7 | 8 | 9 | Fakten prüfen im Netz 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 40 | 41 | 42 |
43 | 44 |
45 |
46 | 47 |
48 | 49 |

Beispiel 2: EU-Mitgliedsbeiträge

50 |

Als zweites Beispiel stellen wir uns vor, dass du eine Nachricht von einer Bekannten geschickt bekommst. Sie bezieht sich auf eine eurer Unterhaltungen über die Europäische Union und sendet dir einen Screenshot von dieser Website.

Ihr Kommentar dazu lautet: Hab' ich dir doch gesagt 😡 51 | 52 | 53 |
54 |
55 |
Screenshot Zivile Koalition
56 | 57 |
58 |
59 | 60 | 61 | 62 | 63 |

Wie reagierst du?

64 | 65 |

Überleg dir kurz, wie du in dieser Situation vorgehen könntest - und lies dir dann unsere Überlegungen auf der nächsten Seite durch. 66 | 67 |

68 |

73 |

74 | 75 | 76 | 77 |
78 |
79 |
80 | 81 | 82 |
83 | 84 | 85 | 89 |
90 | 91 |
92 | 93 | 94 | 95 | 96 | 97 | 98 | 99 | 100 | 101 | 102 | 103 | 104 | -------------------------------------------------------------------------------- /beispiel1.html: -------------------------------------------------------------------------------- 1 | 2 | 7 | 8 | 9 | Fakten prüfen im Netz 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 40 | 41 | 42 |
43 | 44 |
45 | 84 |
85 |
86 | 87 | 88 |
89 | 90 | 91 | 95 |
96 | 97 |
98 | 99 | 100 | 101 | 102 | 103 | 104 | 105 | 106 | 107 | 108 | 109 | 110 | -------------------------------------------------------------------------------- /quelle2.html: -------------------------------------------------------------------------------- 1 | 2 | 7 | 8 | 9 | Fakten prüfen im Netz 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 40 | 41 | 42 |
43 | 44 |
45 |
46 | 47 |
48 | 49 | 50 |

Tipp 2: Quelle überprüfen - der Wikipedia-Trick

51 | 52 |

Wikipedia Trick 53 | 54 |

Die wirkungsvollste, schnellste und einfachste Art der Quellenüberprüfung ist der sogenannte Wikipedia-Trick. Er funktioniert in drei Schritten:

55 | 56 |
  1. 57 | Neuen Tab im Browser öffnen.
  2. 58 |
  3. Die URL der Webseite, den Namen des Absenders (Organisation, Autor oder Autorin) in die Suchleiste eingeben.
  4. 59 |
  5. Dahinter das Wort 'Wikipedia' ergänzen.
  6. 60 |
61 | 62 |

In diesem Screencast zeigen wir anhand eines Beispiels, wie der Wikipedia-Trick bei der Quellenprüfung helfen kann.

63 |

64 | 65 |

Wenn es über die von dir gefundene Information etwas Relevantes zu erzählen gibt, dann wird dir mit dieser Technik wahrscheinlich ein Wikipedia-Artikel angezeigt. Darin findest Du einen mit Links belegten kurzen Überblick über die Information. Wenn dir nichts angezeigt wird, dann hilft auch diese Erkenntnis für eine erste Einordnung.

66 | 67 |

Was aber, wenn nicht die Quelle das Entscheidende für dich ist, sondern die Information an sich? Dann kommt Tipp 3 ins Spiel: Weitere Informationen finden!

68 |

69 | 70 |

75 | 76 | 77 |

78 | 79 | 80 | 81 |
82 |
83 |
84 | 85 | 86 |
87 | 88 | 89 | 93 |
94 | 95 |
96 | 97 | 98 | 99 | 100 | 101 | 102 | 103 | 104 | 105 | 106 | 107 | 108 | -------------------------------------------------------------------------------- /intro.html: -------------------------------------------------------------------------------- 1 | 2 | 7 | 8 | 9 | Fakten prüfen im Netz 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 40 | 41 | 42 |
43 |
44 |

Erkunden

45 |

Vier Tipps, wie Du Informationen im Netz
für Dich einordnen und bewerten kannst.

46 |
47 |
48 |
49 | 50 |
51 | 52 | 53 |

Die Erkundungszeit für den gesamten Kurs beträgt ungefähr 30 Minuten. Du kannst dir aber auch deinen eigenen Weg suchen und dich eigenständig durchklicken: 54 | 55 |

Intro

56 | 59 |

Die vier Tipps erklärt

60 | 69 |

Beispiele und Übungen

70 | 77 |

Abschluss

78 | 80 |
81 | 82 | 85 | 86 | 87 |
88 |
89 | 90 | 91 |
92 | 93 | 94 | 98 |
99 |
100 | 101 | 102 | 103 | 104 | 105 | 106 | 107 | 108 | 109 | 110 | 111 | 112 | -------------------------------------------------------------------------------- /beispiel3.html: -------------------------------------------------------------------------------- 1 | 2 | 7 | 8 | 9 | Fakten prüfen im Netz 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 40 | 41 | 42 |
43 | 44 |
45 |
46 | 47 |
48 | 49 |

Beispiel 3: Kevin Kühnert und die Groko

50 |

Stell dir vor, wir befinden uns Anfang Dezember 2019 und du verfolgst mit Interesse die Diskussionen im Vorfeld des SPD-Parteitages. Mit dem Kurs der Großen Koalition bist du nicht einverstanden. Du freust dich deshalb sowohl über die Wahl von Saskia Esken und Norbert Walter-Borjans als neue Vorsitzende als auch über die klaren Widerworte des Juso-Vorsitzenden Kevin Kühnert zur Großen Koalition. Morgens schlägst du die Bild-Zeitung auf und liest als Schlagzeile 'Juso-Chef warnt vor Groko-Aus: Kühnert macht Kehrtwende'. (Hier findest du die Online-Version dieses Artikels.)

51 | 52 | 53 |
54 |
55 |
Screenshot Bild
56 | 57 |
58 |
59 | 60 | 61 | 62 | 63 |

Wie reagierst Du?

64 | 65 |

Überleg dir kurz, wie du in dieser Situation eine Faktenprüfung vornehmen könntest und schau dir im Anschluss unsere Überlegungen dazu auf der nächsten Seite durch. 66 |

(Hinweis: Es geht um die Reflexion zu den hier vorgestellten Tipps zur Faktenprüfung. Diese funktionieren unabhängig davon, ob du dich mit dem Gedankenspiel identifizieren kannst oder nicht; d.h. du kannst über die Tipps auch reflektieren, wenn du zufrieden mit der Arbeit der Großen Koalition bist und dich nicht für die SPD interessierst). 67 | 68 |

69 | 70 |

75 | 76 | 77 |

78 | 79 | 80 | 81 |
82 |
83 |
84 | 85 | 86 |
87 | 88 | 89 | 93 |
94 | 95 |
96 | 97 | 98 | 99 | 100 | 101 | 102 | 103 | 104 | 105 | 106 | 107 | 108 | -------------------------------------------------------------------------------- /hintergrund.html: -------------------------------------------------------------------------------- 1 | 2 | 7 | 8 | 9 | Fakten prüfen im Netz 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 40 | 41 | 42 |
43 |
44 |

Über das Angebot

45 |

Erfahre mehr über 'Fakten prüfen im Netz'

46 |
47 |
48 |
49 | 50 |
51 |

Idee

52 |

Im Umgang mit digitalen Medien werden wir immer stärker mit einer Vielzahl unterschiedlichster Informationen konfrontiert. Oftmals ist es schwer, diese Informationen für sich zu bewerten. 'Fakten prüfen im Netz' soll Menschen dabei helfen, Informationen im Netz besser einordnen und bewerten zu können. Die vier Tipps unterstützen dabei, selbst einen Weg für sich zu 53 | finden, sie im jeweiligen Kontext zu verorten und entsprechend einsortieren zu können.

54 |

Ursprung

55 |

Die hier beschriebenen 4 Tipps basieren auf dem von Mike Caulfield veröffentlichten Online-Kurs unter dem Akronym S-I-F-T. Die hier befindlichen Texte beschreiben eine inhaltliche Weiterentwicklung und Adaption an den deutschsprachigen Kontext, basierend auf Caulfield's Modell.

56 |

Motivation

57 |

‘Fakten prüfen im Netz’ ist ein Angebot von der Zentral- und Landesbibliothek Berlin, das auf Initiative von und in Zusammenarbeit mit Wikimedia Deutschland gemeinsam mit dem eBildungslabor umgesetzt wurde. 58 | 59 | 60 |

ZLBLogo Bibliotheken als Informationsorte, die Wissen aufnehmen, bewahren und teilen, gewinnen im 61 | Themenfeld „Netzkompetenz“ immer mehr an Bedeutung. Die Zentral- und Landesbibliothek Berlin (ZLB) bezieht den digitalen Raum aktiv in ihre Arbeit ein und möchte mit dem Tool diese Kompetenzen allen zugänglich machen. 62 |

WMDELogo Wikimedia Deutschland engagiert sich dafür, dass alle Menschen Zugang zu Wissen und Bildung im Netz haben und selbst dazu beitragen können. Informationen zu finden, einzuordnen und zu bewerten gehört zu den Fähigkeiten und Kompetenzen, die dafür essentiell sind. 63 |

ebildungslaborLogo Das eBildungslabor unterstützt zeitgemäße Bildung. Ein kompetenter Umgang im Netz gehört hier unbedingt dazu.

64 | 65 |
66 | 67 | 70 | 71 |
72 |
73 | 74 | 75 |
76 | 77 | 78 | 82 |
83 | 84 |
85 | 86 | 87 | 88 | 89 | 90 | 91 | 92 | 93 | 94 | 95 | 96 | 97 | -------------------------------------------------------------------------------- /quelle.html: -------------------------------------------------------------------------------- 1 | 2 | 7 | 8 | 9 | Fakten prüfen im Netz 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 40 | 41 | 42 |
43 | 44 |
45 |
46 | 47 |
48 | 49 | 50 |

Tipp 2: Quelle überprüfen - Was ist damit gemeint

51 | 52 |

Quelle überprüfen 53 | 54 | 55 |

Quellen im Sinne von 'Quellenarbeit' zu überprüfen, mag im ersten Moment aufwändig und langwierig klingen. Gemeint ist jedoch keine umfassende Untersuchung, sondern das Erlangen einer schnellen, ersten Einschätzung. Wichtig ist, dass du zu einer ersten Einschätzung kommen kannst, bevor du dich überhaupt näher mit einer bestimmten Information auseinandersetzt. Auf diese Weise kannst du die Information von Anfang an besser einordnen.

56 | 57 |

Ein paar Beispiele zur Veranschaulichung:

58 |
    59 |
  • Du findest einen Artikel über gesunde Ernährung. Die Untersuchung der Quelle ergibt, dass er vom Vegetarierbund Deutschland geschrieben ist.
  • 60 |
  • Du schaust dir ein Video über Braunkohleabbau in der Lausitz an. Die Untersuchung der Quelle ergibt, dass der Ortsverband der SPD das Video gedreht hat.
  • 61 |
  • Du liest eine Rezension zu einem neuen Kinofilm. Die Untersuchung der Quelle ergibt, dass sie aus dem Cinestar-Magazin stammt.
  • 62 |
63 |

Diese Beispiele verdeutlichen, dass dir die Untersuchung der Quelle nichts dazu sagt, ob die Information richtig oder falsch ist. Sie sagt auch nichts darüber aus, ob ein bestimmtes Anliegen berechtigt ist oder nicht. Sie hilft dir aber dabei, die Information zunächst für dich einzuordnen. Denn natürlich ist es ein Unterschied, ob - um das erste Beispiel aufzugreifen - der Vegetarierbund Deutschland, der lokale Obsthandel, eine Supermarkt- oder aber eine Fastfoodkette über gesunde Ernährung schreibt. All diese Akteure werden zum Teil recht unterschiedliche Perspektiven auf das Thema gesunde Ernährung haben. Mit dem Wissen über Absender oder Absenderinnen, wirst du die Informationen beim Lesen für dich entsprechend einordnen können.

64 |

65 | Wie kannst du weiter vorgehen? 66 |

67 |

Um die Quelle zu untersuchen, kannst du den sogenannten 'Wikipedia-Trick' verwenden. 68 |

69 |

74 |

75 | 76 | 77 | 78 |
79 |
80 |
81 | 82 | 83 |
84 | 85 | 86 | 90 |
91 | 92 |
93 | 94 | 95 | 96 | 97 | 98 | 99 | 100 | 101 | 102 | 103 | 104 | 105 | -------------------------------------------------------------------------------- /loesung1.html: -------------------------------------------------------------------------------- 1 | 2 | 7 | 8 | 9 | Fakten prüfen im Netz 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 40 | 41 | 42 |
43 | 44 |
45 |
46 | 47 |
48 | 49 |

Faktenprüfung Beispiel 1: Redaktionsnetzwerk Deutschland

50 |

Welche Tipps für die Faktenprüfung im Beispiel des Redaktionsnetzwerks Deutschland geeignet sind, liegt insbesondere daran, welche Relevanz die Information für Dich hat.

51 | 52 |

a) Keine Relevanz

53 | 54 |

Wenn die Information für dich keine Relevanz hat, dann ist es am besten, die Website direkt wieder zu schließen. Du wendest damit den Tipp 'Stopp' an.

55 | 56 |

b) Ich möchte wissen, woher die Information stammt

57 | 58 |

Wenn du dich zu einer Faktenprüfung entscheidest, dann solltest du - bevor du dich weiter mit der Information beschäftigst - zunächst nachsehen, woher die Information stammt. Der Wikipedia-Trick könnte dir hier weiterhelfen. Ein Wikipedia-Artikel zum Redaktionsnetzwerk Deutschland ist vorhanden. Du wendest damit den Tipp 'Quelle überprüfen' an.

59 | 60 |

c) Ich möchte die Information an sich prüfen

61 | 62 |

Wenn nicht die Quelle für dich wichtig ist, sondern du zum Beispiel einen Artikel über Verluste von Bundeswehrjets bei Flügen über Deutschland schreiben willst, könnte eine 'Netzbefragung' ein guter erster Schritt sein. Hilfreiche Begriffe für eine Webrecherche wären zum Beispiel 'Bundeswehrjets verlieren teile'. Bei der Suche wirst du feststellen, dass die Meldung des Redaktionsnetzwerks zwar von einigen Redaktionen aufgegriffen wurde, ansonten aber kaum Diskussionen dazu stattfanden. (Du könntest also auch überlegen, ob ein Artikel zu diesem Thema tatsächlich wichtig ist.) Du wendest damit den Tipp 'Weitere Informationen recherchieren' an.

63 |

Da du über Netzbefragung schon kaum weitere Meldungen gefunden hast, ist der vierte Tipp 'Zurück zum Original' in diesem Beispiel nicht erfolgsversprechend. Es gibt kaum weitere Berichte dazu. 64 | 65 | 66 | 67 |

Möchtest du ein weiteres Beispiel ausprobieren?

68 | 69 |

Im nächsten Beispiel beschäftigen wir uns mit einer Meldung der Zivilen Koalition Deutschland. 70 | 71 |

72 |

77 |

78 | 79 | 80 | 81 |
82 |
83 |
84 | 85 | 86 |
87 | 88 | 92 |
93 | 94 |
95 | 96 | 97 | 98 | 99 | 100 | 101 | 102 | 103 | 104 | 105 | 106 | 107 | -------------------------------------------------------------------------------- /loesung3.html: -------------------------------------------------------------------------------- 1 | 2 | 7 | 8 | 9 | Fakten prüfen im Netz 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 40 | 41 | 42 |
43 | 44 |
45 |
46 | 47 |
48 | 49 |

Faktenprüfung Beispiel 3: Kevin Kühnert und die GroKo

50 |

Da du in unserem Gedankenspiel mit den Widerworten von Kevin Kühnert zur Groko sympathisierst, kann es sein, dass du zunächst ziemlich empört bist. Genau in dieser Situation ist es hilfreich, nicht emotional und aufgeregt einen Beitrag z. B. auf Facebook dazu zu teilen, sondern erst einmal Tipps zur Faktenprüfung anzuwenden.

51 | 52 |

Zurück zum Original und weitere Informationen

53 | 54 |

Quelle 55 | 56 |

'Stopp' ist für dich in diesem Beispiel keine Option. Die Bild-Zeitung ist dir als Quelle bekannt. Deshalb musst du auch den zweiten Tipp nicht anwenden. Verbleiben also Tipp 3 'Weitere Informationen finden' und Tipp 4 'Zurück zum Original'. Beides gelingt dir am besten in Form einer Netzbefragung. Überleg dir passende Suchbegriffe (zum Beispiel: Kühnert Kehrtwende Groko') und starte damit eine Internetsuche. Im Bild-Artikel ist zudem die Quelle des Original-Interviews mit RP-Online angegeben. 'Groko Kühnert Interview RP Online' lässt dich vor diesem Hintergrund leicht den Original-Artikel finden.

57 |

In diesem Beispiel ist es so, dass sich jemand anderes die Mühe gemacht hat, Original und Zitat zu vergleichen. Auf der Seite des 'Volksverpetzers' findest du aufgelistet alle relevanten Links zu dieser Debatte. Auch hier gilt: Mit dieser Darstellung musst du nicht einverstanden sein - in jedem Fall hast du jetzt aber eine deutlich bessere Grundlage, die Information der Bild-Zeitung für dich einzuordnen, als wenn du keine der Faktenprüfungs-Tipps angewandt hättest und nur beim ersten Inhalt geblieben wärst.

58 | 59 | 60 | 61 | 62 |

Abschluss und Ausblick

63 | 64 |

Dieses Beispiel ist das letzte Beispiel von uns. Erfahre, wie du nun weiter vorgehen kannst. 65 | 66 |

71 |

72 | 73 | 74 | 75 |
76 |
77 |
78 | 79 | 80 |
81 | 82 | 83 | 87 |
88 | 89 |
90 | 91 | 92 | 93 | 94 | 95 | 96 | 97 | 98 | 99 | 100 | 101 | 102 | -------------------------------------------------------------------------------- /informationen.html: -------------------------------------------------------------------------------- 1 | 2 | 7 | 8 | 9 | Fakten prüfen im Netz 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 40 | 41 | 42 |
43 | 44 |
45 |
46 | 47 |
48 | 49 | 50 |

Tipp 3: Weitere Informationen finden!

51 | 52 |

Weitere Informationen finden 53 | 54 | 55 |

Oft ist es gar nicht die Quelle, die wichtig ist, sondern was von einer bestimmten Information zu halten ist. Das möchten wir wieder an einem Gedankenexperiment verdeutlichen:

56 | 57 |

Stell dir vor, dass du einen Artikel gelesen hast, in dem die These vertreten wird, dass Bildschirmzeit bei Kindern unter 6 Jahren die Augen schädigt. Du hast eine kleine Tochter. Darum findest du das Thema für dich relevant. Der Wikipedia-Trick ergibt, dass der Artikel in einem Eltern-Blog veröffentlicht ist. Wichtig für dich ist nun aber gar nicht so sehr diese Quelle. Vielmehr möchtest du dir eine Meinung bilden und für dich die Frage beantworten können: Kann ich meine Tochter guten Gewissens hin und wieder auf dem Tablet spielen lassen?

58 |

Was wirst du tun?

59 |

Um ein umfassenderes Bild zum Thema zu gewinnen, kann es hilfreich sein, nach Artikeln zu recherchieren, die unterschiedliche Perspektiven, Studien und Diskussionen auflisten anstatt sich auf Artikel zu beschränken, die klare Pro- oder Contra-Positionen beziehen. Dein Ziel sollte es also sein, solche Artikel zu finden, indem du eine einfache Netzbefragung durchführst. Dabei hilft dir eine einfache Suchmaschine, in die du die passenden Schlagworte zu deiner Information einträgst. In unserem Beispiel also: Bildschirmzeit, Augen, Kita-Alter.

60 | 61 |

Den Tipp ‘Weitere Informationen finden’ kannst du auch anwenden, wenn du erfahren willst, ob eine bestimmte Information für dich von Relevanz ist oder nicht. Wenn also zum Beispiel in der WhatsApp-Gruppe vor einem gefährlichen Computervirus gewarnt wird, dann ist es am besten, die Schlagworte dazu kurz bei einer Suchmaschine einzugeben bzw. gezielt nach aktuellen Meldungen dazu zu recherchieren. Du kannst dir fast ganz sicher sein: Wenn niemand im Netz über den Computervirus schreibt, dann wird er eher nicht relevant sein.

62 | 63 |

Mit den Tipps 'Stopp', 'Quelle überprüfen' und 'Weitere Informationen finden' gelingt dir schon eine sehr wirkungsvolle Faktenprüfung. Uns fehlt nun nur noch eine Erklärung zu Tipp 4: Zurück zum Ursprung!

64 |

65 |

70 |

71 | 72 | 73 | 74 |
75 |
76 |
77 | 78 | 79 |
80 | 81 | 82 | 86 |
87 | 88 |
89 | 90 | 91 | 92 | 93 | 94 | 95 | 96 | 97 | 98 | 99 | 100 | 101 | -------------------------------------------------------------------------------- /assets/sass/libs/_breakpoints.scss: -------------------------------------------------------------------------------- 1 | // breakpoints.scss v1.0 | @ajlkn | MIT licensed */ 2 | 3 | // Vars. 4 | 5 | /// Breakpoints. 6 | /// @var {list} 7 | $breakpoints: () !global; 8 | 9 | // Mixins. 10 | 11 | /// Sets breakpoints. 12 | /// @param {map} $x Breakpoints. 13 | @mixin breakpoints($x: ()) { 14 | $breakpoints: $x !global; 15 | } 16 | 17 | /// Wraps @content in a @media block targeting a specific orientation. 18 | /// @param {string} $orientation Orientation. 19 | @mixin orientation($orientation) { 20 | @media screen and (orientation: #{$orientation}) { 21 | @content; 22 | } 23 | } 24 | 25 | /// Wraps @content in a @media block using a given query. 26 | /// @param {string} $query Query. 27 | @mixin breakpoint($query: null) { 28 | 29 | $breakpoint: null; 30 | $op: null; 31 | $media: null; 32 | 33 | // Determine operator, breakpoint. 34 | 35 | // Greater than or equal. 36 | @if (str-slice($query, 0, 2) == '>=') { 37 | 38 | $op: 'gte'; 39 | $breakpoint: str-slice($query, 3); 40 | 41 | } 42 | 43 | // Less than or equal. 44 | @elseif (str-slice($query, 0, 2) == '<=') { 45 | 46 | $op: 'lte'; 47 | $breakpoint: str-slice($query, 3); 48 | 49 | } 50 | 51 | // Greater than. 52 | @elseif (str-slice($query, 0, 1) == '>') { 53 | 54 | $op: 'gt'; 55 | $breakpoint: str-slice($query, 2); 56 | 57 | } 58 | 59 | // Less than. 60 | @elseif (str-slice($query, 0, 1) == '<') { 61 | 62 | $op: 'lt'; 63 | $breakpoint: str-slice($query, 2); 64 | 65 | } 66 | 67 | // Not. 68 | @elseif (str-slice($query, 0, 1) == '!') { 69 | 70 | $op: 'not'; 71 | $breakpoint: str-slice($query, 2); 72 | 73 | } 74 | 75 | // Equal. 76 | @else { 77 | 78 | $op: 'eq'; 79 | $breakpoint: $query; 80 | 81 | } 82 | 83 | // Build media. 84 | @if ($breakpoint and map-has-key($breakpoints, $breakpoint)) { 85 | 86 | $a: map-get($breakpoints, $breakpoint); 87 | 88 | // Range. 89 | @if (type-of($a) == 'list') { 90 | 91 | $x: nth($a, 1); 92 | $y: nth($a, 2); 93 | 94 | // Max only. 95 | @if ($x == null) { 96 | 97 | // Greater than or equal (>= 0 / anything) 98 | @if ($op == 'gte') { 99 | $media: 'screen'; 100 | } 101 | 102 | // Less than or equal (<= y) 103 | @elseif ($op == 'lte') { 104 | $media: 'screen and (max-width: ' + $y + ')'; 105 | } 106 | 107 | // Greater than (> y) 108 | @elseif ($op == 'gt') { 109 | $media: 'screen and (min-width: ' + ($y + 1) + ')'; 110 | } 111 | 112 | // Less than (< 0 / invalid) 113 | @elseif ($op == 'lt') { 114 | $media: 'screen and (max-width: -1px)'; 115 | } 116 | 117 | // Not (> y) 118 | @elseif ($op == 'not') { 119 | $media: 'screen and (min-width: ' + ($y + 1) + ')'; 120 | } 121 | 122 | // Equal (<= y) 123 | @else { 124 | $media: 'screen and (max-width: ' + $y + ')'; 125 | } 126 | 127 | } 128 | 129 | // Min only. 130 | @else if ($y == null) { 131 | 132 | // Greater than or equal (>= x) 133 | @if ($op == 'gte') { 134 | $media: 'screen and (min-width: ' + $x + ')'; 135 | } 136 | 137 | // Less than or equal (<= inf / anything) 138 | @elseif ($op == 'lte') { 139 | $media: 'screen'; 140 | } 141 | 142 | // Greater than (> inf / invalid) 143 | @elseif ($op == 'gt') { 144 | $media: 'screen and (max-width: -1px)'; 145 | } 146 | 147 | // Less than (< x) 148 | @elseif ($op == 'lt') { 149 | $media: 'screen and (max-width: ' + ($x - 1) + ')'; 150 | } 151 | 152 | // Not (< x) 153 | @elseif ($op == 'not') { 154 | $media: 'screen and (max-width: ' + ($x - 1) + ')'; 155 | } 156 | 157 | // Equal (>= x) 158 | @else { 159 | $media: 'screen and (min-width: ' + $x + ')'; 160 | } 161 | 162 | } 163 | 164 | // Min and max. 165 | @else { 166 | 167 | // Greater than or equal (>= x) 168 | @if ($op == 'gte') { 169 | $media: 'screen and (min-width: ' + $x + ')'; 170 | } 171 | 172 | // Less than or equal (<= y) 173 | @elseif ($op == 'lte') { 174 | $media: 'screen and (max-width: ' + $y + ')'; 175 | } 176 | 177 | // Greater than (> y) 178 | @elseif ($op == 'gt') { 179 | $media: 'screen and (min-width: ' + ($y + 1) + ')'; 180 | } 181 | 182 | // Less than (< x) 183 | @elseif ($op == 'lt') { 184 | $media: 'screen and (max-width: ' + ($x - 1) + ')'; 185 | } 186 | 187 | // Not (< x and > y) 188 | @elseif ($op == 'not') { 189 | $media: 'screen and (max-width: ' + ($x - 1) + '), screen and (min-width: ' + ($y + 1) + ')'; 190 | } 191 | 192 | // Equal (>= x and <= y) 193 | @else { 194 | $media: 'screen and (min-width: ' + $x + ') and (max-width: ' + $y + ')'; 195 | } 196 | 197 | } 198 | 199 | } 200 | 201 | // String. 202 | @else { 203 | 204 | // Missing a media type? Prefix with "screen". 205 | @if (str-slice($a, 0, 1) == '(') { 206 | $media: 'screen and ' + $a; 207 | } 208 | 209 | // Otherwise, use as-is. 210 | @else { 211 | $media: $a; 212 | } 213 | 214 | } 215 | 216 | } 217 | 218 | // Output. 219 | @media #{$media} { 220 | @content; 221 | } 222 | 223 | } -------------------------------------------------------------------------------- /ursprung.html: -------------------------------------------------------------------------------- 1 | 2 | 7 | 8 | 9 | Fakten prüfen im Netz 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 40 | 41 | 42 |
43 | 44 |
45 |
46 | 47 |
48 | 49 | 50 |

Tipp 4: Zurück zum Original!

51 | 52 |

Erste Hand 53 | 54 |

Viele Dinge, die man im Internet findet, wurden aus dem Zusammenhang gerissen. Vielleicht gibt es ein Video von einem Kampf zwischen zwei Leuten. Aber wie ist es dazu gekommen? Was geschah wirklich vor Ort? Was wurde aus dem Video herausgeschnitten und was blieb drin?

55 | 56 |

Vielleicht gibt es ein Bild, das real erscheint, aber die Bildunterschrift ist bestenfalls zweifelhaft. Vielleicht wird eine neue medizinische Behandlung auf der Grundlage einer Forschungsarbeit beansprucht - aber du bist nicht sicher, ob die Studie diese Empfehlung tatsächlich unterstützt.

57 | 58 |

In diesen Fällen lautet unsere Empfehlung: Verfolge das Zitat oder das entsprechende Medium (Bild, Video etc.) bis zum Original zurück, so dass du sie in ihrem ursprünglichen Kontext siehst. Das zeigt dir, ob die weitergegebene Darstellung stimmig und richtig ist.

59 | 60 |

Beispiel: ‘Grundschulverbot’ von Linnemann

61 | 62 |

Sehr gut veranschaulichen lässt sich diese Herausforderung anhand der Debatte um das von Carsten Linnemann vermeintlich geforderte ‘Grundschulverbot’ für Kinder, die kein Deutsch sprechen.

63 | 64 |

Auf Twitter stößt du dazu auf dieses Bild, ohne die Debatte zu kennen:

65 |

66 |
67 |
Linnemann-Tweet
68 | 69 |
70 |
71 | 72 |

Du könntest den Beitrag nun - je nach deiner eigenen politischen Positionierung - empört oder zustimmend retweeten, einen Screenshot anfertigen oder recherchieren, welcher Account sich hinter @TKuban96 verbirgt. Im Interesse einer Faktenprüfung und der hier vorgestellten Tipps, wäre jedoch ein anderer Weg aber empfehlenswert: Die Information zur Quelle zurückverfolgen! 73 | 74 |

Das funktioniert mit den bereits geschilderten Möglichkeiten der 'Netzbefragung'. Die RP online ist als Quelle im Tweet in diesem Fall sogar angegeben. Eine einfache Suche mit den Schlagworten 'Linnemann, Grundschule, RP Online' führt uns schnell zum Original-Interview. 75 | 76 |

Und wie ist das bei Bildern?

77 | 78 |

Um Bilder zum Ursprung zurückzuverfolgen gibt es ebenfalls einen einfachen Weg: die Bilder-Rückwärtssuche

79 |

80 |

85 | 86 |

87 | 88 | 89 | 90 |
91 |
92 |
93 | 94 | 95 |
96 | 97 | 98 | 102 |
103 | 104 |
105 | 106 | 107 | 108 | 109 | 110 | 111 | 112 | 113 | 114 | 115 | 116 | 117 | -------------------------------------------------------------------------------- /stopp.html: -------------------------------------------------------------------------------- 1 | 2 | 7 | 8 | 9 | Fakten prüfen im Netz 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 40 | 41 | 42 |
43 | 44 |
45 |
46 | 47 |
48 | 49 | 50 |

Tipp 1: Stopp!

51 | 52 | 53 |

Stopp 54 | 55 |

Um den ersten Tipp vorzustellen, schlagen wir dir ein weiteres Gedankenexperiment vor: 56 | 57 |

Stell dir vor, du kommst gerade von der Arbeit nach Hause. Dein Smartphone vibriert: Ein Bekannter hat dir einen Link zu einer Website der Universität Gießen geschickt - mit dem Kommentar: "Deutsche Internetsicherheit - LOL 😆!" Der Teaser des Artikels lautet: "Universität Gießen aus Sicherheitsgründen offline. Wegen Verdachts auf Cyber-Angriff wird Strafanzeige gestellt."

58 |

Was wirst du tun?

59 |

Vielleicht handelt es sich hierbei um ein Thema, das dich gerade beschäftigt und somit relevant für dich ist. Zum Beispiel, weil du als Mitarbeiterin an der Universität Gießen beschäftigt bist. Dein Bekannter weiß das und will dir deshalb diese Information zukommen lassen. Sehr viel häufiger - und damit wahrscheinlicher - ist aber ein anderer Fall: Dein Bekannter hat etwas im Internet gelesen, das ihn überrascht oder wütend gemacht hat oder das er einfach lustig fand - nun möchte er seine Emotionen mit dir teilen. Deshalb schickt er dir den Link zu diesem Artikel. 60 |

61 | 62 |

In diesem Fall hilft dir der erste der vier Tipps: Stopp!

63 | 64 |

Stopp 65 | 66 | 67 |

Konkret bedeutet das: Bevor du - aus Gewohnheit oder Neugierde - auf den Link klickst und zu lesen beginnst, solltest Du dir die Frage stellen: Möchte ich wirklich diese Website öffnen? Will ich den Artikel lesen? Hat das Thema für mich Relevanz? Will ich mich weiter damit auseinandersetzen?

68 | 69 |

Wenn Du auf diese Fragen nicht mit einem sehr überzeugten ‘Ja’ antwortest, dann leg dein Smartphone schnell wieder beiseite oder investiere deine Bildschirmzeit lieber in etwas, das du selbst auswählst und das dich tatsächlich interessiert.

70 | 71 |

Dieser 'Stopp-Tipp' ist übrigens auch dann hilfreich, wenn du schon mitten in den Tiefen des Internets unterwegs bist. Zum Beispiel, weil du vom Link deines Bekannten ausgehend, angefangen hast, nach weiteren Cyber-Angriffen auf Universitäten zu googeln - und bevor du dich versiehst, klickst du dich von Artikel zu Artikel. Hier gilt: Besser ein spätes 'Stopp', als gar keins. 72 | 73 |

Was aber, wenn die Information für dich relevant ist? Dann lohnt es sich, einen Blick auf die anderen Tipps zu werfen. Der zweite Tipp lautet: Quelle überprüfen! 74 | 75 | 76 |

77 | 78 | 83 | 84 |
85 |
86 | 87 | 88 |
89 | 90 | 91 | 95 |
96 | 97 |
98 | 99 | 100 | 101 | 102 | 103 | 104 | 105 | 106 | 107 | 108 | 109 | 110 | -------------------------------------------------------------------------------- /loesung2.html: -------------------------------------------------------------------------------- 1 | 2 | 7 | 8 | 9 | Fakten prüfen im Netz 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 40 | 41 | 42 |
43 | 44 |
45 |
46 | 47 |
48 | 49 |

Faktenprüfung Beispiel 2: EU-Mitgliedsbeiträge

50 |

Da du mit deiner Freundin erst gestern Abend über das Thema diskutierst hast, hast du dich bereits mit dem Thema auseinander gesetzt und nun wartet sie auf eine Rückmeldung von dir. Der 'Stopp-Tipp' ist hier wahrscheinlich nicht die passendste Option. Du könntest dich also direkt mit den verbleibenden drei Tipps beschäftigen.

51 | 52 |

Woher stammt die Information?

53 | 54 |

Loesung2 55 | 56 |

Bevor du dich näher mit einer Information beschäftigst, könntest du zunächst wieder überprüfen, woher sie stammt. Dazu kannst Du den Wikipedia-Trick nutzen. Die Suche nach 'Zivile Koalition Wikipedia' führt uns direkt zu diesem Wikipedia-Artikel über den Zivile Koalition e. V.; im Artikel steht: "Der Zivile Koalition e.V. ist ein konservativer politischer Verein in Deutschland." Weiter wird dargestellt, dass der Verein von der AfD-Politikerin Beatrix von Storch gegründet wurde und eng mit der Familie von Storch verflochten ist.

57 |

Wichtig ist daran nun: Der Wikipedia-Artikel sagt uns nichts darüber, ob die Information richtig ist oder nicht. Er hilft uns aber bei der Einordnung. Eine Schlussfolgerung könnte sein, dass du mithilfe des Wikipedia-Tricks nun relativ sicher sein kannst, dass der Artikel ein politisches Anliegen hat und für eine bestimmte Position werben will, aber nicht das Ziel einer möglichst umfassenden Darstellung über EU-Mitgliedsbeiträge verfolgt. Das Anliegen kann berechtigt sein. Zur Faktenprüfung solltest du aber Informationen nutzen, die mehr abdecken und den Sachverhalt umfassender darstellen.

58 |

Deshalb empfehlen wir, Tipp 3 und Tipp 4 zu nutzen: Du könntest im ersten Schritt den Suchbegriff 'EU-Mitgliedsbeitrag' in die Suchleiste eingeben, um Berichte zu finden, die umfassender und ausführlicher geschrieben sind. Danach könntest du dich auf die Suche nach der im Artikel zitierten Original-Quelle begeben. Mit den Suchbegriffen 'Gert Jan Koopman Neuberechnung der EU-Beiträge' findest du die Pressemeldung der EU-Kommission inklusive Verlinkungen zu weiteren Berichten zum Thema aus der Kommission.

59 |

Auf Basis dieser Faktenprüfung mit drei der vier Tipps kannst du die Information deiner Freundin nun für dich einordnen und bewerten.

60 | 61 | 62 | 63 | 64 |

Noch ein Beispiel gesucht?

65 | 66 |

Als drittes und letztes Bespiel haben wir die Debatte um das 'Groko-Aus' und die Position von Juso-Chef Kevin Kühnert ausgewählt. 67 | 68 |

69 |

74 |

75 | 76 | 77 | 78 |
79 |
80 |
81 | 82 | 83 |
84 | 85 | 86 | 90 |
91 | 92 |
93 | 94 | 95 | 96 | 97 | 98 | 99 | 100 | 101 | 102 | 103 | 104 | 105 | -------------------------------------------------------------------------------- /impressum.html: -------------------------------------------------------------------------------- 1 | 2 | 7 | 8 | 9 | Fakten prüfen im Netz 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 40 | 41 | 42 |
43 |
44 |

Formalia

45 |

Impressum und Hinweise zum Datenschutz

46 |
47 |
48 |
49 | 50 |
51 |

Impressum

52 |

53 | ‘Fakten prüfen im Netz’ ist ein Angebot von

54 | 55 |

der Zentral- und Landesbibliothek Berlin, das auf Initiative von und in Zusammenarbeit mit Wikimedia Deutschland e.V. gemeinsam mit dem eBildungslabor umgesetzt wurde.

56 | 57 |

Diensteanbieter

58 | 59 |

Anbieter dieser Internetpräsenz ist im Rechtssinne die Stiftung Zentral- und Landesbibliothek Berlin. Die Zentral- und Landesbibliothek Berlin ist eine Stiftung des öffentlichen Rechts. 60 | Aufsichtsbehörde ist die Berliner Senatsverwaltung für Kultur und Europa.

61 | 62 |

Stiftung Zentral- und Landesbibliothek Berlin 63 |
Blücherplatz 1 64 |
10961 Berlin 65 |
E-Mail: MachWas@zlb.de 66 |
Webseite: https://www.zlb.de 67 |
Telefon: +49 (0)30-90226-0 68 |

69 |

Vorstand: Volker Heller

70 | 71 |

Lizenzhinweise

72 | 73 |

Soweit nicht anders angegeben, sind sämtliche Texte dieser Webseite unter der Lizenz Creative Commons Namensnennung 4.0 International lizenziert.

74 | 75 |

Alle Grafiken auf dieser Webseite wurden von graphicrecording.cool produziert und sind - soweit nicht anders angegeben - unter der Lizenz Creative Commons Namensnennung - Weitergabe unter gleichen Bedingungen 4.0 International lizenziert.

76 | 77 |

Alle Screencasts wurden von ebildungslabor produziert und sind unter der Lizenz CC0 1.0 Universell Public Domain Dedication lizenziert.

78 | 79 |

Das Design der Website stammt von HTML5 UPund ist unter der Lizenz Creative Commons Namensnennung 3.0 Unported lizenziert.

80 | 81 |

Alle Inhalte können unter den in der jeweiligen Lizenz genannten Bedingungen weitergenutzt, verändert und veröffentlicht werden. 82 | Soweit Screenshots oder aber Screencasts Werke Dritter zeigen (z. B. Online-Werbung), sind diese Dritt-Inhalte nicht von der vorgenannten CC-Lizenz erfasst. Für diese Bestandteile des Angebots gelten die üblichen Regelungen, wonach sie nur mit Erlaubnis der jeweiligen Rechteinhaber oder nach gesetzlicher Erlaubnis (z. B. Zitatrecht) genutzt werden dürfen.

83 | 84 | 85 | 86 |

87 | 88 |

Hinweise zum Datenschutz

89 |

... 90 |

91 | 92 | 95 | 96 |
97 |
98 | 99 | 100 |
101 | 102 | 103 | 107 |
108 | 109 |
110 | 111 | 112 | 113 | 114 | 115 | 116 | 117 | 118 | 119 | 120 | 121 | 122 | -------------------------------------------------------------------------------- /kontext.html: -------------------------------------------------------------------------------- 1 | 2 | 7 | 8 | 9 | Fakten prüfen im Netz 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 40 | 41 | 42 |
43 | 44 |
45 |
46 | 47 |
48 | 49 | 50 |

Bevor es losgeht

51 | 52 |

Wir beginnen mit einem Gedankenexperiment. Stell dir vor, du recherchierst zu einem Thema im Internet und landest auf dieser Website:

53 | 54 | 55 |
56 |
57 |
Hubschrauber Screenshot
58 | 59 |
60 |
61 | 62 | 63 | 64 |

Vielleicht denkst du jetzt:

65 | 66 |

Engelchen und Teufelchen 67 |

Das wirkt auf mich nicht sehr plausibel und glaubwürdig. Aber wer weiß, vielleicht ist da doch etwas dran?
68 | 69 | 70 |

Wahrscheinlich hast du nun keine Zeit, um die Website einer langwierigen Prüfung zu unterziehen. Vielleicht bist du dir auch unsicher, was genau du eigentlich wie prüfen sollst: Könnte es relevant sein, dass die Website Werbeanzeigen schaltet? Deutet die eher unprofessionelle Gestaltung auf fehlende Seriosität hin? Würde es helfen, sich das Impressum anzusehen?

71 | 72 | 73 |

Aus unserer Perspektive wird Faktenprüfung dann wirkungsvoll, wenn wir uns nicht nur mit dem Inhalt an sich beschäftigen, sondern uns auch den Kontext ansehen. Mögliche Fragen in diesem Sinne können sein: Wer berichtet sonst noch von dieser Information? Von wem wird die Information verbreitet? Worauf bezieht sich die Information?

74 |

Dieser Ansatz hat drei entscheidende Vorteile: 75 |

    76 |
  • Er passt zu einer digitalisierten und vernetzten Gesellschaft, in der wir ständig mit immer neuen Informationen konfrontiert sind. Er funktioniert schnell und zuverlässig.
  • 77 |
  • Er ermöglicht, auf das Wissen anderer zurückzugreifen: Wir müssen beispielsweise nicht selbst herausfinden, ob ein Bild gefälscht ist, wenn jemand anderes diese Information bereits überprüft hat.
  • 78 |
  • Er kann leicht und von jeder Person genutzt werden. Es geht weniger um 'Wissenschaft', sondern eher um prakische 'Lifehacks' und Handlungsroutinen. 79 |
80 |

81 |

Der Ansatz beinhaltet vier einfach zu erlernende Tipps:

82 |

    83 |
  1. Stopp: Will ich das wirklich lesen/ hören/ ansehen? 84 |
  2. Quellen überprüfen: Von wem stammt die Information? 85 |
  3. Weitere Informationen finden: Was sagen andere dazu? 86 |
  4. Zurück zum Ursprung: Auf was bezieht sich die Information genau? 87 |
88 |

Du kannst diese vier Tipps unabhängig voneinander anwenden oder miteinander kombinieren. Wie genau das funktioniert, erkunden wir auf den nächsten Seiten. Lass uns mit dem ersten Tipp - dem 'Stopp' - beginnen! 89 | 90 | 91 |

92 | 93 | 98 | 99 | 100 | 101 | 102 |
103 |
104 |
105 | 106 | 107 |
108 | 109 | 110 | 114 |
115 | 116 |
117 | 118 | 119 | 120 | 121 | 122 | 123 | 124 | 125 | 126 | 127 | 128 | 129 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 7 | 8 | 9 | Fakten prüfen im Netz 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 41 | 42 | 43 | 51 | 52 | 53 | 54 |
55 |
56 |
57 |

Worum geht es hier?

58 |

Sicher fühlst auch du dich manchmal regelrecht erschlagen von all den Informationen, die dich auf Social Media, über Messengerdienste oder auf Websites im Internet erreichen. Ob es sich dabei um Informationen aus vertrauenswürdigen Quellen handelt, ist oft nicht ersichtlich. Das lässt sich ändern! Mit 'Fakten prüfen im Netz' erkundest du vier Tipps, die dich dabei unterstützen, solche Inhalte besser einordnen zu können: 59 | 60 | 61 |

62 | 63 |
64 | 65 |
66 | 67 | 68 |
69 |
70 |

Tipp 1: Stopp

71 |

Wenn die Information für dich nicht relevant ist, dann ist der beste Weg, dich erst gar nicht näher damit auseinander zu setzen. Sage Stopp!

72 |
73 |
74 |
75 |
76 |

Tipp 2: Quellen überprüfen

77 |

Wenn der Inhalt für dich relevant ist, dann solltest du die Information einordnen können, bevor Du dich näher damit auseinandersetzt. Überprüfe dazu die Quelle.

78 |
79 |
80 |
81 |
82 |

Tipp 3: Weitere Informationen recherchieren

83 |

Wenn du mehr über eine bestimmte Aussage wissen und dir eine eigene Meinung bilden willst, dann hilft die Recherche nach weiteren Informationen, die das Thema möglichst umfassend von unterschiedlichen Seiten beleuchten.

84 |
85 |
86 |
87 |
88 |

Tipp 4: Zurück zum Original

89 |

Da Informationen im Netz fast immer nur Ausschnitte von Situationen wiedergeben, ist es zur Einordnung hilfreich, nach dem Original zu suchen. Wo ist der Ursprung der Information?

90 |
91 |
92 |
93 | 94 |
95 |
96 |
97 |

98 |

Auf den folgenden Seiten wollen wir diese vier Tipps anhand von Praxisbeispielen und Übungen veranschaulichen. Natürlich kannst du deinen Rhythmus selbst bestimmen, entscheiden, welche Tipps relevant für dich sind und schließlich auswählen, was zu dir passt. 99 | 100 |

102 | 103 |
104 |
105 | 106 | 107 | 108 | 109 |
110 |
111 |
112 |

Weitere Informationen

113 |


Warum gibt es das Angebot 'Fakten prüfen im Netz'? Was steckt dahinter? Wie ist es entstanden?

114 |
115 |
    116 | 117 |
  • Lesen
  • 118 |
119 |
120 |
121 | 122 | 123 |
124 | 125 | 126 | 130 |
131 | 132 |
133 | 134 | 135 | 136 | 137 | 138 | 139 | 140 | 141 | 142 | 143 | 144 | 145 | -------------------------------------------------------------------------------- /assets/sass/libs/_vendor.scss: -------------------------------------------------------------------------------- 1 | // vendor.scss v1.0 | @ajlkn | MIT licensed */ 2 | 3 | // Vars. 4 | 5 | /// Vendor prefixes. 6 | /// @var {list} 7 | $vendor-prefixes: ( 8 | '-moz-', 9 | '-webkit-', 10 | '-ms-', 11 | '' 12 | ); 13 | 14 | /// Properties that should be vendorized. 15 | /// Data via caniuse.com, github.com/postcss/autoprefixer, and developer.mozilla.org 16 | /// @var {list} 17 | $vendor-properties: ( 18 | 19 | // Animation. 20 | 'animation', 21 | 'animation-delay', 22 | 'animation-direction', 23 | 'animation-duration', 24 | 'animation-fill-mode', 25 | 'animation-iteration-count', 26 | 'animation-name', 27 | 'animation-play-state', 28 | 'animation-timing-function', 29 | 30 | // Appearance. 31 | 'appearance', 32 | 33 | // Backdrop filter. 34 | 'backdrop-filter', 35 | 36 | // Background image options. 37 | 'background-clip', 38 | 'background-origin', 39 | 'background-size', 40 | 41 | // Box sizing. 42 | 'box-sizing', 43 | 44 | // Clip path. 45 | 'clip-path', 46 | 47 | // Filter effects. 48 | 'filter', 49 | 50 | // Flexbox. 51 | 'align-content', 52 | 'align-items', 53 | 'align-self', 54 | 'flex', 55 | 'flex-basis', 56 | 'flex-direction', 57 | 'flex-flow', 58 | 'flex-grow', 59 | 'flex-shrink', 60 | 'flex-wrap', 61 | 'justify-content', 62 | 'order', 63 | 64 | // Font feature. 65 | 'font-feature-settings', 66 | 'font-language-override', 67 | 'font-variant-ligatures', 68 | 69 | // Font kerning. 70 | 'font-kerning', 71 | 72 | // Fragmented borders and backgrounds. 73 | 'box-decoration-break', 74 | 75 | // Grid layout. 76 | 'grid-column', 77 | 'grid-column-align', 78 | 'grid-column-end', 79 | 'grid-column-start', 80 | 'grid-row', 81 | 'grid-row-align', 82 | 'grid-row-end', 83 | 'grid-row-start', 84 | 'grid-template-columns', 85 | 'grid-template-rows', 86 | 87 | // Hyphens. 88 | 'hyphens', 89 | 'word-break', 90 | 91 | // Masks. 92 | 'mask', 93 | 'mask-border', 94 | 'mask-border-outset', 95 | 'mask-border-repeat', 96 | 'mask-border-slice', 97 | 'mask-border-source', 98 | 'mask-border-width', 99 | 'mask-clip', 100 | 'mask-composite', 101 | 'mask-image', 102 | 'mask-origin', 103 | 'mask-position', 104 | 'mask-repeat', 105 | 'mask-size', 106 | 107 | // Multicolumn. 108 | 'break-after', 109 | 'break-before', 110 | 'break-inside', 111 | 'column-count', 112 | 'column-fill', 113 | 'column-gap', 114 | 'column-rule', 115 | 'column-rule-color', 116 | 'column-rule-style', 117 | 'column-rule-width', 118 | 'column-span', 119 | 'column-width', 120 | 'columns', 121 | 122 | // Object fit. 123 | 'object-fit', 124 | 'object-position', 125 | 126 | // Regions. 127 | 'flow-from', 128 | 'flow-into', 129 | 'region-fragment', 130 | 131 | // Scroll snap points. 132 | 'scroll-snap-coordinate', 133 | 'scroll-snap-destination', 134 | 'scroll-snap-points-x', 135 | 'scroll-snap-points-y', 136 | 'scroll-snap-type', 137 | 138 | // Shapes. 139 | 'shape-image-threshold', 140 | 'shape-margin', 141 | 'shape-outside', 142 | 143 | // Tab size. 144 | 'tab-size', 145 | 146 | // Text align last. 147 | 'text-align-last', 148 | 149 | // Text decoration. 150 | 'text-decoration-color', 151 | 'text-decoration-line', 152 | 'text-decoration-skip', 153 | 'text-decoration-style', 154 | 155 | // Text emphasis. 156 | 'text-emphasis', 157 | 'text-emphasis-color', 158 | 'text-emphasis-position', 159 | 'text-emphasis-style', 160 | 161 | // Text size adjust. 162 | 'text-size-adjust', 163 | 164 | // Text spacing. 165 | 'text-spacing', 166 | 167 | // Transform. 168 | 'transform', 169 | 'transform-origin', 170 | 171 | // Transform 3D. 172 | 'backface-visibility', 173 | 'perspective', 174 | 'perspective-origin', 175 | 'transform-style', 176 | 177 | // Transition. 178 | 'transition', 179 | 'transition-delay', 180 | 'transition-duration', 181 | 'transition-property', 182 | 'transition-timing-function', 183 | 184 | // Unicode bidi. 185 | 'unicode-bidi', 186 | 187 | // User select. 188 | 'user-select', 189 | 190 | // Writing mode. 191 | 'writing-mode', 192 | 193 | ); 194 | 195 | /// Values that should be vendorized. 196 | /// Data via caniuse.com, github.com/postcss/autoprefixer, and developer.mozilla.org 197 | /// @var {list} 198 | $vendor-values: ( 199 | 200 | // Cross fade. 201 | 'cross-fade', 202 | 203 | // Element function. 204 | 'element', 205 | 206 | // Filter function. 207 | 'filter', 208 | 209 | // Flexbox. 210 | 'flex', 211 | 'inline-flex', 212 | 213 | // Grab cursors. 214 | 'grab', 215 | 'grabbing', 216 | 217 | // Gradients. 218 | 'linear-gradient', 219 | 'repeating-linear-gradient', 220 | 'radial-gradient', 221 | 'repeating-radial-gradient', 222 | 223 | // Grid layout. 224 | 'grid', 225 | 'inline-grid', 226 | 227 | // Image set. 228 | 'image-set', 229 | 230 | // Intrinsic width. 231 | 'max-content', 232 | 'min-content', 233 | 'fit-content', 234 | 'fill', 235 | 'fill-available', 236 | 'stretch', 237 | 238 | // Sticky position. 239 | 'sticky', 240 | 241 | // Transform. 242 | 'transform', 243 | 244 | // Zoom cursors. 245 | 'zoom-in', 246 | 'zoom-out', 247 | 248 | ); 249 | 250 | // Functions. 251 | 252 | /// Removes a specific item from a list. 253 | /// @author Hugo Giraudel 254 | /// @param {list} $list List. 255 | /// @param {integer} $index Index. 256 | /// @return {list} Updated list. 257 | @function remove-nth($list, $index) { 258 | 259 | $result: null; 260 | 261 | @if type-of($index) != number { 262 | @warn "$index: #{quote($index)} is not a number for `remove-nth`."; 263 | } 264 | @else if $index == 0 { 265 | @warn "List index 0 must be a non-zero integer for `remove-nth`."; 266 | } 267 | @else if abs($index) > length($list) { 268 | @warn "List index is #{$index} but list is only #{length($list)} item long for `remove-nth`."; 269 | } 270 | @else { 271 | 272 | $result: (); 273 | $index: if($index < 0, length($list) + $index + 1, $index); 274 | 275 | @for $i from 1 through length($list) { 276 | 277 | @if $i != $index { 278 | $result: append($result, nth($list, $i)); 279 | } 280 | 281 | } 282 | 283 | } 284 | 285 | @return $result; 286 | 287 | } 288 | 289 | /// Replaces a substring within another string. 290 | /// @author Hugo Giraudel 291 | /// @param {string} $string String. 292 | /// @param {string} $search Substring. 293 | /// @param {string} $replace Replacement. 294 | /// @return {string} Updated string. 295 | @function str-replace($string, $search, $replace: '') { 296 | 297 | $index: str-index($string, $search); 298 | 299 | @if $index { 300 | @return str-slice($string, 1, $index - 1) + $replace + str-replace(str-slice($string, $index + str-length($search)), $search, $replace); 301 | } 302 | 303 | @return $string; 304 | 305 | } 306 | 307 | /// Replaces a substring within each string in a list. 308 | /// @param {list} $strings List of strings. 309 | /// @param {string} $search Substring. 310 | /// @param {string} $replace Replacement. 311 | /// @return {list} Updated list of strings. 312 | @function str-replace-all($strings, $search, $replace: '') { 313 | 314 | @each $string in $strings { 315 | $strings: set-nth($strings, index($strings, $string), str-replace($string, $search, $replace)); 316 | } 317 | 318 | @return $strings; 319 | 320 | } 321 | 322 | // Mixins. 323 | 324 | /// Wraps @content in vendorized keyframe blocks. 325 | /// @param {string} $name Name. 326 | @mixin keyframes($name) { 327 | 328 | @-moz-keyframes #{$name} { @content; } 329 | @-webkit-keyframes #{$name} { @content; } 330 | @-ms-keyframes #{$name} { @content; } 331 | @keyframes #{$name} { @content; } 332 | 333 | } 334 | 335 | /// Vendorizes a declaration's property and/or value(s). 336 | /// @param {string} $property Property. 337 | /// @param {mixed} $value String/list of value(s). 338 | @mixin vendor($property, $value) { 339 | 340 | // Determine if property should expand. 341 | $expandProperty: index($vendor-properties, $property); 342 | 343 | // Determine if value should expand (and if so, add '-prefix-' placeholder). 344 | $expandValue: false; 345 | 346 | @each $x in $value { 347 | @each $y in $vendor-values { 348 | @if $y == str-slice($x, 1, str-length($y)) { 349 | 350 | $value: set-nth($value, index($value, $x), '-prefix-' + $x); 351 | $expandValue: true; 352 | 353 | } 354 | } 355 | } 356 | 357 | // Expand property? 358 | @if $expandProperty { 359 | @each $vendor in $vendor-prefixes { 360 | #{$vendor}#{$property}: #{str-replace-all($value, '-prefix-', $vendor)}; 361 | } 362 | } 363 | 364 | // Expand just the value? 365 | @elseif $expandValue { 366 | @each $vendor in $vendor-prefixes { 367 | #{$property}: #{str-replace-all($value, '-prefix-', $vendor)}; 368 | } 369 | } 370 | 371 | // Neither? Treat them as a normal declaration. 372 | @else { 373 | #{$property}: #{$value}; 374 | } 375 | 376 | } -------------------------------------------------------------------------------- /assets/js/util.js: -------------------------------------------------------------------------------- 1 | (function($) { 2 | 3 | /** 4 | * Generate an indented list of links from a nav. Meant for use with panel(). 5 | * @return {jQuery} jQuery object. 6 | */ 7 | $.fn.navList = function() { 8 | 9 | var $this = $(this); 10 | $a = $this.find('a'), 11 | b = []; 12 | 13 | $a.each(function() { 14 | 15 | var $this = $(this), 16 | indent = Math.max(0, $this.parents('li').length - 1), 17 | href = $this.attr('href'), 18 | target = $this.attr('target'); 19 | 20 | b.push( 21 | '' + 26 | '' + 27 | $this.text() + 28 | '' 29 | ); 30 | 31 | }); 32 | 33 | return b.join(''); 34 | 35 | }; 36 | 37 | /** 38 | * Panel-ify an element. 39 | * @param {object} userConfig User config. 40 | * @return {jQuery} jQuery object. 41 | */ 42 | $.fn.panel = function(userConfig) { 43 | 44 | // No elements? 45 | if (this.length == 0) 46 | return $this; 47 | 48 | // Multiple elements? 49 | if (this.length > 1) { 50 | 51 | for (var i=0; i < this.length; i++) 52 | $(this[i]).panel(userConfig); 53 | 54 | return $this; 55 | 56 | } 57 | 58 | // Vars. 59 | var $this = $(this), 60 | $body = $('body'), 61 | $window = $(window), 62 | id = $this.attr('id'), 63 | config; 64 | 65 | // Config. 66 | config = $.extend({ 67 | 68 | // Delay. 69 | delay: 0, 70 | 71 | // Hide panel on link click. 72 | hideOnClick: false, 73 | 74 | // Hide panel on escape keypress. 75 | hideOnEscape: false, 76 | 77 | // Hide panel on swipe. 78 | hideOnSwipe: false, 79 | 80 | // Reset scroll position on hide. 81 | resetScroll: false, 82 | 83 | // Reset forms on hide. 84 | resetForms: false, 85 | 86 | // Side of viewport the panel will appear. 87 | side: null, 88 | 89 | // Target element for "class". 90 | target: $this, 91 | 92 | // Class to toggle. 93 | visibleClass: 'visible' 94 | 95 | }, userConfig); 96 | 97 | // Expand "target" if it's not a jQuery object already. 98 | if (typeof config.target != 'jQuery') 99 | config.target = $(config.target); 100 | 101 | // Panel. 102 | 103 | // Methods. 104 | $this._hide = function(event) { 105 | 106 | // Already hidden? Bail. 107 | if (!config.target.hasClass(config.visibleClass)) 108 | return; 109 | 110 | // If an event was provided, cancel it. 111 | if (event) { 112 | 113 | event.preventDefault(); 114 | event.stopPropagation(); 115 | 116 | } 117 | 118 | // Hide. 119 | config.target.removeClass(config.visibleClass); 120 | 121 | // Post-hide stuff. 122 | window.setTimeout(function() { 123 | 124 | // Reset scroll position. 125 | if (config.resetScroll) 126 | $this.scrollTop(0); 127 | 128 | // Reset forms. 129 | if (config.resetForms) 130 | $this.find('form').each(function() { 131 | this.reset(); 132 | }); 133 | 134 | }, config.delay); 135 | 136 | }; 137 | 138 | // Vendor fixes. 139 | $this 140 | .css('-ms-overflow-style', '-ms-autohiding-scrollbar') 141 | .css('-webkit-overflow-scrolling', 'touch'); 142 | 143 | // Hide on click. 144 | if (config.hideOnClick) { 145 | 146 | $this.find('a') 147 | .css('-webkit-tap-highlight-color', 'rgba(0,0,0,0)'); 148 | 149 | $this 150 | .on('click', 'a', function(event) { 151 | 152 | var $a = $(this), 153 | href = $a.attr('href'), 154 | target = $a.attr('target'); 155 | 156 | if (!href || href == '#' || href == '' || href == '#' + id) 157 | return; 158 | 159 | // Cancel original event. 160 | event.preventDefault(); 161 | event.stopPropagation(); 162 | 163 | // Hide panel. 164 | $this._hide(); 165 | 166 | // Redirect to href. 167 | window.setTimeout(function() { 168 | 169 | if (target == '_blank') 170 | window.open(href); 171 | else 172 | window.location.href = href; 173 | 174 | }, config.delay + 10); 175 | 176 | }); 177 | 178 | } 179 | 180 | // Event: Touch stuff. 181 | $this.on('touchstart', function(event) { 182 | 183 | $this.touchPosX = event.originalEvent.touches[0].pageX; 184 | $this.touchPosY = event.originalEvent.touches[0].pageY; 185 | 186 | }) 187 | 188 | $this.on('touchmove', function(event) { 189 | 190 | if ($this.touchPosX === null 191 | || $this.touchPosY === null) 192 | return; 193 | 194 | var diffX = $this.touchPosX - event.originalEvent.touches[0].pageX, 195 | diffY = $this.touchPosY - event.originalEvent.touches[0].pageY, 196 | th = $this.outerHeight(), 197 | ts = ($this.get(0).scrollHeight - $this.scrollTop()); 198 | 199 | // Hide on swipe? 200 | if (config.hideOnSwipe) { 201 | 202 | var result = false, 203 | boundary = 20, 204 | delta = 50; 205 | 206 | switch (config.side) { 207 | 208 | case 'left': 209 | result = (diffY < boundary && diffY > (-1 * boundary)) && (diffX > delta); 210 | break; 211 | 212 | case 'right': 213 | result = (diffY < boundary && diffY > (-1 * boundary)) && (diffX < (-1 * delta)); 214 | break; 215 | 216 | case 'top': 217 | result = (diffX < boundary && diffX > (-1 * boundary)) && (diffY > delta); 218 | break; 219 | 220 | case 'bottom': 221 | result = (diffX < boundary && diffX > (-1 * boundary)) && (diffY < (-1 * delta)); 222 | break; 223 | 224 | default: 225 | break; 226 | 227 | } 228 | 229 | if (result) { 230 | 231 | $this.touchPosX = null; 232 | $this.touchPosY = null; 233 | $this._hide(); 234 | 235 | return false; 236 | 237 | } 238 | 239 | } 240 | 241 | // Prevent vertical scrolling past the top or bottom. 242 | if (($this.scrollTop() < 0 && diffY < 0) 243 | || (ts > (th - 2) && ts < (th + 2) && diffY > 0)) { 244 | 245 | event.preventDefault(); 246 | event.stopPropagation(); 247 | 248 | } 249 | 250 | }); 251 | 252 | // Event: Prevent certain events inside the panel from bubbling. 253 | $this.on('click touchend touchstart touchmove', function(event) { 254 | event.stopPropagation(); 255 | }); 256 | 257 | // Event: Hide panel if a child anchor tag pointing to its ID is clicked. 258 | $this.on('click', 'a[href="#' + id + '"]', function(event) { 259 | 260 | event.preventDefault(); 261 | event.stopPropagation(); 262 | 263 | config.target.removeClass(config.visibleClass); 264 | 265 | }); 266 | 267 | // Body. 268 | 269 | // Event: Hide panel on body click/tap. 270 | $body.on('click touchend', function(event) { 271 | $this._hide(event); 272 | }); 273 | 274 | // Event: Toggle. 275 | $body.on('click', 'a[href="#' + id + '"]', function(event) { 276 | 277 | event.preventDefault(); 278 | event.stopPropagation(); 279 | 280 | config.target.toggleClass(config.visibleClass); 281 | 282 | }); 283 | 284 | // Window. 285 | 286 | // Event: Hide on ESC. 287 | if (config.hideOnEscape) 288 | $window.on('keydown', function(event) { 289 | 290 | if (event.keyCode == 27) 291 | $this._hide(event); 292 | 293 | }); 294 | 295 | return $this; 296 | 297 | }; 298 | 299 | /** 300 | * Apply "placeholder" attribute polyfill to one or more forms. 301 | * @return {jQuery} jQuery object. 302 | */ 303 | $.fn.placeholder = function() { 304 | 305 | // Browser natively supports placeholders? Bail. 306 | if (typeof (document.createElement('input')).placeholder != 'undefined') 307 | return $(this); 308 | 309 | // No elements? 310 | if (this.length == 0) 311 | return $this; 312 | 313 | // Multiple elements? 314 | if (this.length > 1) { 315 | 316 | for (var i=0; i < this.length; i++) 317 | $(this[i]).placeholder(); 318 | 319 | return $this; 320 | 321 | } 322 | 323 | // Vars. 324 | var $this = $(this); 325 | 326 | // Text, TextArea. 327 | $this.find('input[type=text],textarea') 328 | .each(function() { 329 | 330 | var i = $(this); 331 | 332 | if (i.val() == '' 333 | || i.val() == i.attr('placeholder')) 334 | i 335 | .addClass('polyfill-placeholder') 336 | .val(i.attr('placeholder')); 337 | 338 | }) 339 | .on('blur', function() { 340 | 341 | var i = $(this); 342 | 343 | if (i.attr('name').match(/-polyfill-field$/)) 344 | return; 345 | 346 | if (i.val() == '') 347 | i 348 | .addClass('polyfill-placeholder') 349 | .val(i.attr('placeholder')); 350 | 351 | }) 352 | .on('focus', function() { 353 | 354 | var i = $(this); 355 | 356 | if (i.attr('name').match(/-polyfill-field$/)) 357 | return; 358 | 359 | if (i.val() == i.attr('placeholder')) 360 | i 361 | .removeClass('polyfill-placeholder') 362 | .val(''); 363 | 364 | }); 365 | 366 | // Password. 367 | $this.find('input[type=password]') 368 | .each(function() { 369 | 370 | var i = $(this); 371 | var x = $( 372 | $('
') 373 | .append(i.clone()) 374 | .remove() 375 | .html() 376 | .replace(/type="password"/i, 'type="text"') 377 | .replace(/type=password/i, 'type=text') 378 | ); 379 | 380 | if (i.attr('id') != '') 381 | x.attr('id', i.attr('id') + '-polyfill-field'); 382 | 383 | if (i.attr('name') != '') 384 | x.attr('name', i.attr('name') + '-polyfill-field'); 385 | 386 | x.addClass('polyfill-placeholder') 387 | .val(x.attr('placeholder')).insertAfter(i); 388 | 389 | if (i.val() == '') 390 | i.hide(); 391 | else 392 | x.hide(); 393 | 394 | i 395 | .on('blur', function(event) { 396 | 397 | event.preventDefault(); 398 | 399 | var x = i.parent().find('input[name=' + i.attr('name') + '-polyfill-field]'); 400 | 401 | if (i.val() == '') { 402 | 403 | i.hide(); 404 | x.show(); 405 | 406 | } 407 | 408 | }); 409 | 410 | x 411 | .on('focus', function(event) { 412 | 413 | event.preventDefault(); 414 | 415 | var i = x.parent().find('input[name=' + x.attr('name').replace('-polyfill-field', '') + ']'); 416 | 417 | x.hide(); 418 | 419 | i 420 | .show() 421 | .focus(); 422 | 423 | }) 424 | .on('keypress', function(event) { 425 | 426 | event.preventDefault(); 427 | x.val(''); 428 | 429 | }); 430 | 431 | }); 432 | 433 | // Events. 434 | $this 435 | .on('submit', function() { 436 | 437 | $this.find('input[type=text],input[type=password],textarea') 438 | .each(function(event) { 439 | 440 | var i = $(this); 441 | 442 | if (i.attr('name').match(/-polyfill-field$/)) 443 | i.attr('name', ''); 444 | 445 | if (i.val() == i.attr('placeholder')) { 446 | 447 | i.removeClass('polyfill-placeholder'); 448 | i.val(''); 449 | 450 | } 451 | 452 | }); 453 | 454 | }) 455 | .on('reset', function(event) { 456 | 457 | event.preventDefault(); 458 | 459 | $this.find('select') 460 | .val($('option:first').val()); 461 | 462 | $this.find('input,textarea') 463 | .each(function() { 464 | 465 | var i = $(this), 466 | x; 467 | 468 | i.removeClass('polyfill-placeholder'); 469 | 470 | switch (this.type) { 471 | 472 | case 'submit': 473 | case 'reset': 474 | break; 475 | 476 | case 'password': 477 | i.val(i.attr('defaultValue')); 478 | 479 | x = i.parent().find('input[name=' + i.attr('name') + '-polyfill-field]'); 480 | 481 | if (i.val() == '') { 482 | i.hide(); 483 | x.show(); 484 | } 485 | else { 486 | i.show(); 487 | x.hide(); 488 | } 489 | 490 | break; 491 | 492 | case 'checkbox': 493 | case 'radio': 494 | i.attr('checked', i.attr('defaultValue')); 495 | break; 496 | 497 | case 'text': 498 | case 'textarea': 499 | i.val(i.attr('defaultValue')); 500 | 501 | if (i.val() == '') { 502 | i.addClass('polyfill-placeholder'); 503 | i.val(i.attr('placeholder')); 504 | } 505 | 506 | break; 507 | 508 | default: 509 | i.val(i.attr('defaultValue')); 510 | break; 511 | 512 | } 513 | }); 514 | 515 | }); 516 | 517 | return $this; 518 | 519 | }; 520 | 521 | /** 522 | * Moves elements to/from the first positions of their respective parents. 523 | * @param {jQuery} $elements Elements (or selector) to move. 524 | * @param {bool} condition If true, moves elements to the top. Otherwise, moves elements back to their original locations. 525 | */ 526 | $.prioritize = function($elements, condition) { 527 | 528 | var key = '__prioritize'; 529 | 530 | // Expand $elements if it's not already a jQuery object. 531 | if (typeof $elements != 'jQuery') 532 | $elements = $($elements); 533 | 534 | // Step through elements. 535 | $elements.each(function() { 536 | 537 | var $e = $(this), $p, 538 | $parent = $e.parent(); 539 | 540 | // No parent? Bail. 541 | if ($parent.length == 0) 542 | return; 543 | 544 | // Not moved? Move it. 545 | if (!$e.data(key)) { 546 | 547 | // Condition is false? Bail. 548 | if (!condition) 549 | return; 550 | 551 | // Get placeholder (which will serve as our point of reference for when this element needs to move back). 552 | $p = $e.prev(); 553 | 554 | // Couldn't find anything? Means this element's already at the top, so bail. 555 | if ($p.length == 0) 556 | return; 557 | 558 | // Move element to top of parent. 559 | $e.prependTo($parent); 560 | 561 | // Mark element as moved. 562 | $e.data(key, $p); 563 | 564 | } 565 | 566 | // Moved already? 567 | else { 568 | 569 | // Condition is true? Bail. 570 | if (condition) 571 | return; 572 | 573 | $p = $e.data(key); 574 | 575 | // Move element back to its original location (using our placeholder). 576 | $e.insertAfter($p); 577 | 578 | // Unmark element as moved. 579 | $e.removeData(key); 580 | 581 | } 582 | 583 | }); 584 | 585 | }; 586 | 587 | })(jQuery); -------------------------------------------------------------------------------- /assets/LICENSE.txt: -------------------------------------------------------------------------------- 1 | Creative Commons Attribution 3.0 Unported 2 | http://creativecommons.org/licenses/by/3.0/ 3 | 4 | License 5 | 6 | THE WORK (AS DEFINED BELOW) IS PROVIDED UNDER THE TERMS OF THIS CREATIVE COMMONS PUBLIC LICENSE ("CCPL" OR "LICENSE"). THE WORK IS PROTECTED BY COPYRIGHT AND/OR OTHER APPLICABLE LAW. ANY USE OF THE WORK OTHER THAN AS AUTHORIZED UNDER THIS LICENSE OR COPYRIGHT LAW IS PROHIBITED. 7 | 8 | BY EXERCISING ANY RIGHTS TO THE WORK PROVIDED HERE, YOU ACCEPT AND AGREE TO BE BOUND BY THE TERMS OF THIS LICENSE. TO THE EXTENT THIS LICENSE MAY BE CONSIDERED TO BE A CONTRACT, THE LICENSOR GRANTS YOU THE RIGHTS CONTAINED HERE IN CONSIDERATION OF YOUR ACCEPTANCE OF SUCH TERMS AND CONDITIONS. 9 | 10 | 1. Definitions 11 | 12 | 1. "Adaptation" means a work based upon the Work, or upon the Work and other pre-existing works, such as a translation, adaptation, derivative work, arrangement of music or other alterations of a literary or artistic work, or phonogram or performance and includes cinematographic adaptations or any other form in which the Work may be recast, transformed, or adapted including in any form recognizably derived from the original, except that a work that constitutes a Collection will not be considered an Adaptation for the purpose of this License. For the avoidance of doubt, where the Work is a musical work, performance or phonogram, the synchronization of the Work in timed-relation with a moving image ("synching") will be considered an Adaptation for the purpose of this License. 13 | 2. "Collection" means a collection of literary or artistic works, such as encyclopedias and anthologies, or performances, phonograms or broadcasts, or other works or subject matter other than works listed in Section 1(f) below, which, by reason of the selection and arrangement of their contents, constitute intellectual creations, in which the Work is included in its entirety in unmodified form along with one or more other contributions, each constituting separate and independent works in themselves, which together are assembled into a collective whole. A work that constitutes a Collection will not be considered an Adaptation (as defined above) for the purposes of this License. 14 | 3. "Distribute" means to make available to the public the original and copies of the Work or Adaptation, as appropriate, through sale or other transfer of ownership. 15 | 4. "Licensor" means the individual, individuals, entity or entities that offer(s) the Work under the terms of this License. 16 | 5. "Original Author" means, in the case of a literary or artistic work, the individual, individuals, entity or entities who created the Work or if no individual or entity can be identified, the publisher; and in addition (i) in the case of a performance the actors, singers, musicians, dancers, and other persons who act, sing, deliver, declaim, play in, interpret or otherwise perform literary or artistic works or expressions of folklore; (ii) in the case of a phonogram the producer being the person or legal entity who first fixes the sounds of a performance or other sounds; and, (iii) in the case of broadcasts, the organization that transmits the broadcast. 17 | 6. "Work" means the literary and/or artistic work offered under the terms of this License including without limitation any production in the literary, scientific and artistic domain, whatever may be the mode or form of its expression including digital form, such as a book, pamphlet and other writing; a lecture, address, sermon or other work of the same nature; a dramatic or dramatico-musical work; a choreographic work or entertainment in dumb show; a musical composition with or without words; a cinematographic work to which are assimilated works expressed by a process analogous to cinematography; a work of drawing, painting, architecture, sculpture, engraving or lithography; a photographic work to which are assimilated works expressed by a process analogous to photography; a work of applied art; an illustration, map, plan, sketch or three-dimensional work relative to geography, topography, architecture or science; a performance; a broadcast; a phonogram; a compilation of data to the extent it is protected as a copyrightable work; or a work performed by a variety or circus performer to the extent it is not otherwise considered a literary or artistic work. 18 | 7. "You" means an individual or entity exercising rights under this License who has not previously violated the terms of this License with respect to the Work, or who has received express permission from the Licensor to exercise rights under this License despite a previous violation. 19 | 8. "Publicly Perform" means to perform public recitations of the Work and to communicate to the public those public recitations, by any means or process, including by wire or wireless means or public digital performances; to make available to the public Works in such a way that members of the public may access these Works from a place and at a place individually chosen by them; to perform the Work to the public by any means or process and the communication to the public of the performances of the Work, including by public digital performance; to broadcast and rebroadcast the Work by any means including signs, sounds or images. 20 | 9. "Reproduce" means to make copies of the Work by any means including without limitation by sound or visual recordings and the right of fixation and reproducing fixations of the Work, including storage of a protected performance or phonogram in digital form or other electronic medium. 21 | 22 | 2. Fair Dealing Rights. Nothing in this License is intended to reduce, limit, or restrict any uses free from copyright or rights arising from limitations or exceptions that are provided for in connection with the copyright protection under copyright law or other applicable laws. 23 | 24 | 3. License Grant. Subject to the terms and conditions of this License, Licensor hereby grants You a worldwide, royalty-free, non-exclusive, perpetual (for the duration of the applicable copyright) license to exercise the rights in the Work as stated below: 25 | 26 | 1. to Reproduce the Work, to incorporate the Work into one or more Collections, and to Reproduce the Work as incorporated in the Collections; 27 | 2. to create and Reproduce Adaptations provided that any such Adaptation, including any translation in any medium, takes reasonable steps to clearly label, demarcate or otherwise identify that changes were made to the original Work. For example, a translation could be marked "The original work was translated from English to Spanish," or a modification could indicate "The original work has been modified."; 28 | 3. to Distribute and Publicly Perform the Work including as incorporated in Collections; and, 29 | 4. to Distribute and Publicly Perform Adaptations. 30 | 5. 31 | 32 | For the avoidance of doubt: 33 | 1. Non-waivable Compulsory License Schemes. In those jurisdictions in which the right to collect royalties through any statutory or compulsory licensing scheme cannot be waived, the Licensor reserves the exclusive right to collect such royalties for any exercise by You of the rights granted under this License; 34 | 2. Waivable Compulsory License Schemes. In those jurisdictions in which the right to collect royalties through any statutory or compulsory licensing scheme can be waived, the Licensor waives the exclusive right to collect such royalties for any exercise by You of the rights granted under this License; and, 35 | 3. Voluntary License Schemes. The Licensor waives the right to collect royalties, whether individually or, in the event that the Licensor is a member of a collecting society that administers voluntary licensing schemes, via that society, from any exercise by You of the rights granted under this License. 36 | 37 | The above rights may be exercised in all media and formats whether now known or hereafter devised. The above rights include the right to make such modifications as are technically necessary to exercise the rights in other media and formats. Subject to Section 8(f), all rights not expressly granted by Licensor are hereby reserved. 38 | 39 | 4. Restrictions. The license granted in Section 3 above is expressly made subject to and limited by the following restrictions: 40 | 41 | 1. You may Distribute or Publicly Perform the Work only under the terms of this License. You must include a copy of, or the Uniform Resource Identifier (URI) for, this License with every copy of the Work You Distribute or Publicly Perform. You may not offer or impose any terms on the Work that restrict the terms of this License or the ability of the recipient of the Work to exercise the rights granted to that recipient under the terms of the License. You may not sublicense the Work. You must keep intact all notices that refer to this License and to the disclaimer of warranties with every copy of the Work You Distribute or Publicly Perform. When You Distribute or Publicly Perform the Work, You may not impose any effective technological measures on the Work that restrict the ability of a recipient of the Work from You to exercise the rights granted to that recipient under the terms of the License. This Section 4(a) applies to the Work as incorporated in a Collection, but this does not require the Collection apart from the Work itself to be made subject to the terms of this License. If You create a Collection, upon notice from any Licensor You must, to the extent practicable, remove from the Collection any credit as required by Section 4(b), as requested. If You create an Adaptation, upon notice from any Licensor You must, to the extent practicable, remove from the Adaptation any credit as required by Section 4(b), as requested. 42 | 2. If You Distribute, or Publicly Perform the Work or any Adaptations or Collections, You must, unless a request has been made pursuant to Section 4(a), keep intact all copyright notices for the Work and provide, reasonable to the medium or means You are utilizing: (i) the name of the Original Author (or pseudonym, if applicable) if supplied, and/or if the Original Author and/or Licensor designate another party or parties (e.g., a sponsor institute, publishing entity, journal) for attribution ("Attribution Parties") in Licensor's copyright notice, terms of service or by other reasonable means, the name of such party or parties; (ii) the title of the Work if supplied; (iii) to the extent reasonably practicable, the URI, if any, that Licensor specifies to be associated with the Work, unless such URI does not refer to the copyright notice or licensing information for the Work; and (iv) , consistent with Section 3(b), in the case of an Adaptation, a credit identifying the use of the Work in the Adaptation (e.g., "French translation of the Work by Original Author," or "Screenplay based on original Work by Original Author"). The credit required by this Section 4 (b) may be implemented in any reasonable manner; provided, however, that in the case of a Adaptation or Collection, at a minimum such credit will appear, if a credit for all contributing authors of the Adaptation or Collection appears, then as part of these credits and in a manner at least as prominent as the credits for the other contributing authors. For the avoidance of doubt, You may only use the credit required by this Section for the purpose of attribution in the manner set out above and, by exercising Your rights under this License, You may not implicitly or explicitly assert or imply any connection with, sponsorship or endorsement by the Original Author, Licensor and/or Attribution Parties, as appropriate, of You or Your use of the Work, without the separate, express prior written permission of the Original Author, Licensor and/or Attribution Parties. 43 | 3. Except as otherwise agreed in writing by the Licensor or as may be otherwise permitted by applicable law, if You Reproduce, Distribute or Publicly Perform the Work either by itself or as part of any Adaptations or Collections, You must not distort, mutilate, modify or take other derogatory action in relation to the Work which would be prejudicial to the Original Author's honor or reputation. Licensor agrees that in those jurisdictions (e.g. Japan), in which any exercise of the right granted in Section 3(b) of this License (the right to make Adaptations) would be deemed to be a distortion, mutilation, modification or other derogatory action prejudicial to the Original Author's honor and reputation, the Licensor will waive or not assert, as appropriate, this Section, to the fullest extent permitted by the applicable national law, to enable You to reasonably exercise Your right under Section 3(b) of this License (right to make Adaptations) but not otherwise. 44 | 45 | 5. Representations, Warranties and Disclaimer 46 | 47 | UNLESS OTHERWISE MUTUALLY AGREED TO BY THE PARTIES IN WRITING, LICENSOR OFFERS THE WORK AS-IS AND MAKES NO REPRESENTATIONS OR WARRANTIES OF ANY KIND CONCERNING THE WORK, EXPRESS, IMPLIED, STATUTORY OR OTHERWISE, INCLUDING, WITHOUT LIMITATION, WARRANTIES OF TITLE, MERCHANTIBILITY, FITNESS FOR A PARTICULAR PURPOSE, NONINFRINGEMENT, OR THE ABSENCE OF LATENT OR OTHER DEFECTS, ACCURACY, OR THE PRESENCE OF ABSENCE OF ERRORS, WHETHER OR NOT DISCOVERABLE. SOME JURISDICTIONS DO NOT ALLOW THE EXCLUSION OF IMPLIED WARRANTIES, SO SUCH EXCLUSION MAY NOT APPLY TO YOU. 48 | 49 | 6. Limitation on Liability. EXCEPT TO THE EXTENT REQUIRED BY APPLICABLE LAW, IN NO EVENT WILL LICENSOR BE LIABLE TO YOU ON ANY LEGAL THEORY FOR ANY SPECIAL, INCIDENTAL, CONSEQUENTIAL, PUNITIVE OR EXEMPLARY DAMAGES ARISING OUT OF THIS LICENSE OR THE USE OF THE WORK, EVEN IF LICENSOR HAS BEEN ADVISED OF THE POSSIBILITY OF SUCH DAMAGES. 50 | 51 | 7. Termination 52 | 53 | 1. This License and the rights granted hereunder will terminate automatically upon any breach by You of the terms of this License. Individuals or entities who have received Adaptations or Collections from You under this License, however, will not have their licenses terminated provided such individuals or entities remain in full compliance with those licenses. Sections 1, 2, 5, 6, 7, and 8 will survive any termination of this License. 54 | 2. Subject to the above terms and conditions, the license granted here is perpetual (for the duration of the applicable copyright in the Work). Notwithstanding the above, Licensor reserves the right to release the Work under different license terms or to stop distributing the Work at any time; provided, however that any such election will not serve to withdraw this License (or any other license that has been, or is required to be, granted under the terms of this License), and this License will continue in full force and effect unless terminated as stated above. 55 | 56 | 8. Miscellaneous 57 | 58 | 1. Each time You Distribute or Publicly Perform the Work or a Collection, the Licensor offers to the recipient a license to the Work on the same terms and conditions as the license granted to You under this License. 59 | 2. Each time You Distribute or Publicly Perform an Adaptation, Licensor offers to the recipient a license to the original Work on the same terms and conditions as the license granted to You under this License. 60 | 3. If any provision of this License is invalid or unenforceable under applicable law, it shall not affect the validity or enforceability of the remainder of the terms of this License, and without further action by the parties to this agreement, such provision shall be reformed to the minimum extent necessary to make such provision valid and enforceable. 61 | 4. No term or provision of this License shall be deemed waived and no breach consented to unless such waiver or consent shall be in writing and signed by the party to be charged with such waiver or consent. 62 | 5. This License constitutes the entire agreement between the parties with respect to the Work licensed here. There are no understandings, agreements or representations with respect to the Work not specified here. Licensor shall not be bound by any additional provisions that may appear in any communication from You. This License may not be modified without the mutual written agreement of the Licensor and You. 63 | 6. The rights granted under, and the subject matter referenced, in this License were drafted utilizing the terminology of the Berne Convention for the Protection of Literary and Artistic Works (as amended on September 28, 1979), the Rome Convention of 1961, the WIPO Copyright Treaty of 1996, the WIPO Performances and Phonograms Treaty of 1996 and the Universal Copyright Convention (as revised on July 24, 1971). These rights and subject matter take effect in the relevant jurisdiction in which the License terms are sought to be enforced according to the corresponding provisions of the implementation of those treaty provisions in the applicable national law. If the standard suite of rights granted under applicable copyright law includes additional rights not granted under this License, such additional rights are deemed to be included in the License; this License is not intended to restrict the license of any rights under applicable law. 64 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | Attribution 4.0 International 2 | 3 | ======================================================================= 4 | 5 | Creative Commons Corporation ("Creative Commons") is not a law firm and 6 | does not provide legal services or legal advice. Distribution of 7 | Creative Commons public licenses does not create a lawyer-client or 8 | other relationship. Creative Commons makes its licenses and related 9 | information available on an "as-is" basis. Creative Commons gives no 10 | warranties regarding its licenses, any material licensed under their 11 | terms and conditions, or any related information. Creative Commons 12 | disclaims all liability for damages resulting from their use to the 13 | fullest extent possible. 14 | 15 | Using Creative Commons Public Licenses 16 | 17 | Creative Commons public licenses provide a standard set of terms and 18 | conditions that creators and other rights holders may use to share 19 | original works of authorship and other material subject to copyright 20 | and certain other rights specified in the public license below. The 21 | following considerations are for informational purposes only, are not 22 | exhaustive, and do not form part of our licenses. 23 | 24 | Considerations for licensors: Our public licenses are 25 | intended for use by those authorized to give the public 26 | permission to use material in ways otherwise restricted by 27 | copyright and certain other rights. Our licenses are 28 | irrevocable. Licensors should read and understand the terms 29 | and conditions of the license they choose before applying it. 30 | Licensors should also secure all rights necessary before 31 | applying our licenses so that the public can reuse the 32 | material as expected. Licensors should clearly mark any 33 | material not subject to the license. This includes other CC- 34 | licensed material, or material used under an exception or 35 | limitation to copyright. More considerations for licensors: 36 | wiki.creativecommons.org/Considerations_for_licensors 37 | 38 | Considerations for the public: By using one of our public 39 | licenses, a licensor grants the public permission to use the 40 | licensed material under specified terms and conditions. If 41 | the licensor's permission is not necessary for any reason--for 42 | example, because of any applicable exception or limitation to 43 | copyright--then that use is not regulated by the license. Our 44 | licenses grant only permissions under copyright and certain 45 | other rights that a licensor has authority to grant. Use of 46 | the licensed material may still be restricted for other 47 | reasons, including because others have copyright or other 48 | rights in the material. A licensor may make special requests, 49 | such as asking that all changes be marked or described. 50 | Although not required by our licenses, you are encouraged to 51 | respect those requests where reasonable. More_considerations 52 | for the public: 53 | wiki.creativecommons.org/Considerations_for_licensees 54 | 55 | ======================================================================= 56 | 57 | Creative Commons Attribution 4.0 International Public License 58 | 59 | By exercising the Licensed Rights (defined below), You accept and agree 60 | to be bound by the terms and conditions of this Creative Commons 61 | Attribution 4.0 International Public License ("Public License"). To the 62 | extent this Public License may be interpreted as a contract, You are 63 | granted the Licensed Rights in consideration of Your acceptance of 64 | these terms and conditions, and the Licensor grants You such rights in 65 | consideration of benefits the Licensor receives from making the 66 | Licensed Material available under these terms and conditions. 67 | 68 | 69 | Section 1 -- Definitions. 70 | 71 | a. Adapted Material means material subject to Copyright and Similar 72 | Rights that is derived from or based upon the Licensed Material 73 | and in which the Licensed Material is translated, altered, 74 | arranged, transformed, or otherwise modified in a manner requiring 75 | permission under the Copyright and Similar Rights held by the 76 | Licensor. For purposes of this Public License, where the Licensed 77 | Material is a musical work, performance, or sound recording, 78 | Adapted Material is always produced where the Licensed Material is 79 | synched in timed relation with a moving image. 80 | 81 | b. Adapter's License means the license You apply to Your Copyright 82 | and Similar Rights in Your contributions to Adapted Material in 83 | accordance with the terms and conditions of this Public License. 84 | 85 | c. Copyright and Similar Rights means copyright and/or similar rights 86 | closely related to copyright including, without limitation, 87 | performance, broadcast, sound recording, and Sui Generis Database 88 | Rights, without regard to how the rights are labeled or 89 | categorized. For purposes of this Public License, the rights 90 | specified in Section 2(b)(1)-(2) are not Copyright and Similar 91 | Rights. 92 | 93 | d. Effective Technological Measures means those measures that, in the 94 | absence of proper authority, may not be circumvented under laws 95 | fulfilling obligations under Article 11 of the WIPO Copyright 96 | Treaty adopted on December 20, 1996, and/or similar international 97 | agreements. 98 | 99 | e. Exceptions and Limitations means fair use, fair dealing, and/or 100 | any other exception or limitation to Copyright and Similar Rights 101 | that applies to Your use of the Licensed Material. 102 | 103 | f. Licensed Material means the artistic or literary work, database, 104 | or other material to which the Licensor applied this Public 105 | License. 106 | 107 | g. Licensed Rights means the rights granted to You subject to the 108 | terms and conditions of this Public License, which are limited to 109 | all Copyright and Similar Rights that apply to Your use of the 110 | Licensed Material and that the Licensor has authority to license. 111 | 112 | h. Licensor means the individual(s) or entity(ies) granting rights 113 | under this Public License. 114 | 115 | i. Share means to provide material to the public by any means or 116 | process that requires permission under the Licensed Rights, such 117 | as reproduction, public display, public performance, distribution, 118 | dissemination, communication, or importation, and to make material 119 | available to the public including in ways that members of the 120 | public may access the material from a place and at a time 121 | individually chosen by them. 122 | 123 | j. Sui Generis Database Rights means rights other than copyright 124 | resulting from Directive 96/9/EC of the European Parliament and of 125 | the Council of 11 March 1996 on the legal protection of databases, 126 | as amended and/or succeeded, as well as other essentially 127 | equivalent rights anywhere in the world. 128 | 129 | k. You means the individual or entity exercising the Licensed Rights 130 | under this Public License. Your has a corresponding meaning. 131 | 132 | 133 | Section 2 -- Scope. 134 | 135 | a. License grant. 136 | 137 | 1. Subject to the terms and conditions of this Public License, 138 | the Licensor hereby grants You a worldwide, royalty-free, 139 | non-sublicensable, non-exclusive, irrevocable license to 140 | exercise the Licensed Rights in the Licensed Material to: 141 | 142 | a. reproduce and Share the Licensed Material, in whole or 143 | in part; and 144 | 145 | b. produce, reproduce, and Share Adapted Material. 146 | 147 | 2. Exceptions and Limitations. For the avoidance of doubt, where 148 | Exceptions and Limitations apply to Your use, this Public 149 | License does not apply, and You do not need to comply with 150 | its terms and conditions. 151 | 152 | 3. Term. The term of this Public License is specified in Section 153 | 6(a). 154 | 155 | 4. Media and formats; technical modifications allowed. The 156 | Licensor authorizes You to exercise the Licensed Rights in 157 | all media and formats whether now known or hereafter created, 158 | and to make technical modifications necessary to do so. The 159 | Licensor waives and/or agrees not to assert any right or 160 | authority to forbid You from making technical modifications 161 | necessary to exercise the Licensed Rights, including 162 | technical modifications necessary to circumvent Effective 163 | Technological Measures. For purposes of this Public License, 164 | simply making modifications authorized by this Section 2(a) 165 | (4) never produces Adapted Material. 166 | 167 | 5. Downstream recipients. 168 | 169 | a. Offer from the Licensor -- Licensed Material. Every 170 | recipient of the Licensed Material automatically 171 | receives an offer from the Licensor to exercise the 172 | Licensed Rights under the terms and conditions of this 173 | Public License. 174 | 175 | b. No downstream restrictions. You may not offer or impose 176 | any additional or different terms or conditions on, or 177 | apply any Effective Technological Measures to, the 178 | Licensed Material if doing so restricts exercise of the 179 | Licensed Rights by any recipient of the Licensed 180 | Material. 181 | 182 | 6. No endorsement. Nothing in this Public License constitutes or 183 | may be construed as permission to assert or imply that You 184 | are, or that Your use of the Licensed Material is, connected 185 | with, or sponsored, endorsed, or granted official status by, 186 | the Licensor or others designated to receive attribution as 187 | provided in Section 3(a)(1)(A)(i). 188 | 189 | b. Other rights. 190 | 191 | 1. Moral rights, such as the right of integrity, are not 192 | licensed under this Public License, nor are publicity, 193 | privacy, and/or other similar personality rights; however, to 194 | the extent possible, the Licensor waives and/or agrees not to 195 | assert any such rights held by the Licensor to the limited 196 | extent necessary to allow You to exercise the Licensed 197 | Rights, but not otherwise. 198 | 199 | 2. Patent and trademark rights are not licensed under this 200 | Public License. 201 | 202 | 3. To the extent possible, the Licensor waives any right to 203 | collect royalties from You for the exercise of the Licensed 204 | Rights, whether directly or through a collecting society 205 | under any voluntary or waivable statutory or compulsory 206 | licensing scheme. In all other cases the Licensor expressly 207 | reserves any right to collect such royalties. 208 | 209 | 210 | Section 3 -- License Conditions. 211 | 212 | Your exercise of the Licensed Rights is expressly made subject to the 213 | following conditions. 214 | 215 | a. Attribution. 216 | 217 | 1. If You Share the Licensed Material (including in modified 218 | form), You must: 219 | 220 | a. retain the following if it is supplied by the Licensor 221 | with the Licensed Material: 222 | 223 | i. identification of the creator(s) of the Licensed 224 | Material and any others designated to receive 225 | attribution, in any reasonable manner requested by 226 | the Licensor (including by pseudonym if 227 | designated); 228 | 229 | ii. a copyright notice; 230 | 231 | iii. a notice that refers to this Public License; 232 | 233 | iv. a notice that refers to the disclaimer of 234 | warranties; 235 | 236 | v. a URI or hyperlink to the Licensed Material to the 237 | extent reasonably practicable; 238 | 239 | b. indicate if You modified the Licensed Material and 240 | retain an indication of any previous modifications; and 241 | 242 | c. indicate the Licensed Material is licensed under this 243 | Public License, and include the text of, or the URI or 244 | hyperlink to, this Public License. 245 | 246 | 2. You may satisfy the conditions in Section 3(a)(1) in any 247 | reasonable manner based on the medium, means, and context in 248 | which You Share the Licensed Material. For example, it may be 249 | reasonable to satisfy the conditions by providing a URI or 250 | hyperlink to a resource that includes the required 251 | information. 252 | 253 | 3. If requested by the Licensor, You must remove any of the 254 | information required by Section 3(a)(1)(A) to the extent 255 | reasonably practicable. 256 | 257 | 4. If You Share Adapted Material You produce, the Adapter's 258 | License You apply must not prevent recipients of the Adapted 259 | Material from complying with this Public License. 260 | 261 | 262 | Section 4 -- Sui Generis Database Rights. 263 | 264 | Where the Licensed Rights include Sui Generis Database Rights that 265 | apply to Your use of the Licensed Material: 266 | 267 | a. for the avoidance of doubt, Section 2(a)(1) grants You the right 268 | to extract, reuse, reproduce, and Share all or a substantial 269 | portion of the contents of the database; 270 | 271 | b. if You include all or a substantial portion of the database 272 | contents in a database in which You have Sui Generis Database 273 | Rights, then the database in which You have Sui Generis Database 274 | Rights (but not its individual contents) is Adapted Material; and 275 | 276 | c. You must comply with the conditions in Section 3(a) if You Share 277 | all or a substantial portion of the contents of the database. 278 | 279 | For the avoidance of doubt, this Section 4 supplements and does not 280 | replace Your obligations under this Public License where the Licensed 281 | Rights include other Copyright and Similar Rights. 282 | 283 | 284 | Section 5 -- Disclaimer of Warranties and Limitation of Liability. 285 | 286 | a. UNLESS OTHERWISE SEPARATELY UNDERTAKEN BY THE LICENSOR, TO THE 287 | EXTENT POSSIBLE, THE LICENSOR OFFERS THE LICENSED MATERIAL AS-IS 288 | AND AS-AVAILABLE, AND MAKES NO REPRESENTATIONS OR WARRANTIES OF 289 | ANY KIND CONCERNING THE LICENSED MATERIAL, WHETHER EXPRESS, 290 | IMPLIED, STATUTORY, OR OTHER. THIS INCLUDES, WITHOUT LIMITATION, 291 | WARRANTIES OF TITLE, MERCHANTABILITY, FITNESS FOR A PARTICULAR 292 | PURPOSE, NON-INFRINGEMENT, ABSENCE OF LATENT OR OTHER DEFECTS, 293 | ACCURACY, OR THE PRESENCE OR ABSENCE OF ERRORS, WHETHER OR NOT 294 | KNOWN OR DISCOVERABLE. WHERE DISCLAIMERS OF WARRANTIES ARE NOT 295 | ALLOWED IN FULL OR IN PART, THIS DISCLAIMER MAY NOT APPLY TO YOU. 296 | 297 | b. TO THE EXTENT POSSIBLE, IN NO EVENT WILL THE LICENSOR BE LIABLE 298 | TO YOU ON ANY LEGAL THEORY (INCLUDING, WITHOUT LIMITATION, 299 | NEGLIGENCE) OR OTHERWISE FOR ANY DIRECT, SPECIAL, INDIRECT, 300 | INCIDENTAL, CONSEQUENTIAL, PUNITIVE, EXEMPLARY, OR OTHER LOSSES, 301 | COSTS, EXPENSES, OR DAMAGES ARISING OUT OF THIS PUBLIC LICENSE OR 302 | USE OF THE LICENSED MATERIAL, EVEN IF THE LICENSOR HAS BEEN 303 | ADVISED OF THE POSSIBILITY OF SUCH LOSSES, COSTS, EXPENSES, OR 304 | DAMAGES. WHERE A LIMITATION OF LIABILITY IS NOT ALLOWED IN FULL OR 305 | IN PART, THIS LIMITATION MAY NOT APPLY TO YOU. 306 | 307 | c. The disclaimer of warranties and limitation of liability provided 308 | above shall be interpreted in a manner that, to the extent 309 | possible, most closely approximates an absolute disclaimer and 310 | waiver of all liability. 311 | 312 | 313 | Section 6 -- Term and Termination. 314 | 315 | a. This Public License applies for the term of the Copyright and 316 | Similar Rights licensed here. However, if You fail to comply with 317 | this Public License, then Your rights under this Public License 318 | terminate automatically. 319 | 320 | b. Where Your right to use the Licensed Material has terminated under 321 | Section 6(a), it reinstates: 322 | 323 | 1. automatically as of the date the violation is cured, provided 324 | it is cured within 30 days of Your discovery of the 325 | violation; or 326 | 327 | 2. upon express reinstatement by the Licensor. 328 | 329 | For the avoidance of doubt, this Section 6(b) does not affect any 330 | right the Licensor may have to seek remedies for Your violations 331 | of this Public License. 332 | 333 | c. For the avoidance of doubt, the Licensor may also offer the 334 | Licensed Material under separate terms or conditions or stop 335 | distributing the Licensed Material at any time; however, doing so 336 | will not terminate this Public License. 337 | 338 | d. Sections 1, 5, 6, 7, and 8 survive termination of this Public 339 | License. 340 | 341 | 342 | Section 7 -- Other Terms and Conditions. 343 | 344 | a. The Licensor shall not be bound by any additional or different 345 | terms or conditions communicated by You unless expressly agreed. 346 | 347 | b. Any arrangements, understandings, or agreements regarding the 348 | Licensed Material not stated herein are separate from and 349 | independent of the terms and conditions of this Public License. 350 | 351 | 352 | Section 8 -- Interpretation. 353 | 354 | a. For the avoidance of doubt, this Public License does not, and 355 | shall not be interpreted to, reduce, limit, restrict, or impose 356 | conditions on any use of the Licensed Material that could lawfully 357 | be made without permission under this Public License. 358 | 359 | b. To the extent possible, if any provision of this Public License is 360 | deemed unenforceable, it shall be automatically reformed to the 361 | minimum extent necessary to make it enforceable. If the provision 362 | cannot be reformed, it shall be severed from this Public License 363 | without affecting the enforceability of the remaining terms and 364 | conditions. 365 | 366 | c. No term or condition of this Public License will be waived and no 367 | failure to comply consented to unless expressly agreed to by the 368 | Licensor. 369 | 370 | d. Nothing in this Public License constitutes or may be interpreted 371 | as a limitation upon, or waiver of, any privileges and immunities 372 | that apply to the Licensor or You, including from the legal 373 | processes of any jurisdiction or authority. 374 | 375 | 376 | ======================================================================= 377 | 378 | Creative Commons is not a party to its public 379 | licenses. Notwithstanding, Creative Commons may elect to apply one of 380 | its public licenses to material it publishes and in those instances 381 | will be considered the “Licensor.” The text of the Creative Commons 382 | public licenses is dedicated to the public domain under the CC0 Public 383 | Domain Dedication. Except for the limited purpose of indicating that 384 | material is shared under a Creative Commons public license or as 385 | otherwise permitted by the Creative Commons policies published at 386 | creativecommons.org/policies, Creative Commons does not authorize the 387 | use of the trademark "Creative Commons" or any other trademark or logo 388 | of Creative Commons without its prior written consent including, 389 | without limitation, in connection with any unauthorized modifications 390 | to any of its public licenses or any other arrangements, 391 | understandings, or agreements concerning use of licensed material. For 392 | the avoidance of doubt, this paragraph does not form part of the 393 | public licenses. 394 | 395 | Creative Commons may be contacted at creativecommons.org. 396 | --------------------------------------------------------------------------------