Web Design 1 Website Construction.

Slides:



Advertisements
Similar presentations
3.02C Website Organization
Advertisements

Basic Principles of Web Page Design CSCI 150, CSCI 155, CSCI , MSTI 131 and MSTI 260 Developed by BNapoli.
Certificate in Digital Applications – Level 02 Creative Multimedia – DA202.
Certificate in Digital Applications – Level 02 Website Design and Creation.
. Website and file organization. How websites work.
INTERACTIVE BRAND COMMUNICATION Class 7 Creative Issues II: Creating Effective Online Advertising.
 Helps you create individual pages according to your thumbnail plan  Helps you organize your web pages and links according to your organizational chart.
Welcome to Our Website Comments and Suggestions Welcomed! Presented by: Vicky Green.
ISTC 301 Standards Web Design & Development. Teaching with Tech Standards “The digital-age teaching professional must demonstrate a vision of technology.
So You Want a Web Page!. What is a Web Page? According to Webopedia, a web page is: A document on the World Wide Web. A Web site is really a bunch of.
1 After completing this lesson, you will be able to: Define your goals for a Web site. Analyze your audience. Create a blueprint for your Web site. Design.
Copyright © Texas Education Agency, All rights reserved. 1 Web Technologies Website Development with Dreamweaver.
Web Design, 4 th Edition 4 Planning a Successful Web Site: Part 2.
Web Development Life Cycle from Beginning to End…and BEYOND!
Name Teacher: Group: 1 Unit 2 – Webpage Creation.
Developing A Website. Reminder 1 You want your website to be _______? 1)Artistic 2)Easy to use 3)Interactive 4)Multimedia-driven.
Web Technologies Website Development Trade & Industrial Education
Electronic Commerce BBA (Hons) ( ) (Website Designing and Publishing) By: Farhan Mir.
Creating Integrated Web-based Projects using Microsoft Word.
Websitewala.com Welcome to. The purpose of your website is to develop a valuable set of information sources that provides information and news about your.
WEB DESIGN USING DREAMWEAVER. The World Wide Web –A Web site is a group of related files organized around a common topic –A Web page is a single file.
Web Design Rules. #1 Easy to Read Includes: Includes: Navigation Navigation Color Color Text Text Graphics Graphics Backgrounds Backgrounds Borders Borders.
WEB DESIGN SOLUTIONS. 2 Presentation by JAVANET SYSTEMS 1st Floor, ROFRA House, Suite 4, Kansanga, Gaba Road P.O Box 31586, Kampala, Uganda Tel: +256(0) ,
INKMART’s Program is a Win-Win for All! You Save Money Your School Makes Money Recycling Supports Clean Environment.
Importing/Exporting between Fireworks and Dreamweaver For Buttons, Navigation Bar and Animated Banners.
Microsoft FrontPage 2003 Illustrated Complete Using a Dynamic Web Template.
Using Publisher to Create a Web Site Mr. Sandford’s U. S. History Class.
Good Web Design. The Four A’s of Good Design Accessible Accurate Appropriate Appealing.
Dreamweaver MX BTA3Open. Dreamweaver MX Application used for creating web sites Homepage must always be saved as index.htm All files names must be in.
INTERACTIVE BRAND COMMUNICATION Class 6 Creative Issues II: Creating Effective Online Advertising.
IT: Web Technologies: Web Animation 1 Copyright © Texas Education Agency, All rights reserved. 1 Web Technologies Designing Web Site Layout Using.
2015 Website Updates. Design: Overall layout of visual elements Navigation: Arrangement of menus Layout: Arrangement of content on an indvidiual page.
ISTC 301 Standards Web Design & Development. Teaching with Tech Standards “The digital-age teaching professional must demonstrate a vision of technology.
Activity 3 - introduction
Web Site Design Plan Checklist Web Design Presented by: Angelo Russo #10 11/22/2014Angelo Russo #101.
Consistency Increases usability of your Web site..
Adobe Dreamweaver CS3 Developing a Web Page. Planning the Page Layout Use White SpaceUse White Space Limit media objectsLimit media objects KISSKISS Use.
© 2005 Lawrenceville Press Slide 1 Chapter 4 Website Development Planning 1.Define the purpose and target audience. 2.Sketch the navigation structure.
Principles of Web Design Keep it simple Content is critical--Form is not. Speed is “King”. Consistent filenames are key. Design efficiently. Cite your.
Microsoft FrontPage 2003 Illustrated Complete Working on the Web Site’s Hyperlinks and Appearance.
You Must… Gather answers to the following questions: Decide what your website will be about. Identify who your audience would be for this site. Outlined.
Web Site Development - Process of planning and creating a website.
Art for New Media 1 - Sketchbook: Look through past examples of the Dreamweaver Practice Gallery on the class website. Pick one that you think.
IPDF toolkit – brought to you by PwC How to use this Interactive PDF (iPDF) template This template is part of a self-service iPDF toolkit. Use this to.
© ExplorNet’s Centers for Quality Teaching and Learning 1 Objective % Understand advanced pre-production methods for web-based digital media.
Creating Web Pages with Links, Images, and Embedded Style Sheets
introductionwhyexamples What is a Web site? A web site is: a presentation tool; a way to communicate; a learning tool; a teaching tool; a marketing important.
COMP 143 Web Development with Adobe Dreamweaver CC.
1 Web Technologies Planning and Designing Client Websites Copyright © Texas Education Agency, All rights reserved.
1. Storyboarding a Website. How to start a storyboard: Have Blank Squares!
Pre-Production Meet with the client to create a project plan:
Using Templates A template is a special type of document that you use to design a “fixed” page layout; you can then create documents based on the template.
Section 7.1 Section 7.2 Identify presentation design principles
Using Templates A template is a special type of document that you use to design a “fixed” page layout; you can then use the web page to create a template.
Web Site Design Plan Checklist
Step 1: Design for a Computer Medium
Creating & Managing for Teaching Purposes
Unit 2 – Webpage Creation
Web Development Life Cycle from Beginning to End…and BEYOND!
Objective Understand web-based digital media production methods, software, and hardware. Course Weight : 10%
Final Website Plan You are to create a final website of your CHOICE ( after Frau’s approval, of course). Here is the time to show me all that you have.
Principles of Good Web Design
In today's lesson you will…
Website Planning Process
Slides prepared by Sarah Benis Scheier-Dolberg
Dreamweaver.
Designing a Web Site.
Using Templates A template is a special type of document that you use to design a “fixed” page layout; you can then create documents based on the template.
Web Development Life Cycle from Beginning to End…and BEYOND!
Question Examples Is the interactive Google map useful?
Presentation transcript:

