Mongrel website - whoop whoop

User avatar
Mongrel
Posts: 8574
Joined: Mon Jan 20, 2014 6:28 pm
Location: Canadumb

Re: Mongrel website - whoop whoop

Postby Mongrel » Sun Aug 23, 2015 6:54 pm

Site is live and complete, in English and French.

Going to start letting people know as soon as I upload a new set of miniatures I'm varnishing now (they have lots of funky detail, so I figure they're a nice "most recent post"). In the meantime let me know if you see any bugs (except for the full-size image sometimes not displaying properly on phones - that's a known issue)
Image

User avatar
Mongrel
Posts: 8574
Joined: Mon Jan 20, 2014 6:28 pm
Location: Canadumb

Re: Mongrel website - whoop whoop

Postby Mongrel » Sun Aug 23, 2015 11:02 pm

Ran into a display bug we are trying to troubleshoot.

Normally, the site should re-size dynamically to fit the screen (using CSS) (the intention is to avoid scrollbars). However, one fellow using a laptop on Win10 got this error:

Image

We have previously tested this resolution (1366x768), this aspect ratio (16:9), and this browser (Chrome), without previously getting this error. It may be related to the new Windows 10 taskbar, but we don't know. Anyone?
Image

User avatar
Thad
Posts: 5513
Joined: Tue Jan 21, 2014 10:05 am
Location: 1611 Uranus Avenue
Contact:

Re: Mongrel website - whoop whoop

Postby Thad » Mon Aug 24, 2015 12:48 am

Well, your image at full size is 1500x1125, but is set to max-width: 68% (of the width of the viewport).

1366 * 0.68 = 929
929/1500*1125 = 697.

And you've also got a margin of 8 pixels at the top of the page. (Well, all around it, but the top is what's important for our purposes here.) So really you're looking at a height of 705px. Which leaves you with only 63 pixels to work with for not just the taskbar but all the UI stuff -- taskbar, titlebar, navbar, bookmark bar. Frankly I'd be surprised if all that stuff didn't add up to more than 63px.

Short answer: I'd drop that max-width a few points.

Long answer: While it is trivial to use CSS to set an element's width based on its parent's width, it is, for some reason, not possible to do the same with height*. There are ways of using JavaScript to check the window's height and set elements' heights based on that, and it's pretty trivial to do in jQuery, but it's probably a needlessly complicated solution for what you're doing here.

Tangent: This is a pretty rudimentary approach to responsive design. It might be good enough if you're keeping the site simple. If the site gets more complex and you need a more all-encompassing solution, we can talk about media queries and frameworks later on down the line.



* unless you use tables. Do not use tables. Tables are for organizing information into intersecting rows and columns, not for designing layouts.

User avatar
Mongrel
Posts: 8574
Joined: Mon Jan 20, 2014 6:28 pm
Location: Canadumb

Re: Mongrel website - whoop whoop

Postby Mongrel » Mon Aug 24, 2015 1:23 am

Yeah, my brother mentioned that he originally wanted to tie the ratio to height but CSS couldn't work on that variable for some reason. I guess it's good to know that there really is no option for that as opposed to our overlooking something obvious, but it's not good for an answer.

Adding whitespace on the bottom is a trade-off, but works as a simple solution in lieu anything short of using JQuery.
Image

User avatar
Thad
Posts: 5513
Joined: Tue Jan 21, 2014 10:05 am
Location: 1611 Uranus Avenue
Contact:

Re: Mongrel website - whoop whoop

Postby Thad » Mon Aug 24, 2015 1:53 am

Now imagine, collectively, how many man-hours have been lost by people trying to create consistent fucking heights for things on websites. Boggles the mind.

Keep in mind CSS is a technology from 1996 that has only had one finalized major revision. (CSS3 is still not a finalized spec, though parts of it are formal recommendations and a lot of its candidate recommendations and drafts are well-supported across all major browsers.) For as rapidly as the web changes, the standards it's built on evolve slowly.

User avatar
Mongrel
Posts: 8574
Joined: Mon Jan 20, 2014 6:28 pm
Location: Canadumb

Re: Mongrel website - whoop whoop

Postby Mongrel » Mon Aug 24, 2015 9:51 pm

Trying to figure out two things which can be ignored if they can't easily be made to work, but would be nice to have working because best practices and all that. Specifically, I think these issues might have to do with our security settings or how the server is setup or such.

The first is that we can't do a redirect to a 404 page. My brother wrote up a .htaccess file and put it in the root folder but it didn't work.

The second is that several people pointed out that I have no favicon, so I made one. It's visible when I go directly to http://mongrel.brontoforum.us/favicon.ico but does not properly display in the usual locations. I don't know if this is because I've done something wrong, or because of the way my share of the brontoserver space is set up.

These are mostly directed at Brent, but I figured I'd ask here in case anyone else had any answers.
Image

User avatar
Brentai
Woah Dangsaurus
Posts: 2056
Joined: Mon Jan 20, 2014 2:40 pm

Re: Mongrel website - whoop whoop

Postby Brentai » Mon Aug 24, 2015 11:28 pm

I think the way I have it set up, I need to add the ErrorDocument into the httpd conf on my end. Which is fine, I used my massive brain to figure out what 404 page you probably wanted, and linked it like so: http://mongrel.brontoforum.us/massivebrain

As for the favicon, all I can suggest is to try to use your full URL to link to it, or stop trying to use ridiculous proprietary Apple styles.

User avatar
Mongrel
Posts: 8574
Joined: Mon Jan 20, 2014 6:28 pm
Location: Canadumb

