SlideShare a Scribd company logo
Websites!!


Introduction to Websites
ITGS Internal Assessment Project
What Makes a Good Website?
   Easy to Navigate
   Aesthetically Pleasing
       Color Scheme
       Images
       Background
       Buttons
       Rollovers
   Obvious and Concise Navigation Bar
   Clean Layout of Pages
   Information is easy to find (logical order to
    things)
   Consistent Theme/Style
www.mms.com


              • Graphically
              Appealing
              •Clear, concise,
              obvious horizontal
              Navigation Bar
              •Simple and clean
              yet interesting
              •Background
              enhances page vs.
              detracting from it
www.celhs.osceola.k12.fl.us


                   Clean Layout
                   Appealing to the
                    eye
                   Easy to Navigate
                   Obvious vertical
                    Navigation Bar
                   Visual elements
                    add to design
Color Scheme:
   Color Scheme: Be aware
   Colors should enhance, not take
    over
   Text color vs. background color
What NOT to do . . .
Static Website Vs. Flash Website:
           Static (standard html)
   Static Websites (standard html):
       May contain Flash elements
       No animation
       Rollovers
            Rollover = One image switches to a different image
       Load faster
       Easier to create
       More Common
Static Website Vs. Flash Website:
            Adobe Flash Website

   Flash is:
       an animation program
       Popular with Website designers.
       Can include animated rollovers, repetitive
        animation in background, and musical options.
       Can be included as a small insert in a static
        site.
Flash Website:
                        http://okaydave.com/okaydave2006.html




• Really Interesting
FLASH site.
• Great Layout and
Organization.
•Great Navigation-Bar
Style.
•Fully Flash Animated


                 Great Resource for Amazing Flash Websites:
                         http://www.commarts.com/
Now that we can recognize a great
website . . .

   You will create your own!

   Remember:
     Your Audience
     Your Color Scheme

     SCREEN SHOTS- DO CONSTANTLY!!
          Every single day you should have at least
           12 Screen shots (even if you don’t use
           them!)
Photoshop Layout
   Your Website will be created using
    PHOTOSHOP (No, this is not negotiable.)
   Your entire page layout, for both pages
    must be sketched out and APPROVED
    before beginning on computer.
   Size:
       800px X 700px (or more)
       Resolution: 72 ppi
   Navigation should be consistent, you will
    create 1 Photoshop file with different
    Folders (within Photoshop) for the pages.
Example of a Sketchbook Layout
    for a Website:
       www.unframedjourney.com




(Mrs.
Model’s
Website)
Sketch!




          Created Site!
Content Sketches!
Website Layout Sketches-
      your sketches should answer these questions!

   How will your site be layed out?
   Where is the Navigation Bar? Is it vertical
    or horizontal?
   What is your color scheme?
   Where will your pictures be placed?
   Where will the text go?
   What will the background look like (you
    don’t have to sketch this- you can make a
    small note to yourself for this)
   What will your top banner look like?
You can add things in Photoshop
     to make your website “Pop”

Images &
Design Element
Ideas:
•“Post-It” Notes
• Polaroid's
• Thumbtacks
• Cork Board.
Your Websites
   Draw a FULL PAGE sketch of your Home Page
    (This one should be the most detailed)
       Put the navigation bar
       The banner
       What content?
   Other Pages
       “See Home page” for banner and nav bar
       Content

More Related Content

What's hot

ppt of web development for diploma student
ppt of web development for diploma student ppt of web development for diploma student
ppt of web development for diploma student
Abhishekchauhan863165
 
WEB I - 01 - Introduction to Web Development
WEB I - 01 - Introduction to Web DevelopmentWEB I - 01 - Introduction to Web Development
WEB I - 01 - Introduction to Web Development
Randy Connolly
 
WordPress
WordPressWordPress
Web development
Web developmentWeb development
Web development
Kanan Rahimov
 
Web Designing Presentation
Web Designing PresentationWeb Designing Presentation
Web Designing Presentation
RahulSuri30
 
Wordpress
WordpressWordpress
Wordpress
lexinamer
 
