Huwebes, Marso 2, 2017

Introduction to Web Design


LESSON 1 The Field of Web Design



Tools of a Web Designer:




  1. WEB BROWSERS

Please do not use Internet Explorer.
Google Chrome is a browser that combines a minimal design with sophisticated technology
to make the web faster, safer, and easier.
-Download Chrome
Mozilla Firefox is a free Web browser. Firefox is created by a global non-profit dedicated to putting individuals in control online. Get Firefox today!
-Download Mozilla Firefox


     2.  A plain Text Editor  
For MAC OSX
TextWrangler is a powerful and richly featured tool for composing, modifying, and transforming text stored in plain-text files.
-Download TextWrangler
For MICROSOFT WINDOWS
Notepad++ is a free source code editor and Notepad replacement that supports several languages. Running in the MS Windows environment, its use is governed by GPL License.
-Download Notepad + +



SHORT NOTES
  The Internet is our global network of networks.
  The World Wide Web is a model built on top of the Internet and uses HTTP (HyperText
Transfer Protocol) to transfer documents on the Web.
  HTML (HyperText Markup Language) is the language of the Web and it is used to
structure and define web pages.
  HyperText Is text that contains links to other published materials.
  Markup Language Is a computer language that uses tags to structure and define elements of a document.

ONLINE RESOURCES

W3C (World Wide Web Consortium) www.w3.org

W3C HTML & CSS Validator validator.w3.org

StackOverflow www.stackoverflow.com 


CodePen www.codepen.io 


LESSON 3 - PLANNING A WEBSITE

The Web Design Process


  1. Information Gathering-
  2. Planning     
  3. Design
  4. Development                        
  5. Testing and Delivery
  6. Maintenance








COLOUR THEORY LINKS

Adobe Color CC: Paletton:
W3C Colors: Colourco:

color.adobe.com http://paletton.com/ https://www.w3.org/TR/css3-color/ http://www.colourco.de/


WIREFRAME CREATION LINKS

https://gomockingbird.com/ https://www.gliffy.com/ https://ninjamock.com/ https://wireframe.cc/


WIREFRAME PRINTABLE GRAPH PAPER
https://drive.google.com/folderview?id=0B185Kb7b4D6XXy0yTGR1c3laQ3c&usp=sharing 








Walang komento:

Mag-post ng isang Komento