Home Web Front-end HTML Tutorial Website production process

Website production process

Sep 11, 2016 am 11:19 AM

As we all know, the production process of a website needs to be done step by step. Of course, the editor here is talking about a purely customized website rather than a template. So, the editor will briefly talk about the process of making a customized website.

First of all, since it is a customized website, from design to production to development, it is all done step by step. Whether it is design or functional development, you need to understand what the customer's needs are. So the first thing to say is what should be done at the beginning of the design.

1. What should be done at the beginning of design

Since we start with design, we need to know the customer’s needs. For example, what type of company is the customer’s company? What type of enterprise group is it? E-commerce type, government agency, school type or something else? Then we have to look at the size of the company and plan the columns of the company website based on the size of the company. Then we have to pay special attention to what style and tone the customer likes, what needs to be highlighted on the page, whether there is any special function development, etc. Then the designer starts to write a planning plan based on the needs put forward by the customer. The plan mainly focuses on further interpretation of the customer's company type, company size, column structure, website style, overall site tone, and functional development.

After the planning plan is approved, the designer will start designing the homepage of the website according to the style, color tone and areas that need to be particularly highlighted on the page required by the customer. After the homepage design is completed, the JPG file of the homepage will be sent to the customer for review, and Let the customer confirm and start designing the sub-page. After the sub-page is completed, the design draft will also be sent to the customer for review, so that the design draft can be modified and confirmed according to the customer's requirements. After all the design drafts are confirmed, it will be handed over to the next page production.

2. What should you pay attention to when creating a page?

Of course, after the design draft is completed and confirmed by the client, the website production process should move to the next step of page production. The front-end is responsible for page production, which means slicing the PSD file of the design draft, and then writing HTML code to write the pictures of the design draft into pages on the website. And handle the JS effect on the page and debug the browser compatibility, and complete the page with more than 99% similarity with the design draft. These are the parts that the front end needs to do, so what does the front end need to pay attention to.

First of all, it is wrong to start production directly after getting the design draft. If you start working directly, you will definitely know nothing about the website of course, and you will not know anything. You will only focus on typing code to make the page. After finishing it, some problems will inevitably be exposed. So this is wrong, so what should be done? The editor’s personal idea is that after getting the design draft, don’t rush to start production. First go through all the pages with the designer and understand the column structure of the website. , and then there are the places on the page that need attention and the places where effects need to be used. After going through all the pages, it will be much easier to do the next page.

After understanding what you need to pay attention to at the beginning of production, what should you pay attention to during the process of creating a page? First of all, during the production process, it is absolutely necessary to restore the design draft to the website page, and then according to the designer's design ideas, add JS effects to the places where JS effects are needed on the page, such as carousels, tabs, etc. Commonly used JS effects and the like, the final focus is on a few things that need to be paid attention to in the HTML code. The first is the title and alt attributes of the image, which is beneficial to SEO optimization. Pages with form submissions need to do form verification, etc.

3. Things that need attention in development

Function development in programs generally does not have much impact on page production. If there are certain pages that need to develop functions, and if there is this page in the design draft, you can communicate with the front-end and give priority to functional development. Page, in this case, page production and function development can be carried out at the same time. What needs to be paid attention to during the development process of the program is that you first need to understand the design draft. In the process of page creation, there will be places where the program needs to cooperate. You can understand the coordination part by simply explaining it. If you don’t understand the design draft , there may be many problems when cooperating. This is also linked to the tacit understanding of the front-end and the program.

The above are the things that need to be paid attention to in the design, front-end, and program during the production of a customized website project. Of course, this is just what I have encountered in my daily life. I have sorted it out and written this short article. If other problems arise later, the editor will continue to update related articles.

This article is reproduced from: http://www.0731pgy.com/a/news/Industry%20News/382.html

Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

Video Face Swap

Video Face Swap

Swap faces in any video effortlessly with our completely free AI face swap tool!

Hot Tools

Notepad++7.3.1

Notepad++7.3.1

Easy-to-use and free code editor

SublimeText3 Chinese version

SublimeText3 Chinese version

Chinese version, very easy to use

Zend Studio 13.0.1

Zend Studio 13.0.1

Powerful PHP integrated development environment

Dreamweaver CS6

Dreamweaver CS6

Visual web development tools

SublimeText3 Mac version

SublimeText3 Mac version

God-level code editing software (SublimeText3)

Is HTML easy to learn for beginners? Is HTML easy to learn for beginners? Apr 07, 2025 am 12:11 AM

HTML is suitable for beginners because it is simple and easy to learn and can quickly see results. 1) The learning curve of HTML is smooth and easy to get started. 2) Just master the basic tags to start creating web pages. 3) High flexibility and can be used in combination with CSS and JavaScript. 4) Rich learning resources and modern tools support the learning process.

The Roles of HTML, CSS, and JavaScript: Core Responsibilities The Roles of HTML, CSS, and JavaScript: Core Responsibilities Apr 08, 2025 pm 07:05 PM

HTML defines the web structure, CSS is responsible for style and layout, and JavaScript gives dynamic interaction. The three perform their duties in web development and jointly build a colorful website.

Understanding HTML, CSS, and JavaScript: A Beginner's Guide Understanding HTML, CSS, and JavaScript: A Beginner's Guide Apr 12, 2025 am 12:02 AM

WebdevelopmentreliesonHTML,CSS,andJavaScript:1)HTMLstructurescontent,2)CSSstylesit,and3)JavaScriptaddsinteractivity,formingthebasisofmodernwebexperiences.

Gitee Pages static website deployment failed: How to troubleshoot and resolve single file 404 errors? Gitee Pages static website deployment failed: How to troubleshoot and resolve single file 404 errors? Apr 04, 2025 pm 11:54 PM

GiteePages static website deployment failed: 404 error troubleshooting and resolution when using Gitee...

What is an example of a starting tag in HTML? What is an example of a starting tag in HTML? Apr 06, 2025 am 12:04 AM

AnexampleofastartingtaginHTMLis,whichbeginsaparagraph.StartingtagsareessentialinHTMLastheyinitiateelements,definetheirtypes,andarecrucialforstructuringwebpagesandconstructingtheDOM.

How to use CSS3 and JavaScript to achieve the effect of scattering and enlarging the surrounding pictures after clicking? How to use CSS3 and JavaScript to achieve the effect of scattering and enlarging the surrounding pictures after clicking? Apr 05, 2025 am 06:15 AM

To achieve the effect of scattering and enlarging the surrounding images after clicking on the image, many web designs need to achieve an interactive effect: click on a certain image to make the surrounding...

HTML, CSS, and JavaScript: Essential Tools for Web Developers HTML, CSS, and JavaScript: Essential Tools for Web Developers Apr 09, 2025 am 12:12 AM

HTML, CSS and JavaScript are the three pillars of web development. 1. HTML defines the web page structure and uses tags such as, etc. 2. CSS controls the web page style, using selectors and attributes such as color, font-size, etc. 3. JavaScript realizes dynamic effects and interaction, through event monitoring and DOM operations.

How to implement adaptive layout of Y-axis position in web annotation? How to implement adaptive layout of Y-axis position in web annotation? Apr 04, 2025 pm 11:30 PM

The Y-axis position adaptive algorithm for web annotation function This article will explore how to implement annotation functions similar to Word documents, especially how to deal with the interval between annotations...

See all articles