Your cheatsheet to website building!!

Introduction

As you delve into the world of the web developer, the amount of terms and labels you are familiar with will play a crucial role. Too muchofwhatsoundslikemumbo- jumbo can throw one off. After all, even the best secret agents are briefed before a mission. This chapter is aimed at making you, the reader, familiar with the terrain. Consider this a survey highlighting the lay of the land, in case you ever get lost. Treat it like  a  glossary:  if  ever you  read something and draw a blank, refer back to this chapter and you should be good to go.

The more you know..

Consider the following a compendium of beginners’ essential web ter- minology, literally anything that has anything to do with websites, in alphabetical order.

Accessibility – This term refers to how easy it is to use a website, across different situations, say, on the various screen sizes of different devices, and for visually or otherwise technologically challenged users. This is an important component of a website emerging from the design choices.

ASCII – American Standard Code for Information Interchange. It is a code that assigns values to symbols and actions (of the keyboard) so that it can be mapped to what is displayed on the screen.

Attribute – Attributes are additional properties that can be specified inside the html tags of an element. They specify information about the element that can be crucial to its functioning, which are given by values fol- lowing an ‘=’ sign. For example, the href attribute specifies the target address when using the <a> tag, as in <a href=”http://www.digit.in”> Digit Home </a>. Backend – The backend refers to everything that is server-side, i.e- the database and server-side code that integrates the data from the database into the web pages. For example, everybody’s Facebook profile page will  have the same code making up the page, however the backend code returns different content from the database depending on who is logged in.

Backlinks – Backlinks refer to hyperlinks that point back to your web- site. Increasing the number of backlinks from other websites gives you more traffic, and may also increase your ranking in the search algorithms. Bandwidth – Building on the metaphor of the internet as interlinked high- ways, bandwidth is equivalent to the width of the roads. It is the amount of data that can be exchanged in unit time with the web server. Low bandwidth limits the amount of traffic that your website can handle.

Banner – Banners are wide graphics usually found in the top half of the home page, and also sometimes at the bottom, in the footer. They often contain artistically emphasized text, and are meant to be eye-catching. At times, a banner may also be a hyperlinked advertisement.

Binary – Binary is a number system. It has base 2, and two digits, 0 and 1, which are also called bits (binary digits). This is the most basic language which computers understand on a hardware level, represented by on and off states, or high and low states in transistors.

Bounce Rate – The bounce rate is defined as the percentage of visitors to a website who leave the site (by navigating to another domain) after viewing only one page. In other words, this is the percentage of people whose atten- tion your website probably didn’t grab.

Browser – A browser is the application software that you use to view and interact with websites and web pages. It is your metaphorical surfboard for surfing the internet. When talking about communication with the server, the browser may also be referred to as the ‘client’.

CSS – Cascading Style Sheets are the files that control how the content of a page looks. This can be accomplished by specifying the values of appropriate element attributes in the CSS files. CSS can even be used for transitions, to create some cool simple animations.

CMS – CMS stands for Content Management Software. They allow not-so-tech-savvy individuals who want to build their own website to   do so easily, and with as less to do with coding as possible. Many CMSs are in fact meta-websites, websites that build websites. For details, see Chapter 6.

Conversion Rate – If your website or landing page has a specific purpose, like getting users to subscribe to your mailing list, the conversion rate refers to the number of users that subscribe divided by the total number of visitors to the page (multiplied by 100% if you like percentages).

Cookies – Cookies are files stored by a website locally on your computer or phone, in the cache of your browser. They record information about your usage of the website and can be very convenient at times. At other times, they can be a breach of privacy.

Domain – A domain name is what you enter into the address bar of your browser. It is the name of your website, like www.digit.in, www.google. com or any other website that you can think of. Domain names have to be purchased, and the registration usually lasts for a year or two, after which it has to be renewed.

DNS – This stands for Domain Name System, a critical part of a func- tioning world wide web. If you’ve ever wondered how a domain name URL written in letters corresponds to a numeric IP address, the answer is DNS. The DNS maintains a list of registered domains and their corre- sponding server’s IP addresses. DNS is the translator between these two address spaces.

