Quick Revision for Web Designing (HTML,CSS,JAVASCRIPT)

Unit 1 


http stands for hypertext transfer protocol which basically used for transferring file to your client. in the form of web. if you are playing a video on youtube.com then your video is transferred by the http. you can see on url bar like this :-  "https://www.google.com" here s means secure your file is secure.  http used to load webpages using hypertext links. HTTP is an application layer protocol designed to transfer information between networked devices and runs on top of other layers of the network protocol stack. A typical flow over HTTP involves a client machine making a request to a server, which then sends a response message. An HTTP request is the way Internet communications platforms such as web browsers ask for the information they need to load a website.

html basic tags are head tag body tag html tag title tag. 

html body tag is  used to write something on the body of your web page. 

<body> 

//your body here

//you can write your body code here


Hello I am body

</body>


List tag in html there is many types of list available  in html ordered list, unordered list and you can find also description list

ordered list code syntax:

<ol>

<li> your list</li>

<li>your list </li>

</ol>

unordered list

<ul>

<li> Abhi</li>

<li>Subha </li>

</ul>

<dl>

your topic

<dt> your description </dt>

</dl>


Insert and linking: If you want to hyper link your document then you

 have to follow these steps.

 <a href="https://www.google.com">Google</a>

if you want to link your email then you have to follow these steps

<a href="mailto:abhisekdas91221@gmail.com">This is my mail</a>

if you want to call me using html call process
<a href="tel:+91 7908688785">You can Call me</a>


What are Absolute URLs?

An absolute URL contains the entire address from the protocol (HTTPS) to the domain name (www.example.com) and includes the location within your website in your folder system (/foldernameA or /foldernameB) names within the URL.

Basically, it's the full URL of the page that you link to.

An example of an absolute URL is:

<a href = http://www.example.com/xyz.html>

What are Relative URLs?

The relative URL, on the other hand, does not use the full web address and only contains the location following the domain. It assumes that the link you add is on the same site and is part of the same root domain.

The relative path starts with the forward slash and leads the browser to stay within the current site.

An example of a relative URL is:

<a href = "/xyz.html">

How can you Insert Image on html document?

if you want insert image then you have to write this code.

<img src="abhi.html.jpg">

if you want o make this image clickable then you have to follow these steps
<a href="https://www.google.com">Google <img src="abhi.html.jpg"></a>

<img  align="left"src="abhi.html.jpg" style="height: 200px; width: 150px;">

for margin you can follow these steps

<img margin  align="right" height="100px"  width="50px"  src="abhi.html.jpg"
style= "margin: 100px;">


Working with Table

if you want create table in html then you have to follow these steps:
1) use table tag
2)tr tag for table row
3)td tag for table data,
4)th tag for table header
5)tf tag for table footer.
example of table

without border.

<table>
      <tr>
        <td>Company</td>
        <td>Contact</td>
        <td>Country</td>
      </tr>
      <tr>
        <td>Alfreds Futterkiste</td>
        <td>Maria Anders</td>
        <td>Germany</td>
      </tr>
      <tr>
        <td>Centro comercial Moctezuma</td>
        <td>Francisco Chang</td>
        <td>Mexico</td>
      </tr>
    </table>


for table border:

place it before head tag
<style>
table, th, td {
border: 1px solid black;
border-collapse: collapse;
}
</style>

You can also change height and width by giving height and width attribute inside
the style attribute.
now if you want know about nested table or table inside the table. then you have
to follow these steps
like this

<table>
  <tr>
    <td><table>
      <tr>
        <td>Company</td>
        <td>Contact</td>
        <td>Country</td>
      </tr>
      <tr>
        <td>Alfreds Futterkiste</td>
        <td>Maria Anders</td>
        <td>Germany</td>
      </tr>
      <tr>
        <td>Centro comercial Moctezuma</td>
        <td>Francisco Chang</td>
        <td>Mexico</td>
      </tr>
    </table>
    </td>
    <td>Contact</td>
    <td>Country</td>
  </tr>
  <tr>
    <td>Alfreds Futterkiste</td>
    <td>Maria Anders</td>
    <td>Germany</td>
  </tr>
  <tr>
    <td>Centro comercial Moctezuma</td>
    <td>Francisco Chang</td>
    <td>Mexico</td>
  </tr>
</table>


want to know about frames? if you want divide your browser in three frames then you
have follow
these steps to create frams. and rememeber one thing that is you have to place these
code before the
body tag so that it will work properly. otherwise your code will not work.
<frameset cols = "25%,50%,25%">
  <frame name = "left" src = "abhi.html.jpg" />
  <frame name = "center" src = "abhi.jpeg" />
  <frame name = "right" src = "abhi.html.jpg" />
 
  <noframes>
     <body>Your browser does not support frames.</body>
  </noframes>
 
</frameset>

OUTPUT


for rows
<frameset rows = "25%,50%,25%">
  <frame name = "left" src = "abhi.html.jpg" />
  <frame name = "center" src = "abhi.jpeg" />
  <frame name = "right" src = "abhi.html.jpg" />
 
  <noframes>
     <body>Your browser does not support frames.</body>
  </noframes>
 
</frameset>





UNIT 2

What is CSS?

  • CSS stands for Cascading Style Sheets
  • CSS describes how HTML elements are to be displayed on screen, paper, or in other media
  • CSS saves a lot of work. It can control the layout of multiple web pages all at once
  • External stylesheets are stored in CSS files

Why Use CSS?

CSS is used to define styles for your web pages, including the design, layout and variations in display for different devices and screen sizes.


CSS Example


body {

  background-color: lightblue;

}

h1 {

  color: white;

  text-align: center;

}


p {

  font-family: verdana;

  font-size: 20px;

}




What is inline css?
Inline css is type is css which is written in the line for example
<!DOCTYPE html>
<html>
<head>
<title>Playing with Inline Styles</title>
</head>
<body>
<p style="color:blue;font-size:46px;">
I'm a big, blue, <strong>strong</strong> paragraph
</p>
</body>
</html

what is internal css?
internal css is a type of css which is written in the head tag using <style>
tag. like this
  1. <!DOCTYPE html>  
  2. <html>  
  3. <head>  
  4. <style>  
  5. body {  
  6.     background-color: linen;  
  7. }  
  8. h1 {  
  9.     color: red;  
  10.     margin-left: 80px;  
  11. }   
  12. </style>  
  13. </head>  
  14. <body>  
  15. <h1>The internal style sheet is applied on this heading.</h1>  
  16. <p>This paragraph will not be affected.</p>  
  17. </body>  
  18. </html>  


what is External Css?
external css is a type of css which is a separated file from html. the file
extension is .css

if you want to link with your html file then you have to write this code in
html inside the head
tag.
 <link rel="stylesheet" href="style.css">


Selectors in css
there is multiple type css selector available. tag selector if you want select a
specific tag
then you have write the tag for example h1 then you have put the third barackets
now you can
style your document. like margin: 30px;
like this
h1{
   color: aqua;
   margin: 100px;
}




ID selector you can give a id to your tag for example:
<article id="abhi">Vikat is here</article>

and you want to select this id then you write this code
#abhi{
    color: red;
    font-size: 100px;
}


<p class="class1">I am paragraph</p>
  <article class="class1">I am article</article>
  <strong class="class1">I am strong</strong>
  <span class="class1"> I am span</span>
css
.class1{
    font-size: 50px;
    font-family: 'Times New Roman', Times, serif;
    margin: 100px;
    color: Blue;
    background-color: aqua;
}


UNVERSAL SELECTOR: THIS A TYPE OF SELECTOR YOU CAN USE THIS SELECTOR TO SELECT ALL THE
ELEMETS
OF YOUR HTML.
*{
YOU CODE IS HERE.
}
child selector:
css:
span {
background-color: aqua;
}

div > span { background-color: yellow;
}


html
<div>
  <span>
    Span #1, in the div.
    <span>Span #2, in the span that's in the div.</span>
  </span>
</div>
<span>Span #3, not in the div at all.</span>


JavaScript

What is JavaScript ?


JavaScript is a lightweight, cross-platformsingle-threaded, and interpreted compiled programming language. It is also known as the scripting language for webpages. It is well-known for the development of web pages, and many non-browser environments also use it.



JavaScript (JS) is a cross-platform, object-oriented programming language used by developers to make web pages interactive. It allows developers to create dynamically updating content, use animations, pop-up menus, clickable buttons, control multimedia, etc. The use of JavaScript can be both on the client-side and server-side. While HTML and CSS languages are used to give structure and style to web pages, JavaScript is used to add interactive elements that engage users. Without JavaScript, 90% of Internet webpages would be static.

Event model in javascript:
An event is an action that occurs as per the user's instruction as input and gives the output in response. We can consider different types of inputs, such as mouse clicks, button presses, and when users press tab and text box change. In Javascript, when the user hits the button, it goes as requested and provides the response to the user in a form of output. JavaScript implements a component called an event handler that helps you acknowledge the certain action to the events. An event handler is a section of code that can be considered as a user-defined JavaScript function that operates when a particular event fires. We can define it as the registration of an event handler and can consider it as an event listener that performs and listens as an event and returns the result.

<!doctype html>

<html>

  <head>

    <script>

      function Greet() {

        alert('Hello World!');

      }

    </script>

  </head>

  <body>

    <button type="button" onclick="Greet()">Please click here! </button>

  </body>

</html>











<!DOCTYPE html>

<html>

<body>

Enter your First name: <input type="text" id="firstname" onkeyup="myKeyUpFunction()">

<p>My First name is: <span id="Test"></span></p>

<script>

function myKeyUpFunction() {

  var input = document.getElementById("firstname").value;

  document.getElementById("Test").innerHTML = input;

}

</script>

</body>

</html>



VARIABLE DECLARATION IN JAVASCRIPT
<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Variables</h1>

<p>In this example, x, y, and z are undeclared.</p>
<p>They are automatically declared when first used.</p>

<p id="demo"></p>

<script>
x = 5;
y = 6;
z = x + y;
document.getElementById("demo").innerHTML =
"The value of z is: " + z;
</script>

</body>
</html>





Types of JavaScript Operators

There are different types of JavaScript operators:

  • Arithmetic Operators (+,-,*,/)
  • Assignment Operators(=)
  • Comparison Operators(==,<,>,<=,>=)
  • String Operators(+=)
  • Logical Operators(&,||, !)
  • Bitwise Operators(&,~>>)
  • Ternary Operators
  • Type Operators
What are Control Statements?
In any program, a typical statement aims to execute a command or,
in simple words, do something. Control Statements are similar to
other statements. But they are different at a certain angle. They
have the ability to determine which of the other statements
should
be executed and at what time it should be executed.

Control statements are intended to allow users to write scripts that
determine which lines of code get evaluated and how many times they
get evaluated. Control statements are classified into two types.

Types of Control Statements in JS
There are basically two types of control statements in Javascript.
Namely, Conditional Statements and Iterative Statements (in simple
words, Loops).

Conditional Statements: These are the ones that make a decision.
There is an expression that gets passed, and then the conditional
statement decides on it. It is either YES or NO.
Iterative Statements (Loop): This is a type of statement that keeps
repeating itself till a condition is satisfied. In simple words,
if we have an expression, until and unless it gets satisfied,
the statement will keep repeating itself.
Examples of Control Statements
Now let us take a look at some examples and try to understand more
about control statements.

Conditional Statements
This is where we decide the flow of a program's execution. Based
on the outcome, Conditional Statements determine the next step.
The outcome of a conditional assertion can be True, or it can
be false. If the condition comes out to be true, the programme
goes to the next step. On the other hand, if the condition comes
out to be false, the programme goes out to a different. Unlike
Loop statements, these statements get executed only once.

Below we can see the different types of Conditional Statements.

Array: an array is special variable which can hold more than one value.

<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Arrays</h1>

<p id="demo"></p>

<script>
const cars = ["Saab", "Volvo", "BMW"];
document.getElementById("demo").innerHTML = cars;
</script>

</body>
</html>





JavaScript functions are defined with the function keyword.

You can use a function declaration or a function expression.

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Functions</h1>

<p>Call a function which performs a calculation and returns the result:</p>

<p id="demo"></p>

<script>
let x = myFunction(4, 3);
document.getElementById("demo").innerHTML = x;

function myFunction(a, b) {
  return a * b;
}
</script>

</body>
</html>


<!DOCTYPE html>
<html>
<body>


<p id="demo"></p>

<script>
const d = new Date();
document.getElementById("demo").innerHTML = d;
</script>

</body>
</html>


<!DOCTYPE html>
<html>
<body>

<p id="demo"></p>

<script>
// Create and display a variable:
let person = "John Doe";
document.getElementById("demo").innerHTML = person;
</script>

</body>
</html>



<!DOCTYPE html>
<html>
<body>


<p id="demo"></p>

<script>
const myObject = {
  firstName:"John",
  lastName: "Doe",
  fullName: function() {
    return this.firstName + " " + this.lastName;
  }
}
document.getElementById("demo").innerHTML = myObject.fullName();
</script>

</body>
</html>





What is WYSIWYG?

The underlying concept behind WYSIWYG isn’t that complex — it stands for What You See Is What You Get. Online, it’s used to denote that in certain applications (or any user interface), what you’re seeing is also the end product produced.

In the more frequently used context, WYSIWYG occurs where the text you are editing exactly matches how the final product looks.

For example, when you’re writing a document in a word processor, it’s using the WYSIWYG concept. What you type into your document, how you format and/or edit it, is exactly replicated in the end document that you print or send as a PDF (ie. what you created on screen, you get).

But WYSIWYG editing isn’t limited to word processors. You also see it in modern applications like CRMs, CMSs, Document Management Tools, Emails Builders, almost anything that includes written content.

A question people often ask is why these applications use a WYSIWYG editor.

The rise in popularity of this writing and editing style, has seen Developers and Product Managers alike incorporating ease-of-use WYSIWYG elements into their interfaces:

What is Domain

A domain name is the identity of one or more IP addresses; for example, the domain name google.com points to the IP address "74.125.127.147". Domain names are invented as it is easy to remember a name rather than a long string of numbers. It would be easy to enter a domain name in the search bar than a long sequence of numbers.

So, it is the web address of your website that people need to type in the browser URL bar to visit your website. In simple words, suppose your website is a house, then the domain name is its address.

A domain name cannot have more than sixty-three characters excluding .com, .net, .org, .edu, etc. The minimum length of a domain is one character excluding the extensions. It is entered in the URL after the protocol and subdomain as shown in the following example and the image:

E.g. https://www.google.com

https: ( Protocol)

www. (Subdomain).

DNS, or the Domain Name System, translates human readable domain names (for example, www.amazon.com) to machine readable IP addresses (for example, 192.0.2.44).

All computers on the Internet, from your smart phone or laptop to the servers that serve content for massive retail websites, find and communicate with one another by using numbers. These numbers are known as IP addresses. When you open a web browser and go to a website, you don't have to remember and enter a long number. Instead, you can enter a domain name like example.com and still end up in the right place.

A DNS service such as Amazon Route 53 is a globally distributed service that translates human readable names like www.example.com into the numeric IP addresses like 192.0.2.1 that computers use to connect to each other. The Internet’s DNS system works much like a phone book by managing the mapping between names and numbers. DNS servers translate requests for names into IP addresses, controlling which server an end user will reach when they type a domain name into their web browser. These requests are called queries.





How to register a domain name

  1. Choose a domain name
  2. Check for domain availability
  3. Choose a domain name registrar
  4. Purchase and register
  5. Renew your domain name

1. Choose a domain name

If you don’t already have a name for your brand, it’s a good idea to merge the domain selection process with the process of coming up with a brand name. Your domain name will be inseparable from your brand, meaning they’ll both be more memorable if they’re alike. We put together an in-depth guide for choosing your domain name if you need some extra help.

If your company already has a name, your first-choice domain is likely YourBrand.com. But if that’s taken, you have a couple options for making sure it’s easy for users to associate your brand with your domain name:

  • Use a suffix. Add a word to the end of your domain name to differentiate it. You could add the name of your primary product (YourBrandShoes.com), your location (YourBrandCanada.com), or something all-encompassing (YourBrandOnline.comYourBrandStore.com).
  • Use a prefix. Add an action-oriented verb at the start of your domain that draws attention to your product (GetYourBrand.comWearYourBrand.comEatYourBrand.com).
  • Use a different domain name extension. A domain name extension, also referred to as a top-level domain (TLD), is the suffix that appears at the end of your domain. The most commonly used domain extension is .com, but there are also region-specific domain extensions (such as .ca.us, or .eu) and a growing number of specialty domain extensions (such as .shop or .store). Keep in mind that specialty domain extensions tend to be more expensive.

2.Check for domain availability

When users enter a URL in their browser, the browser sends a request to a global network of servers that are able to locate your website using something called the domain name system (DNS).


The DNS is a universally recognized, decentralized system for naming websites. This is what allows computers, phones, and any other device that can access the internet to find the webpage a user is looking for.

Checking domain availability takes only a couple of seconds, and nearly every registrar and hosting service has a free domain name search tool that allows you to do this (via a record system called WHOIS or RDAP). Here are a few tools for quickly checking the availability of a domain:

  • Shopify
  • Google Domains
  • GoDaddy
  • IONOS
  • Bluehost
  • Domain.com
  • Namecheap
  • HostGator

Remember, domain names are universal, so if a domain name is unavailable from one provider, it’s unavailable from all of them. What’s great about these tools is they’ll often suggest similar domains that are available if yours isn’t.

Shopify domain name checker: how to register a domain name

If your domain name is unavailable, you might get a message back about brokering the domain. This means the domain name is taken, but the registrar offers a service where they’ll negotiate with the domain owner on your behalf to try and get them to sell it to you.

Although snagging your top domain name choice might sound enticing, it’s important to understand the risks associated with attempting to broker a domain name.

Broker service fees are paid in addition to domain registration fees, even if the current domain owner is unwilling to sell the domain. The process can be time-consuming and delay the launch of your store. And even if the current owner does make an offer, it’s likely to be far more expensive than just purchasing an available domain.

Depending on your situation and how much capital you’re able to deploy, brokering a domain might be the best route to go. But if you’re on a budget, you can always try some variations to keep costs low.


3. Choose a domain name registrar

registrar is a company that reserves and registers domain names on your behalf. When you purchase a domain name, either directly from a registrar or through a web-hosting service, it’s registered to the DNS for you.


Though there are more than a thousand accredited registrars, it’s best to stick with more well-known providers. Using a common provider will make it easier to find info on managing your domain and to troubleshoot issues you might have with syncing your domain to other services.

Domains can be purchased from a number of different types of businesses. You might choose to purchase one from a website-building platform (like Shopify, Squarespace, or WordPress), a web-hosting service (like HostGator or Bluehost), or directly from a domain registrar (like GoDaddy, NameCheap, or Google Domains).

Many registrars offer hosting and vice-a-versa. This can be a great way to keep all your website tasks under one roof, but isn’t necessary. You can purchase a domain one place and use a different company to host, if you so choose.

How much does a domain name cost?

Domain names aren’t sold for a flat rate. Instead, they’re paid for on a recurring basis (usually annually). When considering the costs of your domain, be mindful of the difference between the starting price and the renewal price. Typically, basic .com domain names run in the ballpark of about $11.99 to $20 a year. Premium domains, such as four-letter domains or incredibly common terms, can cost significantly more.

Domain providers often offer discounted rates on domains for the first year or two, especially if the domain is purchased in addition to other services. The starting price is usually lower than the renewal price, so when budgeting for the long term, make sure you factor in the price of renewing your domain down the road.

On top of this, your domain extension can alter the cost of the domain. Specialty domain extensions like .store are usually more expensive than available .com domains.

While the price of domains is important, there are a lot of other factors to consider as well. If you’re looking for the domain provider that’s right for you, here are a couple of questions to ask yourself:

  • How easy will it be to point my domain to my website? The advantage of purchasing a domain from a web-building platform is that set-up tends to be fast and easy, since you’re only dealing with one company directly. Using services from different companies adds additional steps and tends to be more technical or confusing.
  • Will I need domain privacy protection? When you register a domain, your contact info becomes publicly available in the global ICANN registry. Privacy protection is a feature that hides this information. Some providers (like Shopify), provide domain privacy protection for free on all domains, but some providers offer this feature at an additional cost.
  • Which domain extension(s) do I want to use? A domain extension is the part of the domain that comes at the end. All domain providers offer .com domains, but if you’re looking for a region-specific domain extension (such as .ca.eu, or .au), or a speciality domain (.shop.store, etc.), you’ll want to make sure you choose a provider that provides them.
  • Do I need any other services? Domain registrars usually offer additional services, like ecommerce hosting, website building features, and email hosting. Occasionally, domains are offered at what seems like a low rate, but only in addition to the purchase of other services.

To make it easier to decide, here’s a quick breakdown of major domain providers, their starting price points, and cost of WHOIS privacy protection:

Shopify

  • First-year price: Starting at $15
  • Renewal price: $15/year
  • WHOIS privacy protection: Free

Google Domains

  • First-year price: Starting at $7
  • Renewal price: $7 to $10/year
  • WHOIS privacy protection: Free

GoDaddy

  • First-year price: Starting at $20
  • Renewal price: $20/year
  • WHOIS privacy protection: Free

IONOS

  • First-year price: Starting at $1
  • Renewal price: $15/year
  • WHOIS privacy protection: Free

Bluehost

  • First-year price: Starting at $2.99
  • Renewal price: $19.99–$21.99/year
  • WHOIS privacy protection: $15/year

Domain.com

  • First-year price: Starting at $5.99
  • Renewal price:Same as first-year price
  • WHOIS privacy protection: $8.99/year

Namecheap

  • First-year price: Starting at $6
  • Renewal price: Starting at $9.50/year
  • WHOIS privacy protection: Free

HostGator

  • First-year price: Starting at $12.95
  • Renewal price: $18.99/year
  • WHOIS privacy protection: $14.95/year

4. Purchase and register

Once you’ve decided on a registrar and a good domain name, you’re ready to proceed with purchasing your domain. Once you’ve done so, your provider will reserve and register it on your behalf.


5. Renew your domain name

When you purchase a domain, you’re purchasing it for a fixed length of time, usually one year. While some domain providers offer longer terms (GoDaddy, for example, offers up to 10-year terms for .com domains), domain registration is never permanent.

In order to hold on to your registered domain, you’ll want to make sure you renew registration when your term is complete. Nearly all domain providers offer an automatic renewal, so it’s generally a good idea to have this option selected when you purchase.

Keep in mind that if your payment information changes, you’ll need to update your settings with your domain provider so they’re able to charge for automatic renewal.

Most domain providers will notify you when it's time to renew, whether you have automatic renewal enabled or not, but it’s important to renew your domain. If you don’t renew your domain, it will no longer point to your website and may be purchased by someone else. If you don’t want to lose your domain, make sure you renew it.

How do I register a domain name for free?

Domain name registration usually comes with a charge, but there are some companies that offer free domain names with the purchase of other services. These domains typically come with a lot of customization restrictions and limited features.

Free domains from website builders

Website builders typically offer a free domain name when you sign up to their services, however the website domain usually includes their brand name in the URL and, unlike paid domains, they are not transferable to other service providers.

For example, when you start a Shopify store, you’ll be provided a free .myshopify.com domain that can be used as your store’s primary domain. WordPress, Squarespace, Wix, and Weebly offer free domains that contain their own business name as well.

These default domains provide the same basic function as a custom domain, but come with a lot of downsides; they’re harder for users to remember, they look less professional, and they don’t come with features like email forwarding or the option to create subdomains.

You also won’t be able to use these domains outside the platform they’re affiliated with. That means that even if you wanted to use a third-party service provider to add features like email hosting, you wouldn’t be able to.

Generally speaking, it’s a good idea to purchase a custom domain. Domain registration isn’t too expensive, and the charge is worth it for the advantage of being able to customize, transfer, and manage your own domain.

Hosting providers like Bluehost and GoDaddy offer a year of free domain registration with the purchase of their other hosting services. If you’re looking to use one of these hosting services to build your website, then it’s definitely a good idea to take advantage of this option.

That being said, if you’re planning on using a website builder like Shopify, the cost of unneeded hosting services will be more expensive than purchasing a custom domain. On top of this, domain registration is only free for the first year. Renewing the domain in the years following will still come with the same costs.

What is web hosting?

Web hosting is a service that stores your website or web application and makes it easily accessible across different devices such as desktop, mobile, and tablets. Any web application or website is typically made of many files, such as images, videos, text, and code, that you need to store on special computers called servers. The web hosting service provider maintains, configures, and runs physical servers that you can rent for your files. Web site and web application hosting services also provide additional support, such as security, website backup, and website performance, which free up your time so that you can focus on the core functions of your website.

Why is web hosting important?

Hosting your business website on an internal server can be n an internal server can be time-consuming and expensive. Web hosting providers offer the following benefits.

Performance

A web hosting company that manages hardware resources for multiple websites has greater purchasing power. It invests in cutting-edge technology so that you get high-performing web servers with processing power, internal memory, and other computing resources. This improves website performance, and your visitors can load pages quickly.

Reliability

Web hosting service providers take away the stress of ongoing server maintenance. They perform regular system upgrades to maintain high security standards. By doing so, they free up your IT resources so that you can focus on application delivery instead of server management.

Technical support

Most web hosting services offer comprehensive support for troubleshooting performance issues. They also streamline website monitoring and analytics, data backup and recovery, and other similar features that make your website run more smoothly.

Security and compliance

Web hosting services use an end-to-end approach to secure infrastructure, including physical, operational, and software measures that meet all compliance requirements.

What are the features of web hosting?

Most web hosting companies provide different hosting packages and plans. Your monthly web hosting cost can range from free to paid, depending on factors such as the following:

  • Size of your website.
  • Number of daily website visitors.
  • Peak time website or webpage traffic.
  • Web hosting features that you require.

Before selecting a web hosting service, explore the different features that various services provide. The following are the main features generally provided.

Disk space

Your website will require storage space for emails, web files, images, and databases. While you are estimating your storage requirements, also consider future website growth and website traffic. Low disk space impacts user experience, so it is an important factor in the selection of a web hosting service.

Bandwidth and data transfer

In the web hosting industry, the terms bandwidth and data transfer are often used interchangeably. However, they are two different things. Bandwidth is the amount of data that your website can transfer to visitors at one time. Data transfer is the actual amount of data that it transfers.

You can think of bandwidth as a pipe. The bigger the pipe, the more the water can pass through it. However, for various reasons, you might not use the total capacity of the pipe. Data transfer is like the actual amount of water that goes through the pipe in a given time period.

Email accounts

Many web hosting plans include an email account. You can link your email address to your website name. For example, if your website name is example.com, your email address will be yourname@example.com. The following are the main types of email accounts.

POP3

POP3 accounts give you server space to store your emails, which you can access directly or by using your email client program.

Forwarding mail

Forwarding mail accounts redirect emails to another email address. This account could be a personal email account with an email service provider or a third-party account that manages your website emails for you.

Aliases

Some web hosts have emails plans that you can use to create several aliases or email account names without creating a full POP3 account. For example, you might want to display sales@, support@, and orders@ addresses on different pages of you website. Instead of having multiple POP3 accounts that need to be checked and administered, you could redirect everything to a single inbox.

