Creating an HTML page in Notepad: explanations for dummies. An example of creating an html page in notepad Download an html web page in notepad


Hello everyone!

Once we start studying, we need to know the basics of HTML and CSS, which will help make our sites better and more attractive to search engines. All this week I will tell you about working with the website code and this is what awaits you:

  • . We will learn how to edit website code using these editors;
  • . We will help the search robot understand the structure of the page;
  • . We will find out how correctly the site code is compiled and find errors;

As you can see, we will have a lot of work this week, so subscribe to Context-UP blog updates and receive all the lessons in your email if you have not already subscribed.

HTML Basics

HTML (Hyper Text Markup Language) is a markup language for documents on the Internet. That is, any page of your website is a document, and the browser is a means of viewing such documents.

The purpose of HTML is to show the browser where this or that document element is located. Using this language, elements are marked on the page and occupy a certain place, which are then displayed on the monitor of the site visitor.

The markup language consists of special tags that help the browser determine:

  • Document structure;
  • The location of a particular element;
  • Purpose of the element;
  • Included third-party files;
  • And much, much more.

Search robots also understand this, so you need to pay special attention to how well the document is compiled from an SEO point of view and what structure it has.

HTML structure

Any HTML document has an initial structure that must be strictly followed. She looks like this:

Page title Page content

Optional tag attributes :

To keep the picture centered, you can use the tag ……./

2. Practical task No. 3

Inserting and formatting graphics. Independent creation of Web pages for drama theaters.

Lesson #4

Communication with other documents is organized by tags....

hyperlink text .

< IMG SRC =’имя графического файла’>

2. Practical task No. 4

Design of a list of theaters on the main page glavn.htm, as hyperlinks to the corresponding Web pages of theaters.

Lesson #5

1. Tables

They are used not only for arranging data in cells, but for the purpose of positioning fragments of text and images relative to each other.

Using tables it is convenient to create site navigation.

An example of a table with two rows (rows) containing two cells:

Table cells can contain text or images, as well as text with HTML tags and hyperlinks. You should not leave table cells blank; you must place at least a non-breaking space

Basic tag attributes

And
set table, row or cell parameters:

ALIGN=left, right, center – alignment (

, ,
)

BGCOLOR=’color’ – background color (

, ,
)

HSPACE=value – free space to the left and right of the table in pixels (

)

VSPACE=value - free space above and below the table in pixels (

)

WIDTH=value – table (cell) width – in pixels, or as a percentage (

,
)

HEIGHT = value – table height (cell, row) – in pixels, or as a percentage (

, )

BORDER= value – thickness of the border around the table and its cells, default value=1, if value=0, then there is no border (

,
, ,
)

BORDECOLOR=’color’ – border color ()

VALIGH=bottom, middle, top – align content vertically (

)

2. Practical task No. 5

Creating site navigation in the form of a one-row table

Lessons No. 6 and No. 7

1. Header section, meta tags

The header section on each page specifies information about the document that is used to display it. The text enclosed between ... tags appears in the title bar of the browser window.

The header section usually contains a number of tags with various attributes that provide additional information (metainformation) about the Web site:

Drama theaters of St. Petersburg

- - (indicates the type of code table (windows-1251, Koi8-R and others) used in preparing the text part of the document.

- information about


2024 gtavrl.ru.