EDP 115

Web Site Design I

Tutorials / Resources

 

 

 

 

 

 
 
Web Design:
FREE Software options:
  1. FTP Client - Software to upload your files to a server.
Tutorials:

  1. W3 Schools Online Web Tutorials: w3schools.com
  2. http://www.photoshoplady.com/
  3. PSD - Photoshop Tutorials
    http://psd.tutsplus.com/

XHTML:



CSS resources:

  1. CSS Examples: http://w3schools.com/css/css_examples.asp
  2. CSS Box Model: http://w3schools.com/css/css_boxmodel.asp
  3. CSS TIPS AND TRICKS**
    http://css-tricks.com/
  4. Horizontal CSS Menus with SOURCE Download
    http://www.cssmenumaker.com/horizontal_css_menu.php
  5. Collapsible tables with DOM and CSS
  6. 53 CSS-Techniques You Couldn’t Live Without
  7. CSS Creme
    http://csscreme.com/
  8. Boxes layout:
    http://www.thenoodleincident.com/tutorials/box_lesson/boxes.html
  9. NEW dynamic basic CSS TEMPLATES:
    http://www.intensivstation.ch/en/templates/
  10. Designer Toolbox Resource website
    http://www.designerstoolbox.com/
Online Generated Images :

 

  1. Free Seamless-Pattern-Background
    http://www.patterncooler.com/index.php

  2. Background image gradient generator:
    http://tools.dynamicdrive.com/gradient/

  3. Stripe Generator 2.0 - Linear background images.
    http://www.stripegenerator.com

  4. Free High Res Grungy Paper Textures:
    http://www.bittbox.com/freebies/free-high-res-grungy-paper-textures

  5. VectorStock™ Royalty-Free Vector Only Graphics Collection
    From only $1 Download premium quality royalty-free vector illustrations,
    vector graphics & vector icons
    http://www.vectorstock.com/

  6. Free resources: SpoonGraphics, Pixelgirl Presents, Open Clip Art Library, WallpaperStock, FreePixels.com
Color:

  1. Color scheme generator:
    http://wellstyled.com/tools/colorscheme2/index-en.html

  2. **HELP SELECTING FONT FACES / FONT FAMILIES, SIZES AND COLOR:
    http://www.typetester.org/

  3. Adobe Kuler:
    http://kuler.adobe.com/
    Kuler is "all about color: color for exploration, inspiration, experimentation and sharing". As a stand-alone tool, the Flash driven, Lightroom-esque interface raises the bar a notch for this kind of on-line colour-picker. Comprehensive colour references [HSV, RGB, CMYK, LAB and HEX] makes it a useful and versatile tool for print as well as screen-based design.

  4. CSS Colors: Colors, Color Values, Color Names
Useful Tools:


  1. CSS W3C Validator: http://jigsaw.w3.org/css-validator/

  2. WEB DEVELOPER TOOL BAR FOR FIREFOX:
    https://addons.mozilla.org/firefox/60/

  3. Generates AUTO Text:
    http://lipsum.com/

  4. To measure anything on the screen:
    Mac: http://www.pascal.com/software/freeruler/
    PC: http://iconico.com/caliper/

  5. Lightbox JS v2.0 by Lokesh Dhakar
    http://www.huddletogether.com/projects/lightbox2/

  6. Videobox: Lightbox for videos
    http://videobox-lb.sourceforge.net/

  7. Show your favourite places with photos:
    http://www.panoramio.com/

Follow web design updates:

  1. The World Wide Web Consortium: http://www.w3.org/
  2. Web Design Articles: A List Apart - http://www.alistapart.com/
  3. Simple Website Design
  4. Developing With Web Standards – Recommendations and best practices
  5. XHTML Standard Specification: XHTML1.0
  6. CSS Standard Specification: CSS1, CSS2
  7. W3Schools CSS Reference: CSS2 Reference
Inpirational Designs:

  1. Web gallery and Web design trends: BestWebGallery, Web Designer Wall, Website Gallery, DesignFlavr
  2. The Beauty in CSS Design: CSS Zen Garden, CSS Vault, CSS 2.0, CSS Creme, CSS Beauty, CSS Star
Notes:

XHTML
Tip: Your pages must have a DOCTYPE declaration if you want them to validate as correct XHTML.

XML
XML is designed to describe data, and HTML is designed to display data.

root element: It encloses all the other elements and is therefore the sole parent element to all the other elements.
<parent>
<child>content</child>
<child attribute="att"/>
</parent>