Web design must also first have a comprehensive image positioning of the website
|
⑴ Content determines form. First enrich the content, then divide it into blocks, then determine the tone, and finally deal with the details. ⑵ First the whole, then the parts, and finally return to the whole. Consider the overall situation and fill in everything that can be filled to take up space. Then set the tone and design in modules. Finally, adjust some unsatisfactory details. ⑶ Function determines the design direction. The purpose of the website determines the design ideas. Commercial ones should highlight the profit purpose; government ones should highlight the image and authoritative articles; educational ones should highlight the teachers and courses. Content and function determine the form of expression and interface design. The task you often get is a small piece of paper with two sentences on it, asking you to design a website. Some people can design a page just by looking at a piece of paper. With just two sentences, you can design a page for a client. Even with my 7 or 8 years of design experience, I don’t dare to do it. You are really my idol! When doing web design, you need to know a lot about your clients: Column planning for website building and the form and function requirements of each column. Main color, customer gender preference, contact information, old version URL, preferred URL. According to industry and customer requirements, those that need to be emphasized are whether to build in stages and consider future compatibility. Does the customer have a strong desire to build a website? Can you control the customer mentally? Do you have a good grasp of technical knowledge that you have not been exposed to? etc... When you have a clear understanding of all these contents, you will have a comprehensive and vivid positioning of this website in your mind. Now is the time to focus on interface design. ⒈ Basic concepts of web page color matching ⑴ Black and white words are the eternal theme, and no one can say it is bad. ⑵ The most commonly used popular color on web pages is blue—blue sky and white clouds, a calm and tidy color. Green - green and white, elegant and lively. Orange - lively and warm, a standard business color. Dark red - solemn, serious, noble, needs to be matched with black and gray to suppress the stimulating red. ⑶ Taboo on colors: avoid being dirty - the contrast between the background and the text content is not strong enough, and the dark background is depressing! Avoid purity - bright pure colors are too stimulating to people and lack connotation. Avoid jumping around - no matter how beautiful the color is, it cannot be out of place with the overall look. To be separated from the masses is to bring humiliation upon oneself! Avoid using flowers - there must be a main color running through the whole painting. The main color is not the color with the largest area, but the most important color that can best reveal and reflect the theme. It is like a leader who plays a decisive role even though he is in the minority. Avoid powder - light colors appear clean, but if the contrast is too weak, the whole thing will appear pale and weak, just like a hopeless sick man. Avoid pure blue, avoid yellow green, avoid bright red.⑷ Several fixed combinations of blue, white and orange - with blue as the main color. White background, blue title bar, and orange buttons or icons as embellishments. Green and White Orchid - Green is the main tone. White background, green title bar, blue or orange buttons or icons as embellishments. Orange, white and red - orange is the main tone. White background, orange title bar, dark red or orange buttons or icons as embellishments. Dark red and black - dark red as the main tone. Black or gray background, dark red title bar, and light gray background for text content. ⒉ Weakened interface A good interface design has a weakened interface. It highlights the functions and emphasizes what the website provides to users. This involves browsing order, functional division and so on. Visitors should be able to grasp the industry nature of the website within 0.5 seconds and know where to start using the website within 1 second. If they can click once, they should never click a second time. Of course, the above refers to most functional websites. For promotional and display websites, such as those with special effects or Flash websites, they may have to be a little fancy, but not too much. Websites are not cartoons. In China, where efficiency is getting higher and higher and social psychology is becoming more and more impetuous, people's patience is getting smaller and their psychological endurance is getting lower and lower. The effect can reflect the artistic conception and be just right. ⒊ Strong modularity and modifiability Modularity can not only improve reusability, but also unify the website style and reduce the intensity of program development. Here we will design some knowledge about size, modulus, tolerance, naming conventions, etc., and will not go into details. , whether it is architecture, module or picture, we must consider strong modifiability. To give a simple example, for logos, buttons, etc., many people like to make pictures, and N buttons mean N pictures. If you only make background images for 3-5 types of buttons, and then use them to type text in the web page code, then it will be easy to modify and you can just let the programmer change the text. However, the fonts displayed on the web page are jagged. Generally, there are several types of font sizes that can ensure both clarity and beauty: Songti 12px | Songti 12px Bold | Songti 14px | Songti 14px Bold | Heiti 20px | Verdana 9px | Arial Black 12px | ⒋ It is shameful to create art. Analytical ability is far more important than creativity. The design world always talks about "creativity". What I want to say is that it is shameful to use creativity and special effects to confuse customers and visitors without clarifying the purpose and meaning of content, and without perfecting the technical production. A web designer's analytical ability is far more important than creativity. ⒌ To take into account or abandon CSS, XHTML, web2.0, Ajax, etc. The storm is coming. It is certainly beneficial to learn advanced technologies, but the current low level of awareness in China determines that customer demand and prices are also quite low. Before, I mentioned that economics determines web design, so sometimes, you are not allowed to make more compromises, and abandoning and giving up are also helpless moves. |
<<: Detailed explanation of MySQL 8.0 atomic DDL syntax
>>: Detailed explanation of the problem of CSS class names
Recommend
Implementation of Docker configuration modification of Alibaba Cloud image repository
The docker repository itself is very slow, but th...
Detailed example of changing Linux account password
Change personal account password If ordinary user...
jQuery Ajax chatbot implementation case study
Chatbots can save a lot of manual work and can be...
A brief discussion on the pitfalls and solutions of the new features of MySQL 8.0 (summary)
1. Create users and authorize Creating users and ...
The presentation and opening method of hyperlink a
<br />Related articles: How to prompt and op...
Canonical enables Linux desktop apps with Flutter (recommended)
Google's goal with Flutter has always been to...
Basic operations of mysql learning notes table
Create Table create table table name create table...
How to implement Svelte's Defer Transition in Vue
I recently watched Rich Harris's <Rethinki...
Installation and configuration method of vue-route routing management
introduce Vue Router is the official routing mana...
Introduction to CSS3 color value RGBA and gradient color usage
Before CSS3, gradient images could only be used a...
Analysis of Difficulties in Hot Standby of MySQL Database
I have previously introduced to you the configura...
A brief discussion on JavaScript shallow copy and deep copy
Table of contents 1. Direct assignment 2. Shallow...
Detailed graphic tutorial on installing and uninstalling Tomcat8 on Linux
[ Linux installation of Tomcat8 ] Uninstall Tomca...
Web Design TabIndex Element
TabIndex is to press the Tab key to sequentially o...
Complete steps to build a squid proxy server in linux
Preface This article mainly introduces the releva...