Modern Web Development
Modern Web DevelopmentModern Web Development
Modern Web Development
Robert Nyman
 
Content management system
Content management systemContent management system
Content management system
Adhoura Academy
 
Wordpress
WordpressWordpress
Wordpress
samirlakhanistb
 
Web Development
Web DevelopmentWeb Development
Web Development
Aditya Raman
 
Intro to Web Design
Intro to Web DesignIntro to Web Design
Intro to Web Design
Kathy Gill
 
Elements Of Web Design
Elements Of Web DesignElements Of Web Design
Elements Of Web Design
Dan Dixon
 
Lecture 1 intro to web designing
Lecture 1  intro to web designingLecture 1  intro to web designing
Lecture 1 intro to web designing
palhaftab
 
Introduction to WooCommerce
Introduction to WooCommerce Introduction to WooCommerce
Introduction to WooCommerce
Dat Hoang
 
WordPress Complete Tutorial
WordPress Complete TutorialWordPress Complete Tutorial
WordPress Complete Tutorial
OpenSource Technologies Pvt. Ltd.
 
Web development
Web developmentWeb development
Web development
RaziyaChoudhary
 
Web development tool
Web development toolWeb development tool
Web development tool
Deep Bhavsar
 
Introduction to Web Components
Introduction to Web ComponentsIntroduction to Web Components
Introduction to Web Components
Fu Cheng
 

What's hot (20)

ppt of web development for diploma student
ppt of web development for diploma student ppt of web development for diploma student
ppt of web development for diploma student
 
WEB I - 01 - Introduction to Web Development
WEB I - 01 - Introduction to Web DevelopmentWEB I - 01 - Introduction to Web Development
WEB I - 01 - Introduction to Web Development
 
WordPress
WordPressWordPress
WordPress
 
WORDPRESS
WORDPRESSWORDPRESS
WORDPRESS
 
Web development
Web developmentWeb development
Web development
 
Web Designing Presentation
Web Designing PresentationWeb Designing Presentation
Web Designing Presentation
 
Intro to Wordpress
Intro to WordpressIntro to Wordpress
Intro to Wordpress
 
Wordpress
WordpressWordpress
Wordpress
 
Modern Web Development
Modern Web DevelopmentModern Web Development
Modern Web Development
 
Content management system
Content management systemContent management system
Content management system
 
Wordpress
WordpressWordpress
Wordpress
 
Web Development
Web DevelopmentWeb Development
Web Development
 
Intro to Web Design
Intro to Web DesignIntro to Web Design
Intro to Web Design
 
Elements Of Web Design
Elements Of Web DesignElements Of Web Design
Elements Of Web Design
 
Lecture 1 intro to web designing
Lecture 1  intro to web designingLecture 1  intro to web designing
Lecture 1 intro to web designing
 
Introduction to WooCommerce
Introduction to WooCommerce Introduction to WooCommerce
Introduction to WooCommerce
 
WordPress Complete Tutorial
WordPress Complete TutorialWordPress Complete Tutorial
WordPress Complete Tutorial
 
Web development
Web developmentWeb development
Web development
 
Web development tool
Web development toolWeb development tool
Web development tool
 
Introduction to Web Components
Introduction to Web ComponentsIntroduction to Web Components
Introduction to Web Components
 

Viewers also liked

Introduction To Website Development
Introduction To Website DevelopmentIntroduction To Website Development
Introduction To Website Development
zaidfarooqui974
 
CMS 120: Introduction to Building a Website
CMS 120: Introduction to Building a WebsiteCMS 120: Introduction to Building a Website
CMS 120: Introduction to Building a Website
Montana State University
 
Website introduction
Website introductionWebsite introduction
Website introductiongmlib
 
Content Marketing Strategy Guide (2013)
Content Marketing Strategy Guide (2013)Content Marketing Strategy Guide (2013)
Content Marketing Strategy Guide (2013)
Right Hand Planning
 
Joomla Beginners Overview Of Day
Joomla Beginners Overview Of DayJoomla Beginners Overview Of Day
Joomla Beginners Overview Of Dayguest01babb
 