Element – An element can be considered a ‘basic unit’ of HTML files. Everything on a web page is defined by / within an element. Each element is represented by tags like <html> and </html>. In fact, everything on a web page (except the doctype) resides within the html element, and either in the <head> element </head>, or <body> element </body>. Elements can have attributes specifying properties like color, in the opening tag.

Favicon – The favicon is the small image icon that is displayed in the address bar, next to the URL.

Fonts – Font families are the different typographic styles (or typefaces) for displaying the symbols that represent the letters of the alphabet, like Sans- Serif, Roboto, etc. They also have the properties of size and weight (boldness), which are together referred to as the font.

Frontend – The fron- tend of a website refers to the code that mainly makes the parts of the web page that users see. The front end includes the user interface, navigation structure, fonts, formatting etc. It is also called the presentation layer.

FTP – File Transfer Protocol is a communication protocol used on to transfer files on the internet, such as to upload the files for your website to the host server.

Hexadecimal – Hexadecimal (often shortened to hex) is a numbering system with base 16. Our everyday numbering system is decimal, with base 10. The decimal system has 10 single digit numbers and correspondingly the hexadecimal system has 16 ‘single digit’ symbols. The symbols 0-9 represent the values zero to nine and the symbols a-f represent the values ten to fifteen. So 10 in hex is the same numerical value as 16 in decimal.

Hit – While many manipulative marketers utilize this statistic in a way that implies number of hits is equal to the number of visitors, this is simply not true. The website registers a hit every time a request is made to the server, and a request is made every time your browser wants to access a resource, even when you submit forms. Thus a single visitor opening a single page can generate multiple hits.

Host – Your website and its pages reside on a server that needs to have adequate storage as well as bandwidth for the site to function properly. The provider of such servers are called web hosts. See chapter 7 for more. HTML – HyperText Markup Language is the language that all web pages are written in, one way or the other. Pure HTML will result in a static page, and thus pages are usually designed with a combination of HTML, CSS and JavaScript.

HTTP – HTTP stands for HyperText Transfer Protocol, and is the com- munication protocol for the exchange of information on the internet, between browsers and servers. It is written in the address bar as part of the URL, preceding the address of the resource being accessed.

HTTPS- HTTPS is HTTP Secure, or HTTP over SSL (Secure Socket Layer). This is also a protocol for communication between servers and browsers, the difference being that unlike plain HTTP, it is encrypted.

Hyperlink – Commonly called a ‘link’, it can be an image or text or even blank space on a web page, which can be clicked on. Clicking on a hyperlink takes you to the address that the hyperlink links to, enabling a network of interconnected web pages. The linked address can be on the same website or a different one.

Iframe – Inline frames are an element which enables the viewing of other web pages within that web page.

Impression – An impression is a view on a page or any element thereof, say, a link. An impression is not a click, but a click definitely implies an impression.

IP Address – An IP address is an Internet Protocol address. It is a string of numbers in the format x.x.x.x, where 0 < x < 255. When someone enters your domain URL into their browser, the DNS parses it to the corresponding IP address, and they are directed to the server hosting your website.

ISP – Internet Service Providers are the businesses who give you internet connectivity. There are around 3 different classes of ISPs that constitute a global hierarchy. Only the top level ISPs control the internet, while all the other classes purchase bandwidth from a provider in the class above them to sell it to consumers or ISPs in lower classes.

JS – JavaScript is a front end scripting language that enables the use of logical structures in webpages. There are also JavaScript programing environments like Node.js, Angular.js and many libraries such as jQuery.

JPG – .jpg (or .jpeg) is a highly compressed image file formation developed by the Joint Photographic Experts Group. It offers compression ratios of 10:1 with very little loss in quality, and thus is the most widely used image format on the web.

Keywords – Keywords or key phrases are what you expect your potential users to enter into a search engine when you want them to find your website. For example, if your website offers professional Chartered Accountant services for individuals, the keywords (key phrases) you would target on AdWords may be something like “how to file income tax” and related terms.

Landing Page – This is a specialized home page on a website, the page that the user ‘lands’ on when he/she visits your URL. Landing pages are usually specifically designed to elicit certain behaviour from the user, like signing up for a newsletter or donating to a cause.

