Make the home page look finished below the fold - #52
Merged
Merged
Conversation
The page opens with two figures and a program running in the browser and then gives up: below the fold it is three and a half thousand pixels of prose without a single picture in it. The section actually called "everything else it draws" had every one of its pictures behind a collapsed summary and spent three paragraphs on how many tracks there are, on the front page of a library whose whole subject is drawing. Eight of them are on the page now, in the card grid this site already uses for exactly this, each one a link to the part of the catalogue it comes from. The sheet with all thirty six is still a click away for comparison. The four refusals underneath were a bulleted list of dense paragraphs sitting directly below a section built out of blocks, which is what made the page look as though it had run out of care halfway down. They are the same kind of thing as the pieces above them, so they are set the same way, with the message each one prints given its own line.
The last thing on it was one paragraph with the citation link, both authors, two institutions and the licence run together, and then nothing. That is a page stopping because it has nothing left to say rather than because it is finished. The closing block separates the three of those and sets them under a rule, which is not more page: it is the page saying it is done.
Its own rule caps the column and centres it with an auto margin, which wins over the side margin Material would otherwise give it. On a narrow screen an auto margin resolves to nothing, so every paragraph, heading, card and block on the page sat flush against both bezels: measured at 375 wide, all of them started at 0 and ended at 375. They start at 16 now. The same rule in the other stylesheet had already been given this floor; this one is where the landing page cancels it again.
Looking at the page rather than measuring it: the block I had just added repeated the footer two lines above it. Material already prints the authors and the licence down there, and the closing block said both again. Saying a thing twice that close together is worse than not closing the page at all, so it now carries only what the footer has no room for, which is where the work was done.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
The page opens with two figures and the program running in the browser, and then
gives up. Below the fold it was three and a half thousand pixels of prose without
a single picture in it, on the front page of a library whose whole subject is
drawing.
The section called "everything else it draws" drew nothing
Every one of its pictures was behind a collapsed summary, and in their place were
three paragraphs about how many tracks there are: twenty eight of thirty six
reachable from the command line, twenty seven with a file to read, three removed.
Eight figures are on the page now, in the card grid this site already has for
exactly this, each one linking to the part of the catalogue it comes from. The
sheet with all thirty six is still one click away. Measured at 1280: eight cards
of 264 px in three columns of 314, images at 298 by 180 with
object-fit: contain, and every card link and image returns 200 from the built site.The refusals were a bulleted list under a wall of blocks
Four dense paragraphs in a
<ul>, sitting directly below a section built out ofdesigned blocks. That contrast is most of what makes the page look as though it
ran out of care halfway down. They are the same kind of thing as the pieces above
them, so they are set the same way, each with the message it prints on its own
line. The four come out 22 px apart in height, against 47 px for the six blocks
above them.
The page ended by running out
The last thing on it was one paragraph with the citation link, both authors, two
institutions and the licence run together, and then nothing. A closing block
separates those and sets them under a rule. It is not more page; it is the page
saying it is done.
And a gutter it keeps on a phone
The landing page's own rule caps its column and centres it with
margin-inline: auto, which wins over the side margin Material would give it and resolves tonothing on a narrow screen. Measured at 375 wide, every paragraph, heading, card
and block started at 0 and ended at 375: text flush against both bezels. They
start at 16 now, with no horizontal overflow and every grid down to one column.
The same rule in
extra.csshad already been given this floor. This is thesecond place the site cancels it.