Web Design and Publishing

Web Design and Publishing

1. Web Design Programming

   • 1. HTML is a language for creating Web pages. HTML stands for HyperTextMarkupLanguage.It is not a programming language, it is a markup language
   • 2. PHP is stands for HypertextPreprocessor (PHP) are a type of programming language whose main job is to allow the web developers to make a dynamic and vibrant content that reacts with the available databases
   • 3. CSS is stands for Cascading Style Sheets. These sheets refer to the presentation of HTML elements as a distinct file known as CSS file with an .css extension
   • 4. Bootstrap – Itis a “powerful mobile first front-end framework for faster and easier web development.
   • 5. JavaScript- JavaScript is a lightweight, deciphered programming dialect with object-oriented capacities that enables you to incorporate intelligence with generally static HTML pages.

2. Introduction to HTML

   • HTML is a unique language. It is a simple and text - based language. It is used for creating web page. HTML document is created in a simple Text Editor (as a notepad) A Website is a collection of webpages.
     • TYPES OF HTML TAGS
       • 1. Container Tag : It is used twice in a document. Text is written in between the two tags. These are also called pair tag or companion tag.
       • 2. Empty Tag: Empty tag is a single tag. It is also named as singular tag. It does nothave any companion tag.
     • STRUCTURE OF HTML TAGS
       • The general structure of HTML document has two sections: Head section and Body section.
         • 1. Head: The Head section contains the Title that identifies the first part of your HTML coded document.
         • 2. Body: The body section is where you do most of the works that includes text, graphics, and other HTML elements that provide control and formatting of a page like: fonts, paragraph, list and other elements
     • STEPS OF CREATE WEBPAGE
       • The general structure of HTML document has two sections: Head section and Body section.
         • 1. Head Tag: Head tag provides Header information. The document title is written in Head Tag. It always occurs in pair
         • 2. Title Tag: The title of the web page is written with the help of title tag. Title starts with <TITLE> tag and ends with </TITLE> tag.
         • 3. Body Tag: It is a container tag. It is used to represent the body of document. The whole text matter of the page is written between <BODY> and </BODY> tags.
         • 4. Heading Tag: The heading tag is used to fix the heading. These are 6 levels of heading in all.
         • 5. Paragraph Tag: Paragraph is the basic composition of HTML, Paragraph is started with <P> tag and closes with </P> tag. The tags <P> leave a space equivalent to one line between previous line and the following line.
         • 6. Line Break The line Break tag is used to start the text from the new line. This tag does not leave a blank line space as the paragraph tag does.
     • FONT TAGS OF HTML
       • Font is pre-defined style and size of the text. Font has three main properties. First style second - size and third colour
     • IMAGE TAGS
       • In HTML, images tags are defined with the <img>tag. The img tag is empty, which means that it contains attributes only and it has no closing tag. To display an image on a page, you need to use the src attribute

3. LIST & TABLE TAGS

   • HTML Unordered Lists
     • An unordered list is a collection of related items that have no special order or sequence. This list is created by using HTML <ul> tag. Each item in the list is marked with a bullet.
   • HTML Ordered Lists
     • If you are required to put your items in a numbered list instead of bulleted list then HTML ordered list will be used
   • HTML Definition Lists
     • HTML and XHTML support a list style which is called definition lists where entries are listed like in a dictionary or encyclopedia.

4. LINK TAGS

   • Linking Documents
     • A link is specified using HTML tag <a>. This tag is called anchor tag and anything between the opening <a> tag and the closing </a> tag becomes part of the link and a user can click that part to reach to the linked document. Following is the simple syntax to use <a> tag.
   • Linking to a Page Section
     • You can create a link to a particular section of a given webpage by using name attribute
   • Linking to email address
     • You can link with an e-mail address by using an Anchor Tag with this a user can send e-mail to you by clicking on the link.
   • Linking to Image
     • With this you can link the other document through an image (diagram). In this case image file name and its proper format is written.

5. MULTIMEDIA TAGS

   • You can open any external image in your webpage. Similarly external sound and movie (film) etc. can also be viewed. Anchor tag is used for viewing image or movie.

6. Web Site Development & Publishing

   • Website is a place on web and is hosted on a web server. It is a set of related web pages. It is accessed using Internet address known as Uniform Resource Locator (URL).
     • 1. Static Websites
       • Static websites are also known as flat or stationary websites. They are loaded on the client’s browser as exactly they are stored on the web server.
     • 2. Dynamic Websites
       • Dynamic websites shows different information at different point of time. It is possible to change a portion of a web page without loading the entire web page.

7. Website Designing

   • Web designing is linked directly to the visual part of a web site. Active web design is essential to convey thoughts adequately. Web designing is subset of web development

8. Wireframe

   • Wireframe refers to a visual guide to entrance of web pages. It helps to define structure of web site, linking between web pages and layout of visual elements.

9. Web development tools

   • A web development tool helps the developer to test and debug the web sites. Now a day the web development tool comes with the web browsers as add-ons.
     • 1. WEB PAGE ASSESTS, RESOURCES, AND NETWORK INFORMATION
       • Web development tools likewise help to review the resources that are stacked and accessible on the web page.
     • 2. HTML AND DOM
       • HTML and DOM viewer enables you to comprehend the DOM as it was rendered. It additionally enables rolling out improvements to HTML and DOM and seeing the progressions reflected in the page after the change is made.
     • 3. PROFIING AND AUDITING
       • Profiling alludes to get data about the execution of a web page or web application and Auditing gives developers proposals, subsequent to investigating a page, for enhancements to diminish page load time and enhancing responsiveness.

10. Website URL Registration

    • A domain name is the part of your Internet address that comes after "www". For example, in www.google.com the domain name is google.com