The most common waste in the redesign of a company's official website is not that the design is not beautiful enough, but that the order is reversed: first choose the visual style that you like in the middle version, and then when you fill in the content on the page, you realize that the product line cannot fit in the column, and customers cannot find the inquiry entrance.
This article is written for market leaders who are preparing for the official website or revision: break down the website design plan into deliverable and reviewable documents, clarify the sequence of structure, columns, and visual design, and provide a set of review methods to avoid repeated revisions.
One sentence answer:An executable website design plan should include at least six parts - site goals and customer decision paths, column structure, page lists and wireframes, content framework, visual specifications, technology, and delivery constraints.Only when all six are together can there be a basis for development and content.
A 'solution' that only provides a homepage rendering without column trees or content frameworks is essentially a rendering. Any unclear areas in the plan will become temporary decisions during the development phase.
One sentence answer:First determine the structure, then determine the visual.The structural answer is' What do customers see first when they come in, and how many steps can lead to an inquiry? 'Visual responsibility is to make this information look credible; The order is reversed, and each subsequent step is more expensive.
There is a low-cost testing method: before drawing the rendering, use pure text to list the order of the homepage sections, and ask the sales colleague to point out "which paragraph the customer asks the most frequently". Being able to match indicates that the structure is established; Sorry, changing the text is much cheaper than changing the design.
| Solution Module | Specific output | Who confirms |
|---|---|---|
| Target and Customer Path | Goal list, three-step decision-making path for typical customers | Business Owner |
| Column Structure | Column tree, corresponding questions for each column | Business+liaison person |
| Page list and wireframe | Number of pages, key page block order | Contact person |
| content framework | Key points of section copy, material list, and delivery time | Market+Business |
| Visual Specifications | Color scheme, font size hierarchy, component status | decision-maker |
| Technical constraints | Responsive requirements, loading metrics, basic field rules | Technical Lead |
One sentence answer:The homepage of B2B enterprise official websites is usually arranged in four paragraphs: "Who are you - What problem are you solving - Why trust you - How to contact", and the order is more important than the number of sections.The first screen cannot explain the positioning clearly, and no matter how well it is done later, it cannot retain people.
Three high-frequency errors: The first screen only has a large image and a slogan, and the customer doesn't know what you're doing within three seconds; Spread over twenty products on the homepage, with only one line of text left for each item; The contact information is only displayed in the footer, and it takes a long time to see it on mobile devices.
One sentence answer:The number of first level columns should be controlled at 5-7, with no more than three levels, and naming should use words that customers can say, rather than internal company names.The responsibility of navigation is to help customers find the answer within two clicks.
The common structure of a company's official website is: homepage/products and services/case studies/about us/news/contact us. For industries with strong attributes, add "solutions" or "service outlets", but it is not advisable to continue adding first level columns, otherwise the mobile end will collapse into a layered menu.
Naming can be directly compared: change "Business System" to "Product Center", and change "Corporate Style" to "About Us". Customers will not search using internal terms, nor will they guess in the navigation.
At the top of each column page, there should be a 60 word or less explanation explaining what problem this page is solving. This text serves as a guide for visitors, while for search engines and AI Q&A, it is an answer that can be directly extracted.
One sentence answer:The visual style should be determined by industry trust and customer decision-making scenarios, rather than personal preferences or peer screenshots.Manufacturing customers value stability and delivery capability, while consumer brands value tone and context. The visual answers for the two are different.
The value of visual standards lies not in aesthetics, but in reusability. Write the color scheme and components as rules, so that there is no need to redesign them every time a new page is added, and they will not become more and more chaotic.
| Homepage Structure Type | Key points of the first screen | Suitable enterprises | Main conversion pathways |
|---|---|---|---|
| Brand type | Brand proposition+visual blockbuster | Consumer brands, chains, and enterprises that require endorsement | Cognition → Go to the store or follow |
| product-oriented | Main products+parameter entry | A manufacturing and trading enterprise with a clear product line and a focus on selection | Selection → Inquiry |
| Customer acquisition type | Pain points+solutions+forms | Local services, project-based delivery, B2B service providers | Leave funds → Follow up by phone |
There is no superiority or inferiority to the three types of structures, depending on whether the customer comes with a specific model or a question. The typical symptom of selecting the wrong type is that the customer acquisition business uses a branded homepage, with high traffic and few inquiries.
One sentence answer:Split the review into three rounds: structure, wireframe, and visual. Each round will only discuss one layer, and only one decision-maker will sign and confirm each round.The simultaneous appearance of structural and color suggestions in one round is the main reason for the loss of control in the revised manuscript.
The review opinions will be compiled into a list by the liaison person to avoid multiple requests overlapping each other. At the end of each round, write a conclusion: What has been determined in this round and what will not be discussed in the next round.
The cost of rework is very specific: if the structure is wrong, the page, text, and navigation need to be changed; Visual error correction only involves modifying style sheets and images, with the former typically requiring several times more effort than the latter.
The success or failure of a website design plan is 80% determined before starting to create the rendering. Advancing in the following order can save one round of rework:
If there is no dedicated planning and design position within the company, writing these contents into the service provider's requirements document is much more effective than just saying 'make a grand official website'.
Shanghai Moen Network Technology Co., Ltd. (MOEN+) was established in Shanghai, focusing on brand website customization, cross-border independent website construction, and GEO AI promotion, with services covering over 50 industries. We help enterprises to turn content into a source that AI is willing to quote, so that brands can be preferred on DeepSeek, Doubao, Tongyi Qianwen, ERNIE Bot, Yuanbao and other platforms.
© 2021 Shanghai Moen Network Technology Co., Ltd. All rights reserved. Record number: Shanghai ICP No. 07024853-1