Create your first WordPress website – an introduction to WordPress
Create your first WordPress website – an introduction to WordPressCreate your first WordPress website – an introduction to WordPress
Create your first WordPress website – an introduction to WordPress
Nancy Johnson
 
The very introduction to content management systems
The very introduction to content management systemsThe very introduction to content management systems
The very introduction to content management systems
Sean Donnelly BA MSc QFA
 
Beyond Basic Content Management: An Introduction to Drupal Administration
Beyond Basic Content Management: An Introduction to Drupal AdministrationBeyond Basic Content Management: An Introduction to Drupal Administration
Beyond Basic Content Management: An Introduction to Drupal AdministrationForum One
 
Introduction to web content management
Introduction to web content managementIntroduction to web content management
Introduction to web content management
QUT Library
 
Introduction to blogs and blogging
Introduction to blogs and bloggingIntroduction to blogs and blogging
Introduction to blogs and blogging
Sanjana Hattotuwa
 
Introduction to Building Wireframes - Part 1
Introduction to Building Wireframes - Part 1Introduction to Building Wireframes - Part 1
Introduction to Building Wireframes - Part 1lomalogue
 
งานย่อย6
งานย่อย6งานย่อย6
งานย่อย6thelaw191
 
Feeding the homeless
Feeding the homelessFeeding the homeless
Feeding the homelessmarsupial5
 
Couple wise mont.final_final_711gk3
Couple wise mont.final_final_711gk3Couple wise mont.final_final_711gk3
Couple wise mont.final_final_711gk3
gary krane
 
Healthcare Startup Innovation Zone at Healthcare Sabha 2017
Healthcare Startup Innovation Zone at Healthcare Sabha 2017Healthcare Startup Innovation Zone at Healthcare Sabha 2017
Healthcare Startup Innovation Zone at Healthcare Sabha 2017
Rajesh Bhatkal
 

Viewers also liked (20)

Introduction To Website Development
Introduction To Website DevelopmentIntroduction To Website Development
Introduction To Website Development
 
CMS 120: Introduction to Building a Website
CMS 120: Introduction to Building a WebsiteCMS 120: Introduction to Building a Website
CMS 120: Introduction to Building a Website
 
Website introduction
Website introductionWebsite introduction
Website introduction
 
Content Marketing Strategy Guide (2013)
Content Marketing Strategy Guide (2013)Content Marketing Strategy Guide (2013)
Content Marketing Strategy Guide (2013)
 
Joomla Beginners Overview Of Day
Joomla Beginners Overview Of DayJoomla Beginners Overview Of Day
Joomla Beginners Overview Of Day
 
Limit to dvd
Limit to dvdLimit to dvd
Limit to dvd
 
Create your first WordPress website – an introduction to WordPress
Create your first WordPress website – an introduction to WordPressCreate your first WordPress website – an introduction to WordPress
Create your first WordPress website – an introduction to WordPress
 
JOOMLA
JOOMLAJOOMLA
JOOMLA
 
The very introduction to content management systems
The very introduction to content management systemsThe very introduction to content management systems
The very introduction to content management systems
 
Beyond Basic Content Management: An Introduction to Drupal Administration
Beyond Basic Content Management: An Introduction to Drupal AdministrationBeyond Basic Content Management: An Introduction to Drupal Administration
Beyond Basic Content Management: An Introduction to Drupal Administration
 
Introduction to web content management
Introduction to web content managementIntroduction to web content management
Introduction to web content management
 
Introduction to blogs and blogging
Introduction to blogs and bloggingIntroduction to blogs and blogging
Introduction to blogs and blogging
 
Introduction to Building Wireframes - Part 1
Introduction to Building Wireframes - Part 1Introduction to Building Wireframes - Part 1
Introduction to Building Wireframes - Part 1
 
Deconstructing Print Task
Deconstructing Print TaskDeconstructing Print Task
Deconstructing Print Task
 
งานย่อย6
งานย่อย6งานย่อย6
งานย่อย6
 
Feeding the homeless
Feeding the homelessFeeding the homeless
Feeding the homeless
 
