SlideShare une entreprise Scribd logo

Web Design

•Télécharger en tant que PPT, PDF•
•
M
Michigan State University
TechnologieDesign
1  sur  42
Visually communicate with your design Serena Carpenter http://serenacarpenter.com
 
 
 
[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Contrast
Alignment – Invisible grid
Repetition ,[object Object]
Proximity
 
 
Paging vs. Scrolling ,[object Object],[object Object]
[object Object],[object Object],[object Object],[object Object]
 
 
Monitor Resolution ,[object Object],[object Object],[object Object],[object Object],[object Object]
 
Navigation
Stick with Muted Colors And Think about Your Intended Audience ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
 
Images ,[object Object],[object Object],[object Object],[object Object],[object Object]
[object Object]
Typography is not picking a cool font. ,[object Object],[object Object],[object Object],[object Object]
White space unclutters ,[object Object],[object Object]
Stick with narrow columns ,[object Object],[object Object]
Basic Rules ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],Robert Bringhurst The Elements of Typographic Style
Font ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
[object Object],[object Object]
 
 
Font ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Font tips ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Increase Line Spacing
Links ,[object Object],[object Object],[object Object]
 
[object Object],[object Object],[object Object],[object Object]
 
Design your banner ,[object Object],[object Object]
Design your personal page ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Page-level design
Tree Diagram Site-level Design
Future Agenda ,[object Object],[object Object],[object Object],[object Object],[object Object]

Recommandé

Design Credibility: No one trusts an ugly website
Design Credibility: No one trusts an ugly websiteDesign Credibility: No one trusts an ugly website
Design Credibility: No one trusts an ugly website
nonlinear creations
 
Weblayout
WeblayoutWeblayout
Weblayout
lturner
 
Visual Composition
Visual CompositionVisual Composition
Visual Composition
Michigan State University
 
PR, Journalism, Online Jobs
PR, Journalism, Online JobsPR, Journalism, Online Jobs
PR, Journalism, Online Jobs
Michigan State University
 
online writing
online writingonline writing
online writing
Michigan State University
 
Video Trends and Visual Communication - Fall 2010
Video Trends and Visual Communication - Fall 2010Video Trends and Visual Communication - Fall 2010
Video Trends and Visual Communication - Fall 2010
Michigan State University
 
Blog (PR and Journalism)
Blog (PR and Journalism)Blog (PR and Journalism)
Blog (PR and Journalism)
Michigan State University
 
Twitter for PR and Journalism - Fall 2010
Twitter for PR and Journalism - Fall 2010Twitter for PR and Journalism - Fall 2010
Twitter for PR and Journalism - Fall 2010
Michigan State University
 

Recommandé

Design Credibility: No one trusts an ugly website
Design Credibility: No one trusts an ugly websiteDesign Credibility: No one trusts an ugly website
Design Credibility: No one trusts an ugly website
nonlinear creations
 
Weblayout
WeblayoutWeblayout
Weblayout
lturner
 
Visual Composition
Visual CompositionVisual Composition
Visual Composition
Michigan State University
 
PR, Journalism, Online Jobs
PR, Journalism, Online JobsPR, Journalism, Online Jobs
PR, Journalism, Online Jobs
Michigan State University
 
online writing
online writingonline writing
online writing
Michigan State University
 
Video Trends and Visual Communication - Fall 2010
Video Trends and Visual Communication - Fall 2010Video Trends and Visual Communication - Fall 2010
Video Trends and Visual Communication - Fall 2010
Michigan State University
 
Blog (PR and Journalism)
Blog (PR and Journalism)Blog (PR and Journalism)
Blog (PR and Journalism)
Michigan State University
 
Twitter for PR and Journalism - Fall 2010
Twitter for PR and Journalism - Fall 2010Twitter for PR and Journalism - Fall 2010
Twitter for PR and Journalism - Fall 2010
Michigan State University
 
Alternative search
Alternative searchAlternative search
Alternative search
Michigan State University
 
Job Skills
Job SkillsJob Skills
Job Skills
Michigan State University
 
Information writing seo
Information writing seoInformation writing seo
Information writing seo
Michigan State University
 
Online Information Design
Online Information DesignOnline Information Design
Online Information Design
Michigan State University
 
Information Design - BEA
Information Design - BEAInformation Design - BEA
Information Design - BEA
Michigan State University
 
Social Media & Personal Branding
Social Media & Personal BrandingSocial Media & Personal Branding
Social Media & Personal Branding
Michigan State University
 
Video Editing and Encoding
Video Editing and EncodingVideo Editing and Encoding
Video Editing and Encoding
Michigan State University
 
Theoretical Issues - Intro to Quantitative
Theoretical Issues - Intro to Quantitative Theoretical Issues - Intro to Quantitative
Theoretical Issues - Intro to Quantitative
Michigan State University
 
Online identity and social media
Online identity and social mediaOnline identity and social media
Online identity and social media
Michigan State University
 
Concept Explication - Theoretical Issues - Intro to Quantitative
Concept Explication - Theoretical Issues - Intro to Quantitative Concept Explication - Theoretical Issues - Intro to Quantitative
Concept Explication - Theoretical Issues - Intro to Quantitative
Michigan State University
 
Theorybuilding f13
Theorybuilding f13Theorybuilding f13
Theorybuilding f13
Michigan State University
 
Measurement - Intro to Quantitative
Measurement - Intro to Quantitative Measurement - Intro to Quantitative
Measurement - Intro to Quantitative
Michigan State University
 
Sampling survey - Intro to Quantitative
Sampling survey - Intro to Quantitative Sampling survey - Intro to Quantitative
Sampling survey - Intro to Quantitative
Michigan State University
 
Type
TypeType
Type
Alix Fraser
 
Presentation 1 asgardia
Presentation 1 asgardiaPresentation 1 asgardia
Presentation 1 asgardia
Alix Fraser
 
Multimedia: Making it Happen - Text
Multimedia: Making it Happen - TextMultimedia: Making it Happen - Text
Multimedia: Making it Happen - Text
joelk
 
Typography teaching presentation
Typography teaching presentationTypography teaching presentation
Typography teaching presentation
Brianna Morris
 
Neoito — Typography for the web
Neoito — Typography for the webNeoito — Typography for the web
Neoito — Typography for the web
Neoito
 
Editing, Presenting, and Anal Retenting
Editing, Presenting, and Anal RetentingEditing, Presenting, and Anal Retenting
Editing, Presenting, and Anal Retenting
caswenson
 
POW! Your Point Handout 2: Design Basics
POW! Your Point Handout 2: Design BasicsPOW! Your Point Handout 2: Design Basics
POW! Your Point Handout 2: Design Basics
MesaPublicLibrary
 
11. Typography data visualization .pdf
11. Typography data visualization .pdf11. Typography data visualization .pdf
11. Typography data visualization .pdf
ssusercc3ff71
 
multimedia (2nd)
multimedia (2nd) multimedia (2nd)
multimedia (2nd)
Rodney Peñafiel
 

Contenu connexe

En vedette

Concept Explication - Theoretical Issues - Intro to Quantitative
Concept Explication - Theoretical Issues - Intro to Quantitative Concept Explication - Theoretical Issues - Intro to Quantitative
Concept Explication - Theoretical Issues - Intro to Quantitative
Michigan State University
 

En vedette (13)

Alternative search
Alternative searchAlternative search
Alternative search
 
Job Skills
Job SkillsJob Skills
Job Skills
 
Information writing seo
Information writing seoInformation writing seo
Information writing seo
 
Online Information Design
Online Information DesignOnline Information Design
Online Information Design
 
Information Design - BEA
Information Design - BEAInformation Design - BEA
Information Design - BEA
 
Social Media & Personal Branding
Social Media & Personal BrandingSocial Media & Personal Branding
Social Media & Personal Branding
 
Video Editing and Encoding
Video Editing and EncodingVideo Editing and Encoding
Video Editing and Encoding
 
Theoretical Issues - Intro to Quantitative
Theoretical Issues - Intro to Quantitative Theoretical Issues - Intro to Quantitative
Theoretical Issues - Intro to Quantitative
 
