WDI Fundamentals Unit 1
Building a website begins with User Experience Design, often called UX Design or simply UX. The goal of UX Design is to make the site easy and exciting to use. A UX Designer will analyze the larger purpose of the site, and create sketches called wireframes that detail out every functionality the site needs in order to fulfill that purpose. Wireframes show how a user can navigate the different pages and sections of a site using basic layout and annotations. Wireframes are the blueprints of a website.
When the wireframes are complete, they're often passed off to the Visual Design and Developer teams simultaneously. Visual Designers decide how the site will look using layout, color, typography, images, video and more. Visual design is an important aspect of the web production process– not only for beautifying the web– but because certain design elements can largely impact the usability of the site.
As a general rule, a Developer team consists of front-end and back-end developers. Front-end developers bring the designs to life with HTML, CSS, and JS. Back-end developers give the website a "memory" by storing data using languages like PHP, Python, and Ruby.
Let's talk in more detail how the front end differs from the back end. Think of a web app like a retail clothing store.
Then, there are all the parts of the store you don't see: the loading dock where products are shipped, the break room where the staff schedule is posted, or the office where the accountant handles the finances. This is the back end of the store.
Responsibilities of the back-end developers include:
Let's imagine a user has logged in to their bank's website to view the balance on her checking account. Everything she sees on the screen is front-end code.
When she selects 'Checking Account', the back-end code kicks in. The website now finds her user information, which has been stored in a database.
The server returns a response containing our user's checking account information. Then the front end takes over once again, displaying her information with HTML, CSS, and JS.
Objective: Distinguish Between HTML, CSS, and JS
Visit lyft.com. Try to fill in these blanks: