WEBSITE DEVELOPMENT USING HTML AND CSS

-

What is website ?

A website is a collection of publicly accessible, interlinked web pages that share a single domain name. Websites, can be created and maintained by an individual, group, business or organisation to serve a variety of purpose.

Websites come ina nearly endless variety, including educational sites, news sites, forums, social media sites, e-commerce sites, and so on. 

The page within a website are usually a mix of text and other media. That said, there are no rules dictating the form of  a website.

Examples of website are:

Bing.com  wikipedia.org,   google.com, amazon.com  etc.

Languages used for website development ;

The most common programming languages used to develop website are :

Note:- Some of these can be used as an extension of the existing languages but some can be used entirely separate from the other languages to create a dynamic or static website.

Types of websites: Static website and Dynamic website 

Static website:

A static website (sometimes called a flot or stationary page) is displayed in a web browser exactly as it is stored. It contains web pages with fixed content codes in HTML and stored on a web server. It does not change, it says the same, or "static" for every viewer  of the site.

A static website does not require web programming or database design. Static is the most basic form of website and are the most simple to create and are prefect for small scales sites. Maintaining a large number of static pages can become a require a website with hundreds of pages and a ton of content, a dynamic website may be for you.

Advantages of static website;

  • Simplicity: They are easier and faster to develop, making them sutable for simple sites like portfolios.
  • Quick and easy to develop 
  • Cheap to host and develop because static sites require fewer resources.
  • Security: They are more secure to use because there is no server-side scripting, reducing the risk of attacks.

Disadvantages of static website;

  • Content can become stagnant 
  • Requires web development expertise to update .
  • It has limited functionality they can't support dynamic features like, user logins or personality.

Dynamic website;

A dynamic website is one that changes or customizes itself frequently and automatically. Server side dynamic pages are generated "on the fly" by computer code that produces the HTML (CSS are responsible for appearances and thus, are static files). 

A site can display the current state of a dialogue between users, monitor a changing situation, or provide information in some way personalized to the requirements of the individual user.

Few examples of dynamic websites are News channel sites, a retail website with lots of products allows a user to input a search request, e.g. for the keyword Beatles.

Advantages of dynamic website;

  • Dynamic website enhanced user experience. They provide personalized content and interactive features like, comments, user accounts etc.

  • It's content can be updated instantly, making easy to display timely information.

  • It improved SEO:- Frequently updated content can lead to better search engine rankings.

Disadvantages of dynamic websites;

  • They are more expensive to build due to their complexity.

  • It increased maintenance, they require ongoing maintenance.

  • It require more powerful hosting.

What is an HTML File ?

The documents themselves are plain text files with special "tags" or codes that a web browser uses to interpret and display information on your computer screen.
  • HTML stands for Hyper Text Markup Language.
  • HTML is the Standard Markup Language for creating web pages.
  • An HTML file must have an HTML file extension.
  • The markup tags tell the Web browser how to display the page.
  • HTML elements tell the browser how to display the content such as "heading", "paragraph", "table", and so on.
Example:

Open your text editor and type the following text:

<html>
<head>
<title>My First Webpage</title>
</head>
<body>
This is my first homepage.
</body>
</html>

The HTML tags;

  • The first tag in your html document is <html>. This tag tells your browser that this is the start of an HTML document.
  • The last tag in your document is </html>. This tag tells your browser that this is the end of the html document.
  • The text between the <head> tag and the </head> tag is header information.
Note: Header information is not displayed in the browser window.

The text between the<title> tags is the title of your document.

The <title> tag is used to uniquely identify each document and is also displayed in the title bar of the browser window.

The text between the <body> tags is the text that will be  displayed in your browser.

The HTML headings;

<h1>This is a heading</h1>

<h2>This is a heading </h2>

<h3>This is a heading </h3>

<h4>This is a heading </h4>

<h5>This is a heading </h5>

<h6>This is a heading </h6>

Comments

Post a Comment

Popular posts from this blog

Introduction to CSS ✍️

-
Image
  Basics About CSS ✍️ Cascading style sheets (CSS) describe how documents are presented on screens, in print, or perhaps how they are pronounced. Cascading style sheets (CSS) provide easy and effective alternatives to specify various attributes for the HTML tags . Using CSS, you can specify s number of style properties for a given HTML element . Each property has a name and a value, separated by a colon (:).  Each property declaration is separated by a semi-colon (;). Advantages of CSS : CSS saves time - You can write CSS once and then reuse same sheet in multiple HTML pages. You can define a style for each HTML element and apply it to as many web pages as you want. Superior styles to HTML - CSS has a much wider array of attributes than HTML so you can give far better look to your HTML page in comparison of HTML attributes. SEO Benefits - Faster loading times and mobile-friendliness, both facilitated by CSS, are important factors for search engine rankings , which can hel...
Read more

Advanced properties of CSS

-
Image
  In this article you will see how you can display your content better on your website with the help of using Css's properties like, text-shadow and box-shadow. #Whenever you want to apply Text-Shadow on your website in html with using CSS values .  Firstly ,  you should know that t ext -shadow accept four values like ; text-shadow:h-shadow v-shadow blur- radius  color ; h-shadow :- It is  horizontal offset of the shadows , in this positive values move the shadow to the right and the negative values move the shadow to the left. v-shadow :- It is vertical offset of the shadows , in this positive values move the shadow down and the nagative values move the shadow up. blur-radius :- The blur radius works optionally in the text-shadow . A large value makes the shadow more dispersed. Color :- This provides colour to the text-shadow. Example :- Here is how you would use the CSS text -shadow property in a HTML file to add a simple shadow to an <h1> element :...
Read more