Online identity and social media
Online identity and social mediaOnline identity and social media
Online identity and social media
 
Concept Explication - Theoretical Issues - Intro to Quantitative
Concept Explication - Theoretical Issues - Intro to Quantitative Concept Explication - Theoretical Issues - Intro to Quantitative
Concept Explication - Theoretical Issues - Intro to Quantitative
 
Theorybuilding f13
Theorybuilding f13Theorybuilding f13
Theorybuilding f13
 
Measurement - Intro to Quantitative
Measurement - Intro to Quantitative Measurement - Intro to Quantitative
Measurement - Intro to Quantitative
 
Sampling survey - Intro to Quantitative
Sampling survey - Intro to Quantitative Sampling survey - Intro to Quantitative
Sampling survey - Intro to Quantitative
 

Similaire à Web Design

Multimedia: Making it Happen - Text
Multimedia: Making it Happen - TextMultimedia: Making it Happen - Text
Multimedia: Making it Happen - Text
joelk
 
11. Typography data visualization .pdf
11. Typography data visualization .pdf11. Typography data visualization .pdf
11. Typography data visualization .pdf
ssusercc3ff71
 
Intro to Design For Devs, 360|Flex 2012
Intro to Design For Devs, 360|Flex 2012Intro to Design For Devs, 360|Flex 2012
Intro to Design For Devs, 360|Flex 2012
AntonioHolguin
 
Designing The Document
Designing The DocumentDesigning The Document
Designing The Document
Prof S
 
Introductiontowebdesign 090806135811-phpapp02
Introductiontowebdesign 090806135811-phpapp02Introductiontowebdesign 090806135811-phpapp02
Introductiontowebdesign 090806135811-phpapp02
sagaroceanic11
 

Similaire à Web Design (20)

Type
TypeType
Type
 
Presentation 1 asgardia
Presentation 1 asgardiaPresentation 1 asgardia
Presentation 1 asgardia
 
Multimedia: Making it Happen - Text
Multimedia: Making it Happen - TextMultimedia: Making it Happen - Text
Multimedia: Making it Happen - Text
 
Typography teaching presentation
Typography teaching presentationTypography teaching presentation
Typography teaching presentation
 
Neoito — Typography for the web
Neoito — Typography for the webNeoito — Typography for the web
Neoito — Typography for the web
 
Editing, Presenting, and Anal Retenting
Editing, Presenting, and Anal RetentingEditing, Presenting, and Anal Retenting
Editing, Presenting, and Anal Retenting
 
POW! Your Point Handout 2: Design Basics
POW! Your Point Handout 2: Design BasicsPOW! Your Point Handout 2: Design Basics
POW! Your Point Handout 2: Design Basics
 
11. Typography data visualization .pdf
11. Typography data visualization .pdf11. Typography data visualization .pdf
11. Typography data visualization .pdf
 
multimedia (2nd)
multimedia (2nd) multimedia (2nd)
multimedia (2nd)
 
Intro to Design For Devs, 360|Flex 2012
Intro to Design For Devs, 360|Flex 2012Intro to Design For Devs, 360|Flex 2012
Intro to Design For Devs, 360|Flex 2012
 
0135140560 pp10a
0135140560 pp10a0135140560 pp10a
0135140560 pp10a
 
Designing The Document
Designing The DocumentDesigning The Document
Designing The Document
 
Fonts!
Fonts!Fonts!
Fonts!
 
What the Font? A Quick & Helpful Guide for Professional Typography Usage
What the Font? A Quick & Helpful Guide for Professional Typography UsageWhat the Font? A Quick & Helpful Guide for Professional Typography Usage
What the Font? A Quick & Helpful Guide for Professional Typography Usage
 
Introductiontowebdesign 090806135811-phpapp02
Introductiontowebdesign 090806135811-phpapp02Introductiontowebdesign 090806135811-phpapp02
Introductiontowebdesign 090806135811-phpapp02
 
Best web design company
Best web design companyBest web design company
Best web design company
 
