2021-03-11 23:56:57 +00:00
<!doctype html>
< html lang = "en-US" >
< head >
2021-03-13 00:14:10 +00:00
< meta charset = "utf-8" >
< link rel = "stylesheet" href = "styles.css" >
2021-03-11 23:56:57 +00:00
2021-03-13 00:14:10 +00:00
< title > Survey of Facebook UI< / title >
< meta name = "description" content = "Survey of Facebook UI" >
< meta name = "author" content = "SitePoint" >
2021-03-11 23:56:57 +00:00
2021-03-13 00:14:10 +00:00
< link rel = "stylesheet" href = "https://maxcdn.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" >
< script src = "https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js" > < / script >
< script src = "https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js" > < / script >
< script src = "https://maxcdn.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js" > < / script >
2021-03-11 23:56:57 +00:00
< / head >
< body >
2021-03-13 00:14:10 +00:00
<!-- The Nav section for the survey title - - -->
< section id = "title" >
< div class = "container-fluid" >
< navbar >
2021-03-11 23:56:57 +00:00
< div class = "row" >
2021-03-13 00:14:10 +00:00
< div class = "col-6" >
< 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 >
< div class = "col-6" >
< img src = "images/facebook.jpg" alt = "UI" class = "facebook" >
< p style = "font-size:150%;" > Give us your opinion about < a href = "https://www.facebook.com/" > Facebook< / a > user interface< / p >
< / div >
2021-03-11 23:56:57 +00:00
< / div >
2021-03-13 00:14:10 +00:00
< / navbar >
< / div >
< / section >
2021-03-11 23:56:57 +00:00
2021-03-13 00:14:10 +00:00
<!-- the form section for the survey -->
< section id = "form" >
< div class = "container-fluid" >
<!-- The form header -->
< div class = "SurveyIntro" >
2021-03-11 23:56:57 +00:00
< h2 > Facebook Evaluation Form< / h2 >
< p > Please let us about your thoughts/experience with facebook user interface.< / p >
2021-03-13 00:14:10 +00:00
< / div >
< hr >
<!-- the content of the form -->
<!-- action="index.html" method="post" -->
2021-03-13 04:31:28 +00:00
< form class = "surveryForm" onsubmit = "setTimeout(function(){window.location.reload();},10);" >
2021-03-13 00:14:10 +00:00
<!-- User Information -->
< div class = "userInfo" >
< h2 > User Information< / h2 >
< p > Please provide your information before filling the survey< / p >
< / div >
<!-- the text box for the user filling the form -->
< div class = "form-group" >
< div class = "row" >
< div class = "col-6" >
< label for = "fnameLabel" > First Name< / label >
< input type = "text" id = "fname" name = "firstName" placeholder = "First Name" required >
2021-03-11 23:56:57 +00:00
< / div >
2021-03-13 00:14:10 +00:00
< div class = "col-6" >
< label for = "lnameLabel" > Last Name< / label >
< input type = "text" id = "lname" name = "lastName" placeholder = "Last Name" required >
2021-03-11 23:56:57 +00:00
< / div >
2021-03-13 00:14:10 +00:00
< / div >
< / div >
< div class = "form-group" >
< div class = "row" >
<!-- style="float: right;" -->
< div class = "col-6" >
< label for = "emailLabel" > Email< / label >
< input type = "text" id = "email" name = "email" placeholder = "Email" required >
2021-03-11 23:56:57 +00:00
< / div >
2021-03-13 00:14:10 +00:00
< / div >
< / div >
< hr >
<!-- Questions in the form -->
<!-- Quetion 1 and 2 -->
< div class = "row questions" >
<!-- Question 1 -->
< div class = "col-6" >
< label for = "" id = "radio" > < span > 1.< / span > Do you use the Facebook user interface often?< / label >
2021-03-11 23:56:57 +00:00
< br >
2021-03-13 00:14:10 +00:00
<!-- style="margin - right: 4px;" -->
< div class = "row" >
< div class = "col-6" >
< input type = "radio" name = "question1" value = "yes" >
< label for = "yes" > Yes< / label >
< / div >
< div class = "col-6" >
< input type = "radio" name = "question1" value = "no" >
< label for = "no" > No< / label >
< / div >
2021-03-11 23:56:57 +00:00
< / div >
2021-03-13 00:14:10 +00:00
< / div >
<!-- Question 2 -->
< div class = "col-6" >
< label > < span > 2.< / span > Which Facebook user interface do you prefer?< / label >
< div style = "margin-left: 22px;" >
< select name = "question2" >
< option value = "" selected = "" > Select an Option< / option >
< option value = "Old UI" > Old UI< / option >
< option value = "New UI" > New UI < / option >
< option value = "No Preference" > No Preference< / option >
< / select >
2021-03-11 23:56:57 +00:00
< / div >
2021-03-13 00:14:10 +00:00
< / div >
< / div >
<!-- Question3 and 4 -->
< div class = "row questions" >
<!-- Question 3 -->
< div class = "col-6" >
< label id = "radio" > < span > 3.< / span > How difficult is reading characters on the screen?< / label > < br >
< input type = "radio" name = "question3" > Very Hard< br >
< input type = "radio" name = "question3" > Somewhat hard< br >
< input type = "radio" name = "question3" > Somewhat easy< br >
< input type = "radio" name = "question3" > Very easy< br >
< / div >
<!-- Question 4 -->
< div class = "col-6" >
< label id = "checkbox;" > < span > 4.< / span > Please state your level of agreement for the following:< / label > < br >
< input type = "checkbox" name = "question4" value = "Use of terms throughout the system is consistent " > Use of terms throughout the system is consistent< / input > < br >
< input type = "checkbox" name = "question4" value = "Position of messages on the screen is consistent " > Position of messages on the screen is consistent< / input > < br >
< input type = "checkbox" name = "question4" value = "Prompts for inputs are clear " > Prompts for inputs are clear< / input > < br >
< input type = "checkbox" name = "question4" value = "System always informs about the progress of the task " > System always informs about the progress of the task< / input > < br >
< input type = "checkbox" name = "question4" value = "Error messages are helpful " > Error messages are helpful< / input >
< / div >
< / div >
<!-- Question 5 and 6 -->
< div class = "row questions" >
<!-- Question 5 -->
< div class = "col-6" >
< label id = "radio" > < span > 5.< / span > In which section of facebook does the user interface look most awful?< / label > < br >
< input type = "radio" name = "question5" > Photos< br >
< input type = "radio" name = "question5" > News< br >
< input type = "radio" name = "question5" > Messaging< br >
< input type = "radio" name = "question5" > Games< br >
< / div >
<!-- Question 6 -->
< div class = "col-6" >
< label id = "radio" > < span > 6.< / span > Is there a problem in UI that bothers you?< / label > < br >
< input type = "text" name = "question6" placeholder = "Enter the name of your problem" size = "43" >
< / div >
< / div >
<!-- feeback section -->
<!-- texto -->
< div class = "questions" >
< p style = "font-size:120%;" > Please write down your comments< / p >
< textarea rows = "10" cols = "100" maxlength = "3000" name = "comments" placeholder = "" > < / textarea >
2021-03-11 23:56:57 +00:00
< / div >
2021-03-13 00:14:10 +00:00
<!-- Submit button -->
< div class = "btnClass" >
< button type = "submit" class = "button" id = "bb" > Submit< / button >
< / div >
2021-03-11 23:56:57 +00:00
2021-03-13 00:14:10 +00:00
< / form >
2021-03-11 23:56:57 +00:00
< / div >
2021-03-13 00:14:10 +00:00
< / section >
< footer id = "footer" >
< p > Website created by Ruchira, Sam, Batuhan, and Kene< / p >
< / footer >
2021-03-11 23:56:57 +00:00
2021-03-13 00:14:10 +00:00
< script src = "/assets/action.js" > < / script >
2021-03-11 23:56:57 +00:00
< / body >
2021-03-13 00:14:10 +00:00
< / html >