Web Design 1 Website Construction

Website Construction Each website created starts with the basic building blocks. Actually creating the site should be among the LAST steps of the design process. Knowing ahead of time exactly what you want in and on the site eliminates much wasted TIME and energy and helps to make sure the PURPOSE is clear and the AUDIENCE is remembered.

Website Construction STEP ONE: What is the PURPOSE of your site? Who is your target AUDIENCE? What COLOR SCHEME would you like? Where would you like the navigation bar? How many PAGES would you like the site to have?

Website Construction STEP TWO: What THEME do you want? (This determines the overall look and feel of the site and where different blocks, such as links, banner, etc. are placed.) What CONTENT do you want? (What do you want the users to read?) What functionality do you want added? (This includes portfolios, blogs, animations, contact forms, online calendars, and other interactive elements.)

Website Construction STEP THREE: Identify all files and file NAMES necessary to complete the design. (For example, know ahead of time each page’s file name as well as the file names of any media and images to be included.) Create all necessary FOLDERS including the root folder, images folder, and others. CREATE basic assets, such as background, banner, and navigation.

Website Construction STEP THREE: Build a basic TEMPLATE page, adding background, banner, and navigation, linking the navigation using the pre-determined file names. Create other pages off of the template page. (Remember to keep file names consistent with what was used when linking the navigation bar!) Continue building according to previously decided design.

Website Construction REMINDERS Remember to SAVE and TEST the site as you go And most importantly, PROOFREAD!!! Also make sure you have provided: Contact information Last updated date Consistent design and formatting Navigation to every page from every page