Personal view of the web design process

Idea

Feasibility study

Then, we decide if it's feasible to work on the idea, considering factors like available resources (money, time, workforce, motivation), available substitute products by the competition, customer's wants and needs and many others. It's better to discard our idea upfront than to realize it and find that noone cares about it. Before we work on it, we must ensure that it has as many roots as possible, so it can grow almost without water.

Sketch

If we think that the idea is feasible, we can make initial sketches to see our understanding of where its contours fall. In the process, we learn more about the idea and how we can improve it. We can determine if the goal of the website supports our values, who the potential audience is and why should she care, what type of content will be provided. We can sketch the layout and navigation and think about the information architecture and the way the user interaction should happen. A sketch can be done quickly and serves as a discussion point among a larger group.

Graphic layout

After we've created the sketch, it can be digitized, especially if we need to present our ideas to the customer. He can then approve or discard our idea. We start with the functional prototype as soon as the client is happy with the graphic layout. This step can be omitted if we work on our own project, have a clear idea of what we are going to do and want to save some valuable time.

HTML

HTML makes websites possible and hosts their content. There isn't a web browser that can't support even basic HTML. Even like Lynx, which don't have the means to display styles, behavior and multimedia support it. The HTML is important, because its DOM structure has a direct impact on other components of the site. The content is scanned by search engines and frequent updates in accordance to a long-term strategy can be rewarded. Most people hate to read long text, so we can diversify their experience with audio and video to make the content more interesting. We use hooks—like ids and classes—to bind the content with particular style or behavior. Sometimes we need to make a compromise using non-standard solutions. Once we are ready with the HTML, we should test it with the HTML validator to avoid early validation mistakes. We should keep both a minimal number of tags and a shallow tag hierarchy.

CSS

Back-end Development

Front-end development

Database

Most modern websites keep their data in databases consisting of multiple two-dimensional tables with many rows and columns. At the intersection of every row and column—the cell—is stored a single data unit. The most common operations on such relational databases are insert, select, update and delete, which can be performed once we have connected to them. After we have stored our content in the database, we can use a server-side language (see the last paragraph) to extract it from there and load it dynamically in the HTML, which gives us high flexibility. This is why we should text the database together with the sever-side language and the HTML. There are many databases and we must be aware of their advantages and disadvantages, before we choose a particular one. You can try the packages WAMP or XAMPP, which contain a web server like Apache, a database like MySQL and useful tools to operate on it, like phpMyAdmin.

Working with databases requires knowledge of things like:

To find out more, use the MySQL reference.

Verification and validation

V&V are very important during all phases of the development process. Verification determines if we are building the product right and validation—if we are building the right product. If anything in the creation process was wrong, we may need to start over, which is very time consuming. This is why we need to be sure in the answer of these two questions at every step of what we do.

Optimization

Optimization has many facets, but it shouldn't be made before everything is completed. We can optimize for: screen space; more intuitive interaction; usability and accessibility; search results; mobile devices; function execution time; database query speed; code size, maintainability, understandability, flexibility; more sales and others. But we need to determine our priorities first. And then be ready to make trade-offs

Code Compression

After the code was optimized, we can to save on storage space, bandwidth, load and parse time.

Marketing

When a website is ready, it's very important promote it to increase it's visibility. Word-of-mouth, advertising and PR campaigns, brochures, social network presence, reviews and testimonials can further support this task. But we must remember that the best marketing comes from the amazing product we create, the fabulous service we offer or simply how we behave in relation to others.

Sales

bit.ly/WipvdH