Re: Mongrel website - whoop whoop

Postby Mongrel » Mon Aug 24, 2015 11:32 pm

Haha, thanks Brent.
Image

User avatar
Mongrel
Posts: 8574
Joined: Mon Jan 20, 2014 6:28 pm
Location: Canadumb

Re: Mongrel website - whoop whoop

Postby Mongrel » Tue Aug 25, 2015 12:55 am

Found a potential real fix for the dynamic resizing.

I found another way to do it with just CSS:

Code: Select all

.content-main {
  text-align: center;
  /* fit to viewport (visible screen area) */
  width: 100vw;
  height: 50vw; /* height:width ratio = 9/16 = .5625  */
  max-height: 100vh;
  max-width: 177.78vh; /* 16/9 = 1.778 */
  margin: auto;
  position: absolute;
  top:0;bottom:0; /* vertical center */
  left:0;right:0; /* horizontal center */
}


This uses some new units called "viewport units", which is supported even in IE as of version 9: https://developer.mozilla.org/en-US/docs/Web/CSS/length (scroll to Browser compatibility)


ALSO, the gallery has been updated with new functionality reflecting more recent conventions for image galleries - the 'X' has been removed and you can now click anywhere to close an image, and arrows that allow direct sequential navigation within a sub-gallery have been added so that you don't have to open, close, open to look at multiple images.
Image

User avatar
Thad
Posts: 5513
Joined: Tue Jan 21, 2014 10:05 am
Location: 1611 Uranus Avenue
Contact:

Re: Mongrel website - whoop whoop

Postby Thad » Tue Aug 25, 2015 1:44 am

Huh, hadn't seen vw and vh before; might be worth a look.

User avatar
Mongrel
Posts: 8574
Joined: Mon Jan 20, 2014 6:28 pm
Location: Canadumb

Re: Mongrel website - whoop whoop

Postby Mongrel » Tue Aug 25, 2015 10:00 pm

I would really appreciate it if as many people as possible could try opening a portfolio image on mobile. Some people are reporting weird gallery issues on mobile, others are fine. No idea how pervasive it is.
Image

User avatar
beatbandito
Posts: 1539
Joined: Tue Jan 21, 2014 8:04 am

Re: Mongrel website - whoop whoop

Postby beatbandito » Wed Aug 26, 2015 3:17 pm

The portfolio image browser works fine in chrome mobile on android, but the larger images do go off screen with no side scroll.

On both mobile and desktop: English and French seem to display in different resolutions. Also having the other available language displayed instead of current seems counter-intuitive to me, but that's totally subjective.
Image

User avatar
Mongrel
Posts: 8574
Joined: Mon Jan 20, 2014 6:28 pm
Location: Canadumb

Re: Mongrel website - whoop whoop

Postby Mongrel » Wed Aug 26, 2015 3:24 pm

Having the other language displayed is standard, because it's a button to take you to the version of the site in that language.

The French site might look different because we've been doing bugfixes on the English site only and will update the French site once all the bug fixes are finalized.

The scrolling issue on mobile for the gallery has been an intractable problem and we're really not sure how to fix it.
Image

User avatar
Mongrel
Posts: 8574
Joined: Mon Jan 20, 2014 6:28 pm
Location: Canadumb

Re: Mongrel website - whoop whoop

Postby Mongrel » Sun Aug 30, 2015 1:21 pm

Well, site's properly live now. Now comes the harder part: Advertising.
Image

User avatar
Mongrel
Posts: 8574
Joined: Mon Jan 20, 2014 6:28 pm
Location: Canadumb

Re: Mongrel website - whoop whoop

Postby Mongrel » Mon Nov 16, 2015 3:32 pm

Now that I know the website move worked fine, I can look again at trying to drum up business.

Anybody ever do much work with press releases?

Still having a lot of trouble with advertising. Paid adverts are right out (and not that effective for what I'm doing anyway). I have informal followers on the one large minis forum where I am allowed to advertise (most, like the Reaper, PP, Dakka, etc. don't allow any sort of advertising, even just sig links) There's one or two news aggregator services for minis and they accept submissions.

After looking at some basic guides, here's the draft I put together:

New Painting Service Framson Studios Now Open

With all the Kickstarters and new miniatures lines on the markets these days, not everyone has time to paint all their shiny new toys. Luckily, A new painting service has opened for business to help people turn those grey plastic figures into lively characters. Framson Studios offers high-quality painting, with a special focus on bringing out the individual personality and expression of each miniature painted.

Come see our work at framsonstudios.com


There will be an image. Should it be longer or add anything else?
Image

User avatar
François
Posts: 1001
Joined: Tue Jan 21, 2014 8:00 am

Re: Mongrel website - whoop whoop

Postby François » Tue Nov 17, 2015 7:14 am

It reads more like a promotional article or advert than a press release, but depending on where it's going, that might not actually be a problem. In any case, the least ad copy can do is respect the potential client's time, so I would say that's a decent length. I'm curious as to why you don't mention artwork or terrain building though; is it a deliberate focus/specialization thing? I could see it turning into a "wait, you guys do terrain too? I had no idea!" situation somewhere down the line.

User avatar
Mongrel
Posts: 8574
Joined: Mon Jan 20, 2014 6:28 pm
Location: Canadumb

Re: Mongrel website - whoop whoop

Postby Mongrel » Tue Nov 17, 2015 1:22 pm

Mentioning artwork is a good angle, though terrain can probably be left off for the sake of brevity.
Image

Who is online

Users browsing this forum: No registered users and 1 guest