M2 – Explain the tools and techniques used in the creation of an interactive website. By Arturas Vitkovskij.

Slides:



Advertisements
Similar presentations
By Pamela McMahon. Find space on the internet In order to build a website, you must have somewhere to build it. You can buy space and customize it anyway.
Advertisements

HTML Basics Customizing your site using the basics of HTML.
WEB DESIGN TABLES, PAGE LAYOUT AND FORMS. Page Layout Page Layout is an important part of web design Why do you think your page layout is important?
1 Web Site Design Overview of the Internet Cookie Setton.
Designing Websites Using HTML and FrontPage A Typical Webpage View Source A webpage is a text file containing instructions to tell a computer how the.
Cascading Style Sheets
Designing Websites Using HTML and FrontPage A Typical Webpage View Source A webpage is a text file containing instructions to tell a computer how the.
Chapter 1 Getting Started With Dreamweaver. Explore the Dreamweaver Workspace The Dreamweaver workspace is where you can find all the tools to create.
1 of 5 This document is for informational purposes only. MICROSOFT MAKES NO WARRANTIES, EXPRESS OR IMPLIED, IN THIS DOCUMENT. © 2006 Microsoft Corporation.
Dreamweaver 8 Concepts and Techniques Introduction Web Site Development and Macromedia Dreamweaver 8.
Tutorial 3: Adding and Formatting Text. 2 Objectives Session 3.1 Type text into a page Copy text from a document and paste it into a page Check for spelling.
S ELECTION OF WEB HOST AND WEB PAGE SYSTEM. W EB HOST stores all the pages of your website and makes them available to computers connected to the Internet.
LEARN THE QUICK AND EASY WAY! VISUAL QUICKSTART GUIDE HTML and CSS 8th Edition Chapter 21: Publishing Your Pages on the Web.
Web Design Basic Concepts.
Wordpress SEO. Your Own Website If you want your own website, we have designed Wordpress website templates that you can purchase that have pretty much.
Build Your Own Website Introduction Introduction Phil Stone Phil Stone ICT tutor for Dudley Adult Community Learning ICT tutor for Dudley Adult Community.
Review of last Session Adding custom html Adding custom html HTML is the language that web servers understand, all web pages are created using HTML. HTML.
Review of Last Session Search Engine Optimisation (SEO) Search Engine Optimisation (SEO) You can fine-tune your site so that the search engines notice.
Create a Website Session I Key Components Hands-on HTML.
Web Sites for amateur radio. So You want to make a Web Site? There are several things you need to know about web sites before you start to think about.
Web Design Dreamweaver Semester 2 ATBs. ATB #1 What is a web site?
 ult.htm ult.htm  This website illustrates the use of CCS (style sheets)
DIY Web Development Hand Code Your Own Page (For Free!) by Bryan Brown, Indiana University Bloomington SLIS.
HTML 101 MPM What is a website? A website is basically a collection of web pages stored on a particular computer (called a web server) and accessed.
Build a Free Website1 Build A Website For Free 2 ND Edition By Mark Bell.
Creating Web Pages Overview. Design – Start with a Purpose Before you start any web page, you need to design the website. The first question that should.
Building a site on the World Wide Web requires more than simply learning the HTML language and starting out. You need to get a place to put your Web pages,
.  Entertain  Inform  Educate  Blogs  Sell  Date  Gamble  Religion.
10 Adding Interactivity to a Web Site Section 10.1 Define scripting Summarize interactivity design guidelines Identify scripting languages Compare common.
Copyright © 2008 Pearson Prentice Hall. All rights reserved. 1 Exploring Microsoft Office Word 2007 Chapter 8 Word and the Internet Robert Grauer, Keith.
Google Adsense Tips and Tricks.... Every single website and its owner have the opportunity to make some great money by displaying Google Adsense ads on.
Unit 1 – Improving Productivity Instructions ~ 100 words per box.
Objective To create a professional, affordable, and easy to use website Create a user friendly interface with accessibility and effortless navigation.
XP Dreamweaver 8.0 Tutorial 3 1 Adding Text and Formatting Text with CSS Styles.
Introduction to web development and HTML MGMT 230 LAB.
 HTML is hypertext markup language. It is a way for people to display their information with more complex pictures and text displays. Before HTML, messages.
Level 2 IT Users Qualification – Unit 1 Improving Productivity JACK GOODING.
Louisa Lambregts, Louisa Lambregts
CHAPTER 5 Working with Data Tables and Inline Frames.
INTRODUCTION TO CSS. TOPICS TO BE DISCUSSED……….  Introduction Introduction  Features of CSS Features of CSS  Creating Style Sheet Creating Style Sheet.
How the Web Works Building a Website – Lesson 1. How People Access the Web Browsers People access websites using software called a web browser. To view.
 Computer use language to communicate  A web browser will read these tags and translate it into what you actually see  Viewing Code of ESPN WebsiteESPN.
