Web Design related resources

CSS RESOURCES:

1. CSS TIPS AND TRICKS**
   http://css-tricks.com/
   
   
2. CSS/JQuery
   http://www.webdesignerwall.com/category/tutorials/
   
   
3. Horizontal CSS Menus with SOURCE Download
   http://www.cssmenumaker.com/horizontal_css_menu.php
   
   
4. Collapsible tables with DOM and CSS
   
   
5. 53 CSS-Techniques You Couldn’t Live Without
   
   
6. CSS Creme
   http://csscreme.com/
   
   
7. Index of Boxes and Borders:
   http://mandarindesign.com/boxes.html
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/
11. Create Custom Search Bars with Image Replacement using CSS

 

XHTML Ordered by Function
http://w3schools.com/tags/ref_byfunc.asp

 

Photoshop

1. http://www.photoshoplady.com/
   
   
2. PSD - Photoshop Tutorials
   http://psd.tutsplus.com/
   
   
   

 

Background images:

1. Large Website Backgrounds Do’s and Don’ts

 

 

 

Pick an idea:

 

1. 80 Large Backgrounds Websites*************
   http://www.webdesignerwall.com/trends/80-large-background-websites/
   
   
2. Best of CSS DESIGN 2009
   http://www.webdesignerwall.com/trends/best-of-css-design-2009/
   
   
3. 63 Impressive Website Background-Images: Trends, Resources and Tutorials
   http://www.noupe.com/design/63-impressive-website-background-images-trends-resources-and-tutorials.html
   
   
4. Designing The Holy Search Box: Examples And Best Practices
   http://www.smashingmagazine.com/2008/12/04/designing-the-holy-search-box-examples-and-best-practices/
   

 

 

10 Characteristics of Excellent Portfolio Sites

http://www.webdesignerdepot.com/2008/12/10-characteristics-of-excellent-portfolio-sites/

 

 

Generated Images

1. Stripe Generator
   http://www.stripegenerator.com/
   
   
2. Free Seamless-Pattern-Background
   http://www.patterncooler.com/index.php
   
   
3. Background image gradient generator:
   http://tools.dynamicdrive.com/gradient/
   
   
4. Stripe Generator 2.0 - Linear background images.
   http://www.stripegenerator.com
   
   
5. Free High Res Grungy Paper Textures:
   http://www.bittbox.com/freebies/free-high-res-grungy-paper-textures
   
   
6. 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/

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.

 
TOOLS:

1. WEB DEVELOPER TOOL BAR FOR FIREFOX:
   https://addons.mozilla.org/firefox/60/
   
   
2. XHTML Table Generator with CSS
   http://www.webmastercorey.com/apps/
   
   
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/
   
   
8. Here is the license you've chosen:
   http://creativecommons.org/choose/results-one?license_code=by-nd&jurisdiction=&version=3.0&lang=en

FTP Resources:

1. WINDOWS FTP CLIENTS: TUTORIALS
   http://ftphelp.secureserver.net/
   
   
2. FREE FTP APPLICATION FOR MAC:
   Cyberduck
   Probably the only FTP client you'll ever need
   
   
3. For WINDOWS / PC:
   FileZilla - The free FTP solution
   http://filezilla-project.org/

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>

Inspirational Resources:

1. Web design inspiration - http://www.webcreme.com/
   
   
2. http://cssmania.com/
   
   
3. 56 Light & Clean Website Designs Using A Minimalist Color Scheme
   
   
4. Inspirational Websites from CSS ZEN Garden:
   http://www.mezzoblue.com/zengarden/alldesigns/
   
   
5. Just Cute:
   http://www.dezinerfolio.com/2009/02/20/css-standards-best-practices
   
   
6. Enter/Search the web style that you looking for inspiration:
   http://www.scrnshots.com/
   
   
7. 30 Beautifully Textured Web Designs:
   http://sixrevisions.com/web_design/30-beautifully-textured-web-designs/
   
   
   
