DMT612 Professional Preparation EFFECTIVE WEB DESIGN.

Slides:

Advertisements

Similar presentations

6 Developing Content and Layout Section 6.1 Generate and organize content ideas Write and organize Web text Section 6.2 Identify page dimension guidelines.

Advertisements

Scientific Communication CITS7200 Lecture 11 Designing and Writing Web Pages.

1 Today’s Goal: Web Design for Usability To become able to appreciate the role of usability in Web design To become able to identify some of the factors.

Certificate in Digital Applications – Level 02 Website Design and Creation.

Web design criteria University of Stellenbosch. What is on a web page? Navigational elements Text Graphics.

Multimedia Design Guidelines General Guidelines for Multimedia Learning Design.

Presented by Ryan Walters. The Site  The main page of the site (seen left) is the users first introduction to the whole site.  The look is clean and.

A Beginners Guide to Web Site Design. What we will cover…. Planning your site. Creating a template. Images and Fonts. Absolute vs. Relative Links.

Chapter 2 Web Site Design Principles Principles of Web Design, Third Edition.

Instructional Design Tips Janet Holland. Impression on First Entry Meaningful Images Small Loads Quickly Text Visible Text Steady.

Chapter 2 Web Site Design Principles Principles of Web Design, 4 th Edition.

Website Design BTT1OC/2OC. What is web design? O A web site is a digital page consisting of HTML (hypertext markup language) files, images, movies, sound,

Multimedia Design. Table of Content 1.Navigational structures 2.Storyboard 3.Multimedia interface components 4.Tips for interface design.

Analyzing a Webpage/site. Authority Who is the author? What are the author’s credentials? Is the webpage/site sponsored by any organization or corporate?

Chapter 15 Designing Effective Output

Web Design, 3 rd Edition 4 Planning a Successful Web Site: Part 2.

Week 2 Web Site Design Principles. 2 Design for the Computer Medium Craft the look and feel Make your design portable Design for low bandwidth Plan for.

Web Design, 4 th Edition 4 Planning a Successful Web Site: Part 2.

 What is a wireframe?  What features are important?  Which wireframe tools might you want to try?

Responsive Web design The usage and essentiality of responsive web design are increasing with the increase of mobiles devices and tablets usage Your website.

Lesson 1 Text, Graphics Links Content Navigation Video, Audio.

The Internet Writer’s Handbook 2/e Web Page Design Writing for the Web.

What is Multimedia?. Today’s objectives Define multimedia Work with XHTML Work with CSS.

1. 2 OVERVIEW First Impressions Content Purpose Design Distinction Closing.

12 Tips to Creating Effective Web Sites Don’t Make Sites that Suck!

Web Page Design. Some Terms Cascading Style Sheet, (CSS) –a style sheet language used to describe the look and formatting of a document written in html;

An Introduction To Websites With a little of help from “WebPages That Suck.

Lecture 3 Web Design What makes a "good" website? Getting started on your website. Planning the layout. Picking a theme. Effective Design Tips.

Web Page Design Principles

STEPS IN THE WEB DESIGN PROCESS A 5 minute presentation on the latest Ideas and methods.

Website Development Instructor: Brad Atkinson. Planning Save valuable time Create mock-up drawing Provide useful content.

Good Web Design. The Four A’s of Good Design Accessible Accurate Appropriate Appealing.

G053 - Lecture 07 Designing Your Web Pages Mr C Johnston ICT Teacher

Usability Testing October 17, Overview Heuristic Evaluation and Usability Testing (25 min) Client Relationships – Lisa Lowthers (30 min) Review.

Available at Presentations: Posters and Talks Vanessa Couldridge BCB 703: Scientific Methodology Please note: AUDIO required.

Chapter 2 Web Site Design Principles Principles of Web Design, Third Edition.

Unit 3, Lesson 8 Principles of Design AOIT Web Design Copyright © 2008–2013 National Academy Foundation. All rights reserved.

Building an Effective Website. Start with a plan  Have clear goal and design your entire site with those goals in mind.  Research and develop a sketch.

COM 205 Multimedia Applications St. Joseph’s College Fall 2003.

