<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="styles.css">
<title>Survey of Facebook UI</title>
<meta name="description" content="Survey of Facebook UI">
<meta name="author" content="SitePoint">
<link rel="stylesheet" href="css/styles.css?v=1.0">
</head>
<body>
<div>
<h1>Questionnaire of the Facebook UI/UX</h1>
<a href="https://www.facebook.com/">
<img src="images/fb.png" alt="Facebook" class="fb">
</a>
</div>
<section class="survey_body">
<p style="font-size:150%;">Give us your opinion about <a href="https://www.facebook.com/">Facebook</a> user interface</p>
<form>
<div class="form-control">
<label id="name-label">First Name:</label>
<input type="text" placeholder="Enter the First Name" required>
</div>
<div class="form-control">
<label id="name-label">Last Name:</label>
<input type="text" placeholder="Enter the Last Name" required>
</div>
<div class="form-control">
<label id="name-label">E-mail:</label>
<input type="text" placeholder="Enter the Email" required>
</div>
<br>
<div id="questions">
<div class="two">
<form>
<label id="radio">Do you use the Facebook user interface often?</label>
<br>
<div style="margin-right: 4px;">
<input type="radio" value="yes" name="enjoy">
<label for="yes">Yes</label>
<input type="radio" value="no" name="enjoy">
<label for="no">No</label>
</div>
</form>
<br>
</div>
<div class="box">
<label>Which Facebook user interface do you prefer?</label>
<div style="margin-left: 22px;">
<form action="/action_page.php" method="get">
<label for="browser"></label>
<input list="browsers" name="browser" id="browser">
<datalist id="browsers">
<option value="Old UI">
<option value="New UI">
<option value="No Preference">
</datalist>
</form>
</div>
</div>
<div class="btn-control">
<label id="radio">How difficult is reading characters on the screen?</label><br>
<input type="radio" name="Times ">Very Hard<br>
<input type="radio" name="Times ">Somewhat hard<br>
<input type="radio" name="Times ">Somewhat easy<br>
<input type="radio" name="Times ">Very easy<br>
</div>
<div class="btn-control">
<label id="checkbox;">Please state your level of agreement for the following:</label><br>
<input type="checkbox" value="">Use of terms throughout the system is consistent</input><br>
<input type="checkbox" value="">Position of messages on the screen is consistent</input><br>
<input type="checkbox" value="">Prompts for inputs are clear</input><br>
<input type="checkbox" value="">System always informs about the progress of the task</input><br>
<input type="checkbox" value="">Error messages are helpful</input>
</div>
<div class="btn-control">
<label id="radio">In which section of facebook does the user interface look most awful?</label><br>
<input type="radio" name="Times ">Photos<br>
<input type="radio" name="Times ">News<br>
<input type="radio" name="Times ">Messaging<br>
<input type="radio" name="Times ">Games<br>
</div>
<div class="btn-control">
<label id="radio">Is there a problem in UI that bothers you?</label><br>
<input type="text" placeholder="Enter the name of your source" size="43">
</div>
<br>
<div class="texto">
<p style="font-size:120%;">Please enter your comments here:
<p>
<textarea rows="10" cols="100" maxlength="3000" placeholder="Enter your text...."></textarea>
</div>
<button type="submit" class="button">Submit</button>
</div>
</form>
</section>
<div class="footer">
<p>Website created by Ruchira, Sam, Batuhan, and Kene</p>
</div>
</div>
</body>
</html>