A list of recommended web sites, books, and articles that you can explore to enhance your experience in the class.
This list is frequently updated.
| RESOURCE | DESCRIPTION |
|---|---|
| Stock Photos | |
| Pixy.org | No-fuss Creative Commons downloads. Also, each image has swatches with RGB's of the main colors in the image. Beautiful and rich looking images. I do not see a way of filtering, but there is a way to browse categories. |
| Creative Commons | Creative Commons is a type of licensed attribution where authors can specify that their work can be used in a certain way. You usually do not have to request permission or payfor the images. However, keep in mind that Creative Commons works are protected by copyright law. |
| Unsplash.com | Hundreds of thousands of pictures contributed by photographers. Credit isn't required, but it would be nice if you would give some exposure to the photographers. High resolution images browsable by categories or searchable by keywords. |
| FreeImages.com | For sure, we have an embarrassment of riches with free stock photos. Here yet another one. |
| Pexels.com | Pexels provides high quality and completely free stock photos licensed under the Pexels license. All photos are nicely tagged, searchable and also easy to discover through our discover pages. |
| FreePik | Includes collage Vectors, photos & Photoshop files. Must give credit for free files. |
| Stockphotosecrets.com | This is a good source for pay. It costs $99 for 200 per year, plus 69 for additional images. If you're a professional designer, you'll find these types of quality websites worth the money. |
| Pixabay | Nearly 900,000 free high quality images. |
| Snipstock.com | PNG and Photoshop images. The small and medium sizes are free. |
| PNGImg.com | Free PNG images |
| Freepngs.com | Seems to be associated with SnipStock |
| Pngwing.com | Free PNG images |
| VectorGrove.com | |
| PngHost.com | Easy to download free images. Suggests attribution |
| Pngtree.com | Png, vector, photoshop files, and clipart. Hundreds of thousands of them. Downloadable in different sizes. |
| pxhere.com | Another creative commons site, but you have to log in to download for large pictures. However, if you want a fairly large file to be used within our webpages, simply right click and Save As. |
| publicdomainpictures.net | I learned about this one from ATC textbook. Seems great! |
| Wallpaper style backgrounds | Large images to be used on websites as well. |
| CanStock Photos | Good pricing and a variety of photos. |
| Punchstock.com | Stock photos that are good for practicing. Otherwise cost $79 each. |
| Flickr.com | If you get an account, you can "right click" to save pictures. |
| stockvault.net | Free high resolution pictures |
| Freedigitalphotos.net | Looks like only the small versions are free. |
| www.stockio.com | Thousands of free Photos, Vectors, Icons, Fonts and Videos. You can find premium pictures as well. |
| Icons | |
| FreeIcons | This is one of the best sites I've seen. Once you find your desired icons, it cleanly gives you the choices of sizes and other options |
| FlatIcon | You can filter for free icons. There are choices of sizes starting at the largest size of 512. |
| Web Design Elements | |
| Transparent Patterns | Fabulous! The patterns are semitransparent. Therefore you can change the color on the fly. |
| Subtlepatterns.com | Good place for modern seamless backgrounds, over 375 of them. Weakness is that they are not categorized, but you can search on keywords. |
| Website Bullets | A website with simple bullets fit for many occasions. They are correctly sized and not flambouyant. |
| CSS and other generators sites | |
| cssmenumaker.com | Truthfully, some of the ones listed below are from the late 90's. However, this is a newer type of menu generator that uses CSS rather than images. |
| Dabuttonfactory.com | This site quickly generates buttons in image or CSS format. |
| Flamingtext.com | This site quickly generates buttons and logos that can be customized as desired. |
| CSS3Generator | Very nice. It has about 12 different techniques, and attempts to give you a view of your choice as you type in parameters. |
| CSS3maker | It has lots of visual results. It also provides a browser compatibility chart. |
| Colorzilla.com/gradient-editor | This only does one thing - gradients. However, it provides indepth options for creating and editing gradients. |
| CSS3gen.com | This does the same techniques as the others, including animation. Admittedly, most of these techniques can be just as easily created by typing from scratch. However, for speed of generating, they may be useful. Also good for trial and error because of their WYSIWYG nature. |
| html-css-js.com | Comprehensive website including generators as well as general reference. |
| Webcode.tools | The Ultimate Web Code Generator. The CSS3 is especially useful and time-saving. |
| Older web art | These three sites are older, but you may find them useful for a quick embellished heading or design element: |
| Tutorial and reference sites | |
| HTML Elements Reference | This Mozilla site is authoritative and handy |
| Vanseodesign.com | Includes design principles topics and many others. A repository for his prolific wrting about a variety of design topics. |
| htmlprimer.com/ | Contains easy-to-read tutorials. Also contains a user forum where you can ask questions of others. |
| webdesign.about.com/cs/html | www.about.com is a very comprehensive site. It contains lots of material relating to web site development. One of its most useful areas deals with design tips and principles. |
| www.w3schools.com | At W3Schools you will find all the Web-building tutorials you need, from basic HTML to advanced coding and scripting. |
| www.htmlhelp.com | This is a solid and authoritative site that offers help on a wide range of topics. The site does not look fancy, but provides great information in a reference manner. It focuses on material that helps you to create sites that work in all browsers. |
| Special Characters listing | From an HTML reference website. Nicely organized and easy to find. |
| Special Characters from W3C | This is a nicely displayed and organized chart and comes directly from https://dev.w3.org/html5/html-author/charref |
| Special Characters (from a Univ of Texas site) | Special characters. This is just one of the many sites that provides a convenient list of special characters. Thanks to University of Texas. |
| CSS references | |
| CSS3 Generator | Automatically generates common CSS3 styles |
| Free web hosting | |
| Text Editors and HTML Editors | |
| Notepad++ | Features include opening multiple files, drag & drop, toolbars, numbering lines, etc. There are two versions--Lite and Pro. |
| Brackets.io | Free from Adobe |
| Colors (hex and RGB lists) | |
| easycalculation.com | Hexadecimal color chart |
| Color Chart - 100 plus, colors | RGB to Hexadecimal color converter |
| Another Color Chart | Wikipedia's entire color page |
| HTMLcolorcodes.com/color-names | When you're practicing HTML, and don't feel like looking up colors |
| Cookwood.com | Hexadecimal equivalents - from 0 to 255 |
| Color Schemes | |
Best for exploring existing schemes and downloading text version. Click “Explore” then “View”. Then copy the hex color. |
|
| schemecolor.com | I happened upon another site that might become my favorite. It has about a dozen colors on the top row. You click on the one that you want as a dominant color. Then it generates many palettes for you to choose from. I als like the fact that you can simply download as text and paste into your .CSS file. |
| december.com/html/spec/colorchips.html | An old site, but great for choosing monochrome scheme. Scroll down to the main color area. Reds: www.december.com/html/spec/color1.html |
| Click “Explore” to see schemes. Must copy & paste each hex color individually. |
|
|
|
| colr.org | For choosing colors based on a picture. |
| Palleton | Gain quick confidence with your choice of colors. Use this tool to generate color schemes of good-looking, well balanced and harmonic web pages. Overall, a useful and sophisticated website. Best to read the brief instructions on using it. |
| Multimedia (Audio & Video) | |
| online-convert.com | Quickly convert various types media online. No software installation needed. Free |
| Others | |
| www.lipsum.com | Generates placeholder text. Also tells the story behind "Lorem Ipsum Dolor Sit Amet" |
| www.blindtextgenerator.com | Generates placeholder text |
| www.websitehostingrating.com | This is a useful reference for web hosting. It appears to have objective ratings and is updated frequently. |