Web Development/Web Designing

Web development is the process of building a website for the Internet (World Wide Web) or an intranet (a private network). The process of web development, which can begin with a single static page of plain text, can be used to create complex web applications, online shops, and social network services. Web engineering, Web design, Web content development, client liaison, client-side/server-side scripting, Web server and network security configuration, and e-commerce development may all be included in a more extensive list of tasks that are generally referred to as Web development.

The two primary non-design aspects of building Web sites, writing markup and coding, are collectively referred to as “web development” by web professionals. [2] Content management systems (CMS) can be used in web development to make content changes simpler and accessible to those with only rudimentary technical knowledge.

Teams of web developers for larger businesses and organizations may number in the hundreds and create websites using standardized techniques like Agile methodologies. Smaller businesses might only need a single permanent or contract developer, or they might assign additional personnel to related roles like graphic designer or information systems technician. Instead of being the purview of a single department, web development may involve cross-departmental cooperation. The three different specializations available to web developers are front-end, back-end, and full-stack. Since Tim Berners-Lee [4] created the World Wide Web at CERN and made the Web commercially viable, the industry has exploded and the Web has become one of the most widely used technologies ever.

The creation and upkeep of websites require a wide range of abilities and disciplines, including web design. Web graphic design, user interface design (UI design), authoring, including standardized code and proprietary software, user experience design (UX design), and search engine optimization are some of the different facets of web design. Although some designers handle every aspect of the design process, it is common for many people to work in teams to cover various aspects. The process of creating a website’s front-end (client side), which includes writing markup, is commonly referred to as “web design.” In the broader context of web development, web design and web engineering partially overlap. It is expected of web designers to be knowledgeable about web accessibility standards and usability issues.

Web developers can test and debug their code using web development tools, also known as devtools or inspect elements. They are different from website builders and integrated development environments (IDEs) in that they are tools for testing the user interface of a website or web application rather than aiding in the direct creation of a webpage.

Web browsers either have built-in features or add-ons that are used for web development. The majority of widely used web browsers, including Google Chrome, Firefox, Internet Explorer, Safari, Microsoft Edge, and Opera [1], come with built-in tools to aid web developers, and their respective plugin download pages also offer a wealth of additional add-ons.

Developers can work with a variety of web technologies, such as HTML, CSS, the DOM, JavaScript, and other elements that are handled by the web browser, thanks to web development tools.  Popular web browsers have added more developer-focused features in response to the growing demand from web browsers to do more [2].

common characteristics

When you mouse over an element on a webpage and choose “Inspect Element” or a comparable option from the context menu, you can usually access the built-in web developer tools in the browser. As an alternative, the F12 key is frequently used as a shortcut.

The DOM and HTML

The built-in web development tools frequently include an HTML and DOM viewer and editor. The HTML and DOM viewer differs from the view source feature in web browsers in that it not only lets you edit the HTML and DOM and watch the changes you make appear on the page as they happen. It also lets you see the DOM as it was rendered.

The HTML elements panels typically also show DOM object properties, such as display dimension and Cascading-style-sheet properties, in addition to selecting and editing.

The 3D page inspector in Firefox versions 11 to 46 made use of WebGL to display the nesting of elements as layers that protruded from the page’s surface.

Assets, resources, and network information for websites

Typically, external files such as images, scripts, fonts, and other content are needed to fully load a web page. The appearance of style sheets can be tested in real time, and web development tools also enable developers to inspect the resources that are loaded and accessible on the web page in a tree-structure listing.

Web developers can view network usage data with the aid of web development tools, including the bandwidth and loading times as well as the HTTP headers that are being sent and received.

auditing and profiling

Developers can gather data about a web page’s or web application’s performance using profiling. With this information developers can improve the performance of their scripts. After analyzing a page, auditing features may offer developers recommendations for optimizations to shorten page load times and improve responsiveness. The majority of web development tools also keep track of memory usage, page rendering times, and the different kinds of events that are occurring. Developers can optimize their web page or web application using these features.


Debugging JavaScript

Web browsers frequently use JavaScript. When debugging JavaScript, web development tools frequently have a panel that enables developers to add watch expressions, breakpoints, view the call stack, and pause, step over, step into, and step out of functions.

Commonly present is a JavaScript console. The consoles give programmers the ability to enter JavaScript commands, call functions, and view any errors that may have occurred while a script was being executed.