Y8 Web Design Introduction
Download as PPT, PDF3 likes1,173 views
The document discusses important considerations for designing an effective website, including: 1) Understanding the purpose and intended audience of the site before beginning design. 2) Collecting all necessary content such as facts, opinions, images before layout. 3) Using a clear design layout to organize content into sections like header, navigation bar, body text, and footer. 4) Keeping the design simple and easy to understand.
Y8 Web Design Introduction
- 1. What is good web design? Year 8: Website Design Project
- 2. In pairs, discuss what you think is important when designing a website. 4 minutes - click here for timer
- 3. Planning Before you do the fun part i.e. design and layout, you need to make sure you understanding the purpose of your web site.
- 4. Audience Who are you making the site for? Think about your audience: are they young people, shoppers, teachers, etc..? What would they want. Ask them.
- 5. Information What information do you need? Facts? Opinions? Quotes? Images? Start collecting them before designing. Label them and keep them in a folder.
- 6. Design & Layout Once you have all the content (i.e. words and images) for your website, you can put them together using a design layout.
- 7. Make it Live In order to allow others to see your website, you need a host company to make your website live I.e. put it on the internet. At the moment, it can only be seen by you on your computer. Hosting can be cheap, around £10 a year, but you will need to do your research.
- 8. Publicity You’ve completed your amazing website, but who knows about it. Now is the time to start publicising your website. Put up links on your myspace/bebo, copy the web address (URL) and put on your VLE profile. Tell friends and get feedback!
- 9. In general, websites are split up into four sections: • Header • Navigation Bar • Body Text • Footer
- 10. Design Tips
- 11. Clear Bold Headings Simple main text font
- 12. Scale Consider scale between words
- 13. Colour combinations Colour combinations Colour combinations Complimentary colours create high contrast
- 14. Colour combinations Colour combinations Colour combinations Similar background colours create soothing contrast
- 15. Adding images and illustrations to replace words
- 16. Simple Alignment Simple alignment helps to direct the eye towards one area and avoids distractions. In this case, all the text and image objects have been aligned to the left hand side . Simple Alignment Simple alignment helps to direct the eye towards one area and avoids distractions. In this case, all the text and image objects have been aligned to the right hand side .
- 17. If in doubt: KISS
- 18. K eep I t S imple S tupid
- 19. Look at the following website design and see if you can identify why it is poor design and how it could be improved?
- 20. Biography page Simple alignment helps to direct the eye towards one area and avoids distractions. In this case, all the text and image objects have been aligned to the left hand side . Simple alignment helps to direct the eye towards one area and avoids distractions. In this case, all the text and image objects have been aligned to the left hand side . Simple alignment helps to direct the eye towards one area and avoids distractions. In this case, all the text and image objects have been aligned to the left hand side . POOR DESIGN AND LAYOUT EXAMPLE Navigation Bar 1. Homepage 2. Gallery page 3 . Links page 4. Biography page 5. Analysis page 6. "My work" page
- 21. Look at the following website design and see if you can identify why it is a good design?
- 22. Biography Page Bob Ross in Action Remember him? Grand Flash Master of the Art world Bob Ross, was a TV presenter who taught the nation how to paint. He refined many painting techniques in order to paint traditional rural landscapes. For many, he was an icon of the 70s, but some argue that it was “art-in-a-can”, devoid of individuality and lacking in soul. Should all art be distinct and avoid mass-production? GOOD SIMPLE DESIGN & LAYOUT Navigation Bar 1. Homepage 2. Gallery page 3. Links page 4. Biography page 5. Analysis page 6. "My work" page Above : Bob Ross, 1974 Above : Mona Lisa by Leonardo Da Vinci, 1503-6
- 23. Task: In pairs and using PowerPoint, make 2 slides about an artist of your choice. Each slide must include: • Header • Navigation Bar • 2 images • Body Text The first slide must have good design and the other slide poor design… Use the design tips and have fun!