8. INSPIRATION BLOG and TEN TOP FREE RESOURCES:
   http://www.crestock.com/blog/inspiration/
   
   
9. http://www.dvsn.at/
   
10. http://www.cimplerd.com/
11. http://www.silaspartners.com/
12. http://www.outsidesource.com/portfolio.html
13. http://www.randybacon.com/
14. http://www.cssremix.com/
15. http://www.netdiver.net/
16. http://37signals.com/
17. http://herbiv.org/

 

Services:

1. PSD to Web page service:
   <!-- CODE IS ART --> http://w3-markup.com/
   
   
2. WEB SERVICES, WEB HOSTING, ETC...
   IXWEBHOSTING
   You Design — We XHTML / CSS
   
   
3. Web hosting: http://godaddy.com/
   
   
4. QUALITY LOGO DESIGN, LOGO TEMPLATES, 3D LOGOS AND STATIONERY
   LOGOMAID- http://www.logomaid.com/?aff=designmeltdown
   
   
5. What is Motismo? http://www.motismo.com/
   Motismo is a simple, no fluff, time tracking solution for creative professionals. It has been designed for both freelancers and small businesses to provide a bit more organization and management.
   
   
   
6. Flash components AND OTHER SERVICES
   
   
7. Make more money by selling text based ads.

 

"Free" Websites:

1. Create a free flash website with free hosting:
   http://www.wix.com/start/matrix/?utm_campaign=w3&experiment_id=ma_w500

 

INFORMATION:

Users don’t read, they scan
10 Principles Of Effective Web Design
http://www.smashingmagazine.com/2008/01/31/10-principles-of-effective-web-design/

Simple Website Design

Developing With Web Standards – Recommendations and best practices


DESIGN ELEMENTS, TRENDS & PROBLEMS IN WEB DESIGN
http://www.designmeltdown.com/chapters/OldPaper/

Info about the quirks mode:
http://www.quirksmode.org/
Rounds the corners of a box- Mozilla CSS Commands:
http://eightlines.com/neil/mozskin/csscommands.html

Stop using CSS hacks now:
http://www.456bereastreet.com/archive/200510/stop_using_css_hacks_now/
Alternative Style: Working With Alternate Style Sheets:
http://www.alistapart.com/articles/alternate/
DOM Scripting:
http://domscripting.com/book/
FLOAT to fix a float:
http://complexspiral.com/publications/containing-floats/
FIXES doubled-margin space in IE:
http://positioniseverything.net/explorer/doubled-margin.html

Definition lists: the DL, DT, and DD elements:
http://www.w3.org/TR/html4/struct/lists.html#h-10.3


How to Ruin a Web Design - The Design Curve:
http://www.seomoz.org/blogdetail.php?ID=1230

CUNY TEST:
https://cuny.cps.ca.gov/

• The Hack Sample
• The Problem with the above
• Clearing Floats
• The One True Layout
• CSS Zen Garden
• Style Sheet Switching
• Select Oracle
• Float Tutorial
• Floats and Clear
• Brainjar CSSP
• WestCiv CSS Reference
• w3shools
• Better Living Through XHTML
• W3 Validators

 
DEFINITIONS:
Breadcrumbs or breadcrumb trail is a navigation aid used in user interfaces. It gives users a way to keep track of their locations within programs or documents. The term comes from the trail of breadcrumbs left by Hansel and Gretel in the popular fairytale.
Typical breadcrumbs look like this: Home page > Section page > Subsection page

SEO = Search Engine Optimization
* = Defines a Universal selector in CSS
Georgia Font = Perfect to display elegant numbers.

https://email.secureserver.net

https://urdox1.cuny.edu/cns/cc/authoring/index.html
lnievesra#s

https://www3test.cuny.edu/cuny5/site/authoring/index.html

http://domino2.cuny.edu/
lxnbhRA

Old dox site: https://urdox1.cuny.edu/cns/index.html
New DOx site: https://www3test.cuny.edu/cuny5/index.html

New Production Server:https://urdox1.cuny.edu/cuny5/main/authoring/index.html
Independents sites