Go to another page. Redirecting to another page using JavaScript

will look like in the browser:

Element a (ancor) is like an anchor, i.e. text enclosed between the opening and closing tag will be the link text.
The href attribute is short for "hypertext reference" and specifies the location to which the link is navigated - usually an internet address and/or file name.

Making an html link between pages of the same website is much easier. For example, if we have two pages (for example page1.htm and page2.htm) located in the same folder, then the code for the link from page1 to page2 will look like this:

Those. we just need to write the name of the page we want to go to.

If page page 2 is located in the "subfolder" subfolder, the link code looks like this:

To go to page2 click here!

To go to page1 click here!

Those. the combination "../" indicates, as it were, a folder located one level higher from the given position of the file from which the link is made.

Section 1

Section1:

You can now link to the marked area(in in this case Section1) by simply indicating her name after the #.

I'll give you more clear example:

Table of contents

Section 1: How to become rich



Section 3: How to be healthy
Section 1: How to become rich

In order to become rich you need to work a lot.....

Here is the result in the browser:

In order to become rich you need to work a lot.....

In order to become happy, you need to use every minute...

In order to be healthy you need to do a lot of physical exercise...

Of course you can..

Write a letter to the site administrator

In the browser it will look like:

As you can see, mailto is used followed by a colon and the recipient's email. Clicking on the link will launch mail client with the recipient's name field filled in.

A couple of additional attributes:

TARGET - indicates where to open the page to which the html link leads. By default, it opens in the same window. If you want it to open in a new one, you should write target ="_blank" .

See example:

This is a link to the site website, will open in a new window




This one is also on the site. When hovered, a title will appear.

Look at the result:

Well, that's basically all. You don't have to get too hung up on it, Adobe program Dreamweaver any link is made with one click of the mouse. The main thing for you is to understand what’s what, and you don’t have to memorize it...

Is it possible to change the color of links?

Of course you can. To change the color of links throughout the document, there are special attributes of the BODY element.

LINK - the color of just links.

ALINK (Active Link) - color active links(active means when you click on it)

VLINK (Visited Link) - color of already visited links

All colors are specified either by an RGB value in hexadecimal or by one of 16 basic colors.

For example, if when opening the body of a document, write to the body element:

Black link

Instructions

There are several ways to register a link on a website. If you are using an engine, log in as an administrator to the materials menu. Next select desired page or create a new one. Write a text that, when clicked, will lead to a transition. Select it and select the Add Link icon from the toolbar. A form will open in front of you to fill out. Specify all the necessary parameters provided by cms, set the address and click “Ok”. Save the changes and refresh the page in the browser window - the link should appear. Check its functionality and make changes if necessary.

If you need to create a link that will be displayed on all pages of the site, then go to the templates section. Select the “Edit html” command, a page with the code will open in front of you. Before changing anything here, be on the safe side - copy the information to safe place so that in case of accidental deletion of data, the original material can be returned.

Find required block and enter a link in it in the Text format from which the transition will be made. If necessary, replace the text with graphic file, apply the following link: . Save the changes and see the result.

To create a transition to a specific part of a web page, first place anchors in in the right places site, give them names. It's better to ask serial numbers– spend less time writing links. If you use cms, select part of the text, click “Add link” and fill in the “Anchor” field. In html document format it will look like Text/Image

On simple web pages, the transition to another page is also written in the code using tags And.

Organize a permanent automatic transition all visitors to one specific page to another site you can either use the server and server programming languages, or with using HTML and JavaScript. The advantages of the second option are simplicity and accessibility - its implementation does not require programming knowledge; the only mandatory requirements are access to editing source code pages.

Instructions

You can solve the problem of automatically redirecting visitors to another site only using HTML (HyperText Markup language). It has a (meta tag) that tells the browser that after loading current page you should start downloading another one. This meta tag contains information (tag attributes) about the redirection address and the time after which the website should be sent to the page. For example, it may look like this: Here Refresh is code word, which starts the redirection mechanism. The number 5 indicates that the process should begin after loading this page. This time may be necessary so that the visitor, for example, has time to send a message that you will place on this page. If such a pause is not needed, set it to zero. And URL=http://www.site contains the address to which the browser should send the visitor. This meta tag should be placed in the header part of the page source code - between and .

