Let's talk including on the design of sites on pure CSS and HTML, that is, without the use of Photoshop.
Let's start with CSS, which we normally use to create everything that opens in your browser. It is worth noting that for many Photoshop is just a tool prototyping: it's just a canvas on which you can do something. When it comes to the actual construction site, people all rely on the CSS.
By the way, here are a few examples of sites created with minimal use of Photoshop.
Let's start with CSS, which we normally use to create everything that opens in your browser. It is worth noting that for many Photoshop is just a tool prototyping: it's just a canvas on which you can do something. When it comes to the actual construction site, people all rely on the CSS.
Dissent is a plus
For many years we have been developing models of sites in programs such as Photoshop, Fireworks, Illustrator, and always carefully calibrate every detail to make it look perfect. Then share the layouts to pieces and collect them together again, like a puzzle. But if you skillfully use CSS, there is no need for it, especially with the advent of CSS3.Tak as creating a Web page is now a dynamic, consider a few guidelines that streamline the process of creating a good layout.
So, always keep in mind:
For many years we have been developing models of sites in programs such as Photoshop, Fireworks, Illustrator, and always carefully calibrate every detail to make it look perfect. Then share the layouts to pieces and collect them together again, like a puzzle. But if you skillfully use CSS, there is no need for it, especially with the advent of CSS3.Tak as creating a Web page is now a dynamic, consider a few guidelines that streamline the process of creating a good layout.
So, always keep in mind:
- Realistic fonts
- Buttons with no images
- Display Size
- Images
- What can be done with CSS?
- Is this possible?
By the way, here are a few examples of sites created with minimal use of Photoshop.
Realistic fonts
There are many different fonts that can be downloaded without a problem, and we all want to stand out with unusual and beautiful letters. But ... do not forget that above all we must be guided by the principles of clarity and accessibility of the text to the user, that is, the text must always be readable. Before you start to use the font once again think and check whether the browser to understand it.
Buttons with no images
The buttons can cause many problems. It is better to conceive of a button, you can create using CSS or JavaScript. There are many advantages to this: a living text, scalable buttons, no need to upload images, sprites do not have the buttons and background images that need to be customized in size and so on. Easy Button can save an enormous amount of time a designer, so before you create an ultra-featured buttons in Photoshop think maybe it can be done in CSS. If so - do it, and if not, consider whether it is in order.
Screen Size
Since the size of displays are a great many, from 320 × 480 to 2560 × 1440, consider how the design will look at each of them. Good design - a job that requires a thorough working head, so that before you begin, consider the following:
What the audience will have a site need to be mobile, or responsa version .
As the contents will be located: in the center or to the left?
How customizable should be this layout
Let not all sites will attract the attention of users entering the Internet with mobile devices, but this possibility should never be discounted. Always keep in mind that your website can open on displays with a resolution of 1024 × 720 all the way up to 2560 × 1440, as well as the user can hold the device horizontally and vertically, which is also important. It is important to avoid the horizontal scroll bar.
Images
Say no to cutting pictures. Any standard Web site needs only one image and a logo.You may need to add a repeating background pattern and / or embedded images. All that is required fragmentation and layout are easily created in the CSS. CSS-gradients, rounded corners, transform, and countless other options, CSS can be used to reconstruct the images.
Is it possible to do everything in CSS?
Happily creating a masterpiece in Photoshop, ask yourself, is it possible to create all the elements in CSS? CSS - a very powerful tool that allows you to copy most of the design elements created in Photoshop. Before you start to clean up images, buttons, rulers, or anything else, find out whether you can create them in the CSS. This will facilitate and accelerate the design process. Minimize the items that will not be able to recreate in the CSS.
Is this possible?
No wonder, do not place a huge background image (which may have also divided into 40 parts, so that it more or less quickly to load). Do not design a site to 1280px wide.Limited by the size of an average display images limitations, restrictions, limitations and general file network. Of course, you can make exceptions, but do not abuse it.
Network - a fairly open and flexible concept, and it can create almost anything, most importantly, remember that you need to fit into the framework. And to begin to consider their best before you start to design a website design. Proceed to action only when you are firmly convinced that your idea is not out of the realm of fantasy. Just make sure that task. I think every web designer should have HTML / CSS.
Make a mistake? Correct it!
A huge plus of web design is that errors and inaccuracies can always fix it. The site is easy to update. One has only to download updates - all in order. In order to improve the design, not necessarily messing with Photoshop.
We have complete freedom of action, which is limited to leash so that you actually want to design. So do not confuse web design with the design of printing. The best way to learn web design in perfection - is to learn HTML / CSS / Javascript. In his spare time, try to design a website, never using Photoshop, I think you'll be surprised at what can be achieved when working exclusively in your browser.
There are many different fonts that can be downloaded without a problem, and we all want to stand out with unusual and beautiful letters. But ... do not forget that above all we must be guided by the principles of clarity and accessibility of the text to the user, that is, the text must always be readable. Before you start to use the font once again think and check whether the browser to understand it.
Buttons with no images
The buttons can cause many problems. It is better to conceive of a button, you can create using CSS or JavaScript. There are many advantages to this: a living text, scalable buttons, no need to upload images, sprites do not have the buttons and background images that need to be customized in size and so on. Easy Button can save an enormous amount of time a designer, so before you create an ultra-featured buttons in Photoshop think maybe it can be done in CSS. If so - do it, and if not, consider whether it is in order.
Screen Size
Since the size of displays are a great many, from 320 × 480 to 2560 × 1440, consider how the design will look at each of them. Good design - a job that requires a thorough working head, so that before you begin, consider the following:
What the audience will have a site need to be mobile, or responsa version .
As the contents will be located: in the center or to the left?
How customizable should be this layout
Let not all sites will attract the attention of users entering the Internet with mobile devices, but this possibility should never be discounted. Always keep in mind that your website can open on displays with a resolution of 1024 × 720 all the way up to 2560 × 1440, as well as the user can hold the device horizontally and vertically, which is also important. It is important to avoid the horizontal scroll bar.
Images
Say no to cutting pictures. Any standard Web site needs only one image and a logo.You may need to add a repeating background pattern and / or embedded images. All that is required fragmentation and layout are easily created in the CSS. CSS-gradients, rounded corners, transform, and countless other options, CSS can be used to reconstruct the images.
Is it possible to do everything in CSS?
Happily creating a masterpiece in Photoshop, ask yourself, is it possible to create all the elements in CSS? CSS - a very powerful tool that allows you to copy most of the design elements created in Photoshop. Before you start to clean up images, buttons, rulers, or anything else, find out whether you can create them in the CSS. This will facilitate and accelerate the design process. Minimize the items that will not be able to recreate in the CSS.
Is this possible?
No wonder, do not place a huge background image (which may have also divided into 40 parts, so that it more or less quickly to load). Do not design a site to 1280px wide.Limited by the size of an average display images limitations, restrictions, limitations and general file network. Of course, you can make exceptions, but do not abuse it.
Network - a fairly open and flexible concept, and it can create almost anything, most importantly, remember that you need to fit into the framework. And to begin to consider their best before you start to design a website design. Proceed to action only when you are firmly convinced that your idea is not out of the realm of fantasy. Just make sure that task. I think every web designer should have HTML / CSS.
Make a mistake? Correct it!
A huge plus of web design is that errors and inaccuracies can always fix it. The site is easy to update. One has only to download updates - all in order. In order to improve the design, not necessarily messing with Photoshop.
We have complete freedom of action, which is limited to leash so that you actually want to design. So do not confuse web design with the design of printing. The best way to learn web design in perfection - is to learn HTML / CSS / Javascript. In his spare time, try to design a website, never using Photoshop, I think you'll be surprised at what can be achieved when working exclusively in your browser.
0 comments:
Post a Comment