$25
Week 1: Course Introduction
Agenda
Overview
Course Introduction o Who am I? o What will we be learning? o How will we learn it? o Course Expectations o Grade Breakdown o Important Grading Policies
Introduce Yourself (Class Activity)
What is Web Development? (Lecture)
Website Features Discussion (Class Activity)
Reflection/Website Evaluations (HW)
Participation Questions (4)
Next Week
Overview
This week we will introduce ourselves and learn about the course and expectation for it. We will also go over what web development is briefly and discuss the evaluation of websites. Students will be given one homework assignment and 4 participation questions to answer.
Course Introduction
What will we be learning?
This class at its core is a web design/development course. We will be examining and utilizing front-end technologies to create high quality websites capable of functioning across various devices/platforms. Specifically, we will work with the following technologies:
HTML
CSS
JavaScript/JQuery
HTML/CSS are the front-end technologies that allow our website to have a look/feel to them.
Think of the support beams, walls, wood, paint, and other aesthetics which make up a house. JavaScript is a programming language that gives our website functionality. Think of light switches, air conditioning, and other appliances which add to the comfort and ease-of-use in your home.
How will we learn it?
One of the best ways to learn to build websites is through hands-on activities. Throughout the course of the semester, you will be given tasks to fix or build various components of web pages. In completing these exercises, you will learn best practices for building websites and how to implement them into your work. These tasks aren’t designed to be overly strenuous or tedious but will require effort and your active participation for you to succeed.
In addition to weekly exercises, there will be participation and in-class activities to test your course content knowledge and research abilities. Research and discussion allow us to obtain more knowledge through the sharing of new information and debating of existing ideas.
Lastly, we will have a final project consisting of multiple parts due at the end of the semester. The overall project will be for you the build a website based on a topic of your choice. The purpose of this project is to demonstrate the web development/design skills you’ll have picked up throughout the course of the semester. Each week, we will learn new things to aid you in the completion of the project, so weekly participation is very important if you want to be able to finish it.
What is Web Development? (Lecture)
Web development revolves around the creation of websites which are generally publicly available. To build a website, you need to at least use Hypertext Markup Language (HTML). However, for more robust websites, other technologies such as Cascading Style Sheets (CSS) and JavaScript (JS) may be required. These technologies are considered “client-side” and are what we will primarily work with this semester. CINF 362 is geared more toward the “serverside” technologies which allow us to utilize databases and build more advanced features for our website such as user accounts, payment systems, etc.
What makes a website good vs bad?
Before determining whether a website is “good” or “bad”, it’s important to note that opinions on a website can vary widely from one person to the next. One user may think a website is incredible, while another user finds it to be lackluster. Therefore, it becomes important to distinguish between subjective and objective criteria used to evaluate websites. Our goal is to try and be objective to ensure that our websites are functional above
However, there are general things we can look at which are necessary for a website to function properly and be useful. Firstly, we must consider the purpose of the website. Once we’ve established its purpose, we can use some of the following criteria for our evaluation. This list isn’t exhaustive, but it’s a good place to start.
Ease of use
o Navigable o Readable o Understandable
Information hierarchy
Load times
Aesthetics
Quality of content o Published by website o Published by users on website
Available features
Responsiveness (mobile-friendly)
Personalization
Website Features Discussion (Class Activity)
Visit any two websites of your choosing. If you can’t think of any, feel free to use some from the list below. Your task for the next few minutes is to go through a few pages of each website and document what you’re seeing. Consider the different criteria mentioned above and write down some quick information on your websites.
Specifically, what types of content are present on the website? How is the information organized? Where is the main navigation placed? Where is the contact information located? Can you tell the purpose of the website right away? What are common features on these websites? Do these websites work well on mobile devices?
Links for Discussion
https://omh.ny.gov/
https://www.cnn.com/
https://pinchofyum.com/
https://www.amazon.com/
https://www.etsy.com/
For this exercise, all you need to do is quickly jot down some pieces of information, and then we’ll go over our findings together as a class.
Reflection/Website Evaluations (HW)
This assignment contains two parts. Please follow the instructions for each part.
Part 1 (Reflection) Instructions:
https://deathtobullshit.com/
https://vimeo.com/63437853
Visit the links above and watch the video for “Death to Bullshit” by Brad Frost. Write at least two paragraphs with your reactions to the video. Your write-up should include your reflections and views on what Brad Frost discussed as opposed to a shaummary of what he says. If you’re unsure of where to start, feel free to use the questions below for starting points. Keep in mind that this video was released in 2013.
Do you agree with what Brad Frost mentions?
How have the statistics he mentions changed since the video was released? o Browser usage, technologies, amounts of data produced, etc.
Are the issues he talks about still relevant? Have you experienced them?
What are some problems arising from the widespread adoption of the internet and related technologies? What are some benefits?
What changes would you make to modern websites?
In your write-up, you should also include a link to some related research that adds to your reflection. It can refute or agree with what the speaker was discussing, or it can introduce a new relevant topic entirely. For citation purposes, include a link to your source below the write-up so I can view it.
Part 2 (Website Evaluations) Instructions:
https://www.darkpatterns.org/types-of-dark-pattern
https://www.w3.org/WAI/perspective-videos/
https://www.ideasonpurpose.com/on/7-qualities-great-website/
https://html-online.com/articles/avoid-html-website-features/
Visit the links above which cover dark patterns, how users with disabilities work with the web, and general practices for website development. Based on the information provided and the criteria for good/bad websites discussed earlier in class, your task will be to evaluate three websites. One website will be your choice, but the other two must be from the list below.
http://www.goetzskyvu.com/GOETZ_THEATRE/GOETZ_SHOW_&_TIMES.html
http://themagicofbaltimore.blogspot.com/
https://www.art.yale.edu/
https://www.felixhieronimus.com/
https://www.reddit.com/
In your evaluation, you should provide a link to the websites you’re using for this assignment. Besides this, you should discuss what aspects of the website make it “good” versus “bad.” In your evaluation, you must mention some specific criteria and make a clear argument for your decision.
These write-ups are due Thursday, September 2nd at 6pm. Each one should be grammatically correct and represent your own personal thoughts. To submit the work for this assignment, visit Blackboard à Course Materials à Lectures Notes for this week’s class. You can also go into the “Assignments” folder and the submission area will be titled “Reflections/Website
Evaluations.” The file should be submitted individually as a Word document or something else I can open. The work submitted will be evaluated based on the rubric explained below.
Reflection/Website Evaluations Rubric – 10pts
Death to Bullshit Reflection: 4pts o Length of writeup: 1pts o Quality of writeup: 2pts o Cited source: 1pt
Website Evaluations: 6pts o Each Evaluation: 3ptsWebsite link included: .5pt
Evaluation is thorough: 2.5pts
Stated whether website is “good” or “bad”
Provided specific reasons as to why
To submit it, go to Blackboard à Course Materials à Lecture Notes for this week’s class. You can also visit the Assignments folder directly from the Course Materials folder.
Participation Questions 8/26
To receive credit for participation in today’s class, please answer all the questions in the Google Form linked below. If you don’t want to answer the final question (fun), simply put N/A (not applicable) for your answer and that will count.
https://forms.gle/VgsZxP5rMUNtmRv56
Next Week
In next week’s class, we will learn about the website building process. Specifically, we’ll cover wireframes, style tiles, and conducting needs assessments. The links below aren’t required reading but will offer a helpful glimpse into wireframes and style tiles.
https://www.experienceux.co.uk/faqs/what-is-wireframing/
https://balsamiq.com/learn/resources/articles/what-are-wireframes/ http://styletil.es/