Couple wise mont.final_final_711gk3
Couple wise mont.final_final_711gk3Couple wise mont.final_final_711gk3
Couple wise mont.final_final_711gk3
 
Healthcare Startup Innovation Zone at Healthcare Sabha 2017
Healthcare Startup Innovation Zone at Healthcare Sabha 2017Healthcare Startup Innovation Zone at Healthcare Sabha 2017
Healthcare Startup Innovation Zone at Healthcare Sabha 2017
 
wcnc05
wcnc05wcnc05
wcnc05
 
Louisiana purchase
Louisiana purchaseLouisiana purchase
Louisiana purchase
 

Similar to Website Introduction

Webdesign New
Webdesign NewWebdesign New
Webdesign New
lyngdoh
 
Website design
Website designWebsite design
Website design
jagan asan
 
Website design
Website designWebsite design
Website design
R.sivaji SIVA
 
#1 Website designing Company in Delhi & NCR √ Mumbai, Ghaziabad, Noida
#1 Website designing Company in Delhi & NCR √ Mumbai, Ghaziabad, Noida#1 Website designing Company in Delhi & NCR √ Mumbai, Ghaziabad, Noida
#1 Website designing Company in Delhi & NCR √ Mumbai, Ghaziabad, Noida
Css Founder
 
Web designing company in mumbai
Web designing company in mumbaiWeb designing company in mumbai
Web designing company in mumbai
Css Founder
 
Website Design.ppt
Website Design.pptWebsite Design.ppt
Website Design.ppt
ssuserb5bbd9
 
Web Designing Courses in Pune |Web designing Classes in Pune | 3DOT Technologies
Web Designing Courses in Pune |Web designing Classes in Pune | 3DOT TechnologiesWeb Designing Courses in Pune |Web designing Classes in Pune | 3DOT Technologies
Web Designing Courses in Pune |Web designing Classes in Pune | 3DOT Technologies
rashmee wairagade
 
Website design-calgary
Website design-calgaryWebsite design-calgary
Website design-calgary
Red Cherry Calgary Web Design
 
Website design
Website designWebsite design
Website design
ankur_pandey123
 
Green Hectares Rural Tech Factsheet – Website Design
Green Hectares Rural Tech Factsheet – Website DesignGreen Hectares Rural Tech Factsheet – Website Design
Green Hectares Rural Tech Factsheet – Website Design
Green Hectares
 
Website development company noida
Website development company noidaWebsite development company noida
Website development company noida
Css Founder
 
Introduction to web sites design
Introduction to  web sites designIntroduction to  web sites design
Introduction to web sites design
Marwa Abdelgawad
 
Web project – Web SiteConsistency with Web Design Site PlanYou.docx
Web project – Web SiteConsistency with Web Design Site PlanYou.docxWeb project – Web SiteConsistency with Web Design Site PlanYou.docx
Web project – Web SiteConsistency with Web Design Site PlanYou.docx
melbruce90096
 
Lesson 3 - IA for web
Lesson 3 - IA for webLesson 3 - IA for web
Lesson 3 - IA for web
Hanna-Liisa Pender
 
Css Founder.com | Cssfounder Company
Css Founder.com | Cssfounder CompanyCss Founder.com | Cssfounder Company
Css Founder.com | Cssfounder Company
Rationhome
 
Css Founder.com | Cssfounder Company
Css Founder.com | Cssfounder CompanyCss Founder.com | Cssfounder Company
Css Founder.com | Cssfounder Company
Css Founder
 
Create webpages
Create webpagesCreate webpages
Create webpages
Umamaheshwariv1
 
Responsive web design
Responsive web designResponsive web design
Responsive web designRicha Goel
 
Design for the Web
Design for the WebDesign for the Web
Design for the Web
Astek Consulting
 

Similar to Website Introduction (20)

Webdesign New
Webdesign NewWebdesign New
Webdesign New
 
Website design
Website designWebsite design
Website design
 
Website design
Website designWebsite design
Website design
 
