LoginFew web design suggestions
hexagon sun
8 years, 7 months ago at Oct 8 23:40 - I'm loving the new design, good job on that. I'm sure with the launch of this new design there are way too many bugs to fix, and these problems I'm about to talk about could pass as only the tip of the iceberg. Plus, I'm pretty sure Tom is a more than capable web designer. Yet I feel like I could make some suggestions, even though it's not my intention to turn this topic into a stackoverflow.com discussion.
1 - First of all, I've seen countless examples of images overflowing out of the screen when in mobile (and desktop), in comments and forum topics, etc. This could easily be fixed by adding a max-width: 100%; to the content inside (images, textboxes, etc). For text, it needs to be put inside a div, and inside a tag (p, span, etc) so it won't overflow.
-- Seen this happening in main page comments, forum topics, profile comments.
2 - Too much styling in the HTML. Styling should only be done in CSS, separate from the HTML. This just makes things harder to standardize and fix.
-- The entire HTML.
3 - Fixed backgrounds in profile - background images will depend on the parent element, if the parent element moves, the background image will move too. So in order to fix this, background images should be added to the body tag, or to a static div.
-- In user profiles.
4 - For responsiveness, css media queries should be used to hide all the not so necessary content, which could help in organising the content, make pages simpler and removing the infinite scrolling. Some pages just get too crowded with information in small screens, and the stuff that appears underneath each list (Related lists, etc) are unnecessary for mobile - at least the in way they exist now.
-- In many pages, crowded with information.
5 - While writting this, I noticed this textarea box could be stretched forever, both vertically and horizontally, fix this by adding a resize: vertical;, just so it resizes vertically, and give it a max-height if you want to (if you do, it'll just add a scroll, so no big deal - users will still see everything they write).
-- In any textarea box.
6 - In Reviews page, for small screens, text should move underneath the image, otherwise it'll only contribute to the infinite scrolling of the page.
Last time I came to Listal it was still the old design, and I had seen the beta version and thought it looked pretty cool. Now I came back and the new design is already up, with a lot of (easily fixable) structure bugs, so I figured I could roam a while, make some suggestions and help in what I can. If you find anything I said irrelevant, please ignore.
Keep up the great work, btw.
1 - First of all, I've seen countless examples of images overflowing out of the screen when in mobile (and desktop), in comments and forum topics, etc. This could easily be fixed by adding a max-width: 100%; to the content inside (images, textboxes, etc). For text, it needs to be put inside a div, and inside a tag (p, span, etc) so it won't overflow.
-- Seen this happening in main page comments, forum topics, profile comments.
2 - Too much styling in the HTML. Styling should only be done in CSS, separate from the HTML. This just makes things harder to standardize and fix.
-- The entire HTML.
3 - Fixed backgrounds in profile - background images will depend on the parent element, if the parent element moves, the background image will move too. So in order to fix this, background images should be added to the body tag, or to a static div.
-- In user profiles.
4 - For responsiveness, css media queries should be used to hide all the not so necessary content, which could help in organising the content, make pages simpler and removing the infinite scrolling. Some pages just get too crowded with information in small screens, and the stuff that appears underneath each list (Related lists, etc) are unnecessary for mobile - at least the in way they exist now.
-- In many pages, crowded with information.
5 - While writting this, I noticed this textarea box could be stretched forever, both vertically and horizontally, fix this by adding a resize: vertical;, just so it resizes vertically, and give it a max-height if you want to (if you do, it'll just add a scroll, so no big deal - users will still see everything they write).
-- In any textarea box.
6 - In Reviews page, for small screens, text should move underneath the image, otherwise it'll only contribute to the infinite scrolling of the page.
Last time I came to Listal it was still the old design, and I had seen the beta version and thought it looked pretty cool. Now I came back and the new design is already up, with a lot of (easily fixable) structure bugs, so I figured I could roam a while, make some suggestions and help in what I can. If you find anything I said irrelevant, please ignore.
Keep up the great work, btw.