Every year, WordPress is increasingly moving away from the “blog engine” label in favor of business card sites, online stores and one-page sites. User requests are also changing.
The first thing owners of business card websites want is to make a static home page, because... It is she who immediately tells the visitor about the company, about its services and gives the opportunity to continue their acquaintance.
In this tutorial we will talk about creating a static home page. There will be a video at the end! Go! 😉
Many premium themes (which are purchased for money) have their own mechanism for customizing the main page and the material in this instruction may be useless. Please remember this.
If you are unable to change the main page according to my recommendations, then you should study the documentation for your theme; perhaps there are nuances in setting it up. 🙂
Advice: Very often, when creating a page, you have the opportunity to select a template in the page creation interface. It will either say “Home page” or something else, but in that spirit, in general. Please note, this may be exactly your case.
Introduction
By default, WordPress displays the last N posts on the main page in reverse chronological order. The usual blog format, nothing unusual and you are already familiar with it.
This behavior is almost always used in most free themes. With only a few exceptions, free themes can make the main page a static page instead of a blog.
This instruction will be necessary only for those who, after installing the theme, display posts on the main page, and not sliders, a block of services and other non-blog elements.
Creating Pages
In order to install a static home page, you must first create it. Go to the “Pages” menu - “Add new”, enter the required text and publish it.
There is a nuance here: because We are removing blog posts from the main page; we still have to create a separate page called “Blog”, for example. It will be used to display your entries.
In total, after these operations you will have two pages: “Home” and “Blog”, you can choose yourself. I prefer to use "glavnaya" and "blog", plain and simple.
Setting the Home Page
Now it’s just a matter of small things: we need to mark our newly created page as the main page. To do this, go to the “Settings” - “Reading” section and look at the settings block that interests us:
We switch the option to “Static page” and we have the opportunity to select recently created new pages from the list of pages. Let's do it like this:
We save and go to the main page, make sure that instead of it there are now not records, but the information you need about your company or project. Just what we wanted! 🙂
Use an existing page
In fact, you don’t have to create a special home page, but use one of the existing ones for this, for example, “About the company” or “Services”. This is the best option for a business card website.
For a blog, this could be a welcome page or about the author. But I did something different on my personal blog - I modified the template so that both the posts on the main page and the necessary greeting were visible.
The World Wide Web
The World Wide Web (WWW) is a network of information resources around the world. A resource here means any information available to network users. This can be either a simple text document, or a program, an archive, or some kind of service for the user (for example, a service that provides accurate time).
Typically, users understand the Internet as a set of sites that can be visited through a browser and that are interconnected by links (hyperlinks).
This is just one of many aspects of the Internet. However, when they talk about web design, they mean the creation of sites accessible to users through a browser. Therefore, we will focus specifically on documents in the HTML language.
To put it simply, browsers are programs for displaying HTML documents. That is, when you type a site in the address bar, the browser downloads the html code and displays it to you as a web page. Currently the most popular browsers are:
Microsoft Internet Explorer(IE)
· The undisputed leader in the number of people who use it. According to various estimates, the share of this browser is 85-95%. Lately it has been crowded out by Firefox, but with the release of IE7, Firefox may have problems in further winning the market.
Mozilla Firefox
· Rising from the ashes of the dying Netscape Navigator in the late 90s, this browser is rapidly gaining momentum. Its popularity is the sum of two components: open source and a huge number of extensions (plugins) that anyone can write. Some of the extensions are simply masterpieces. Personally, I use the HTML Validator extension, which shows me html errors on a web page with detailed description of the error.This is very helpful when developing web pages.
· A very nice browser from Scandinavian programmers. Free and very rich in features.
There are also a large number of browsers that actually use libraries from Internet Explorer.
Static and dynamic pages
You've probably often heard the concepts of static and dynamic web pages. Here it is important to clearly understand what we are talking about and what these concepts apply to.
Pages are divided into static and dynamic according to the behavior of the document in the browser. On the other hand, these concepts are often used in another sense. Documents are also divided into static and dynamic based on the way the document is created.
Based on the behavior of the document in the user’s browser, there are:
· Static html pages
· Static - means that the page always looks the same, regardless of user actions. For example, the menu is organized by links to individual pages rather than by a drop-down list.
· Dynamic html pages
· These pages can already respond to user actions and change. For example, when you click on the text, a block of text with the translation of the word may pop up. By the way, this is exactly how one of the translator plugins for the Firefox browser is implemented.
Dynamics on web pages is implemented using scripts that are executed by the browser. Many elements of the HTML language support the definition of event handlers. For example, you can set the processing of the “mouse click” event on the image. Then if the user clicks on this picture, the handler defined for this will be called.
This may sound a little confusing, but don't worry. When you come across this, everything will be easier.
The most common language for creating dynamic web pages is JavaScript. (Not to be confused with the Java programming language. They are two completely different entities.)
VBscript (visual basic script) is used less frequently. (Microsoft, as always, went its own way.)
Based on the method of creation, documents are again divided into static and dynamic.
Pages are called static if they are on the server in html form.
And dynamic ones are those that are generated “on the fly” at the request of the browser.
As you can easily see, if there is a regular HTML page on the server, then this approach is very limited. For example, you have an online store and you have added a new product. If your store consists of "static" html pages, then you must manually edit several other pages. At a minimum, this is a product catalog and, probably, an order form. If you run out of a product, you need to update the site again. It is very uncomfortable. Therefore, you will not find a single online store on html. (Although it is possible to come up with a system that automatically regenerates the site when a product changes. But this is not a very elegant solution).
If the site contains frequently changing content (content - information on the site), then scripts running on the server will come to your aid. And this is the key difference between these scripts and those described earlier (those written in JavaScript). It works like this:
1. The browser requests a document from the server
2. The server determines that the document is a script and starts it for execution
3. The script generates an html page
4. The server sends the generated page to the browser, so that the browser has no idea that the script has been executed on the server.
There are several programming languages that can be used to write scripts that generate "dynamic" pages. The most common of them:
7. Binary code (a C or C++ program compiled into executable code)
Each of these languages has its own application features. You can write scripts in any language. The main thing is to know its strengths and weaknesses and use them effectively. I will tell you more about these languages on the pages of our newsletter. In the meantime, it is important to know that there are various programming languages in which websites with frequently changing content are programmed.
As a rule, if you see that the page address ends in .html or .htm, then this is a regular static page. (You can, of course, configure the server so that it executes scripts that end with these same endings, but this is not practical. Still, .html and .htm are the standard and you shouldn’t redefine these endings.) If you see any other ending, then this is most likely a script. For example, scripts in PHP usually have the extension .php, in Perl - .pl, ASP - .aspx
If the address does not contain the page name (for example, www.neomoon.ru), then the server will use the default document (usually either index.html or index.htm or index.php).
It must be said that the hybrid system is now increasingly gaining strength. Its name is like that of a Dutch football club - AJAX, which means: Asyncronous JavaScript And XML (I don’t know how the name of the Dutch club stands for :)). This technology allows JavaScript scripts to access any script on the server and receive information from the server. This in turn gives the user the flexibility to reload only part of the page's content, rather than the entire page (which saves a lot of traffic).
Static html pages are not a very flexible solution. You should only use them if you have completely static content. For example, you post a book online. The book has already been written and will not change. In this case, it is much more efficient and easier to design the book as a static HTML document.
If you have frequently changing information on your website, then you should opt for using scripts.
However, scripts have one drawback: they require additional resources from the server for their work. If you just need to read an html page from the server and send it to the browser, then the script must first be launched and executed. In addition, very often scripts use a database management system (DBMS) to store changing data, which creates additional load.
Isn’t it wonderful to be able to create and maintain a website yourself, without turning to anyone for help? In addition to saving money (after all, web development services cost a lot), this allows you to independently solve a lot of problems: creating a personal web page, a corporate website, an online store, implementing interesting projects - this is not a complete list of what a person can do, proficient in web development technologies.
After reading this book, you will learn what a modern website is, how its concept is developed, what hosting and a domain name are, how a static web page differs from a dynamic one, how site content is generated, why it is needed to be optimized, and much more. friend. You will learn how to independently program web pages using the hypertext markup language HTML, and will also become closely acquainted with software products specially created for web developers and allowing you to automatically create a full-fledged website, spending a minimum of time and effort.
An easy, accessible style of presentation, as well as a large number of visual illustrations and practical examples, turn the study of this book into an exciting process, the result of which will be the ability to quickly create an attractive modern web resource and perform all the necessary actions to support, maintain and optimize it.
Book:
Concept of static and dynamic web page
We previously talked briefly about what static and dynamic web pages are. In this section we will consider this issue in more detail.
The name of a static page speaks for itself: such a page presents static, permanent and unchanging information. Or rather, you can change it, but to do this you need to make appropriate adjustments to the page’s program code.
Typically, a static page file is in HTML format. The web developer writes HTML code, creating the content of the site, the file is given a name, after which the page is uploaded to the web server and becomes available to Internet users. For example, on a corporate website, a static page may contain information about the history of the company, the main directions of its activities, etc. Note that you should begin your first experiences in the field of web development by creating static web pages. We'll talk about this in more detail in the chapter on the basics of web programming using HTML.
NOTE
The address of a page written in HTML will end with the characters following the period.
The fundamental difference between a dynamic web page and a static one is that its content is not constant, but can change. It is formed depending on the user’s wishes, or more precisely, based on requests created by visitors and sent to the web server. As we noted earlier, the most typical example of a dynamic web page is a page with search results returned by a search engine (the same www.google.ru) based on the search query submitted by the user. Another typical example of the use of web pages is online stores: the visitor, using the options, indicates which product and with what properties he is interested in, sends a request (the corresponding button is usually intended for this - , etc.), and after a couple of seconds receives on the screen a list of goods that meet the established criteria. In addition, dynamic pages are widely used in other sites for a wide variety of purposes and orientations.
Dynamic pages can also be created using HTML, but another language, PHP, is more suitable for this (primarily due to its wider functionality). Accordingly, the file format of the page will no longer be HTML, but PHP, and its Internet address will end with the characters following the period.
Consisting of static html (htm, dhtml, xhtml) pages that make up a single whole. Contains (in the form of HTML markup) text, images, multimedia content (audio, video) and HTML tags. Tags can be either service tags, intended for the browser, or intended for placement, shaping the appearance and display of information. All changes to the site are made to the source code of the site’s documents (pages), for which you need to have access to the files on the web server.
Advantages and disadvantages
Advantages
- You don't need to know web programming languages to create a page.
- Good page cacheability.
- Fast page loading speed.
- Minimum requirements for the web server and minimum load on it.
- Easy to transfer to another server or local computer.
- Ability to directly view a file in a browser, without using middleware (web server, CGI).
Flaws
- Inability to dynamically generate content.
- Inability to fully support visitors (choice of appearance, cookies).
- To fill the site with information, you need to access page files via FTP, or third-party web scripts that allow you to edit pages.
- With a large number of pages (files), if there is a need to make similar changes (design, layout, adding new sections), you must use third-party software (utilities).
Modern use
- Business card website - contains the most general information about the owner of the site (organization or individual entrepreneur). Type of activity, history, price list, contact information, details, directions. Specialists post their resumes. That is, a detailed business card.
- Product catalog - the catalog contains a detailed description of goods/services, certificates, technical and consumer data, expert reviews, etc. Such sites contain information about goods/services that cannot be included in the price list.
- Users' home pages.
Also, static pages are often used as templates for dynamic sites.
Now, after looking at the request/response in detail HTTP, let’s pay attention to the different types of content (any meaningful content of an information resource) that you expect to see on the Internet. I divided it into four types - plain text, standards Web, dynamic Web-pages and formats that require other applications or plug-ins.
Simple text
At the very beginning, before any standards appeared Web or plugins, the Internet consisted primarily of images and plain text - files with a .txt or similar extension. When a plain text file comes across the Internet, the browser simply displays it as is, without any additional processing. Plain text files are still common on university websites.
Web Standards
The basic building blocks of the World Wide Web are three main standards Web- HTML (or XHTML, the two will be used interchangeably here for our purposes), CSS and JavaScript.
Hypertext Markup Language (HTML) is actually a pretty apt name because it conveys its purpose well. HTML is used to break up a document, define its content and structure, and define the meaning of each part (what all the text contains, etc., what we see on the pages Web). It uses special elements to define various components on a page.
Cascading Style Sheets (CSS) give you complete control over how an element is rendered. It is very easy, using style declarations, to display all paragraphs on two lines (line-height: 2em;), or to make all second-level headings green (color: green;). There are many benefits to separating structure and formatting, and we'll look at this in more detail in the next lecture. To demonstrate the power of using HTML and CSS together, Figure 3.2 shows simple HTML code on the left, with no additional formatting at all, and on the right you can see the same HTML code with CSS styles added to it.
Rice. 3.2. Plain HTML on the left, HTML using CSS on the right
Finally, the JavaScript language provides Web-site dynamic functions. You can write small JavaScript programs that will run on the client computer without requiring installation on server any special software. JavaScript allows you to add Web-site has some basic functionality and interactivity, but it has its limitations, which leads us to server-side programming languages and dynamic Web pages.
Dynamic Web Pages
Sometimes when browsing the Internet you can come across pages Web that don't use the .html extension - they might have a .php, .asp, .aspx, .jsp, or some other weird extension. These are all examples dynamic technologies Web, which can be used to create pages Web having dynamic sections - code that produces different results from a database or other data source depending on the values defined for it. We will review the pages Web of this type below in the "Comparison" section static And dynamic Web-sites".