FTP access

FTP refers to website file transfer and sharing. Many websites have documents, such as PDF files or image files, that they want internet users to download. The web hosting company uses FTP access to provide this service.

What is the difference between web hosting and a domain name?

Web hosting gives your website or web application a server or a machine on the internet. But a domain name gives your applications an address so that your users can find you.

Domain name

On the internet, every machine has a unique number, called an IP address. Users use this IP address to find the machine and the website or resources on that machine. IP addresses can be hard to remember. That is why domain name registries use a Domain Name System (DNS) to map IP addresses to easy-to-remember website names. These registries map the website names, which are called domain names, to the web hosting servers’ IP addresses.

To visit any website, you enter its domain name into the browser. For example, the domain name for the AWS website is aws.amazon.com.

Domain name registration

To make your site accessible on the World Wide Web, you require both a web hosting service account and a registered domain name. You can choose the name, but you need to pay a small fee to register it with the domain name registry. You can then link your web hosting account to your registered domain name as your official website address.

How does web hosting work?

When you create an account with your web hosting provider, your provider allocates some space for your website or web application on its server. You can access and manage this space from your hosting account dashboard. You will also get access to other resources, such as random access memory (RAM), central processing unit (CPU), and bandwidth. The percentage of server resources you receive depends on the type of web hosting service you select.

Choosing a web hosting plan is similar to renting an office space. The least expensive option is to lease a coworking space. As your company grows, you can expand to leasing an entire office or even an entire building. Similarly, you can start with free web hosting on a server that you share with several other websites or web applications. Eventually, you might want to upgrade to more exclusive web server access or even rent the entire server!

What are the types of web hosting services?

Abstract Window Toolkit (AWT) is a GUI that you can use to create UI objects such as buttons, windows, and scroll bars.

Shared hosting

Shared hosting service providers give you shared access to their web server. You get access to your directory or folder for website files, but you share server resources, including disk space, CPU power, and RAM. Shared hosting providers can have hundreds of websites or web applications using the same server. However, other websites will not see your internal data because no user gets access to the main or root directory.

Shared hosting is suitable for these kinds of cases: 

  • New businesses or small businesses
  • Personal websites and blogs
  • Sole traders and owner-operator webpages

Benefits of shared hosting

A shared hosting plan provides several web hosting benefits:

  • Low monthly fees.
  • Built-in features such as site builder and database software.
  • Ease of setup and start.
  • Ability to host multiple websites on a single account.

Limitations of shared hosting

The following are some of the limitations of shared web hosting services:

  • If another website on your server experiences a traffic spike, it will affect your website’s performance.
  • You have less control of the server configuration, which limits your website features as well. For example, you cannot install third-party software, such as an accounts system, to integrate with your website.
  • Costs may increase substantially as users and traffic growth increases.

VPS hosting

Virtual private server (VPS) hosting providers use a virtual private server to give you more exclusive access to server resources. VPS hosting technology partitions the physical server to create small virtual servers that you can lease. With virtual private servers, you have exclusive access to both space and computing resources, such as memory and processing power, on the physical server. You can install an operating system on your virtual server and have greater control of your server environment.

VPS hosting is suitable for these cases:

  • Medium-sized businesses with increasing traffic.
  • Complex websites that require installation of other business software on the server.

Benefits of VPS hosting

VPS hosting provides several benefits:

  • Complete control over your virtual server configuration.
  • Ease of scaling and customization.
  • Greater control of website performance.

Limitations of VPS hosting

VPS hosting typically requires you to have some in-house technical expertise and server configuration knowledge. You can choose a managed hosting service that takes care of ongoing server maintenance to overcome this limitation.

Dedicated hosting

Dedicated hosting providers give you access to the complete physical server. You have exclusive access to a dedicated server for only your website. You can optimize and control the environment as it suits your requirements. You can partition this server yourself to host multiple domains on the same physical server.

A dedicated hosting plan is suitable for these cases:

  • Large enterprises and businesses.
  • Business owners with multiple domains.
  • Complex web applications that require large amounts of processing power.

Benefits of dedicated hosting

Dedicated servers for web hosting provide several benefits:

  • Greater reliability and security
  • Greater server optimization capabilities
  • Full customization of server configuration

Limitations of dedicated hosting

A dedicated server is expensive to lease and maintain. You must also have in-house technical capabilities. Therefore, organizations that have scaled up sufficiently usually find that dedicated hosting is a better fit.

Java plugin

Java plugin establishes a connection between popular browsers and the Java platform so that you can run your website applets within a desktop browser.

Cloud hosting