Quick Questions 1. What does HTML stand for? 2. What are the three main languages of the Web? 3. What is the purpose of the tags? 4. Why do we indent different.
Tutorial 3 Adding and Formatting Text with CSS Styles.
Cascading Style Sheets CSS. Source W3Schools
HTML & CSS BasicsHTMLCSSQuizAnswers  The logo In this website(made of html and css Codes), you will learn some basics of How to use HTML and CSS codes.
Build Your Own Website Review of week 6 You should now have your website pretty complete You should now have your website pretty complete Are there any.
Miguel Lara, PhD. 1:10 – 1:15 Pre-test 1:15 – 1:30 Course overview 1:30 – 2:00 Setting up DW Site 2:00 – 2:05 > 2:05 – 2:55 Hands-on Lecture 2:55 – 3:00.
Spiderman ©Marvel Comics Creating Web Pages (part 1)
Presented by the Monroe County Public Library. Me: Austin Stroud, Instructional Designer at the Monroe County Public Library Adjunct Faculty, Ivy Tech.
Chapter 8 HTML Editors. Copyright © 2006 Pearson Addison-Wesley. All rights reserved. 8-2 Text Editors Text editors don't have word processing features.
+ Publishing Your First Post USING WORDPRESS. + A CMS (content management system) is an application that allows you to publish, edit, modify, organize,
ADVANCED COMPUTERS S.Y.B.M.M. LECTURE SERIES - PART 1 - KANISHKA KHATRI m.
Learning Aim B.  It is a good idea to think carefully about the design of a website before you try to implement it.
Overview In this tutorial you will: learn what an e-portfolio is learn about the different things e-portfolios may be used for identify some options for.
Tutorial #1 Using HTML to Create Web Pages. HTML, XHTML, and CSS HTML – HyperText Markup Language The tags the browser uses to define the content of the.
WEB DESIGN CONCEPTS Brayden Burr. UNDERSTANDING THE CONTENT.
Web Programming Java Script-Introduction. What is Javascript? JavaScript is a scripting language using for the Web. JavaScript is a programming language.
How to create a website from scratch.  You should have an internet access.  Visit  You need to create a new account OR.
Setting up a website for free
Objective % Select and utilize tools to design and develop websites.
Web Site Development and Macromedia Dreamweaver 8
Lecture 4 Web Design. Part 1.
Where to Start When Re-Designing a Webpage
Objective % Select and utilize tools to design and develop websites.
Web Page Design ICT Ms. McGrew.
Digital Design – Copyright Law
Objective Understand web-based digital media production methods, software, and hardware. Course Weight : 10%
Training & Development
5.00 Apply procedures to organize content by using Dreamweaver. (22%)
Presentation transcript:

M2 – Explain the tools and techniques used in the creation of an interactive website. By Arturas Vitkovskij.

Web hosting. Before you actually start on designing the web site you have to get some web hosting space which can be done through one of two ways; one you get it yourself or two, you go and buy some from a website, which I advice because it’s much easier and less time consuming and this would get you one step closer to letting the world see your website. Also just to let you know your website originally comes with a free domain name such as http://48.websiteplan.cheese.com, which as you can see isn’t a very good one and wouldn't attract many customers. After you finished with finding a suitable web hosting spot for you, it would be then be uploaded to a secure server where you could access it through the internet.

Domain names. A “domain” in this instants is a website which is controlled by yourself or under the control of a particular organization or individual. A domain “name” is a part of a network address which identifies it’s belonging to a particular domain, which in your case is a website. So over all that’s what a (domain name) is. So for you to receive a lot of visitors and to get noticed on the internet, you would have to get a “custom” domain name because the original one you receive is almost like it’s designed to make sure you don’t get notices on the internet. Getting a custom domain name is extremely cheap. You can have your own domain name for as low as £1.29p. Also most web hosting service providers sell custom domain names directly on their websites, meaning your more then likely to be able to buy a custom domain name from your web hosting service provider.

Getting started on your website. Once you have taken care of your web hosting provider and your hopefully a custom domain name you are able to proceed to getting started on creating your website. So this will be done through various methods and it all depends on which web hosting provider you have chosen. For example you could have been provided with Dreamweaver Sc6 which is done on the internet, in which you would have to do most of the work but it would have explained to create a website to you clearly or you could have been provided with tools which do all the hard work for you such as www.weebly.com and all you would have to do is, pick a design, check the layout and add the content. Also over all you would be able to create a website you desire with most web hosting services you hired. Meaning your able to create a really cool website with zero any prier knowledge about programming languages such as HTML or PHP.

Style sheet for web development using CSS. A style sheet for web development is a form separating presentation and content from your website but what is CSS, it stands for Cascading Style Sheets and is the things which separates presentation for content. Why would you do that? Well because it allows separation which can improve content access, provide more flexibility and control in the section where you would present your content. Also enable multiple pages to share data and just overall reduce the complexity of doing it any other.

Using Meta tags. A Meta tag is a HTML tag which provides a selection of information about your website, which is displayed on search engines whenever someone searches for something that you may have on your website specifically or similar. Also writing meta tags which have a good description of your website for example 3 to4 sentences improve the chances of your website scoring high on the search engine results, which could result in you receiving more unique visitors and becoming more popular.

Web design languages. On the Internet there loads of languages, all of whom are used for different purposes and different reasons. The majority of languages are specially designed for their purpose for example CSS is a language who's main purpose is to design the style for a website, where as JavaScript is mainly designed to create the interactivity on a website. So what I am trying to say is you can get the exact website you want, it is crucial to get the right languages together.

www.weebly.com I designed my website using the easy option, which was “weebly” an American base web hosting service provider who specialize in “drag-and-drop” website building, which basically means instead of you writing the coding for the website and creating the design and the template. It’s already done but as a demonstration of what your own website may look like if you put in the effort . Resulting in you getting new ideas of how your website may look like, which you may have not considered before. Also “Weebly’s” tools for the website creator are powerful and free to use which saves you around £230 compared to Dreamweaver Sc6. Which include adding maps, gallery's, surveys etc.

Weeblys tools and features. As you can see Weeblys tools and features from the right. It is extremely easy to use, all you have to do is click on any of the 5 features above the word “BASIC” and then click and drag the tool you require on to the website designer.

Managing Weebly. As you can see from the picture below, Weebly allows you to modify your text color, boldness, size, hyperlink, alignment etc. Which are vital tools for creating an ideal website because without them everything would be the same color, size, boldness etc. Which over all wouldn't make it very interactive for the visitors.