These are questions that affect all fields of engineering and that evolve over time, as profiles specialize and tools are created that substantially improve work productivity. Let’s see how these questions are answered in the case of web and app development.

Website design

The design of a website or an app has two main fields, functional design and graphic design. By parts, we understand by functional design the definition of the transactions to be made by the application. To give an easy example, an e-commerce website must allow the user to view the product catalog, select the ones they like, obtain more information on each of them, select the purchase, pay, etc. 

All of these transactions are part of the functional design. On the other hand, graphic design groups two other fields, the first refers to everything related to the visual aspects of the UI / UX – the user interface and the user experience – that somehow unify functional design with user interface. 

The second refers to everything related to visual aesthetics and usability of a website. That is, color schemes, typefaces, organization of the information on the screen and information flow that invites the required action.

In general, and in colloquial language, when we talk about web design we refer to the graphic and user part and to those professionals who design the front-end of the application

Consequently, some commonly used skills and tools that distinguish the web designer from the developer are as follows:

1. Adobe Creative Suite (for example Photoshop or Illustrator), as well as other design software.

1. Knowledge of graphic design and, therefore, of logo design, format, branding, color palettes and typography.

1. Knowledge of layout, storyboards and wireframes.

• Web design, therefore, focuses on what the user sees on the computer screen or mobile phone and not on the mechanisms that operate below the surface that make everything work. Basically, they make it possible to create a digital user experience.

Currently there is a clear trend for the web designer to be both a front-end developer . Therefore, many people who have trained as graphic designers and want to work in the digital world have no choice but to develop technical programming skills in HTML, CSS and JavaScript, the three languages ​​used for front end development. Thus, a creative website design agency is highly valued in the market because they also create user-friendly designs that are attractive and engaging.

WEB DEVELOPMENT

The concept of development is linked to the idea of ​​programming, of building a product, in this case a website or an app. Web development governs and directs all the code that makes a website work. Traditionally it has been divided into two categories: front-end (the client-oriented part) and back-end (the server-oriented part).

 The back-end is responsible for managing the transactional part of the application. In the aforementioned e-commerce example, the back-end. It is responsible for identifying the user, collecting the list of products requested, loading the shopping cart and making the payment, among other functions. 

All these transactions work with databases and elements of information security and integrity. And they work without the user knowing, since they are programs that only show the result of their work, relevant to the user, through the front end. In general, more and more development is identified with back end. The back end programming languages are Java, Python, .net, Ruby, PHP…

Finally, and once this brief introduction has been made, it must be said that the borders between each other are never as clear and defined as we have expounded Stall. The complete design / development cycle would be specified in:

1. – Functional design of the application

2. – Graphic design – —Front end development – —Back end development

3. – User test and integration tests

4. – Commissioning

And a good project manager will know who to assign each task to at what time.

What we see on a web page is web design, that this design is not merely static, is given by the web layout and that is why we speak here in a strict sense, of responsive web layout and not of responsive web design, A web design without templates, begins with Photoshop and / or Illustrator, and this is static, as for example, a logo, that is, it is more a graphic design than something applied to a web, but since it is done thinking of a web or an APP, yes we are dealing with a web design.

The web layout is usually done with HTML5 and CSS3 mainly, and according to needs, also with Javascript. 

We are talking about web layout, but because we understand our potential clients, we explain it this way, since it is rare for a person to request a plain web layout.

 For this reason, and because web design positions much better than web layout , since logically if customers search for web design when they refer to design and layout and in most cases, in fact, they are referring to the comprehensive development of a web application.

We have chosen to adapt to your language, after all, the important thing is to understand each other, and then it is our job to explain the steps we are going to take when creating the website.

The HTML is a markup language where the spaces where the content will be marked, but it is not a programming language. Arithmetic functions cannot be developed, it does not control any user action, they do not take into account variables, in HTML only the basic structure of a web page is described and links, links to other pages or documents can be included.

The layout is completed with CSS, which is to “make beautiful” the content of the web and create the style of the web page, basically, so that it is not bland and ugly, so that we understand each other. Colors, indents, background images, sizes, fonts, rotate elements … all of this can be modified with CSS. And it is especially useful when creating responsive web applications through the use of Media Queries.

And within the web layout Javascript also comes into play, but we have already released quite a bit for today 😉 In summary, we will say that it also serves for certain animations on the web that can be performed without having to go through the server, so that they are done quickly. For example, the fact that a menu folds and unfolds or that we get a warning that a field to fill in a form is missing.

And what is web programming?

 Here comes into play the provision of functions to the web or the application. The most common programming language is PHP, in use the latest version of this language, PHP 7. With web programming, the graphic elements of the web are provided with functionality.

And with PHP you can program both the front end and the back end of a web page.

With PHP we process the information, we add functions to the web page (when X passes, when Y passes, when the user does this, the other is displayed …) When we need any dynamic function, beyond showing static content, we need a programming language like PHP.

Pages like Wikipedia are created with PHP, among many other technologies.

And to simplify and speed up work with PHP , there are a number of frameworks .These frameworks help with the most repetitive and common tasks of a web project, making there less code, making the programmer program faster and the web is created more stable

And for any type of dynamic web application, we need to consult a database, we work with MySQL. The databases of a web page contain a series of organized and related data, and complex queries can be made thanks to them.

And also, depending on the specific project, there are many other technologies, APIS, etc.

If we add web design, responsive web layout, front end and back end programming and database development, we are dealing with a comprehensive web development, which adds design, layout and programming.

Deception: Did you confuse about what’s the difference between Web design and web development?  Here are all answers which help you to solve every queries and doubts

Bio: Jignesh Vaghasiya is the CEO at Universal Stream Solution. Universal Stream Solution is a web development company in Atlanta (). That helps start-ups to enterprise companies in mobile & web technology.