Basic Terminologies in Website Design and Development

Just like any other industry, web design and development has a heck lot of industry-specific terminologies and acronyms. For someone just getting started with web design, or a business owner looking forward to have a website designed, all the technical jargon can be a bit confusing and overwhelming.

Below is a guide to web design and development terms that you are likely to come across which hopefully will help you understand what web designers and developers are saying:

Web page A web page is a document that is viewed using a web browser such as Firefox, Google Chrome, Opera etc. A web page is used to provide information to viewers which may comprise of texts, graphics, videos etc. A good example of a web page is what you are reading right now.

Website A website is a collection of web pages which are grouped together and accessible under the same domain name(eg. example.com is a website with plenty of web pages within it). Web pages within a website are usually connected/linked to each other with the help of hyperlinks. A website is often shortened to “site”.

Blog A blog is an information-based website that revolves around a specific topic. Blogs typically consist of text-based content in form of entries known as posts arranged in chronological order with the most recent entry appearing at the top of the blog’s home page. Most modern websites have a blog which they use for several reasons, including educating their audience and driving organic visitors to the site from search engines like Google.

E-commerce site E-commerce site (also commonly known as online store) is a website that supports buying and selling products and services online. The products sold via e-commerce sites can be physical(eg. Electronics, clothing, furniture etc) or digital(eg. Online courses, books etc).

Home Page The Home Page is basically the cover of a website. It is the first page that get presented to visitors when they access the domain name/address of a website. For instance, when you visit www.example.com the first page that you see is the home page. This page should give visitors an immediate sense of who you are as an organization/business or what your website is all about. It should be well linked to the other pages to guide the visitors to other important information in the website.

Landing Page Landing page is a web page in which a visitor first enters a website. Technically therefore any page can be a landing page. Oftentimes, as used in digital marketing, a landing page is a standalone web page used to optimize the number of visitors who take action after clicking an Ad or a call-to-action on a website.

Domain name A domain name is essentially a name/address that uniquely identifies a website on the internet eg. facebook.com, google.com etc. To access a website, you type its domain name in the address bar of a web browser.

URL A Uniform Resource Locator (URL) is the address of a resource on the Internet. These resources may include web pages, images, videos, pdf files and much more. Sample URL: **https://www.example.com/documents/example.pdf** In this example, the URL is the address to a pdf file. URL structure breakdown: Protocol: https:// Subdomain: www. Directory: documents/ File name: example.pdf

Web Browser A web browser, often referred as “browser” or “Internet browser” is a software application that is used for accessing the information on the web and displaying web pages. Examples of popular browsers are Mozilla Firefox, Google Chrome, Safari, Internet Explorer etc. Right now you are using a web browser to read this content.

Web Server Web Servers are powerful computers on the Internet used to store, process and deliver web pages to clients (such as web browsers). For a website to be accessible on the internet, it needs to be hosted/stored on a web server.

Hosting All websites need to be stored on a web server to be accessible to the rest of the world on the internet. You can get your own server and host your website files on it. However, this is very expensive. To save on the cost, hosting service providers (usually referred to as hosts) allows individuals and business to host/store their websites on their servers for which they charge them some fee usually billed annually. The hosting fee usually depends on the features that comes with the hosting plan such as amount of storage space, bandwidth, amount of email accounts allowed, number of databases allowed etc.

cPanel It is a web-based admin interface provided by a web hosting service that allows website owners to manage their servers and hosted services. With cPanel you can do a lot of things such as manage your domain names, install applications, create and manage email accounts, upload website’s files etc.

User Interface (UI) User Interface is what users see when interacting with the website. User Interface design considers all the visual and interactive elements of a website interface — including images, buttons, icons, spacing, typography, color schemes, and responsive design. The goal of UI design is to visually guide the user through a website and create an intuitive experience that doesn’t require the user to think too much. Good UI design should ensure that the design is consistent, coherent and aesthetically appealing.

User Experience (UX) User experience refers to how a user feels while interacting with the website. To create a good user experience, the website need to be easy to use, visually appealing and attractive, be free of bugs, easy to locate content, have quality, credible and original content.

Web design Generally, the process of creating a website is referred to as web design, which is commonly used interchangeably with web development. This is because in most cases the web design and web development roles are done by the same person.

However, there is a difference between the two terms. Comparing the website creation process to a house construction work, a website designer is the architect while website developer is the engineer. As an architect would create a plan for the house prior to its construction, a web designer designs the website look and feel before the web developer develops it.

Web designers transform an idea into a visually appealing design that catches users’ attention and models the layout of the website to integrate the best user experience possible. Web designers are more concerned with visual aesthetics of the site such as layout, color scheme, typography etc. They use tools such as Photoshop and Illustrator to make site sketches, wireframes and mock-ups.

Wireframe A visual representation of a website’s layout with directions for visuals, positioning of content, and style for each page. Designed by web designers, it is used as road map or plan by web developers in the development of the website.

Web development Web developers are the individuals who transform a design in to a live website. They use some softwares referred to as text-editors or IDEs(Integrated Development Environment) to write website code using programming, markup and styling languages.

Website developers are divided in to three categories: Front-end developers, back-end developers and full-stack developers.