Designing Type for User Interface
Designing Type for User InterfaceDesigning Type for User Interface
Designing Type for User Interface
 
Web Typography
Web TypographyWeb Typography
Web Typography
 
Visual Rhetoric
Visual RhetoricVisual Rhetoric
Visual Rhetoric
 
Font-families in CSS
Font-families in CSSFont-families in CSS
Font-families in CSS
 

Plus de Michigan State University

Content Analysis - Theoretical Issues - Intro to Quantitative
Content Analysis - Theoretical Issues - Intro to Quantitative Content Analysis - Theoretical Issues - Intro to Quantitative
Content Analysis - Theoretical Issues - Intro to Quantitative
Michigan State University
 
Academic Publishing in Communication and Journalism
Academic Publishing in Communication and JournalismAcademic Publishing in Communication and Journalism
Academic Publishing in Communication and Journalism
Michigan State University
 

Plus de Michigan State University (19)

Stats - Intro to Quantitative
Stats - Intro to Quantitative Stats - Intro to Quantitative
Stats - Intro to Quantitative
 
Content Analysis - Theoretical Issues - Intro to Quantitative
Content Analysis - Theoretical Issues - Intro to Quantitative Content Analysis - Theoretical Issues - Intro to Quantitative
Content Analysis - Theoretical Issues - Intro to Quantitative
 
Social media-overview
Social media-overviewSocial media-overview
Social media-overview
 
Social media verification and credibility
Social media verification and credibilitySocial media verification and credibility
Social media verification and credibility
 
Engagement and Journalism
Engagement and JournalismEngagement and Journalism
Engagement and Journalism
 
Google search
Google search Google search
Google search
 
Teaching engagement
Teaching engagement Teaching engagement
Teaching engagement
 
Elevating a Portfolio
Elevating a PortfolioElevating a Portfolio
Elevating a Portfolio
 
Academic Publishing in Communication and Journalism
Academic Publishing in Communication and JournalismAcademic Publishing in Communication and Journalism
Academic Publishing in Communication and Journalism
 
Personal branding sp11
Personal branding sp11Personal branding sp11
Personal branding sp11
 
Online writing, design and SEO
Online writing, design and SEOOnline writing, design and SEO
Online writing, design and SEO
 
Broll or Video Shooting - Fall10
Broll or Video Shooting - Fall10Broll or Video Shooting - Fall10
Broll or Video Shooting - Fall10
 
Social Media and Online Identity
Social Media and Online IdentitySocial Media and Online Identity
Social Media and Online Identity
 
Information Design and SEO
Information Design and SEOInformation Design and SEO
Information Design and SEO
 
Blogging Fall 2010
Blogging Fall 2010Blogging Fall 2010
Blogging Fall 2010
 
Social Media in the Classroom - AEJMC
Social Media in the Classroom - AEJMCSocial Media in the Classroom - AEJMC
Social Media in the Classroom - AEJMC
 
Video Trends, Tips and Communication
Video Trends, Tips and CommunicationVideo Trends, Tips and Communication
Video Trends, Tips and Communication
 
Photo Composition and Communication
Photo Composition and CommunicationPhoto Composition and Communication
Photo Composition and Communication
 
Twitter Basics
Twitter BasicsTwitter Basics
Twitter Basics
 

Dernier

Histor y of HAM Radio presentation slide
Histor y of HAM Radio presentation slideHistor y of HAM Radio presentation slide
Histor y of HAM Radio presentation slide
vu2urc
 
Understanding Discord NSFW Servers A Guide for Responsible Users.pdf
Understanding Discord NSFW Servers A Guide for Responsible Users.pdfUnderstanding Discord NSFW Servers A Guide for Responsible Users.pdf
Understanding Discord NSFW Servers A Guide for Responsible Users.pdf
UK Journal
 
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Miguel Araújo
 
TrustArc Webinar - Stay Ahead of US State Data Privacy Law Developments
TrustArc Webinar - Stay Ahead of US State Data Privacy Law DevelopmentsTrustArc Webinar - Stay Ahead of US State Data Privacy Law Developments
TrustArc Webinar - Stay Ahead of US State Data Privacy Law Developments
TrustArc
 
