(substitutions). In replacement ciphers, letters are changed to other letters from the same alphabet; when coding, the letters are changed to something completely different - pictures, symbols of other alphabets, sequences of different characters, etc. A table of unambiguous correspondence between the alphabet of the source text and the code symbols is compiled, and in accordance with this table, one-to-one coding occurs. To decode, you need to know the code table.
There are a large number of codes used in different areas of human life. Well-known codes are used for the most part for the convenience of transferring information in one way or another. If the code table is known only to the transmitter and receiver, then a rather primitive cipher is obtained, which is easily amenable to frequency analysis. But if a person is far from the theory of coding and is not familiar with the frequency analysis of text, then it is rather problematic for him to guess such ciphers.
A1Z26
The simplest cipher. It is called A1Z26 or in the Russian version A1Я33. Alphabet letters are replaced with their ordinal numbers.
"NoZDR" can be encrypted as 14-15-26-4-18 or 1415260418.
Morse code
Letters, numbers and some signs are associated with a set of dots and dashes, which can be transmitted by radio, sound, knocking, light telegraph and signaling flags. Since sailors have a corresponding flag associated with each letter, it is possible to transmit a message with flags.
Braille
Braille is a tactile reading system for the blind, made up of six-point characters called cells. The cell is three points high and two points wide.
Different braille characters are formed by placing dots at different positions within a cell.
For convenience, the points are described when reading as follows: 1, 2, 3 from the left from top to bottom and 4, 5, 6 from the right from top to bottom.
When compiling the text, the following rules are adhered to:
one cell is skipped between words (space);
no cell is skipped after the comma and semicolon;
a dash is written together with the previous word;
the number is preceded by a digital sign.
Code Pages
In computer quests and riddles, you can encode letters according to their codes in various code pages - tables used on computers. For Cyrillic texts, it is best to use the most common encodings: Windows-1251, KOI8, CP866, MacCyrillic. Although for complex encryption, you can choose something more exotic.
You can encode with hexadecimal numbers, or you can convert them to decimal. For example, the letter E in KOI8-R has the code B3 (179), in CP866 it is F0 (240), and in Windows-1251 it is A8 (168). And you can search for letters in the right tables for a match in the left ones, then the text will turn out to be typed in "krakozyabrami" like èαᬫº∩íαδ (866 → 437) or Êðàêîçÿáðû (1251 → Latin-1).
And you can change the upper half of the characters to the lower one within one table. Then for Windows-1251 instead of "krakozyabra" you get "jp" jng ap ("instead of" HELICOPTER "-" BEPRNK (R ". Such a shift in the code page is a classic loss of the most significant bit in case of failures on mail servers. can be encoded with a reverse shift downward by 128 characters, and this encoding will be a variant of the cipher - ROT128, only not for the usual alphabet, but for the selected code page.
The exact time of the origin of the cipher is unknown, but some of the found records of this system date from the 18th century. Variations of this cipher were used by the Rosicrucian Order and the Freemasons. The latter used it in their secret documents and correspondence quite often, therefore the cipher began to be called the cipher of the Freemasons. Even on the gravestones of the Masons, you can see the inscriptions using this cipher. A similar encryption system was used during the US Civil War by the army of George Washington, as well as by prisoners in federal prisons in the US Confederations.
Below are two (blue and red) options for filling the grid of such ciphers. The letters are arranged in pairs, the second letter of the pair is drawn with a dotted symbol:
Copyright ciphers
Ciphers, where one character of the alphabet (letter, number, punctuation mark) corresponds to one (rarely more) graphic character, a great many have been invented. Most of them are designed for use in science fiction films, cartoons and computer games. Here is some of them:
Dancing men
One of the most famous copyright substitution ciphers is "". It was invented and described by the English writer Arthur Conan Doyle in one of his works about Sherlock Holmes. The letters of the alphabet are replaced with characters that look like men in various poses. In the book, the little men were not invented for all letters of the alphabet, so the fans creatively modified and reworked the symbols, and the following code was obtained:
Thomas More's alphabet
But such an alphabet was described in his treatise "Utopia" by Thomas More in 1516:
Ciphers from the animated series "Gravity Falls"
Bill Shifra
Stanford Pines (Diary Writer)
Jedi alphabet from Star Wars
Alien alphabet from "Futurama"
Superman's krypton alphabet
Bionicle alphabets
Semantics(fr. sémantique from ancient Greek. σημαντικός - denoting) - the science of understanding certain signs, sequences of symbols and other conventions. This science is used in many fields: linguistics, proxemics, pragmatics, etymology, etc. I don’t know what these words mean and what all these sciences do. And it doesn't matter, I am interested in the question of applying semantics in the layout of sites.
The note
I will not touch on the term Semantic Web here. At first glance, it might seem that the Semantic Web and Semantic HTML Code themes are almost the same thing. But in fact, the Semantic Web is a rather philosophical concept and does not have much in common with the current reality.
Semantic layout - what is it?
In the language, each word has a specific meaning, purpose. When you say "sausage", you mean a food product that is minced meat (usually meat) in an oblong casing. In short, you mean sausage, not milk or green peas.
HTML is also a language, its "words", called tags, also have a certain logical meaning and purpose. Therefore, first of all semantic HTML code is a layout with the correct use of HTML tags, using them for their intended purpose, as they were conceived by the developers of the HTML language and web standards.
microformats.org is a community that works to bring the idealistic ideas of the Semantic Web to life by bringing page markup closer to those semantic ideals.
Why and who needs semantic layout at all?
If on my website information is displayed in the same way as on the design, why should you still break your brain and think about some semantics ?! This is extra work! Who needs it ?! Who will appreciate it besides another layout designer?
I often heard such questions. Let's figure it out.
Semantic HTML for Web Developers
Semantic code for users
Increases the availability of information on the site. This is primarily important for alternative agents such as:
- semantic code directly affects the amount of HTML code. Less code -> easier pages -> load faster, less RAM is required on the user side, less traffic, less database size. The site becomes faster and less expensive.
- voice browsers for which the tags and their attributes are important in order to pronounce the content correctly and with the necessary intonation, or vice versa, not to pronounce too much.
- mobile devices which do not fully support CSS and therefore rely mainly on HTML code, displaying it on the screen according to the tags used.
- printing devices even without additional CSS, the information will print better (closer to the design), and creating the perfect version for printing will turn into a few easy CSS manipulations.
- in addition, there are devices and plugins that allow you to quickly navigate the document - for example, by headings in Opera.
Semantic HTML for machines
Search engines are constantly improving their search methods so that the results include the information that really looking for user. Semantic HTML facilitates this because lends itself to much better analysis - the code is cleaner, the code is logical (you can clearly see where the headers are, where the navigation is, where the content is).
Good content plus high-quality semantic layout is already a serious application for good positions in search engine results.
The semantics of HTML code is always a hot issue. Some developers try to always write semantic code. Others criticize dogmatic adherents. And some even have no idea what it is and why it is needed. Semantics are defined in HTML in tags, classes, IDs, and attributes that describe the purpose, but do not specify exactly the content that is contained in them. That is, we are talking about the separation of content and its format.
Let's start with an obvious example.
Bad code semantics
Good code semantics
The text of the article, which was written by someone. Inco Gnito- its author.Article title
Whether you think HTML5 is ready-to-use or not, most likely using the tag But not everything is so clearly represented with HTML5 tags. Let's take a look at a set of class names and see if they meet the semantic requirements. Not semantic code. This is a classic example. Every CSS workbench for modular grid uses these type of class names to define grid items. Whether it's "yui-b", "grid-4", or "spanHalf" —these names are closer to describing markup than describing content. However, their use in most cases is inevitable when working with templates of modular grids. Semantic code. The footer has taken on an enduring meaning in web design. This is the footer of the page that contains elements such as repeating navigation, usage rights, author information, and so on. This class defines a group for all these elements without their description. If you have switched to using HTML5, then it is better to use the element Not semantic code. It defines the content precisely. But why should the text be large? To stand out from other smaller text? "standOut" (selection) is more appropriate in this case. You may decide to change the style for the highlight text, but do nothing with its size, in which case the name of the class may confuse you. Semantic code. In this case, we are talking about determining the level of importance of an element in the application interface (for example, a paragraph or a button). An item with a higher level can have vibrant colors and larger sizes, while items with a lower level can contain more content. But there is no exact definition of styles in this case, so the code is semantic. This situation is very similar to using tags Semantic code. If only every class name could be so clearly defined! In this case, we have a description of a section that has content that is easy to describe, just like "tweets", "pagination" or "admin-nav". Not semantic code. In this case, we are talking about setting the style for the first paragraph on the page. This technique is used to attract the attention of readers to the material. Better to use the name "intro", which does not mention the element. Better yet, use a selector for such paragraphs, such as article p: first-of-type or h1 + p. Not semantic code. This is a very generic class name that is used to organize the formatting of elements. But there is nothing in it to describe the content. Various semantics theorists recommend using a class name like "group" in such cases. It is likely that they are right. Since this element undoubtedly serves to group several other elements, and the recommended name would better describe its purpose without going into details. Not semantic code. Too detailed description of the format of the content. It is better to choose a different name that describes the content, rather than its format. Semantic code. The class describes the status of the content very well. For example, the success message might have a completely different style from the error message. Not semantic code. This example is trying to define the format of the content, not its purpose. "plain-jane" is very similar to "normal" or "regular". Ideally, CSS should be written so that there is no need for class names like "regular" to describe the format of the content. Not semantic code. These types of classes are commonly used to define site elements that should not be included in a chain of links. In this case, it is better to use something like rel = nofollow for links, but not a class for all content. Not semantic code. This is an attempt to describe the format of the content, not its purpose. Let's say you have two articles on your site. And you want to give them different styles. Movie Reviews will have a blue background, and Hot News will have a red background and larger font. One of the ways to solve the problem is this: Another way is this: Surely, if you ask several developers about which code is more consistent with the requirements of semantics, most will point to the first option. It fits perfectly with the material in this tutorial: a description of the purpose without formatting references. And the second option indicates the format ("blueBg" is a class name that is formed from two English words meaning "blue background"). If suddenly a decision is made to change the design of movie reviews - for example, to make a green background, then the class name "blueBg" will turn into a developer's nightmare. And the name "movie-review" will allow you to completely change the visual styles while maintaining an excellent level of code support. But no one claims that the first example is better in all cases without exception. Let's say that a particular shade of blue is used in many places on the site. For example, it is the background for some of the footer and areas in the sidebar. You can use the following selector: Movie-review, footer> div: nth-of-type (2), aside> div: nth-of-type (4) (background: # c2fbff;) An effective solution, since the color is determined in only one place. But such code becomes difficult to maintain, since it has a long selector that is difficult to visualize. You will also need other selectors to define unique styles, which will lead to repetitive code. Or you can take a different approach and leave them separate: Movie-review (background: # c2fbff; / * Color definition * /) footer> div: nth-of-type (2) (background: # c2fbff; / * And one more thing * /) aside> div: nth-of- type (4) (background: # c2fbff; / * And one more thing * /) This style helps keep the CSS file more organized (different areas are defined in different sections). But repetition of definitions comes at a price. For large sites, the definition of the same color can go up to several thousand times. Terrible! A solution would be to use a class like "blueBg" to define the color once and insert it in the HTML code when you want to use the given design. Of course, it is better to name it "mainBrandColor" or "secondaryFont" to get rid of the formatting description. You can sacrifice the semantics of your code in favor of resource conservation. ,
,
, and so on, but to other interface elements.
But...