#1 Website designing Company in Delhi & NCR √ Mumbai, Ghaziabad, Noida
#1 Website designing Company in Delhi & NCR √ Mumbai, Ghaziabad, Noida#1 Website designing Company in Delhi & NCR √ Mumbai, Ghaziabad, Noida
#1 Website designing Company in Delhi & NCR √ Mumbai, Ghaziabad, Noida
 
Web designing company in mumbai
Web designing company in mumbaiWeb designing company in mumbai
Web designing company in mumbai
 
Website Design.ppt
Website Design.pptWebsite Design.ppt
Website Design.ppt
 
Web Designing Courses in Pune |Web designing Classes in Pune | 3DOT Technologies
Web Designing Courses in Pune |Web designing Classes in Pune | 3DOT TechnologiesWeb Designing Courses in Pune |Web designing Classes in Pune | 3DOT Technologies
Web Designing Courses in Pune |Web designing Classes in Pune | 3DOT Technologies
 
Website design-calgary
Website design-calgaryWebsite design-calgary
Website design-calgary
 
Website design
Website designWebsite design
Website design
 
Green Hectares Rural Tech Factsheet – Website Design
Green Hectares Rural Tech Factsheet – Website DesignGreen Hectares Rural Tech Factsheet – Website Design
Green Hectares Rural Tech Factsheet – Website Design
 
Website development company noida
Website development company noidaWebsite development company noida
Website development company noida
 
Web Site Design
Web Site DesignWeb Site Design
Web Site Design
 
Introduction to web sites design
Introduction to  web sites designIntroduction to  web sites design
Introduction to web sites design
 
Web project – Web SiteConsistency with Web Design Site PlanYou.docx
Web project – Web SiteConsistency with Web Design Site PlanYou.docxWeb project – Web SiteConsistency with Web Design Site PlanYou.docx
Web project – Web SiteConsistency with Web Design Site PlanYou.docx
 
Lesson 3 - IA for web
Lesson 3 - IA for webLesson 3 - IA for web
Lesson 3 - IA for web
 
Css Founder.com | Cssfounder Company
Css Founder.com | Cssfounder CompanyCss Founder.com | Cssfounder Company
Css Founder.com | Cssfounder Company
 
Css Founder.com | Cssfounder Company
Css Founder.com | Cssfounder CompanyCss Founder.com | Cssfounder Company
Css Founder.com | Cssfounder Company
 
Create webpages
Create webpagesCreate webpages
Create webpages
 
Responsive web design
Responsive web designResponsive web design
Responsive web design
 
Design for the Web
Design for the WebDesign for the Web
Design for the Web
 

Recently uploaded

Welcome to TechSoup New Member Orientation and Q&A (May 2024).pdf
Welcome to TechSoup   New Member Orientation and Q&A (May 2024).pdfWelcome to TechSoup   New Member Orientation and Q&A (May 2024).pdf
Welcome to TechSoup New Member Orientation and Q&A (May 2024).pdf
TechSoup
 
Embracing GenAI - A Strategic Imperative
Embracing GenAI - A Strategic ImperativeEmbracing GenAI - A Strategic Imperative
Embracing GenAI - A Strategic Imperative
Peter Windle
 
The basics of sentences session 5pptx.pptx
The basics of sentences session 5pptx.pptxThe basics of sentences session 5pptx.pptx
The basics of sentences session 5pptx.pptx
heathfieldcps1
 
Language Across the Curriculm LAC B.Ed.
Language Across the  Curriculm LAC B.Ed.Language Across the  Curriculm LAC B.Ed.
Language Across the Curriculm LAC B.Ed.
Atul Kumar Singh
 
Operation Blue Star - Saka Neela Tara
Operation Blue Star   -  Saka Neela TaraOperation Blue Star   -  Saka Neela Tara
Operation Blue Star - Saka Neela Tara
Balvir Singh
 
Instructions for Submissions thorugh G- Classroom.pptx
Instructions for Submissions thorugh G- Classroom.pptxInstructions for Submissions thorugh G- Classroom.pptx
Instructions for Submissions thorugh G- Classroom.pptx
Jheel Barad
 
