CSS is an amazing technology. When I used it for the first time, I thought it was something I could not dream of. With the introduction of css3, rounded corners and shadows, rotation and other technologies bring CSS to an unprecedented height. However, we have gone too far with regard to CSS. In this article, we have considered some experimental applications of CSS from the perspective of a web designer.
Avant-garde experiments on CSS
A few months ago, the author was in six revisions
I published an article about five interesting CSS experiments:
- Css3 transforms & @ font-face Experiment
- CSS posters
- Pure CSS Line Graph
- Css3 leopard-style stacks
- Pure CSS Twitter fail whale
Different methods are used in each experiment. Some of them, such as CSS line charts, can be used to find practical applications in reality. Others, such as the Twitter fail whale image implemented by CSS.
Is purely an experiment. The purpose of these experiments is only to demonstrate the effect that CSS can achieve, and does not mean that we should do this.
Let us be more practical
It is a social media network sign implemented with pure CSS, which is amazing, isn't it?
I recently read Faruk ate movie, pure CSS icons: Make the madness stop
In this article, I raised a question about this practice. The author said that some people began to try to use CSS as a design tool and quickly caused a lot of follow-up. However, how easy is this practice to use? It is not easy to integrate into your design and development, and it is not easy to adjust.
Just like the above CSS-based social network logo, it is nothing more than a bunch of combinations of various lines. It is impressive and creative, but not practical, it may take a few hours to create such a logo. It takes no effort to draw the same image in Photoshop, and the effect is better (more delicate ).
The maintainability of the icons generated in this way is also very problematic. To adjust an icon, you only need to adjust the pixels, But now you need to modify the CSS definition. At the same time, nicolas Gallagher, the designer of the above CSS flag, also said that CSS is not the most suitable for such operations.
Reduce HTTP requests?
The icons in the figure above are all generated using CSS, and the author sells them out, and 40 icons sell for $25. I have to admit that these icons are very well designed. The author designed these CSS to reduce the number of HTTP requests for those websites, because they do not require additional image file requests. However, is the HTTP request from a small icon file really worth mentioning? Besides, with CSS sprite technology, these icons can be placed in the same image and displayed by CSS positioning, only one HTTP request is required. Moreover, I doubt how much bandwidth these CSS Icons can actually reduce.
In the spirit of Semantics
It must be admitted that I sometimes use tags such as Div or span to implement some visual needs, which is not semantic. However, CSS plotting is not semantic. The true mission of CSS is to modify the content on the webpage, rather than creating the content itself. The images on the Web page belong to the content category and should not be created by CSS.
Source: blog.echoenduring.com
Are we taking CSS too far?
(Author: Matt Ward
)
Chinese translation Source:Ruishang enterprise CMS
Website content management system
Official Website