Another way is implemented using the language JavaScript programming. You only need one line of code to get your web surfer to required address. It may look, for example, like this: window.location.reload("http://www..location.replace("http://www..location.href="/";Here you only need to replace the address of the topics which you should place this command inside tags that tell the browser that it is written in JavaScript:
document.location.replace("http://www.site");
And these three lines, in turn, should be placed inside the same header area (between and ).

After you select one of these options, open the desired page, for example, in the page editor of the site management system. Switch to HTML editing mode and find the tag in it. Copy the prepared redirect code (JavaScript or HTML) and paste it before this tag. Then save the modified page.

If the text material does not fit into the required area of ​​the page, knowing how to make the text smaller will help you out. This command included in any text program, as well as well-known graphic and photo editors, Excel tables and programs for creating multimedia projects. The text can be reduced using either the convenient quick panel, and using the keyboard keys.

Instructions

Open famous program, working with . This could be a standard Notepad, the no less famous Word Pad, everyone’s favorite Microsoft Office Word, as well as a program for creating periodicals Microsoft Publisher and others. Highlight desired area text that you plan to reduce. In all of the above text editors At the top of the working window there is a special text formatting panel. It contains service buttons that change the font format, its style, size, color and position on the document page. Set the text to the required size - by simply selecting the appropriate digital value. For example, reduce the font size from position "14" to position "12".

You can set the font size manually if you do not find a suitable value in the list of sizes. If the formatting bar is not displayed, you should enable it. To do this, use the “View” tab, which is located in top line menu. Click "View" and turn on "Format" in the "Toolbars" section. You can use the keyboard to reduce the font. Select the desired area of ​​text. Press combination Ctrl keys+[. After this, the font size and the entire text as a whole will decrease by exactly 1 point.

If you work in abword or, it would be good to use special service“Paragraph”, so the text there can be smaller by reducing line spacing. Open the “Format” menu, “Paragraph” section. A new service window will open. Next, go to the “Indents and Spacing” tab. In the lower “Spacing” field, enter the desired line spacing value. Click Ok to save the settings. In graphic and photo editors The text size is most often changed with the mouse. After inserting the inscription into the work area or onto the image itself, select it with the mouse. Then grab the edge of the dotted line with your mouse that will encircle the text. Pull the edge towards the center of the text to make the text smaller.

Video on the topic

Sources:

• Reduce text font on keyboard in 2019

Currently available on the Internet huge amount sites containing often tens and hundreds of millions of pages. Many webmasters create new resources every day. Some of these masters are professionals. Some of them are just taking their first steps in the field of web development, puzzling over the simplest questions. But often the path to success begins with questions, similar to that how to create new page on the website.

You will need

• - browser;
• - Internet connection;
• - possibly a text editor;
• - possibly credentials for access to administrative panel CMS.

Instructions

Prepare all the content that will be placed on the new site page. Create informational content. Write the text with all headings, subheadings, footnotes and notes. Prepare table data in a convenient format.
Tackle presentation content. If there are graphic images, which will illustrate the information contained in the pages, bring them to the resolution in which they will be present. Use for this graphic editors, allowing you to scale images with interpolation, for example, GIMP. If it is embedded into the page, process it in a video editor.

Consider the structure of the page. Decide how the text content will be placed on it, where the pictures, tables, and diagrams will be located. Define alignment and text wrapping options for each embedded object.

Post presentation content future page. Post images. Upload them to one of the photo hosting sites that allow hotlinking. The images can be uploaded using an FTP client. If the site operates under CMS management and it provides file upload functionality, it may be more convenient to use it. Upload the video to the server (if you have your own flash player) or, for example, YouTube or RuTube. Get and save direct links to every element of presentation content.

Layout the page. Create text file, place the contents of the future page into it. Complete the text with markup. The type of markup, and therefore the actions associated with layout, depend on the type of site. The site will need to generate full HTML markup (the HTML specification can be found at w3c.org). For sites running a CMS, the markup depends on the type of system. Typically, separate sections of help for working with a CMS are devoted to formatting information, available on developer websites, in the administrative panel, and in the software distribution.

Create a new page on the site. If the site is static, rename the file created in the previous step to htm or html. Upload it to the server in the desired folder. Make changes to other files to link to the new page.
If the site is managed by a CMS, log into its administrative panel and go to the create a new document section. Select the document type, if necessary, and its position in the virtual structure of the site. Copy the prepared content into the text field provided for it. Save the document.

Video on the topic

Sometimes there is a need to automatically redirect a site visitor from one page to another in “ automatic mode" That is, I just logged in and immediately, without asking questions or clicking anything, please go to another page. For example, the site has moved, but visitors still go to the old address. Of course, superpros do this kind of redirect at the file level additional configuration web server (htaccess) or server scripts. But a growing number of Internet residents are acquiring their own websites and managing them perfectly without the help of a super official. Fortunately, the principle “everyone has a website” is implemented online without any national projects or mortgages. So how can a non-professional implement automatic redirection of a visitor to a given link?

Instructions

There are two most simple options redirects that do not require anything other than the ability to make appropriate changes to the desired page. The first solves using HTML (HyperText Markup Language- "hypertext markup language"). This is the language in which - . This contains the tag we need - which tells the browser to which address and how many seconds it needs to send the page visitor. It looks like this:
Here the number “10” indicates how many seconds you need to wait - for example, in order to have time to read the message that the site has moved. And the address gives browser URL where to send the visitor. This tag should be inserted in the "page header" - the area of ​​html code that starts with the tag and ends with the tag.

The second redirect method uses the capabilities of the JavaScript language. To use it, you need to enter the appropriate . First you need to tell the browser that the JavaScript script starts at this point. In JavaScript, this opening tag looks like this:
And the closing one is like this:
Between these two tags are instructions - language operators. The redirection effect we need can be achieved by several of them:
window.location.reload("http://www.site/");
or
document.location.replace("http://www.site/");
or
document.location.href="/";
Full script code in

All users who are in one way or another connected with sites, their creation or editing, encounter the creation of links to various materials. And probably each of them knows how and using which html tag to make a link to any material on the Internet.

However, not everyone knows how to link to a certain part of the page. This can be very useful if you are writing large articles. At the beginning of the post, you can make a table of contents, from each line of which you can then make a link to a part of the text both on the same page and on any other.

To understand what we mean, look at the design of our recent instructions about. At the top of the page there is just such a menu, in which links are made to a specific place on the page.

The first step is to assign a so-called “anchor” to the part of the page to which the user should be redirected when clicking on the link. To do this, insert the following code before the text in this part of the page

Page text...

where instead of "anchor" insert any word that preferably matches the meaning of the paragraph you are referring to.

The second thing you need to do is link to the “anchor” set in the first paragraph in that place on the page from where you think the user might want to go to the part of the text you are linking to. For example, this could be a table of contents at the beginning of an article. The anchor link looks like this

where “anchor” replace with the word you chose in the first paragraph of the article.

In the same way that we discussed above, you can link not only to part of the text on the same page, but also to a specific place on any other page. The main thing is that you have the opportunity to place an “anchor” there. This is done as follows:

As in the previous paragraph, assign an “anchor” to the desired part of the page that the user should go to when clicking on the link, it still looks the same:

Page text...

where instead of "anchor" you should insert any word you want.

As in the previous case, you just need to put a link to the “anchor” you created earlier. The only difference is that when linking to part of another page you need to add its URL to the code, which as a result will look like this

Link text

where instead of “page address” you need to substitute, respectively, Page URL, which you are linking to, and instead of "anchor" the text you selected when creating the "anchor".

A hyperlink can link pages within one site or point to any page on the Internet. When building links to other people's pages, you should always use the absolute address of the page (http://www.site.com/page.html). If you are creating a link to a page within the site, then it is preferable to use relative URL(page.html, catalog/page.html). When creating a graphical hyperlink, remember that graphics may not be accessible to some users, so be sure to include appropriate text elements.

Example:

Sometimes it is necessary to create a hyperlink within one page. For example, on this page there are hyperlinks at the beginning of the lesson, allowing you to go to view a specific question, and at the very bottom of the page, allowing you to go to the top of the page.

Example:

Example:

Using the TARGET attribute, you can load the page in a new browser window. This attribute is intended to specify the name of the window. The window name is used for official purposes. To open a page in a new window, you need to use the _blank constant.

Example:

The attributes LINK, ALINK, VLINK specify the font color of hyperlinks.

The LINK attribute is used to highlight hyperlinks that have not yet been visited by the user.

Some browsers may support the ability to navigate hyperlinks using the Tab key. In this case, the browser by default highlights hyperlinks in the order they appear in the page text. You can change the transition order using the TABINDEX tag attribute . To include a hyperlink in the list describing the new navigation order, you must assign the TABINDEX attribute some positive integer number in the range from 1 to 32767. To exclude a hyperlink from the list, you must assign the attribute any negative number. When the user presses the TAB key, the cursor moves to the hyperlink with the smallest positive index value. If multiple hyperlinks are given the same index value, the first one selected is the one that appears higher in the page text.

This refers to the URL HTML links, which defines a path relative to the root of the domain.

For example, if we want to link to the URL https://www.quackit.com/html/tutorial/ and the current location is https://www.quackit.com/html/ , we would use the following link:

HTML Tutorial

The forward slash means the root of the domain. No matter where your file is located, you can always use this method to determine the path, even if you don't know what the domain name will be (as long as you know full path from the root).

You can also determine whether the URL will open in a new window or in the current one. This can be done using the target attribute. For example, target = "_blank" opens the URL in a new window.

The target attribute can take the following values:

Blank: Opens the link in a new HTML window. _self: Loads the URL in the current window. _parent: Loads the URL into the parent frame (still in the current browser window). Applicable only when using frames. _top: Loads the URL in the current browser window, but overrides other frames.

Example:

Quackit

Add an ID to the part of the page you want to take the user to. To do this, use the id attribute. The value must be short text. id is a commonly used attribute in HTML.

Elephants

Jump to Elephants

The above code snippets are posted at different parts document. It turns out something like this:

Example

Jump to Elephants

All about cats.

All about dogs.

All about birds.

All about elephants.

All about monkeys.

All about snakes.

All about rats.

All about fish.

All about buffalo.

View example

It doesn't have to be the same page. You can use this method to navigate to the ID of any page. To do this, before you paste the link into the HTML, add the target URL before the "#" character. For example:

Jump to Elephants

Of course, it is assumed that there is an identifier with this value on the page.

Email King Kong

View example

You can automatically fill out the subject line for your users, and even the body of the email. This is done by adding the subject and body parameters to the email address.

View example

You can set a default URL where all HTML links on a page will start. To do this, place the base tag (along with the href attribute) within the element.

Example HTML code:

Example HTML

View example