June 3, 2024 Anti-Semitism Letter Sent to MIT President Kornbluth and MIT Cor...
June 3, 2024 Anti-Semitism Letter Sent to MIT President Kornbluth and MIT Cor...June 3, 2024 Anti-Semitism Letter Sent to MIT President Kornbluth and MIT Cor...
June 3, 2024 Anti-Semitism Letter Sent to MIT President Kornbluth and MIT Cor...
Levi Shapiro
 
A Strategic Approach: GenAI in Education
A Strategic Approach: GenAI in EducationA Strategic Approach: GenAI in Education
A Strategic Approach: GenAI in Education
Peter Windle
 
Thesis Statement for students diagnonsed withADHD.ppt
Thesis Statement for students diagnonsed withADHD.pptThesis Statement for students diagnonsed withADHD.ppt
Thesis Statement for students diagnonsed withADHD.ppt
EverAndrsGuerraGuerr
 
Francesca Gottschalk - How can education support child empowerment.pptx
Francesca Gottschalk - How can education support child empowerment.pptxFrancesca Gottschalk - How can education support child empowerment.pptx
Francesca Gottschalk - How can education support child empowerment.pptx
EduSkills OECD
 
Guidance_and_Counselling.pdf B.Ed. 4th Semester
Guidance_and_Counselling.pdf B.Ed. 4th SemesterGuidance_and_Counselling.pdf B.Ed. 4th Semester
Guidance_and_Counselling.pdf B.Ed. 4th Semester
Atul Kumar Singh
 
Home assignment II on Spectroscopy 2024 Answers.pdf
Home assignment II on Spectroscopy 2024 Answers.pdfHome assignment II on Spectroscopy 2024 Answers.pdf
Home assignment II on Spectroscopy 2024 Answers.pdf
Tamralipta Mahavidyalaya
 
The French Revolution Class 9 Study Material pdf free download
The French Revolution Class 9 Study Material pdf free downloadThe French Revolution Class 9 Study Material pdf free download
The French Revolution Class 9 Study Material pdf free download
Vivekanand Anglo Vedic Academy
 
Unit 8 - Information and Communication Technology (Paper I).pdf
Unit 8 - Information and Communication Technology (Paper I).pdfUnit 8 - Information and Communication Technology (Paper I).pdf
Unit 8 - Information and Communication Technology (Paper I).pdf
Thiyagu K
 
678020731-Sumas-y-Restas-Para-Colorear.pdf
678020731-Sumas-y-Restas-Para-Colorear.pdf678020731-Sumas-y-Restas-Para-Colorear.pdf
678020731-Sumas-y-Restas-Para-Colorear.pdf
CarlosHernanMontoyab2
 
Palestine last event orientationfvgnh .pptx
Palestine last event orientationfvgnh .pptxPalestine last event orientationfvgnh .pptx
Palestine last event orientationfvgnh .pptx
RaedMohamed3
 
Phrasal Verbs.XXXXXXXXXXXXXXXXXXXXXXXXXX
Phrasal Verbs.XXXXXXXXXXXXXXXXXXXXXXXXXXPhrasal Verbs.XXXXXXXXXXXXXXXXXXXXXXXXXX
Phrasal Verbs.XXXXXXXXXXXXXXXXXXXXXXXXXX
MIRIAMSALINAS13
 
Acetabularia Information For Class 9 .docx
Acetabularia Information For Class 9  .docxAcetabularia Information For Class 9  .docx
Acetabularia Information For Class 9 .docx
vaibhavrinwa19
 
Synthetic Fiber Construction in lab .pptx
Synthetic Fiber Construction in lab .pptxSynthetic Fiber Construction in lab .pptx
Synthetic Fiber Construction in lab .pptx
Pavel ( NSTU)
 
Unit 2- Research Aptitude (UGC NET Paper I).pdf
Unit 2- Research Aptitude (UGC NET Paper I).pdfUnit 2- Research Aptitude (UGC NET Paper I).pdf
Unit 2- Research Aptitude (UGC NET Paper I).pdf
Thiyagu K
 

Recently uploaded (20)