Cloud hosting providers use resource sharing and scale to drive down web hosting costs and improve website performance. You get shared access to a cluster of servers, and the cloud hosting provider automatically replicates your website files across several servers. If one of the cloud servers is busy, the hosting provider automatically routes your traffic to another server. This greatly improves website performance without adding to your ongoing costs. 

You can choose from shared hosting, VPS hosting, or dedicated cloud hosting plans. What differentiates them is the underlying physical server management. 

Because you have several options in cloud hosting, it is suitable for all types of businesses, including the following:

  • Small and medium businesses.
  • Ecommerce and complex web applications.
  • Government and nongovernmental organizations.
  • Large enterprises with several domains.

Benefits of cloud hosting

Cloud hosting provides several benefits as a web hosting option:

  • Greater availability and reliability for your website users.
  • Automatically scales up or down as your requirements change.
  • Increased security that meets the highest compliance standards.
  • Automatic data backup and redundancy.
  • High flexibility—you pay for only what you use.

What are the requirements of modern web hosting?

Today's web and mobile apps are expected to be available from anywhere in the world. Customers are looking to modernize their web applications to do the following:

  • Create feature-rich applications that deliver compelling user experiences for all types of use cases, such as static web or server-side-rendered applications, a mobile app landing page, or a progressive application.
  • Deliver the lowest possible latency to end users globally.
  • Scale to meet peak workloads and spikes in traffic.
  • Deliver applications that work on hundreds of different desktop browsers and mobile devices.
  • Continually monitor applications to identify problems before they impact customer experience.
  • Increase agility, innovate faster, and get to market faster.
  • Avoid managing physical servers.
  • Lower total cost of ownership (TCO).
  • Build secure applications.

Change Your DNS Address

After you have purchased your web hosting, you will get Name Servers (also known as Domain Name Servers or DNS) – which is the Internet’s equivalent of a phone book that contains IP Addresses3.
To get your website up and working, you will need to change the Name Servers of your domain. It’s a simple but mandatory step for you to get started.

  1. Go to your Domain Control Panel via http://manage.hostgator.in/customer.
  2. Enter your registered email address and password.
  3. Click on the Domain Name for which you need to change the Name Servers.
  4. In the Domain Registration section, click on the Name Servers option.
  5. Replace the existing Name Servers with the ones provided by your current web host, and click on the Update Name Servers button.

If you have registered your domain name with a third party provider, you will need to log in to their Control Panel, update the Name Servers of the domain to those provided by HostGator. However, if your domain is already using the Name Servers of the third party provider, you can add an A Record for the domain pointing to HostGator’s Server IP in the third Party DNS Zone.
After you have changed your DNS, it will take about 24-48 hours for your website to start resolving to HostGator India’s servers.

Step 5: Upload Your Website

You can now upload your website to your account by connecting to the server using either cPanel’s File Manager or FTP Client (such as FileZilla) – after which your website will go live.

    • How to Upload Your Website Using cPanel File Manager
      1. Log in to your cPanel.
      2. Click on the icon titled File Manager.
      3. Select Web Root and click on Go.
      4. Add all the files and folders under public_html and their respective domain folder.
    • How to Upload Your Website Using FTP Client

You can connect to FTP via an FTP program such as FileZilla Client. It allows you to see the files and folders on our server like you’d see them on your computer. You can use it to drag and drop your website’s files into the /public_html/ folder.
To connect to your web server via FileZilla, follow these steps:

      1. Install FileZilla and open it
      2. From the File menu, select Site Manager
      3. Click on New Site
      4. Name the New Site – such as with your real domain name
      5. Enter your website’s IP address in the field marked FTP Address
      6. Enter the username and password you received in your welcome mail
      7. Set the Port to 21 (FTP always runs on Port 21)
      8. Click Connect

Once your FTP is connected, you will see the files and folders of your:

        • Local computer on the left
        • Web hosting service on the right

To upload files to your hosting service provider via FileZilla, follow these steps:

    1. From the left-hand side of FileZilla, select the file(s) and folder(s) you want to upload.
    2. Drag and drop the file(s) and folder(s) to the directory location on the right side of your web hosting service. FileZilla will now start uploading.
    3. After the uploading is finished, FileZilla log will confirm success and your uploads will be visible on the right-hand side.

Viola! Your website is now live.

Working with files on the FTP server

After you log in to the server, you can upload a file to or download a file from the authorized directory by following these steps:

  1. Use the dir or ls command to display the directory and location of the file on the FTP server.

  2. Delete unused files to get more free storage space.

  3. Set the file transfer mode to ASCII for text files or to binary for non-text files.

  4. Use the lcd command to change the local working directory of the FTP client. You can upload the file or save the downloaded file in this directory.

  5. Upload or download the file.


Comments

Popular posts from this blog

.Net Full notes in one shot for bca