SlideShare une entreprise Scribd logo
1  sur  18
Website design for the rest of us…… Debra D’Andrea School Library Media and Technology Specialist [email_address] If you want me to call you,  send an email with your number www.dandreamedia.com www.dandreamedia.wordpress.com Grant Wood
Using  iWEB  to create and publish a personal website iLife Suite Mac / Apple Only
How did we get here? Early Website Design…. Was a little scary if you weren’t a math program geek… Don’t want to learn a new language?   HTML defined http://www.tizag.com/htmlT CSS defined http://en.wikipedia.org/wiki/Cascading_Style_Sheets
Why  WYSIWYG? WYSIWYG (play / ˈ w ɪ ziw ɪɡ / wiz-ee-wig) is an acronym for What You See Is What You Get. The term is used in computing to describe a system in which content displayed during editing appears very similar to the final output,[2] which might be a printed document, web page, or slide presentation. Source: Wikipedia
Variety of Programs Available to Do the Job Common Applications You’ve Heard Of Best of the Web 2011 http://webdesign.about.com/od/windowshtmleditors/tp/windows-wysiwyg-editors.htm Adobe Dreamweaver   Industry Standard / Difficult to learn MicroSoft Front Page   No longer supported by Microsoft www.bloomfield.k12.nj.us 1. It causes massive errors on other browsers 2. It's not valid code 3. The interface is ugly 4. It's only compatible with Internet Explorer 5. Created weird errors that made problems for visitors, esp. w/o IE 6. Created errors that were not fixable by even the experts here  7. The server that you want to host the site on has to have FrontPage Extensions  enabled and updated regularly in order for FrontP ageto work properly Microsoft Expressions Examples:  http://webdesigneraid.com/15-brilliant-examples-of-websites-using-expression-engine/ Information:  http://www.brighthub.com/computing/windows-platform/articles/2949.aspx
Consumer Suggestions Coffee Cup User Friendly http://www.coffeecup.com Wordpress blog in place of a website www.wordpress.com
eBlogger/blogspot Google Sites G o o g l e
The Basic Components Before iWEB   ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
[object Object],[object Object],[object Object],[object Object],[object Object]
Onto the Program iWeb ,[object Object],[object Object]
Create New Site Choose Template Choose Page Style
Organization Adding Pages Changing Names Menu Directory
All Text, Photos and Layout Can Be Altered They appear as place holders. Photos fill the frames instantly.  Text appears at the fonts/sizes you see but this can be changed
Insert Media Button Links to: iPhoto iTunes iMovies Drag and Drop Be careful of bandwidth. Consider service contract and amount of time to load
[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Ready, set…. PUBLISH!
 
Debra D’Andrea [email_address] 973-632-4320 www.dandreamedia.wordpress.com Site Samples Photography Site www.dandreamedia.com Musician Site www.larissadandrea.com Media Center Site http://www.ehow.com/videos-on_21_design-website-using-iweb.html Video Tutorials eHOW http://www.ehow.com/videos-on_21_design-website-using-iweb.html LYNDA.Com www.lynda.com Resources Templates http://www.iwebtemplate.com/ Winning iWeb WEBSITES http://iwebusersites.com/Home.html RESOURCE PAGE

Contenu connexe

Tendances

Librarians learn web day 3
Librarians learn web day 3Librarians learn web day 3
Librarians learn web day 3
Robin Hastings
 
Introduction wordpress
Introduction wordpressIntroduction wordpress
Introduction wordpress
Hall_
 

Tendances (19)

Librarians learn web day 3
Librarians learn web day 3Librarians learn web day 3
Librarians learn web day 3
 
Introduction wordpress
Introduction wordpressIntroduction wordpress
Introduction wordpress
 
Custom Template for Joomla! 3
Custom Template for Joomla! 3Custom Template for Joomla! 3
Custom Template for Joomla! 3
 
Joomla 15 Quickstart
Joomla 15 QuickstartJoomla 15 Quickstart
Joomla 15 Quickstart
 
WordPress101 ppt
WordPress101 pptWordPress101 ppt
WordPress101 ppt
 
Social media management wordpress ppt
Social media management   wordpress pptSocial media management   wordpress ppt
Social media management wordpress ppt
 
Joomla Explained - As Easy as 1, 2, 3
Joomla Explained - As Easy as 1, 2, 3Joomla Explained - As Easy as 1, 2, 3
Joomla Explained - As Easy as 1, 2, 3
 
DigitalInsights-ECM-WordPress-Session
DigitalInsights-ECM-WordPress-SessionDigitalInsights-ECM-WordPress-Session
DigitalInsights-ECM-WordPress-Session
 
EASY AUTOPILOT 200$ A DAY METHOD
EASY AUTOPILOT 200$ A DAY METHODEASY AUTOPILOT 200$ A DAY METHOD
EASY AUTOPILOT 200$ A DAY METHOD
 
Introduction to WordPress Class 2
Introduction to WordPress Class 2Introduction to WordPress Class 2
Introduction to WordPress Class 2
 
Start a Blog: Module 6
Start a Blog: Module 6Start a Blog: Module 6
Start a Blog: Module 6
 
Website Design Dos and Don’ts for a Successful Online Presence
Website Design Dos and Don’ts  for a Successful Online PresenceWebsite Design Dos and Don’ts  for a Successful Online Presence
Website Design Dos and Don’ts for a Successful Online Presence
 
Conquering Code with hjc
Conquering Code with hjcConquering Code with hjc
Conquering Code with hjc
 
How to create your blog and personal Web site
How to create your blog and personal Web siteHow to create your blog and personal Web site
How to create your blog and personal Web site
 
Smart Browsers and HTML5 Web Apps for the Chrome Web Store
Smart Browsers and HTML5 Web Apps for the Chrome Web StoreSmart Browsers and HTML5 Web Apps for the Chrome Web Store
Smart Browsers and HTML5 Web Apps for the Chrome Web Store
 
4 steps to make a custom 404 error page
4 steps to make a custom 404 error page4 steps to make a custom 404 error page
4 steps to make a custom 404 error page
 
Introduction to WordPress Class 5
Introduction to WordPress Class 5Introduction to WordPress Class 5
Introduction to WordPress Class 5
 
JUGN-meet1
JUGN-meet1JUGN-meet1
JUGN-meet1
 
Learning Joomla! In 30 Days
Learning Joomla! In 30 DaysLearning Joomla! In 30 Days
Learning Joomla! In 30 Days
 

Similaire à iWeb NJECC June 28, 2011 DAndrea

NJECC iWEB Tutorial DAndrea
NJECC iWEB Tutorial DAndreaNJECC iWEB Tutorial DAndrea
NJECC iWEB Tutorial DAndrea
D'Andrea
 
Aucd ppt
Aucd pptAucd ppt
Aucd ppt
icidemo
 
Empowerment Technology- PowerPoint Presentation copy.pptx
Empowerment Technology- PowerPoint Presentation copy.pptxEmpowerment Technology- PowerPoint Presentation copy.pptx
Empowerment Technology- PowerPoint Presentation copy.pptx
Arcee Mondragon
 
Rutgers - FrontPage 98 (Advanced)
Rutgers - FrontPage 98 (Advanced)Rutgers - FrontPage 98 (Advanced)
Rutgers - FrontPage 98 (Advanced)
Michael Dobe, Ph.D.
 

Similaire à iWeb NJECC June 28, 2011 DAndrea (20)

NJECC iWEB Tutorial DAndrea
NJECC iWEB Tutorial DAndreaNJECC iWEB Tutorial DAndrea
NJECC iWEB Tutorial DAndrea
 
Web development
Web developmentWeb development
Web development
 
Web Development.pdf
Web Development.pdfWeb Development.pdf
Web Development.pdf
 
Web Development.pdf
Web Development.pdfWeb Development.pdf
Web Development.pdf
 
BrowserArchitecture_ClientSide.pptx
BrowserArchitecture_ClientSide.pptxBrowserArchitecture_ClientSide.pptx
BrowserArchitecture_ClientSide.pptx
 
Girl Scouts Website Designer Badge Seminar - Workbook
Girl Scouts Website Designer Badge Seminar - WorkbookGirl Scouts Website Designer Badge Seminar - Workbook
Girl Scouts Website Designer Badge Seminar - Workbook
 
Aucd ppt
Aucd pptAucd ppt
Aucd ppt
 
Web engineering lecture 5
Web engineering lecture 5Web engineering lecture 5
Web engineering lecture 5
 
Dreaweaver cs5
Dreaweaver cs5Dreaweaver cs5
Dreaweaver cs5
 
Empowerment Technology- PowerPoint Presentation copy.pptx
Empowerment Technology- PowerPoint Presentation copy.pptxEmpowerment Technology- PowerPoint Presentation copy.pptx
Empowerment Technology- PowerPoint Presentation copy.pptx
 
Empowerment Technology- PowerPoint Presentation copy.pdf
Empowerment Technology- PowerPoint Presentation copy.pdfEmpowerment Technology- PowerPoint Presentation copy.pdf
Empowerment Technology- PowerPoint Presentation copy.pdf
 
Web Basics for Business
Web Basics for BusinessWeb Basics for Business
Web Basics for Business
 
How websites and search engines work
How websites and search engines workHow websites and search engines work
How websites and search engines work
 
Rutgers - FrontPage 98 (Advanced)
Rutgers - FrontPage 98 (Advanced)Rutgers - FrontPage 98 (Advanced)
Rutgers - FrontPage 98 (Advanced)
 
Web designing and publishing computer studies theory lesson
Web designing and publishing computer studies theory lessonWeb designing and publishing computer studies theory lesson
Web designing and publishing computer studies theory lesson
 
Professional web development with libraries
Professional web development with librariesProfessional web development with libraries
Professional web development with libraries
 
How to Learn Web Designing Step by Step From Basics in 2018
How to Learn Web Designing Step by Step From Basics in 2018How to Learn Web Designing Step by Step From Basics in 2018
How to Learn Web Designing Step by Step From Basics in 2018
 
A career in web development | the user | web development essentials!
A career in web development | the user | web development essentials!A career in web development | the user | web development essentials!
A career in web development | the user | web development essentials!
 
Web development
Web developmentWeb development
Web development
 
webdevelopment-210628031421.pdf
webdevelopment-210628031421.pdfwebdevelopment-210628031421.pdf
webdevelopment-210628031421.pdf
 

Dernier

Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...
Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...
Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...
ZurliaSoop
 

Dernier (20)

Sensory_Experience_and_Emotional_Resonance_in_Gabriel_Okaras_The_Piano_and_Th...
Sensory_Experience_and_Emotional_Resonance_in_Gabriel_Okaras_The_Piano_and_Th...Sensory_Experience_and_Emotional_Resonance_in_Gabriel_Okaras_The_Piano_and_Th...
Sensory_Experience_and_Emotional_Resonance_in_Gabriel_Okaras_The_Piano_and_Th...
 
Jamworks pilot and AI at Jisc (20/03/2024)
Jamworks pilot and AI at Jisc (20/03/2024)Jamworks pilot and AI at Jisc (20/03/2024)
Jamworks pilot and AI at Jisc (20/03/2024)
 
Unit-V; Pricing (Pharma Marketing Management).pptx
Unit-V; Pricing (Pharma Marketing Management).pptxUnit-V; Pricing (Pharma Marketing Management).pptx
Unit-V; Pricing (Pharma Marketing Management).pptx
 
Interdisciplinary_Insights_Data_Collection_Methods.pptx
Interdisciplinary_Insights_Data_Collection_Methods.pptxInterdisciplinary_Insights_Data_Collection_Methods.pptx
Interdisciplinary_Insights_Data_Collection_Methods.pptx
 
Holdier Curriculum Vitae (April 2024).pdf
Holdier Curriculum Vitae (April 2024).pdfHoldier Curriculum Vitae (April 2024).pdf
Holdier Curriculum Vitae (April 2024).pdf
 
Single or Multiple melodic lines structure
Single or Multiple melodic lines structureSingle or Multiple melodic lines structure
Single or Multiple melodic lines structure
 
ICT Role in 21st Century Education & its Challenges.pptx
ICT Role in 21st Century Education & its Challenges.pptxICT Role in 21st Century Education & its Challenges.pptx
ICT Role in 21st Century Education & its Challenges.pptx
 
Unit 3 Emotional Intelligence and Spiritual Intelligence.pdf
Unit 3 Emotional Intelligence and Spiritual Intelligence.pdfUnit 3 Emotional Intelligence and Spiritual Intelligence.pdf
Unit 3 Emotional Intelligence and Spiritual Intelligence.pdf
 
Mehran University Newsletter Vol-X, Issue-I, 2024
Mehran University Newsletter Vol-X, Issue-I, 2024Mehran University Newsletter Vol-X, Issue-I, 2024
Mehran University Newsletter Vol-X, Issue-I, 2024
 
HMCS Vancouver Pre-Deployment Brief - May 2024 (Web Version).pptx
HMCS Vancouver Pre-Deployment Brief - May 2024 (Web Version).pptxHMCS Vancouver Pre-Deployment Brief - May 2024 (Web Version).pptx
HMCS Vancouver Pre-Deployment Brief - May 2024 (Web Version).pptx
 
Graduate Outcomes Presentation Slides - English
Graduate Outcomes Presentation Slides - EnglishGraduate Outcomes Presentation Slides - English
Graduate Outcomes Presentation Slides - English
 
Micro-Scholarship, What it is, How can it help me.pdf
Micro-Scholarship, What it is, How can it help me.pdfMicro-Scholarship, What it is, How can it help me.pdf
Micro-Scholarship, What it is, How can it help me.pdf
 
Google Gemini An AI Revolution in Education.pptx
Google Gemini An AI Revolution in Education.pptxGoogle Gemini An AI Revolution in Education.pptx
Google Gemini An AI Revolution in Education.pptx
 
Fostering Friendships - Enhancing Social Bonds in the Classroom
Fostering Friendships - Enhancing Social Bonds  in the ClassroomFostering Friendships - Enhancing Social Bonds  in the Classroom
Fostering Friendships - Enhancing Social Bonds in the Classroom
 
Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...
Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...
Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...
 
How to Create and Manage Wizard in Odoo 17
How to Create and Manage Wizard in Odoo 17How to Create and Manage Wizard in Odoo 17
How to Create and Manage Wizard in Odoo 17
 
How to Give a Domain for a Field in Odoo 17
How to Give a Domain for a Field in Odoo 17How to Give a Domain for a Field in Odoo 17
How to Give a Domain for a Field in Odoo 17
 
Application orientated numerical on hev.ppt
Application orientated numerical on hev.pptApplication orientated numerical on hev.ppt
Application orientated numerical on hev.ppt
 
On National Teacher Day, meet the 2024-25 Kenan Fellows
On National Teacher Day, meet the 2024-25 Kenan FellowsOn National Teacher Day, meet the 2024-25 Kenan Fellows
On National Teacher Day, meet the 2024-25 Kenan Fellows
 
2024-NATIONAL-LEARNING-CAMP-AND-OTHER.pptx
2024-NATIONAL-LEARNING-CAMP-AND-OTHER.pptx2024-NATIONAL-LEARNING-CAMP-AND-OTHER.pptx
2024-NATIONAL-LEARNING-CAMP-AND-OTHER.pptx
 

iWeb NJECC June 28, 2011 DAndrea

  • 1. Website design for the rest of us…… Debra D’Andrea School Library Media and Technology Specialist [email_address] If you want me to call you, send an email with your number www.dandreamedia.com www.dandreamedia.wordpress.com Grant Wood
  • 2. Using iWEB to create and publish a personal website iLife Suite Mac / Apple Only
  • 3. How did we get here? Early Website Design…. Was a little scary if you weren’t a math program geek… Don’t want to learn a new language? HTML defined http://www.tizag.com/htmlT CSS defined http://en.wikipedia.org/wiki/Cascading_Style_Sheets
  • 4. Why WYSIWYG? WYSIWYG (play / ˈ w ɪ ziw ɪɡ / wiz-ee-wig) is an acronym for What You See Is What You Get. The term is used in computing to describe a system in which content displayed during editing appears very similar to the final output,[2] which might be a printed document, web page, or slide presentation. Source: Wikipedia
  • 5. Variety of Programs Available to Do the Job Common Applications You’ve Heard Of Best of the Web 2011 http://webdesign.about.com/od/windowshtmleditors/tp/windows-wysiwyg-editors.htm Adobe Dreamweaver Industry Standard / Difficult to learn MicroSoft Front Page No longer supported by Microsoft www.bloomfield.k12.nj.us 1. It causes massive errors on other browsers 2. It's not valid code 3. The interface is ugly 4. It's only compatible with Internet Explorer 5. Created weird errors that made problems for visitors, esp. w/o IE 6. Created errors that were not fixable by even the experts here 7. The server that you want to host the site on has to have FrontPage Extensions enabled and updated regularly in order for FrontP ageto work properly Microsoft Expressions Examples: http://webdesigneraid.com/15-brilliant-examples-of-websites-using-expression-engine/ Information: http://www.brighthub.com/computing/windows-platform/articles/2949.aspx
  • 6. Consumer Suggestions Coffee Cup User Friendly http://www.coffeecup.com Wordpress blog in place of a website www.wordpress.com
  • 8.
  • 9.
  • 10.
  • 11. Create New Site Choose Template Choose Page Style
  • 12. Organization Adding Pages Changing Names Menu Directory
  • 13. All Text, Photos and Layout Can Be Altered They appear as place holders. Photos fill the frames instantly. Text appears at the fonts/sizes you see but this can be changed
  • 14. Insert Media Button Links to: iPhoto iTunes iMovies Drag and Drop Be careful of bandwidth. Consider service contract and amount of time to load
  • 15.
  • 17.  
  • 18. Debra D’Andrea [email_address] 973-632-4320 www.dandreamedia.wordpress.com Site Samples Photography Site www.dandreamedia.com Musician Site www.larissadandrea.com Media Center Site http://www.ehow.com/videos-on_21_design-website-using-iweb.html Video Tutorials eHOW http://www.ehow.com/videos-on_21_design-website-using-iweb.html LYNDA.Com www.lynda.com Resources Templates http://www.iwebtemplate.com/ Winning iWeb WEBSITES http://iwebusersites.com/Home.html RESOURCE PAGE