Free Web design resources for easy access

Source: Internet
Author: User
Tags css zen garden

Free Web design resources for easy access
Web Designers with a large budget can obtain all the resources they need to put their imagination into the web experience. They can hire professional photographers to Create Compelling photos; they can ask the best HTML and CSS experts to create complex la s suitable for multiple browsers; graphic artists can be guided to create gorgeous decorations based on corporate costumes; professional copywriters can be hired to draft charming prose. The biggest benefit is that they can hire a large number of test users and attention groups to ensure that the website is attractive, easy to use, and can work as expected.

However, not all web designers are so lucky! Unfortunately, some designers have to use a small amount of money to create a website, and their expectations for the Web experience are not very low. In this case, you must seek all the help you can get. In most cases, Web developers and designers are generous in sharing knowledge and achievements with colleagues. When you share, colleagues usually try to correct and enhance your work to make it more refined, with fewer bugs, and provide your own attention group and quality assurance. This means you can find a lot of free materials. If you know where to find them, you can fill in some vulnerabilities in low-budget web development and operation. In this article, I will introduce various free web resources and warn you about some seemingly free web resources.

Creative public

First, we will introduce Creative Commons (cc). It is not a source of free resources, but a source of licenses used by people who provide free resources. In their own words, CC is a non-profit organization that provides flexible Copyright licenses for creative works. You can select a CC license to allow the owner to ask you to honor the use of the work of the owner or to modify the work of the owner (the title clause); you can restrict your work to only non-profit organizations; any change to your work may be required to be shared under the same terms as the original terms (Similar to the sharing terms ). You can combine other terms. For example, a common CC license is the Attribution Share Alike license.

CC has achieved great success-the subject of the works from the CC license is huge and is expanding every day. Literature, images, music, and other works can be provided under the CC license. You can use any of these files on your website as long as the restrictions are met. To learn how to find any free product designed for the web, the first step is to learn how to search for materials provided under the CC license. You can use the CC search engine page to directly obtain the source, which allows you to use the professional search functions of the search engine (such as Google and Flickr) and free resource collection (such as flick and dmusic.

Style element

A good style sheet is the skeleton of a good website, especially a stacked style sheet (CSS ). Unfortunately, changing support in browsers means it is difficult to develop a style sheet. With free style sheets, at least free modules of style elements, you can save a lot of effort and test work. Many websites provide CSS instructions and examples, but my focus is on the websites I have found. Most of them have CSS materials that you can use to quickly assemble into your own websites. There is a site published as a journal by top web professionals: A list apart, focusing on code and design topics. CSS intensivstation templates focuses on the main layout styles used for structured sites.

The most famous CSS Exchange Place Is CSS zen garden, but you must be very careful when using this website. CSS zen garden is designed to demonstrate the powerful functions of CSS. CSS is a good way to separate content and forms. However, at first many web developers avoided CSS because they thought that they could not create the same unforgettable effect without using traditional HTML techniques (such as layout tables and hidden images. CSS zen garden proves this recognition is wrong with beautiful styles. There is a separate and shared content segment, and the Web designer creates a page to display the content in a unique way. They use clever la S, charming images and colors to create a theme, such as a sea or museum-style theme. CSS zen garden cannot be a set of templates. You can see the following in the warning displayed in most CSS contributions:

This design is not a template. You shall not copy the file without the designer's written consent. However, you can study CSS at will and use the learned technology elsewhere.

In addition, many contributors use non-free images. Site maintenance personnel request contributors to provide their CSS (see references) under the non-commercial Creative Commons license, so copying CSS is usually a safe practice, make sure that you check the beginning of the contributor CSS file.


Professional websites use various images, from photos to artist paintings to icons and symbols. Some sites provide royalty-free images. There is a project worth your attention, that is, open clip art library, which is a collection of contributed and downloadable clip art images. The range of images includes small and simple images to large and complex images. Most images are in Scalable Vector Graphics (SVG) format, which is an open and XML-based format. SVG enhances browser support, but it is not universal, so open clip art library includes the PNG version of each image. You can browse or search for images on the website, but you may only want to download a release, so you can browse images offline. The image quality is similar to the image quality you find in many clip art sets purchased in the store. When I need symbols, icons, and other resources (such as highlighted), the Open clip art library is usually browsed, but maxpower free icons is a good set of links to the free icon set. When talking about the clip art set in the store, even if you have already purchased it, there are still many restrictions. Some clip art paintings require commercial royalty. If you purchase such a collection, check the end user license agreements.

When a photo is required, I often access the CC photo library mentioned above, but I usually arrive there through yotophoto, yotophoto is a free licensed photo search aggregate from the CC variant to the public domain. One of my favorite resource sites is stock. xchng. This site contains a large number of high-quality photos and has a very useful search engine. Not all photos are royalty-free, but most of them are! You can even check whether a photo model is released. This is an important factor to consider when using a photo containing a portrait. A small-sized site that is not yet refined but still useful is open photo, which only contains CC-licensed photos. I also use morguefile, which is similar to the stock. xchng website and has similar advantages in searching and rich data. All images on the morguefile are subject to a special license (not based on CC), but are exempt from royalties from personal or commercial works. I like the answers in the morguefile FAQ about why they provide free images: This website follows the traditional World Wide Web. It is committed to advocating free views and exchanges.

Design Tools

Some web designers and companies provide online tools to help other users and improve their community image. The most commonly used color solution tool allows you to choose beautiful and pleasant colors for your site. In terms of color matching, I do not have the best eyesight in the world, so I would like to thank such websites as the color scheme generator of Another site that provides more information about how to assemble the solution is's HTML color code combination chooser.

The most popular Web browser is also the most strange browser. Over the years, web designers have had to deal with the differences between Microsoft Internet Explorer 5 and 6, including the Macintosh and Windows versions. Microsoft is developing a 7-edition browser that promises better standard compatibility with the new version, but Dean Edwards has developed a javascript solution. To reference this website:

[Dean Edwards/'] IE7 is a javascript library that makes ie behave like a standard compatible browser. It fixes many CSS problems and enables transparent PNG to work normally in ie5 and IE6.

Remember that Macintosh users are very important when designing websites. If purchasing a Mac machine for testing is not an option, thank you for Daniel vine because it has created icapture. You can specify a URL on the site and search for PNG images that look like the Safari web browser on a Mac machine. Edwards also provides iecapture, which allows you to view the Display Effect of your site in the Macintosh IE7 beta.

Complete web layout and templates

Sometimes, even with all of the above help, I still cannot Create Compelling web pages. I may want everything. Fortunately, I can find free and complete page la s on some websites, including HTML (often XHTML) templates, images, style sheets, and highlighted displays. Open Web design has nearly 2000 complete templates of various quality. The website has a rating system that sometimes leads to a designer competition to expand its collection volume. Open source web design is a website of a similar scale.


In this article, you learn a lot about resources and get free materials and tools to improve your website. Even if you have a budget to get top professional help, it will be helpful if you are familiar with the latest web design technologies. Fortunately, the latest technologies are almost never hidden or inaccessible, and they are always free of charge. If you have the opportunity, I also encourage you to share, such as contributing to the website I mentioned. After all, the wave of Web aesthetics will rise.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.