Front-end developer Front-end developers act as the connection between the web designers and the back-end developers. They build the website interfaces, and provides the layout as the interaction between the back-end of the website and the user. Front-end developers use three main languages; Hypertext Markup Language (HTML), Cascading Style Sheets (CSS), and JavaScript (JS).

Back-end developer Back-end developers deal with the components of the website invisible to the website users such as processing server requests, application logic and data storage and manipulation. They use server-side programming languages such as PHP, Python, ASP.NET etc to write application logic and connect with the database as well as write database queries by using languages such as SQL.

Full-stack developer Full-stack developers are a group of developers that are well skilled to perform the roles of both the front-end and back-end developers.

Responsive Design Responsive web design is an approach to web design aimed at crafting sites to provide an optimal viewing and interaction experience, easy reading and navigation with a minimum of resizing, panning, and scrolling across a wide range of devices (smartphones, tablets, laptops and desktop computers).

Code A set of computer instructions written using a programming language. A computer code is used to develop websites, apps and other technologies that we use in our day to day lives. To see an example of what code looks like, right-click on a web page and select “view page source”. You’ll then be able to see the code that’s behind this particular website.

Coding/Programming Coding is the process of writing code. When developing websites or other types of applications, the developers do coding which is also known as programming.

HTML HTML, in full Hypertext Markup Language is the primary language used to make web pages. It is used to define the structure of the web pages and tell the browser how to display the various contents such as images, videos, texts, links etc.

CSS CSS, in full Cascading Style Sheets is a computer language used to design the look and feel of the website. It defines the colors, sizes, shapes, positions and typography among other features of the web page components.

Javascript Javascript is a programming language that runs on the web browser commonly used to add interactive effects within the web pages.

Database A database is an organized collection of structured data to make it easily accessible, manageable and updated. Simply put, a database is a place where the data is stored.

Content Management System(CMS) A software system that is used to manage the content of a website. The website owner can log into it and add or edit text content, upload images and create new web pages. Example of popular CMS’s include WordPress, Joomla and Drupal among others.

Traffic This is the number of visitors coming to a website. The higher the traffic a website receives, the more likely it is to generate more leads and sales.

**Search Engine Optimization(SEO)** This involve all the activities done on or outside the website to make it rank in a higher position in the organic search engine results for certain search queries as a way of increasing website traffic.

SSL Certificate This is a standard security protocol necessary for establishing encrypted communication between the web server and web browser. Websites with an SSL certificate are secure because the data is transmitted in an unreadable form to the naked eye. To know whether a website is secured with SSL, look at the web address: if the URL starts with “https”, the website is secure. You’ll also see a padlock symbol in the browser bar.

Sitemap A list of all the pages on a website that is easily accessible to search engines, crawlers, and site users. There are two types of sitemaps: HTML sitemaps are made and organized by topics to help site users easily navigate a website. XML sitemaps are created to provide search engines’ crawlers with a list of web pages on a website to easily discover and index your content.

Backup Anything may happen anytime unexpectedly that negatively impacts your website accessibility or its performance. Examples: Server may crash and cause loss of data, you or someone else may accidentally delete some website files or database tables or records, a hacker may infect your website files with malware or delete some data, some bugs may be introduced during website updates thus causing some errors on the website.

These may lead to losing the website or some data forever. To be on the safer side, it is always advisable to keep a website backup.

A website backup is a copy of all the important website’s components. These components include files such as code files, images and databases etc.

Cache Cache is temporary data storage that helps site speed by downloading and storing relevant information on your computer the first time you visit a website. If you return to that same website again, your browser will retrieve the already saved website information from your cache rather than from the original server thus making the web page load much quicker.

Cookies A cookie is a small text file created by a website that is stored on visitor’s computer. Cookies provide a way for websites to recognize visitors and keep track of their preferences (e.g. adding products to a shopping cart and returning later to make a purchase), remember their login, etc.

API API (Application Programming Interface) is a piece of code that allow communication between two applications. This is achieved by making some parts of the website code available to developers. The developers can use the API, to build tools and widgets that can be connected to that particular website. For example, most payment systems have APIs which developers can integrate to their website. In such situations, when a customer makes an order on the website and pays via the payment system, the transaction details and status are sent and saved on the website database.

Call-to-action(CTA) This is anything on a website (text, image, banner or button) that uses action-oriented(persuasive) language to get the website visitor to to take an expected, predetermined action (e.g. Make a purchase, Sign Up, Contact Us, Enroll to a course, etc.).

Examples of common CTAs are “order now”, “Add to cart”, “call us today”, “Start a free trial now” etc.

Conversion Conversion is the predetermined, desired and quantifiable goal accomplished by the visitor on a website. This goal could be: purchasing a product, sending an inquiry email, enrolling to a course, subscribing to an email newsletter, making a phone call etc.

Bug A bug is an error that prevents a website from running the way it is supposed to.

Documentation The documentation is essentially the central point of reference for anyone involved in developing, maintaining or using a website. Documentation may provide information on system requirements, architecture and design, technical properties and information for the end user.

Deployment Deployment is a key step at the end of web development process that involves taking the website to its live environment after testing has been done and the client accepted the complete product.