Welcome to TechSoup New Member Orientation and Q&A (May 2024).pdf
Welcome to TechSoup   New Member Orientation and Q&A (May 2024).pdfWelcome to TechSoup   New Member Orientation and Q&A (May 2024).pdf
Welcome to TechSoup New Member Orientation and Q&A (May 2024).pdf
 
Embracing GenAI - A Strategic Imperative
Embracing GenAI - A Strategic ImperativeEmbracing GenAI - A Strategic Imperative
Embracing GenAI - A Strategic Imperative
 
The basics of sentences session 5pptx.pptx
The basics of sentences session 5pptx.pptxThe basics of sentences session 5pptx.pptx
The basics of sentences session 5pptx.pptx
 
Language Across the Curriculm LAC B.Ed.
Language Across the  Curriculm LAC B.Ed.Language Across the  Curriculm LAC B.Ed.
Language Across the Curriculm LAC B.Ed.
 
Operation Blue Star - Saka Neela Tara
Operation Blue Star   -  Saka Neela TaraOperation Blue Star   -  Saka Neela Tara
Operation Blue Star - Saka Neela Tara
 
Instructions for Submissions thorugh G- Classroom.pptx
Instructions for Submissions thorugh G- Classroom.pptxInstructions for Submissions thorugh G- Classroom.pptx
Instructions for Submissions thorugh G- Classroom.pptx
 
June 3, 2024 Anti-Semitism Letter Sent to MIT President Kornbluth and MIT Cor...
June 3, 2024 Anti-Semitism Letter Sent to MIT President Kornbluth and MIT Cor...June 3, 2024 Anti-Semitism Letter Sent to MIT President Kornbluth and MIT Cor...
June 3, 2024 Anti-Semitism Letter Sent to MIT President Kornbluth and MIT Cor...
 
A Strategic Approach: GenAI in Education
A Strategic Approach: GenAI in EducationA Strategic Approach: GenAI in Education
A Strategic Approach: GenAI in Education
 
Thesis Statement for students diagnonsed withADHD.ppt
Thesis Statement for students diagnonsed withADHD.pptThesis Statement for students diagnonsed withADHD.ppt
Thesis Statement for students diagnonsed withADHD.ppt
 
Francesca Gottschalk - How can education support child empowerment.pptx
Francesca Gottschalk - How can education support child empowerment.pptxFrancesca Gottschalk - How can education support child empowerment.pptx
Francesca Gottschalk - How can education support child empowerment.pptx
 
Guidance_and_Counselling.pdf B.Ed. 4th Semester
Guidance_and_Counselling.pdf B.Ed. 4th SemesterGuidance_and_Counselling.pdf B.Ed. 4th Semester
Guidance_and_Counselling.pdf B.Ed. 4th Semester
 
Home assignment II on Spectroscopy 2024 Answers.pdf
Home assignment II on Spectroscopy 2024 Answers.pdfHome assignment II on Spectroscopy 2024 Answers.pdf
Home assignment II on Spectroscopy 2024 Answers.pdf
 
The French Revolution Class 9 Study Material pdf free download
The French Revolution Class 9 Study Material pdf free downloadThe French Revolution Class 9 Study Material pdf free download
The French Revolution Class 9 Study Material pdf free download
 
Unit 8 - Information and Communication Technology (Paper I).pdf
Unit 8 - Information and Communication Technology (Paper I).pdfUnit 8 - Information and Communication Technology (Paper I).pdf
Unit 8 - Information and Communication Technology (Paper I).pdf
 
678020731-Sumas-y-Restas-Para-Colorear.pdf
678020731-Sumas-y-Restas-Para-Colorear.pdf678020731-Sumas-y-Restas-Para-Colorear.pdf
678020731-Sumas-y-Restas-Para-Colorear.pdf
 
Palestine last event orientationfvgnh .pptx
Palestine last event orientationfvgnh .pptxPalestine last event orientationfvgnh .pptx
Palestine last event orientationfvgnh .pptx
 
