How I completed Habrahabr
Unlike " How I broke Habrahabr ", it is known that breaking is not building. Breaking a known resource is traditionally of great interest. The fact that everyone believed that it was impossible to do it turned out that it was possible. How are things going with the construction? And what can you build if everything is already out of the box: opened the site and use it? There are some users, developers, who see that the site can be completed, but to which it does not immediately reach, if you just ask the administration. And they finish building themselves, and then share the results with the community, thanks to which we know them, and their work is also of great interest. Let's start by remembering the builders, let them not get invites for improvements, as far as I know, for the completion and don’t issue bonuses.
As the experience of recent years shows, a number of interface flaws are being corrected, new official features appear that have been made by full-time site developers. For example, over the past 2 years:
the typed article is not lost - all fields are saved in the repository;
provides for editing comments within 3 minutes after publication;
for some readers, the “Report” button on an article or comment is available;
a selector appeared above the comment input field with a choice of code language and the list of languages ​​was expanded from 16 to 42;
work has been done on anarchy of blogs and they are systematized into hubs;
“Similar posts” removed from company blogs
and much more.
Fixed interface bugs and vulnerabilities. In general, the work goes on, and the site is becoming more convenient. There are rumors about the appearance of interface improvements (the source is an article with New Year wishes at the end of 2012 and about mobile apps ). What more could you want?
')
Third-party developers want and implement. If you search for the site name on the resources of usersprints, user styles and applications, you can find:
several scripts and programs that allow you to conveniently draw letters to the authors about errors in their articles (most often they were made for Chrome and one for the old Opera) - 1 , 2 , 3 ;
several Chrome extensions (only 55% of readers can use - source ):
chrome.google.com/webstore/detail/habrahabr-more/glaccbllkhielccdhfbbpilnlbemgaji - various site improvements, loading tapes;
chrome.google.com/webstore/detail/habrahabr-reader/nnbjhfplkknimonkomifaleclogojjjd - read news / article headlines and navigate to them;
Habraredizayner , changes the appearance of the tape and title;
HabraPanel , similarly;
chrome.google.com/webstore/detail/habrinfo/kbfcbifjdpbmcolhlpjdbojffhnmkaia - HabrInfo, adds page navigation from the toolbar button.
several styles that transform the look of the site;
userstyles.org/styles/78393/habrahabr - the gray style of the site pages (10 months has not been updated);
userstyles.org/styles/19827/habrahabr-inversion-compact-skin - compact traditional style;
userstyles.org/styles/11900/habrahabr-prettifier - compact light style;
(there is a black style, but it causes great doubts in the freshness)
userstyles.org/styles/55161/habrahabr-reader - style for reading (also old) - hides everything, sidebar and even comments; leaves the article.
users scripts that change the location of information blocks on the site.
collapsing comments with sorting by estimates for them;
viewing the activity of commentators on the site on days of the year, like on GitHub;
viewing the comment to which the selected comment responds without scrolling the page;
view user performance by existing Habr API;
adding formatting buttons (inserting pseudo tags) in the comment input field.
… and some others.
As you can see, there is interest in the transformation and refinement of the site. If you look at the number of users, they are few. They appear from those who are not afraid to run someone else's script on their browser, most likely understands the process, and probably can correct something in the script or in the styles.
The result of measurements of one script showed that regular users recruited 50 people who tried - 100-200 for a period of 2-3 months. Thousands of downloads listed on userscripts.org - shows downloading new versions, which have to change with each modification of the site. And, of course, over time, new people come in or former people install scripts and styles on other computers - one person and several downloads. In addition, since March 2013, the counter on userscripts.org was generally broken or stopped — now, without any special effort, even the interest of users in various scripts cannot be determined. Most likely, this will lead to a loss of interest in hosting in general.
So, a little understood that thousands of downloads mean hundreds of samples and dozens of users.
Accordingly, hundreds of downloads of Chrome extensions mean that dozens have tried it, and continue to use - dozens. The fewer version changes, the more real users relative to the number of installations.
However, the interest of users here, rather - a side effect. You can not make everyone learn to put scripts. This is done by those who understand the risks or have not yet explained this to them. The script of an unknown author can extract important user information, so you should either trust the author’s reputation, look at the script yourself, or use a firewall that controls unexpected network activity. But okay, in the user community the reputation exists, and their technical skills contribute to a larger percentage of the “side effect” - the use of scripts.
Some time ago I also started using scripts and styles to eliminate the flaws of some of the sites I visited. Immediately revealed the main drawback of user scripts - the variability of sites, their layout. It is quite difficult to use other people's scripts and styles when they stop working. Naturally, there is a desire to remake scripts and styles to fit your needs. Judging by the number of site alterations that I would like to have, it was expected about 20 or more functions. On Habré, I saw around 2010 or 2011 only one person who aggregated many functions into one script. He lasted 8 months and then threw his publication on userscripts.org. And here, it’s also a function aggregator from the list above. But I did not use either one or the other, because approximately from the middle of 2011 I had my own aggregator. Initially, it was done as a user script, and not as an application. Why? A user script has a little less rights, but in it you can achieve cross-browser compatibility with less effort. For a long time, the script supported 4 browsers with all functions - Firefox, Opera, Chrome, Safari. Last year Safari fell off, because I stopped supporting myself on Windows, and on Mac I have nowhere to run the script.
Experience shows that supporting cross-browser compatibility does not take a lot of additional forces. But this can not be said about the styles. Styles, let them be similar, but become sloppy looking in one, then in another browser, when users are trying to maintain the appearance everywhere. You have to choose - support everywhere or quality. I was more interested in support everywhere. You still do not need to choose a browser to view the site through scripts and styles - they work everywhere. And in Safari could, but with him - a separate story.
You can support applications for different browsers, including IE. For this there are special frameworks (Kango). Or in a self-made framework, it would look like this: the kernel is processed by the loader, which in 1-3 seconds reassembles the application and substitutes it in the right place in the file system. Then it is required (or not) to reload the tab, sometimes the browser, depending on which debugging scheme is used, and to test changes in this browser. From the kernel, the collector would collect the target application, and then it is brought to cross-browser compatibility. A single code in the application will be about 90% of each archive, but will be dissolved among the features of browser applications. Such a development scheme is somewhat redundant, even for a code of several thousand lines. But it would be necessary if I wanted to use the browser features of applications - buttons and informers in the taskbar, pop-up messages, for example.
For non-complication approach and to support 3 browsers, the code was organized as follows:
users , about 1000 lines - in the form of code ready for installation in Firefox, and the bulk of which is ready for installation in 2 (previously 3) other browsers - Chrome and Opera.
The main idea of ​​these styles is compactness, the release of "air". The site can be viewed with a window width of 320 pixels., Adaptive fields: the smaller the width, the greater the savings on voids. Places with noise are eliminated: underlines in the sidebar, unnecessary words are hidden; some of them are additionally shortened by the script in order to get interface elements, and not their descriptions (answer - reply, the comment has been changed - amended). Compact design - header, footer, sidebar. Between the comments there is a gap of 1 line (the variant without it (Zen mode) was already brute force and was worse read). Always visible main and custom menus in the corners and paginator tapes below.
userscripts fully supported by a single code for all browsers. They also insert a compressed user stylesheet string so that they can be run from user scripts (a delay of 0.5-1 s, but suitable for fitting, and installing without scripts applies styles immediately, without flickering pages with site styles).
Briefly, what they can do (links lead to descriptions of the details):
loading articles into Ajax feeds - browses articles and comments without reloading the page by clicking on the “read more” or article annotation title in any feed (main, all, sandbox, favorites, search, questions).
Inclusion of user styles ZenComment - the users built in the script are used; they exist separately but require the installation of the Stylish extension. They convert the text into a more dense one and have 2 special modes of reading comments (Zen and Compact).
limiting or retracting the sidebar - a solution for narrow windows and a screen, or removing redundant information in whole blocks (ZenComment also hides a lot of excess).
forced cat - limits the height of any annotation in the tape to 240 (for ZenComment) - 290 pixels, reduces pictures and video to 240 by 120, compresses vertical voids, provides tags with no more than 1 line - everything to fit several annotations and more text into the window .
Filter by authors and keywords - collapses annotations to one title for the specified list of authors and for the specified list of regular expressions - filters by text and by headings.
short dates of the current year - does not show the year, if it is current or the date is not older than 8 months.
Google search on the site - additional buttons for Google search and Yandex on the site and 3 output modes: in the window, in the frame or in the current page. If nothing is entered - search for the title of the article among the favorites on the site.
link corrections - links to translations - in a new window, the “tape” link is “tape-new”, correction of links in the sidebar - to articles, not to messages.
setting / hiding the Google+ buttons and others - unused sharing buttons can be deleted by settings and put on Google+, if it is used or to inform about the popularity of the article.
input tags source, font, blockquote - tags are entered with one click above the input field; The behavior of some other buttons is corrected (there is no blocking popup).
adjustment of the size of long headers - decreases the font, if the header is long; long blog names are shortened in the feed and in the sidebar.
coloring and counting the activity of commentators - each commentator receives a color according to the number of answers, which mark his comments by a narrow band on the left and in the title of answers.
half-height frame for viewing profiles, favorites, searching and composing letters. It opens above or below the point of the click, so as not to close the context and shows the data without leaving the page.
Shift-Tab - to enter a tab character in textarea, Ctrl + space - for "& + nbsp;".
Links to caches from the end-of-page page - if the article is deleted or Habr is unavailable ("maintenance") - a number of links to the page cache on large and small services.
autorost of input fields - the frames of multiline input fields (textarea) are expanded automatically if the window height allows.
viewing images without rebooting - in an enlarged size, with scaling the mouse wheel and moving around the screen.
selection of quotations for comments and personal messages (PM, letters) (select the text, press the context button "Letter" - we see the nested half-height frame with the form of the letter to the author and with the quote);
commenting on loaded articles and comments via contextual quotation and frame and look for a quote or comment);
Editing your article in a frame, another tab, or directly - by highlighting quotes (highlighted in the preview what needs to be edited, pressed the context button "E" next to the selection - switched to highlighting the same in the input field).
Links to external sources - in a new tab. At the tip of local links - the month and year of publication.
Duplication of the date and author of the article at the top and bottom of the article.
Knocked to the bottom footer. Upload 3 lower articles . Compact footer.
There are separate scripts , but the styles are all placed in one block of codes. There were worse times with styles, when you had to maintain 2 ways of layout, which existed on the site during transition periods - the site was not rebuilt immediately, first some pages, then others. The appearance of the styles was also slightly changed. Bad ideas were discarded, successful ones were used.
An interesting story with the wishes of those who did not use styles. There are wishes of users - they are listed here and constructive: to do something else, third. And there are exclamations of others, such as "I will not use these styles." On the proposals to make your own version of the design, which I would implement in styles - complete silence. I explain this by the fact that designers and connoisseurs of style are people who are farther from technology in order to install themselves or scripts themselves. It is enough for them that the official site gives.
The last addition of scripts ( uploading images by dragging and dropping ) I proposed to do crowdsourcing - someone will offer a design, I will do the implementation. The survey shows that 14 out of 87 people who had participated in the survey could have done the design. We got in touch - 0 people. Now here is a construction drawn by me in UPD6, at the end of the article. Perhaps the implementation of someone not like it. But styles are made this way - everyone can take part, but what is being done, but not existing in possibilities, is done.
As the experience of recent years shows, a number of interface flaws are being corrected, new official features appear that have been made by full-time site developers. For example, over the past 2 years:
the typed article is not lost - all fields are saved in the repository;
provides for editing comments within 3 minutes after publication;
for some readers, the “Report” button on an article or comment is available;
a selector appeared above the comment input field with a choice of code language and the list of languages ​​was expanded from 16 to 42;
work has been done on anarchy of blogs and they are systematized into hubs;
“Similar posts” removed from company blogs
and much more.
Fixed interface bugs and vulnerabilities. In general, the work goes on, and the site is becoming more convenient. There are rumors about the appearance of interface improvements (the source is an article with New Year wishes at the end of 2012 and about mobile apps ). What more could you want?
')
Third-party developers want and implement. If you search for the site name on the resources of usersprints, user styles and applications, you can find:
several scripts and programs that allow you to conveniently draw letters to the authors about errors in their articles (most often they were made for Chrome and one for the old Opera) - 1 , 2 , 3 ;
several Chrome extensions (only 55% of readers can use - source ):
chrome.google.com/webstore/detail/habrahabr-more/glaccbllkhielccdhfbbpilnlbemgaji - various site improvements, loading tapes;
chrome.google.com/webstore/detail/habrahabr-reader/nnbjhfplkknimonkomifaleclogojjjd - read news / article headlines and navigate to them;
Habraredizayner , changes the appearance of the tape and title;
HabraPanel , similarly;
chrome.google.com/webstore/detail/habrinfo/kbfcbifjdpbmcolhlpjdbojffhnmkaia - HabrInfo, adds page navigation from the toolbar button.
several styles that transform the look of the site;
userstyles.org/styles/78393/habrahabr - the gray style of the site pages (10 months has not been updated);
userstyles.org/styles/19827/habrahabr-inversion-compact-skin - compact traditional style;
userstyles.org/styles/11900/habrahabr-prettifier - compact light style;
(there is a black style, but it causes great doubts in the freshness)
userstyles.org/styles/55161/habrahabr-reader - style for reading (also old) - hides everything, sidebar and even comments; leaves the article.
users scripts that change the location of information blocks on the site.
collapsing comments with sorting by estimates for them;
viewing the activity of commentators on the site on days of the year, like on GitHub;
viewing the comment to which the selected comment responds without scrolling the page;
view user performance by existing Habr API;
adding formatting buttons (inserting pseudo tags) in the comment input field.
… and some others.
As you can see, there is interest in the transformation and refinement of the site. If you look at the number of users, they are few. They appear from those who are not afraid to run someone else's script on their browser, most likely understands the process, and probably can correct something in the script or in the styles.
The result of measurements of one script showed that regular users recruited 50 people who tried - 100-200 for a period of 2-3 months. Thousands of downloads listed on userscripts.org - shows downloading new versions, which have to change with each modification of the site. And, of course, over time, new people come in or former people install scripts and styles on other computers - one person and several downloads. In addition, since March 2013, the counter on userscripts.org was generally broken or stopped — now, without any special effort, even the interest of users in various scripts cannot be determined. Most likely, this will lead to a loss of interest in hosting in general.
So, a little understood that thousands of downloads mean hundreds of samples and dozens of users.
Accordingly, hundreds of downloads of Chrome extensions mean that dozens have tried it, and continue to use - dozens. The fewer version changes, the more real users relative to the number of installations.
However, the interest of users here, rather - a side effect. You can not make everyone learn to put scripts. This is done by those who understand the risks or have not yet explained this to them. The script of an unknown author can extract important user information, so you should either trust the author’s reputation, look at the script yourself, or use a firewall that controls unexpected network activity. But okay, in the user community the reputation exists, and their technical skills contribute to a larger percentage of the “side effect” - the use of scripts.
Some time ago I also started using scripts and styles to eliminate the flaws of some of the sites I visited. Immediately revealed the main drawback of user scripts - the variability of sites, their layout. It is quite difficult to use other people's scripts and styles when they stop working. Naturally, there is a desire to remake scripts and styles to fit your needs. Judging by the number of site alterations that I would like to have, it was expected about 20 or more functions. On Habré, I saw around 2010 or 2011 only one person who aggregated many functions into one script. He lasted 8 months and then threw his publication on userscripts.org. And here, it’s also a function aggregator from the list above. But I did not use either one or the other, because approximately from the middle of 2011 I had my own aggregator. Initially, it was done as a user script, and not as an application. Why? A user script has a little less rights, but in it you can achieve cross-browser compatibility with less effort. For a long time, the script supported 4 browsers with all functions - Firefox, Opera, Chrome, Safari. Last year Safari fell off, because I stopped supporting myself on Windows, and on Mac I have nowhere to run the script.
Experience shows that supporting cross-browser compatibility does not take a lot of additional forces. But this can not be said about the styles. Styles, let them be similar, but become sloppy looking in one, then in another browser, when users are trying to maintain the appearance everywhere. You have to choose - support everywhere or quality. I was more interested in support everywhere. You still do not need to choose a browser to view the site through scripts and styles - they work everywhere. And in Safari could, but with him - a separate story.
You can support applications for different browsers, including IE. For this there are special frameworks (Kango). Or in a self-made framework, it would look like this: the kernel is processed by the loader, which in 1-3 seconds reassembles the application and substitutes it in the right place in the file system. Then it is required (or not) to reload the tab, sometimes the browser, depending on which debugging scheme is used, and to test changes in this browser. From the kernel, the collector would collect the target application, and then it is brought to cross-browser compatibility. A single code in the application will be about 90% of each archive, but will be dissolved among the features of browser applications. Such a development scheme is somewhat redundant, even for a code of several thousand lines. But it would be necessary if I wanted to use the browser features of applications - buttons and informers in the taskbar, pop-up messages, for example.
For non-complication approach and to support 3 browsers, the code was organized as follows:
users , about 1000 lines - in the form of code ready for installation in Firefox, and the bulk of which is ready for installation in 2 (previously 3) other browsers - Chrome and Opera.
The main idea of ​​these styles is compactness, the release of "air". The site can be viewed with a window width of 320 pixels., Adaptive fields: the smaller the width, the greater the savings on voids. Places with noise are eliminated: underlines in the sidebar, unnecessary words are hidden; some of them are additionally shortened by the script in order to get interface elements, and not their descriptions (answer - reply, the comment has been changed - amended). Compact design - header, footer, sidebar. Between the comments there is a gap of 1 line (the variant without it (Zen mode) was already brute force and was worse read). Always visible main and custom menus in the corners and paginator tapes below.
userscripts fully supported by a single code for all browsers. They also insert a compressed user stylesheet string so that they can be run from user scripts (a delay of 0.5-1 s, but suitable for fitting, and installing without scripts applies styles immediately, without flickering pages with site styles).
Briefly, what they can do (links lead to descriptions of the details):
loading articles into Ajax feeds - browses articles and comments without reloading the page by clicking on the “read more” or article annotation title in any feed (main, all, sandbox, favorites, search, questions).
Inclusion of user styles ZenComment - the users built in the script are used; they exist separately but require the installation of the Stylish extension. They convert the text into a more dense one and have 2 special modes of reading comments (Zen and Compact).
limiting or retracting the sidebar - a solution for narrow windows and a screen, or removing redundant information in whole blocks (ZenComment also hides a lot of excess).
forced cat - limits the height of any annotation in the tape to 240 (for ZenComment) - 290 pixels, reduces pictures and video to 240 by 120, compresses vertical voids, provides tags with no more than 1 line - everything to fit several annotations and more text into the window .
Filter by authors and keywords - collapses annotations to one title for the specified list of authors and for the specified list of regular expressions - filters by text and by headings.
short dates of the current year - does not show the year, if it is current or the date is not older than 8 months.
Google search on the site - additional buttons for Google search and Yandex on the site and 3 output modes: in the window, in the frame or in the current page. If nothing is entered - search for the title of the article among the favorites on the site.
link corrections - links to translations - in a new window, the “tape” link is “tape-new”, correction of links in the sidebar - to articles, not to messages.
setting / hiding the Google+ buttons and others - unused sharing buttons can be deleted by settings and put on Google+, if it is used or to inform about the popularity of the article.
input tags source, font, blockquote - tags are entered with one click above the input field; The behavior of some other buttons is corrected (there is no blocking popup).
adjustment of the size of long headers - decreases the font, if the header is long; long blog names are shortened in the feed and in the sidebar.
coloring and counting the activity of commentators - each commentator receives a color according to the number of answers, which mark his comments by a narrow band on the left and in the title of answers.
half-height frame for viewing profiles, favorites, searching and composing letters. It opens above or below the point of the click, so as not to close the context and shows the data without leaving the page.
Shift-Tab - to enter a tab character in textarea, Ctrl + space - for "& + nbsp;".
Links to caches from the end-of-page page - if the article is deleted or Habr is unavailable ("maintenance") - a number of links to the page cache on large and small services.
autorost of input fields - the frames of multiline input fields (textarea) are expanded automatically if the window height allows.
viewing images without rebooting - in an enlarged size, with scaling the mouse wheel and moving around the screen.
selection of quotations for comments and personal messages (PM, letters) (select the text, press the context button "Letter" - we see the nested half-height frame with the form of the letter to the author and with the quote);
commenting on loaded articles and comments via contextual quotation and frame and look for a quote or comment);
Editing your article in a frame, another tab, or directly - by highlighting quotes (highlighted in the preview what needs to be edited, pressed the context button "E" next to the selection - switched to highlighting the same in the input field).
Links to external sources - in a new tab. At the tip of local links - the month and year of publication.
Duplication of the date and author of the article at the top and bottom of the article.
Knocked to the bottom footer. Upload 3 lower articles . Compact footer.
There are separate scripts , but the styles are all placed in one block of codes. There were worse times with styles, when you had to maintain 2 ways of layout, which existed on the site during transition periods - the site was not rebuilt immediately, first some pages, then others. The appearance of the styles was also slightly changed. Bad ideas were discarded, successful ones were used.
An interesting story with the wishes of those who did not use styles. There are wishes of users - they are listed here and constructive: to do something else, third. And there are exclamations of others, such as "I will not use these styles." On the proposals to make your own version of the design, which I would implement in styles - complete silence. I explain this by the fact that designers and connoisseurs of style are people who are farther from technology in order to install themselves or scripts themselves. It is enough for them that the official site gives.
The last addition of scripts ( uploading images by dragging and dropping ) I proposed to do crowdsourcing - someone will offer a design, I will do the implementation. The survey shows that 14 out of 87 people who had participated in the survey could have done the design. We got in touch - 0 people. Now here is a construction drawn by me in UPD6, at the end of the article. Perhaps the implementation of someone not like it. But styles are made this way - everyone can take part, but what is being done, but not existing in possibilities, is done.
Source: https://habr.com/ru/post/197736/
All Articles