Libraries – Libraries are a bunch of code written by someone else that you can incorporate into your own code to save time and effort. A lot of awe- some libraries are freely available so it’s good practice to credit the authors when you use their work. The most popular example for an aspiring web developer would be jQuery, which is a JavaScript library.

Liquid Layout – A liquid layout (as opposed to a fixed-width layout) is a design choice that defines element widths in terms of percentages of the total width. This way, content is rearranged in real-time according to the width of the browser, and the presentation can be optimised according to the size of the maximum width. An example is the box model in Bootstrap. Meta data – Meta data is information about the web page itself. It is contained in the <meta> tag in the header. This information is not displayed on the website itself, only in the source code. Some search engines use this date in their ranking algorithms.

Navigation – Navigation pertains to the system on your website that allows user to visit the various pages while having an understanding of where they are. The most common navigation systems used in websites are menus.

Optmization – Optimization may refer to Search Engine Optimization, or structural and content optimization of your webpages. In the second case, images need to be compressed as much as possible and the scripts and other resources need to be in order so that the page loads as fast as possible.

Parked Domains – Parked domains are those domain names which point to the same hosting server as another domain name. That is, if you enter either domain url into your browser, you will land up on the same website.

PHP – PHP is a server side scripting language that can be used to create dynamic websites. Some CMSs are written in PHP.

Plugin – A plugin is third-party code that you can add to extend the functionality of your CMS of choice. There are free and premium plugins, and they offer a range of easy enhancements like e-commerce integration, SEO, slideshow banners, etc.

PPC – Pay Per Click is a payment method when using advertising ser- vices like Google AdWords to generate traffic to your site. You specify the details of the ad and the contexts in which it should be shown, (and many other details,) and you pay a certain amount whenever a user clicks on the ad and you get a visitor.

Ranking – Your website contains content, and people who haven’t heard of your website can find it if they are searching for that (or similar) content on a search engine. Search engines take a query to return a relevant list, and ranking refers to how high your website is on that list.

Root – The highest level folder which contains all the files and folders that make up your website is called root, a term that Linux users will be familiar with.

Script – A script is a collection of code that enables some kind of interac- tive/logical functionality on a web page. The most common language for scripting on websites is JavaScript.

SEO – Search Engine Optimization is a strategy to increase the visibility of your website by having it rank higher in search results for related content. For in depth knowledge about SEO, grab a copy of the Fast Track to SEO, covered last month.

Server – A server is where the files that make up your website are stored. Whenever someone enters the url of your website from their browser, it sends a request to the server, which in turn serves back the required pages. Sitemap – A sitemap is literally like the map of your website. It is usu- ally a chart or an index which conveys the page structure of your website. Sitemaps are useful for users to navigate your site, as well as for search engines to properly crawl and index your site.

Subdomain – Subdomains are a way to split up your single domain name for multiple websites. For example, if your domain name is www. funkyname.com, you could have almost unlimited subdomains of the type www.subdomain1.funkyname.com, www.sd2.funkyname.com, etc.

Tag – A tag is used to specify the starting and end of an HTML element, in the format <tag>element content</tag>. A few tags do not require the end </tag>, like the (outdated) <br>.

Themes – Themes are pre-packaged designs for websites, especially those made using popular CMSs or website builders. Themes ensure that all pages have a consistent look across your website, while providing a professional look. Some themes are free, some are premium and cost money. Traffic – Just like the vehicles that cause physical traffic on the roads, every packet on every digital route contributes to the traffic on the highways of the internet. For a website, the ‘traffic’ generated refers to the number of visitors who have viewed any web page. This statistic is often used to judge the market value of a website for monetization. A high traffic also requires the proportionate amount of bandwidth, which is determined by the hosting service

URL – Acronym for Uniform Resource Locator. This is the address of any web page (containing the domain name), which you enter into the address bar of your browser.

Web page – A webpage, also referred to simply as a ‘page’, is a single .html or .htm file on a website (that may also be associated with a .css and .js file). Although all the content of a website can be fit on a single web page, websites are divided into multiple pages for ease of access and compre- hension. A web page may be static (remain the same unless modified) or dynamic (constantly appears different, as determined by the backend code). Website – A website is a collection of webpages that are linked to each other according to the sitemap. Most often, all the pages of a website reside under the same domain. A website may also organize different sections under different subdomains.