Phrasal Verbs.XXXXXXXXXXXXXXXXXXXXXXXXXX
Phrasal Verbs.XXXXXXXXXXXXXXXXXXXXXXXXXXPhrasal Verbs.XXXXXXXXXXXXXXXXXXXXXXXXXX
Phrasal Verbs.XXXXXXXXXXXXXXXXXXXXXXXXXX
 
Acetabularia Information For Class 9 .docx
Acetabularia Information For Class 9  .docxAcetabularia Information For Class 9  .docx
Acetabularia Information For Class 9 .docx
 
Synthetic Fiber Construction in lab .pptx
Synthetic Fiber Construction in lab .pptxSynthetic Fiber Construction in lab .pptx
Synthetic Fiber Construction in lab .pptx
 
Unit 2- Research Aptitude (UGC NET Paper I).pdf
Unit 2- Research Aptitude (UGC NET Paper I).pdfUnit 2- Research Aptitude (UGC NET Paper I).pdf
Unit 2- Research Aptitude (UGC NET Paper I).pdf
 

Website Introduction

  • 1. Websites!! Introduction to Websites ITGS Internal Assessment Project
  • 2. What Makes a Good Website?  Easy to Navigate  Aesthetically Pleasing  Color Scheme  Images  Background  Buttons  Rollovers  Obvious and Concise Navigation Bar  Clean Layout of Pages  Information is easy to find (logical order to things)  Consistent Theme/Style
  • 3. www.mms.com • Graphically Appealing •Clear, concise, obvious horizontal Navigation Bar •Simple and clean yet interesting •Background enhances page vs. detracting from it
  • 4. www.celhs.osceola.k12.fl.us  Clean Layout  Appealing to the eye  Easy to Navigate  Obvious vertical Navigation Bar  Visual elements add to design
  • 5. Color Scheme:  Color Scheme: Be aware  Colors should enhance, not take over  Text color vs. background color
  • 6. What NOT to do . . .
  • 7. Static Website Vs. Flash Website: Static (standard html)  Static Websites (standard html):  May contain Flash elements  No animation  Rollovers  Rollover = One image switches to a different image  Load faster  Easier to create  More Common
  • 8. Static Website Vs. Flash Website: Adobe Flash Website  Flash is:  an animation program  Popular with Website designers.  Can include animated rollovers, repetitive animation in background, and musical options.  Can be included as a small insert in a static site.
  • 9. Flash Website: http://okaydave.com/okaydave2006.html • Really Interesting FLASH site. • Great Layout and Organization. •Great Navigation-Bar Style. •Fully Flash Animated Great Resource for Amazing Flash Websites: http://www.commarts.com/
  • 10. Now that we can recognize a great website . . .  You will create your own!  Remember:  Your Audience  Your Color Scheme  SCREEN SHOTS- DO CONSTANTLY!!  Every single day you should have at least 12 Screen shots (even if you don’t use them!)
  • 11. Photoshop Layout  Your Website will be created using PHOTOSHOP (No, this is not negotiable.)  Your entire page layout, for both pages must be sketched out and APPROVED before beginning on computer.  Size:  800px X 700px (or more)  Resolution: 72 ppi  Navigation should be consistent, you will create 1 Photoshop file with different Folders (within Photoshop) for the pages.
  • 12. Example of a Sketchbook Layout for a Website:  www.unframedjourney.com (Mrs. Model’s Website)
  • 13. Sketch! Created Site!
  • 15. Website Layout Sketches- your sketches should answer these questions!  How will your site be layed out?  Where is the Navigation Bar? Is it vertical or horizontal?  What is your color scheme?  Where will your pictures be placed?  Where will the text go?  What will the background look like (you don’t have to sketch this- you can make a small note to yourself for this)  What will your top banner look like?
  • 16. You can add things in Photoshop to make your website “Pop” Images & Design Element Ideas: •“Post-It” Notes • Polaroid's • Thumbtacks • Cork Board.
  • 17. Your Websites  Draw a FULL PAGE sketch of your Home Page (This one should be the most detailed)  Put the navigation bar  The banner  What content?  Other Pages  “See Home page” for banner and nav bar  Content