socnetsurvey/data/survey.html
2014-12-28 04:19:37 +01:00

403 lines
No EOL
20 KiB
HTML

<html>
<head>
<title>The Social Networks Threats Survey</title>
<meta name="author" content="co-authored by Michał Tomasz Baran, Jacek Klich, Michał 'rysiek' Woźniak" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="Content-Language" content="en" />
<meta name="description" content="Social Networks survey for 31C3" />
<meta name="robots" content="noindex,nofollow" />
<meta name="audience" content="all" />
<style>
body {
font-size:11pt;
font-family:sans-serif;
max-width:1000px;
margin:auto;
padding:1em;
background:white;
}
fieldset {
margin-bottom:2em;
border:solid 2px #555;
border-radius:1em;
}
fieldset > legend {
font-size:110%;
border-radius:0.5em;
background:#555;
color:white;
padding:0.5em;
max-width:75%;
}
.survey-container.errors fieldset {
opacity:0.5;
}
.error-message {
display:none;
font-weight:bold;
color:red;
}
.survey-container.errors fieldset.error {
border-color: red;
opacity:1.0;
}
fieldset.error > legend {
background: red;
}
fieldset.error .error-message, .survey-container.errors > .error-message {
display:block;
}
.survey-container.errors > .error-message {
border-radius:0.5em;
padding:1em;
color:white;
background:red;
}
.submitted-message {
border-radius:0.5em;
padding:1em;
color:white;
background:green;
}
.error-message.save, .error-message.repeat {
border-radius:0.5em;
padding:1em;
color:white;
display:block;
background:#f80;
font-weight:normal;
}
.submitted-message > em, .error-message > em {
font-weight:bold;
font-style:normal;
}
fieldset > legend > em {
font-weight:bold;
}
fieldset .description {
font-style:italic;
}
input, label {
cursor:pointer;
}
input[type="submit"] {
display:block;
color:white;
background:#555;
padding:0.5em;
border-radius:0.5em;
border:solid 3px #555;
font-weight:bold;
font-size:120%;
width:100%;
transition: border-color 1s, background-color 1s;
}
input[type="submit"]:hover, input[type="submit"]:focus {
background-color:#222;
border-color:#222;
}
.response {
display: block;
margin-bottom: 0.5em;
margin-top: 0.5em;
padding: 0.5em;
border-radius: 0.5em;
border: solid 2px #ddd;
}
.response > p {
margin:0em;
}
.response > input[type="text"], .response > textarea {
display:block;
margin:0em;
width:100%;
cursor:text;
border-radius:0.25em;
border:solid 1px #666;
padding:0.25em;
}
.response.error, input.error {
border-color: red;
background: #fdb;
}
header {
margin-bottom:2em;
border-bottom:solid 2px #555;
border-radius:1em;
padding:1em;
background:linear-gradient(0deg, #ccc, #fff 50%, #fff);
}
footer {
margin-top:2em;
border-top:solid 2px #555;
border-radius:1em;
padding:1em;
background:linear-gradient(180deg, #ccc, #fff 50%, #fff);
}
footer > h2 {
margin-top:0.5em;
}
</style>
</head>
<body>
<div class="outer-container">
<header>
<h1>Social Networks Threats Survey</h1>
<p class="description">This survey is intended to help mapping mainstream social networks' impact, perceived or actual threats related to them, perception of these, and possible ways of handling them.</p>
<p class="description"><em>This survey is anonymous.</em> No potentially identifying data (like IP addresses, user-agent strings, etc) will be logged nor used in the analysis.</p>
<p class="description">There are <em>2 sections</em> in this survey. The first one is the questionnaire with 5 questions pertaining to your use of mainstream social networks. All these questions need to be answered for the survey to be considered complete. The second section contains 4 personal questions that will help us in the analysis of gathered data; these questions are not required, but answers would be very helpful.</p>
</header>
{% set submitted = false %}
{% for p in post %}{% if (loop.last) %}
{% set submitted = true %}
{% for e in errors %}{% if (loop.last) %}
{% set submitted = false %}
{% endif %}{% endfor %}
{% endif %}{% endfor %}
{% if (submitted) %}
<p class="submitted-message"><em>The survey has been successfully submitted. Thank you!</em><br/>Information on the results of the survey and the resulting article will be published here. This might, however, take some time - your patience is greatly appreciated.<p>
{% elif (errors["save"]) %}
<p class="error-message save"><em>An error occured while saving your survey - we're sorry!</em><br/>Thank you for your contribution. We would appreciate if you tried at some later time</p>
{% elif (errors["repeat"]) %}
<p class="error-message repeat"><em>You seem to have already filled this survey before.</em><br/>Thank you for your contribution, but we would prefer to have a single survey per participant.</p>
{% else %}
{% macro posted_text(name) %}{% if (post[name]) %}{{ post[name] }}{% endif %}{% endmacro %}
{% macro posted_radio(name, val) %}{% if (post[name] == val) %} checked{% endif %}{% endmacro %}
{% macro fieldset_class(s, q) %}question {{s}} {{q}}{% if (errors) && (errors[s]) %}{% if (errors[s][q] === false) %} error{% elseif (errors[s][q]) %} error{% endif %}{% endif %}{% endmacro %}
{% macro field_error(s, q, f) %}{% if (errors) && (errors[s]) and (errors[s][q]) -%}
{%- for e in errors[s][q] -%}
{%- if f === e %} error{% endif -%}
{%- endfor -%}
{%- endif %}{% endmacro %}
<form method="POST" action="{{survey_address}}/{{survey_id}}">
<div class="survey-container{% for e in errors %}{% if loop.last %} errors{% endif %}{% endfor %}" >
<p class="error-message">The survey seems incomplete. Please take note of the errors indicated below.<p>
<div class="section-container">
<h2>Section I. Survey Questionnaire</h2>
<p class="description">Questions in this section important and must be completed. These 5 questions will help us understand and map people's use and attitudes towards mainstream social networks.</p>
<div class="questions-container">
<fieldset class="{{ fieldset_class('s1', 'q1') }}">
<legend><em>Question 1:</em> While using or considering use of mainstream social networks (such as Facebook, Google+, Twitter or similar), do you perceive any problems related to policy and practices of their owners?</legend>
<p class="error-message">Please select an option.<p>
{% set q1 = [
"I use these social networks and do not perceive any problems at all",
"I use these social networks and sometimes perceive problems, but usually it doesn't matter",
"I use these social networks but I constantly consider such problems, and make decisions regarding which of these social networks I use because of this",
"I am a very rare user of these social networks because of these problems",
"I do not use these social networks because of these problems",
"I do not use these social networks at all or use them seldom regardless of these problems"
]
%}
{% for q in q1 %}
<div class="response s1_q1_{{loop.index}}"><input type="radio" name="s1_q1" value="{{loop.index}}" id="s1_q1_{{loop.index}}"{{ posted_radio('s1_q1', loop.index)}}/><label for="s1_q1_{{loop.index}}">{{q}}</label></div>
{% endfor %}
</fieldset><!-- q1 -->
<fieldset class="{{ fieldset_class('s1', 'q2') }}">
<legend><em>Question 2:</em> With regard to mainstream social networks (as listed in question 1.), please mark how serious you perceive problems to be in the given areas.</legend>
<p class="description">While evaluating problems of using social networks please use the scale:</p>
<ol class="description">
<li>there are no problems;</li>
<li>there are some problems, but I do not consider them significant; they do not influence my use or choice of mainstream social networks;</li>
<li>there are some problems that influence my use or choice of mainstream social networks;</li>
<li>there are significant problems that influence heavily my use or choice of mainstream social networks;</li>
<li>because of these problems in this area I do not use mainstream social networks.</li>
</ol>
<p class="error-message">Please select options in the highlighted areas. Please indicate other areas if option "other" is selected.<p>
{% set q2 = [
"security of my privacy and negotiating position with regard to commercial relations (e.g. insurance company, bank, lender, etc)",
"security of my information with regard to relations with public administration / government",
"security of my information with regard to personal, social, family relations",
"manipulation of or influence over my perception of the world",
"risk of making my personal information available to third parties outside my control (e.g. to social network's operator's business partners)",
"risk of losing control over my information/data/contacts stored within the social network (e.g. due to censorship, factual or apparent policy violation, change of business model, etc)",
"risk of sudden one-sided negative change to terms of service of the social network",
"risk of losing access to third-party services (e.g. those that use the social network as authentication provider)",
"(optional) other not mentioned above (please indicate):"
]
%}
{% for q in q2 %}
<div class="response s1_q2_{{loop.index}} {{ field_error('s1', 'q2', 's1_q2_' + loop.index ) }}">
{% set o = loop.index %}
{% for a in Array(5) %}
<input type="radio" name="s1_q2_{{o}}" value="{{loop.index}}" id="s1_q2_{{o}}_{{loop.index}}"{{ posted_radio('s1_q2_' + o, loop.index)}}/><label for="s1_q2_{{o}}_{{loop.index}}">{{loop.index}}</label>
{% endfor %}
<p>{{q}}{% if loop.last %}</p><input type="text" class="{{ field_error('s1', 'q2', 's1_q2_' + o + '_text' ) }}" name="s1_q2_{{o}}_text" id="s1_q2_{{o}}_text" value="{{ posted_text('s1_q2_' + o + '_text') }}"/>{% endif %}
</div>
{% endfor %}
</fieldset><!-- q2 -->
<fieldset class="{{ fieldset_class('s1', 'q3') }}">
<legend><em>Question 3:</em> In your opinion, should some of the information you supply to the mainstream social networks you use not be used for commercial purposes?</legend>
<p class="error-message">Please select an option.<p>
<div class="response s1_q3_1"><input type="radio" name="s1_q3" value="1" id="s1_q3_1"{{ posted_radio('s1_q3', 1)}}/><label for="s1_q3_1">Yes</label></div>
<div class="response s1_q3_0"><input type="radio" name="s1_q3" value="0" id="s1_q3_0"{{ posted_radio('s1_q3', 0)}}/><label for="s1_q3_0">No</label></div>
</fieldset><!-- q3 -->
<fieldset class="{{ fieldset_class('s1', 'q4') }}">
<legend><em>Question 4:</em> Who should exercise control and oversight to resolve problems with using mainstream social networks?</legend>
<p class="description">You may indicate several options.</p>
<p class="error-message">Please select at least one option.<p>
{% set q4 = [
"there is no such need",
"the social network itself",
"social network and other enterprises, in cooperation",
"social network and public administration, in cooperation",
"public administration"
]
%}
{% for q in q4 %}
<div class="response s1_q4_{{loop.index}}"><input type="checkbox" name="s1_q4_{{loop.index}}" value="1" id="s1_q4_{{loop.index}}"{{ posted_radio('s1_q4_' + loop.index, 1)}}/><label for="s1_q4_{{loop.index}}">{{q}}</label></div>
{% endfor %}
</fieldset><!-- q4 -->
<fieldset class="{{ fieldset_class('s1', 'q5') }}">
<legend><em>Question 5:</em> Please select (in your opinion) the best solution to resolve problems with using mainstream social networks.</legend>
<p class="error-message">Please select an option.<p>
{% set q5 = [
"there is no such need",
"market forces will be sufficient to resolve these problems.",
"self-regulation in this sector will be sufficient mechanism to resolve these problems.",
"legal regulation is needed to resolve these problems"
]
%}
{% for q in q5 %}
<div class="response s1_q5_{{loop.index}}"><input type="radio" name="s1_q5" value="{{loop.index}}" id="s1_q5_{{loop.index}}"{{ posted_radio('s1_q5', loop.index)}}/><label for="s1_q5_{{loop.index}}">{{q}}</label></div>
{% endfor %}
</fieldset><!-- q5 -->
</div><!-- questions-container -->
</div><!-- section-container -->
<div class="section-container">
<h2>Section II. Personal Information</h2>
<p class="description">We would like you to answer a few additional questions which will enable us to better understand public opinion in this area. All answers are absolutely anonymous and will be used only in a consolidated statistical report.</p>
<p class="description">We recognize these are sensitive questions, and understand not everyone is willing to answer them. Feel free to ignore this whole section or individual questions, if you feel uncomfortable with them.</p>
<div class="questions-container">
<fieldset class="{{ fieldset_class('s2', 'q1') }}">
<legend><em>Question 1:</em> Do you prefer to identify as...</legend>
<p class="error-message">When providing free-form description, please limit its length to 1024 characters<p>
{% set q1 = [
"Female",
"Male",
"Genderfluid",
"Agender/Neutral/Neither",
"Pangender/Non-binary",
"None of your business",
"Other (please indicate):"
]
%}
{% for q in q1 %}
<div class="response s2_q1_{{loop.index}}"><input type="radio" name="s2_q1" value="{{loop.index}}" id="s2_q1_{{loop.index}}"{{ posted_radio('s2_q1', loop.index)}}/><label for="s2_q1_{{loop.index}}">{{q}}</label>{% if loop.last %}<input type="text" name="s2_q1_{{loop.index}}_text" id="s2_q1_{{loop.index}}_text" value="{{ posted_text('s2_q1_' + loop.index + '_text') }}"/>{% endif %}</div>
{% endfor %}
</fieldset><!-- q1 -->
<fieldset class="{{ fieldset_class('s2', 'q2') }}">
<legend><em>Question :</em> Your age</legend>
{% set q2 = [
" < 18",
"19 - 24",
"25 - 30",
"31 - 35",
"36 - 40",
"41 - 45",
"46 - 50",
" > 50"
]
%}
{% for q in q2 %}
<div class="response s2_q2_{{loop.index}}"><input type="radio" name="s2_q2" value="{{loop.index}}" id="s2_q2_{{loop.index}}"{{ posted_radio('s2_q2', loop.index)}}/><label for="s2_q2_{{loop.index}}">{{q}}</label></div>
{% endfor %}
</fieldset><!-- q2 -->
<fieldset class="{{ fieldset_class('s2', 'q3') }}">
<legend><em>Question 3:</em> What is your occupation (please select the most relevant option)?</legend>
{% set q3 = [
"student",
"full- or part-time empolyee",
"freelancer",
"entrepreneur",
"other"
]
%}
{% for q in q3 %}
<div class="response s2_q3_{{loop.index}}"><input type="radio" name="s2_q3" value="{{loop.index}}" id="s2_q3_{{loop.index}}"{{ posted_radio('s2_q3', loop.index)}}/><label for="s2_q3_{{loop.index}}">{{q}}</label></div>
{% endfor %}
</fieldset><!-- q3 -->
<fieldset class="{{ fieldset_class('s2', 'q4') }}">
<legend><em>Question 4:</em> What is your education level?</legend>
<p class="description">Please select the highest level.</p>
{% set q4 = [
"primary/secondary/high school",
"college",
"BoA /BoS (or equivalent)",
"MA/MS (or equivalent)",
"PhD or higher"
]
%}
{% for q in q4 %}
<div class="response s2_q4_{{loop.index}}"><input type="radio" name="s2_q4" value="{{loop.index}}" id="s2_q4_{{loop.index}}"{{ posted_radio('s2_q4', loop.index)}}/><label for="s2_q4_{{loop.index}}">{{q}}</label></div>
{% endfor %}
</fieldset><!-- q4 -->
<fieldset class="{{ fieldset_class('s2', 'q5') }}">
<legend><em>Your Comments:</em> Please share any comments you might have</legend>
<p class="description">We value your input; if you have any comments about the survey, its topic, composition, etc., we would greatly appreciate if you shared them. Please limit your comment to 1024 characters.</p>
<p class="error-message">Please note: text supplied in this field cannot be longer than 1024 characters<p>
<div class="response s2_q5"><textarea name="s2_q5" id="s2_q5" rows="5">{{ posted_text('s2_q5') }}</textarea></div>
</fieldset><!-- q4 -->
</div><!-- questions-container -->
</div><!-- section-container -->
<input type="submit" value="Submit survey!"/>
</div><!-- survey-container -->
</form>
{% endif %}
<footer>
<h2>Who are we?</h2>
<p>We are a team of researchers from Poland, attempting to map issues (both apparent and factual) related to use of mainstream social networks, and possible ways to tackle them.</p>
<p><em>prof. Jacek Klich</em>, Cracow University of Economy profesor, Economy and Public Administration department.</p>
<p><em>Michal Baran, Ph. D.</em>, Doctor of Philosophy in Management Science on Jagiellonian University in Krakow (Poland). Deals with the area of information science, communication in the field of management.</p>
<p><em>Michał "rysiek" Woźniak</em>, human rights in digital era activist, free-software advocate, privacy evangelist.</p>
<p><em><a href="https://git.hackerspace.pl/rysiek/socnetsurvey/">Code is available</a> under the terms of <a href="http://www.gnu.org/licenses/agpl-3.0.txt">Affero GPL</a></em></p>
</footer>
</div><!-- outer-container -->
</body>
</html>