Driving Behavioral Change for Information Management through Data-Driven Gree...
Driving Behavioral Change for Information Management through Data-Driven Gree...Driving Behavioral Change for Information Management through Data-Driven Gree...
Driving Behavioral Change for Information Management through Data-Driven Gree...
Enterprise Knowledge
 
Boost PC performance: How more available memory can improve productivity
Boost PC performance: How more available memory can improve productivityBoost PC performance: How more available memory can improve productivity
Boost PC performance: How more available memory can improve productivity
Principled Technologies
 
From Event to Action: Accelerate Your Decision Making with Real-Time Automation
From Event to Action: Accelerate Your Decision Making with Real-Time AutomationFrom Event to Action: Accelerate Your Decision Making with Real-Time Automation
From Event to Action: Accelerate Your Decision Making with Real-Time Automation
Safe Software
 
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
?#DUbAI#??##{{(☎️+971_581248768%)**%*]'#abortion pills for sale in dubai@
 

Dernier (20)

Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
 
Histor y of HAM Radio presentation slide
Histor y of HAM Radio presentation slideHistor y of HAM Radio presentation slide
Histor y of HAM Radio presentation slide
 
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
 
Understanding Discord NSFW Servers A Guide for Responsible Users.pdf
Understanding Discord NSFW Servers A Guide for Responsible Users.pdfUnderstanding Discord NSFW Servers A Guide for Responsible Users.pdf
Understanding Discord NSFW Servers A Guide for Responsible Users.pdf
 
The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024
 
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
 
🐬 The future of MySQL is Postgres 🐘
🐬 The future of MySQL is Postgres 🐘🐬 The future of MySQL is Postgres 🐘
🐬 The future of MySQL is Postgres 🐘
 
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
 
Advantages of Hiring UIUX Design Service Providers for Your Business
Advantages of Hiring UIUX Design Service Providers for Your BusinessAdvantages of Hiring UIUX Design Service Providers for Your Business
Advantages of Hiring UIUX Design Service Providers for Your Business
 
Partners Life - Insurer Innovation Award 2024
Partners Life - Insurer Innovation Award 2024Partners Life - Insurer Innovation Award 2024
Partners Life - Insurer Innovation Award 2024
 
Scaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organizationScaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organization
 
TrustArc Webinar - Stay Ahead of US State Data Privacy Law Developments
TrustArc Webinar - Stay Ahead of US State Data Privacy Law DevelopmentsTrustArc Webinar - Stay Ahead of US State Data Privacy Law Developments
TrustArc Webinar - Stay Ahead of US State Data Privacy Law Developments
 
Powerful Google developer tools for immediate impact! (2023-24 C)
Powerful Google developer tools for immediate impact! (2023-24 C)Powerful Google developer tools for immediate impact! (2023-24 C)
Powerful Google developer tools for immediate impact! (2023-24 C)
 
Driving Behavioral Change for Information Management through Data-Driven Gree...
Driving Behavioral Change for Information Management through Data-Driven Gree...Driving Behavioral Change for Information Management through Data-Driven Gree...
Driving Behavioral Change for Information Management through Data-Driven Gree...
 
Boost PC performance: How more available memory can improve productivity
Boost PC performance: How more available memory can improve productivityBoost PC performance: How more available memory can improve productivity
Boost PC performance: How more available memory can improve productivity
 
GenAI Risks & Security Meetup 01052024.pdf
GenAI Risks & Security Meetup 01052024.pdfGenAI Risks & Security Meetup 01052024.pdf
GenAI Risks & Security Meetup 01052024.pdf
 
Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024
 
Exploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone ProcessorsExploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone Processors
 
From Event to Action: Accelerate Your Decision Making with Real-Time Automation
From Event to Action: Accelerate Your Decision Making with Real-Time AutomationFrom Event to Action: Accelerate Your Decision Making with Real-Time Automation
From Event to Action: Accelerate Your Decision Making with Real-Time Automation
 
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
 

Web Design