Principles of effective web design NOTES Flo Morris-Duffin.

?. When designing, you should analyze your target audience. Design you webpage around your target audience Target Audience.

Unit 8.2 / Lesson 1 / presentation1b Website Styles.

With a focus on screen design and CRAP. The Joshua Tree Epiphany.

Graphics Navigation Usability Typography Content Clarity & Consistency.

Informational Design.  Informational Design involves determining a Web page’s content  Content – text and graphics  A successful Web page uses words.

Learning Aim C.  Once the website is complete, you should test it using the test plan you created at the design stage.

BASIC WEB DESIGN 1.Keep it simple 2.Keep it clean 3. Keep it organized, easy to use, and easy to read 4. Give text enough room 5. Kern text whenever possible.

COMP 143 Web Development with Adobe Dreamweaver CC.

By: Your Name ELEMENTS OF WEB DESIGN. VISUAL APPEAL Optimization of Graphics, for people to stay on your website, your pictures have to load out as soon.

Web Design Principles. Designing a Website Choice of a site color scheme. Choice of text font and size. Placeholder text. Use of white space. Location.

What makes a Good Website?. Examples of Bad Websites For more really.

Unit 14 - Task 3 Webpage Design. Lesson: eportfolio Class: 13d Date: 21 st Jan Starter pageguide/badpgguide.html.

Understanding the principles of website development

Web Design Principles.

Elements of Design.

Elements of Design.

Web Design and Development

Layout - you need to understand that a simple navigation bar:

Objective % Explain concepts used to create websites.

Better Design Understand how to incorporate key design concepts to the entire site Guidelines for site design Use color, balance, alignment, and other.

Applications Software

Instructional Design Tips

Instructional Design Tips

Website Planning EIT, Author Gay Robertson, 2018.

For use on your feedback page

Web Design Principles.

DELIGHT WITH UX DESIGN RACHEL KORPELLA

Elements of Effective Web Design

Web Design Principles.

Product Design: Graphical Design 2.

Presentation transcript:

DMT612 Professional Preparation EFFECTIVE WEB DESIGN

Effective web design… …is the result of careful thought and planning

Effective web design… 1.Planning 2.What do you want your website to do for you? 3.Colour 4.Typography 5.Layout 6.Best Practice 7.Coding 8.Tools 9.Assets

Planning Thoroughly plan your website before you start building it. Make your website load with lightning speed. Make site navigation clear and simple. Focus on solving visitors' problems.

What are you trying to achieve? Decide what you are trying to say and to whom. Figure out how to deliver the solution quickly. Map out your website on paper before you start building it. Continue to fine-tune your website after it is created.

Colour Colour can create an emotional response in people. Monochromatic colour schemes are soothing and work with neutral colours. Analogous colour schemes are vibrant but can be tricky to balance. Complementary colour schemes are high-contrast and allow you to draw attention to important information.

Typography Design so that your web site will be legible with many different browser settings. Pick a font that is appropriate for your content. Keep enough contrast between the text and the background. Keep line-length short enough to enable easy reading.

Layout Put your best content at the top of the page. Keep images and graphics small so your page will load quickly. Keep items like navigation menus in the same place from page to page. Break up your text into logical blocks.

Best practice Thoroughly plan your website around serving the user. Design webpages that load quickly. Simplify navigation. Be consistent with fonts, colours and menu locations. Use plenty of 'white space'. Preview your website on as many different platforms as possible to eliminate bugs. Don't make pages too long - users don't like to scroll down too far. Keep graphics to a minimum to reduce load times. Carefully select colour. Keep sufficient contrast between the text and background. Use fonts that are appropriate to your content. Keep line-length at a comfortable size. Don't overuse flashing/animated graphics. Write as shortly and clearly as possible. Put your best content at the top of the page. Break text into logical blocks. Provide users with a way to contact you.

Session Links

Close To finish, here are my top tips: 1.For audio or video, use a small number of short clips, highlights; no one wants to see your life’s work at this stage! 2.Use quotes about your work that you couldn't use on your CV 3.Optimise your assets for the web, you need your pages to load quickly 4.A web page is essentially visual, so consider how visually appealing yours are Time for you to go and play!