What is web design? How does it work?
Objectives
Course Objectives
- Understand the importance of the web as a medium of communication.
- Understand the principles of creating an effective web page, including an in-depth consideration of information architecture.
- Become familiar with graphic design principles that relate to web design and learn how to implement these theories into practice.
- Develop skills in analyzing the usability of a web site.
- Learn the language of the web: HTML and CSS.
- Develop skills in digital imaging (Adobe Photoshop.)
- Be able to embed social media content into web pages.
- Differentiate website building and website coding
What are the different types of websites we use?
Search The Web
Use the list of 10 types of websites to find a unique example of each site. Use a google docs document to type the example and write the URL underneath it.
What do you need to Start a Website?
Now use a google document to price how much it will cost you to start your website. Use the list below to get you started. Turn your website budget into Google classroom when you are done.
List the Brand Model software you need on each line to complete your website:
1. A computer (this goes without saying, but we've been asked)
2. An Internet connection
3. The website itself (plus programs for making images and text)
4. Browsers (e.g., Internet Explorer, Firefox, Chrome, Safari, etc.)
5. Web hosting space
6. Domain name (e.g., yourwebsite.com — optional)
7. Uploading software
List the Brand Model software you need on each line to complete your website:
1. A computer (this goes without saying, but we've been asked)
2. An Internet connection
3. The website itself (plus programs for making images and text)
4. Browsers (e.g., Internet Explorer, Firefox, Chrome, Safari, etc.)
5. Web hosting space
6. Domain name (e.g., yourwebsite.com — optional)
7. Uploading software
Learning Dreamweaver
. Essentials for beginners — Short tutorials to get you going.
Build a Responsive Website (Due Tuesday April 13th, 2016)
Adobe has provided a great tutorial to build a responsive website. Your assignment is to complete this tutorial in dreamweaver and save the webpage files into a folder. Name it Lastname_Firstname_Dreamweaver and upload it in google classroom. Use the SHort tutorials above to help you complete the task.
Below are some tools to help:
What is a website builder?
Website builders are tools that typically allow the construction ofwebsites without manual code editing. They fall into two categories: online proprietary tools provided by web hosting companies. These are typically intended for users to build their private site.
web_designer_vs_web_builder.pdf | |
File Size: | 1532 kb |
File Type: |
What is Weebly?
Founded in 2007, Weebly is a San Francisco-based, global platform that lets people easily create a unique website, blog or online store. Millions around the world use Weebly to start their own business, sell online, showcase their achievements and communicate with visitors in a thoughtful and meaningful way. Designed with the first-time business owner in mind, Weebly gives everyone the freedom to build a high-quality site that works brilliantly across any device.
Sign Up for your Weebly Account.
1. Use your google Login to sign up for a weebly account.
2. Choose any type of website except BLOG
3. Choose weebly domain.
4. Send me the link to your domain in google classroom.
2. Choose any type of website except BLOG
3. Choose weebly domain.
4. Send me the link to your domain in google classroom.
USE GOOGLE TO SIGN IN
Choose a Template
Pick a Weebly Subdomain name:
Get Familiar with Weebly.
Building a website Portfolio
Today you will start your website portfolio.You will use this website the remainder of the school year to show display all of your work. Follow the Directions below.
Home Page of your website
Your home page is the introduction to your website. This is where the first impression of you and your site is made. Today you will design your site so that it is appealing to the eye.
1. Choose a theme that fits your personality or idea that you want to exhibit. Select the "Theme" tab in the blue ribbon on the top of you website builder.
2. Choose the Pages tab and create these pages in this order
3. Home Page
4. About me page: This is the important page
5. Portfolio: Some of the Items you should include in your portfolio include at least 6 from the list.
1. Choose a theme that fits your personality or idea that you want to exhibit. Select the "Theme" tab in the blue ribbon on the top of you website builder.
2. Choose the Pages tab and create these pages in this order
- Home
- About Me (You can rename this later)
- My Portfolio
- Contact Me
3. Home Page
- You must have a picture of yourself or a personal logo
- A short introduction of what the website is about
- Must be organized and clearly navigable
4. About me page: This is the important page
- Paragraph 1 - Personal information; Where you are from, age, school family all that stuff
- Paragraph 2 - Fun stuff, what your hobbies are, future interests, goals, food etc.
- Paragraph 3 - Professional Skills; Photoshop, coding, graphic design, typing, software etc. This is a short resume.
5. Portfolio: Some of the Items you should include in your portfolio include at least 6 from the list.
- Everfi Certificate
- TYPING CLUB Certificate
- Block Letter
- Slide Show Presentation / Powtoons
- Tynker Coding Games
- Gamestar mechanic link to your games
- Khan Academy Coding Project
- Photography you've done.
- Podcasts
- Music Loops
- Radio Commercial
- Photography from the photo shoots
- Any photoshop lessons
EXAMPLE: http://mytexhillportfolio.weebly.com/