Please login or register.

Login with username, password and session length
Advanced search  

News:

Latest sNews - sNews 1.7 - with its own forums - for discussion and user mods.

Pages: [1] 2 3

Author Topic: Introducing the new Inkpattern Magazine site  (Read 7904 times)

Fred K

  • Still trying to learn stuff
  • ULTIMATE member
  • ******
  • Karma: 130
  • Posts: 2728
    • Personal
Introducing the new Inkpattern Magazine site
« on: September 23, 2009, 08:56:06 PM »

My baby: http://inkpattern.com/
It's now a magazine. Or a webazine. An eMag. Anyway, it's sweet, I think.

Note: the site is built with HTML 5 and uses some CSS 2.1 and CSS 3 effects that not every browser supports yet. I have tested the site in Firefox 3, Opera 9, Safari 4/Mac, Stainless/Mac (which is similar to Google Chrome) and haven't come across any rendering issues in those browsers. The downside to using Firefox and Opera is that those two browsers don't support the HTML 5 <video> element properly, at least not yet, so the few videos that are in place at this time won't be viewable in Firefox or Opera unfortunately. This, by the way, is a choice that the browser makers (Mozilla and Opera) have made, it's not a fault in the design or the HTML spec (well, that can perhaps be argued over a beer or three).

Most javascript effects, like the slide shows, are jQuery based. All “fancy” fonts on the site are using @font-face with font kits from FontSquirrel and all are as far as I have been able to ascertain fully web-licensed. I was planning to use the Toyota IQ font (see article on the site) but they never bothered to respond to questions about license restrictions so I pulled it in the end.

Contributions, ideas for content etc are happily accepted (best way to do that is to use the contact form on the site btw). And obviously critique. I think I can take it. :)

Ok, there you have it. A magazine site that sort of looks like a real magazine. All built with sNews 1.7, and many of the heavier mods could only be done with the help of you guys (philmoz, bakercad, Joost, equilni/nukpana, poppoli, Sven, and anyone else that I'm forgetting at the moment.)

Oh yeah, one more thing: due to the nature of the content, or my mindset (take your pick), the site is restricted for US residents. Sorry, but, it's a statement. Hopefully it'll change soon.
Logged

poppoll

  • Full Member
  • ***
  • Karma: 47
  • Posts: 199
    • Poppoll's sNews playground
Re: Introducing the new Inkpattern Magazine site
« Reply #1 on: September 24, 2009, 04:03:37 AM »

Fred,
 In safari on winXp  the site freeze on the toyata page.
When I go to this page with Chrome I get an error.

I think you must increase the font-size for the @font, it is not very good readable.
Had this to with my @font "Zag"

I don't think it's a good idea to have the posts in 2 columns.
I reed my screen from left to right.
My screen is NOT a magazine or newspaper.
Bad idea.. ;D
PP
« Last Edit: September 24, 2009, 04:14:22 AM by poppoll »
Logged

Fred K

  • Still trying to learn stuff
  • ULTIMATE member
  • ******
  • Karma: 130
  • Posts: 2728
    • Personal
Re: Introducing the new Inkpattern Magazine site
« Reply #2 on: September 24, 2009, 06:33:06 AM »

Thanks for the comments, Paul. I'll look at this. The 2-column layout will stay for the time being, unless I get overwhelming critique about it of course, because I prefer it myself. But I've noted the comment and I'll consider it.

It's interesting that Safari and Chrome on Windows has trouble playing the Toyota video, it is an flv file which shouldn't be a problem normally. I can only assume that Safari/Win and Chrome have issues with the Flash plugin (?) or the <video> element. I'll need to investigate this further. Videos won't be that prominent a feature on the site though (I think...).

Cheers
Logged

Sven

  • ULTIMATE member
  • ******
  • Karma: 88
  • Posts: 2029
  • Chasing MY bugs!
    • hiseo.fr - rédacteur Web
Re: Introducing the new Inkpattern Magazine site
« Reply #3 on: September 24, 2009, 09:05:46 AM »

Thanks for the comments, Paul. I'll look at this. The 2-column layout will stay for the time being, unless I get overwhelming critique about it of course, because I prefer it myself.(...)
Your playground for HTML 5 and CCS 3 is very interesting.
Regarding embedded videos I've found this yesterday: HTML5 video element using SVG for the player interface.
Now about the 2 cols question, on my point of view it suits to an on line magazine.
A french online magazine (sorry I've tried I am not able to retrieve its name or URI) offers the choice to have the article printed in 2 col or just one by on click on a little button at the top of it. That was nice.
Another point regarding your 2 col design: there are not aligned vertically. It needs to be justified vertically automatically. But how can it be done?

Fred K

  • Still trying to learn stuff
  • ULTIMATE member
  • ******
  • Karma: 130
  • Posts: 2728
    • Personal
Re: Introducing the new Inkpattern Magazine site
« Reply #4 on: September 24, 2009, 10:17:46 PM »

It seems that some comments have disappeared...
Thanks for the feedback, Sven. Making the columns fully justified is quite hard, even harder than in print (where you can make manual changes to fix such issues better). I have made some changes today, both for the column alignment and the @font-face fonts (for poppoli ;)) so hopefully that will help a little. Overall though I'm quite happy with the layout even if there are always tweaks to be made along the way.
I prefer to refrain from using scripts for layout effects and my guess is that the button you mention, to control column layout, requires a piece of javascript to do its thing. For inkpattern, I'm trying my best to use CSS for styling/layout and scripting for functionality. So far, it works, in most browsers.

The SVG video page you link to, Sven, is an XHTML5 page which is decidedly different from HTML5 and something that requires a lot more work than using HTML5 with <video> elements... SVG is interesting though, as is XHTML5, but I need to learn it better before attempting to use it on a live site.
Logged

Sven

  • ULTIMATE member
  • ******
  • Karma: 88
  • Posts: 2029
  • Chasing MY bugs!
    • hiseo.fr - rédacteur Web
Re: Introducing the new Inkpattern Magazine site
« Reply #5 on: September 26, 2009, 10:09:01 AM »

(...)
I prefer to refrain from using scripts for layout effects and my guess is that the button you mention, to control column layout, requires a piece of javascript to do its thing. For inkpattern, I'm trying my best to use CSS for styling/layout and scripting for functionality. So far, it works, in most browsers.
It can be done easily Fred:
Code: [Select]
<a href="#" onclick="document.getElementById('your div ID').className='one_col'; return false;">1 col display"</a>

Fred K

  • Still trying to learn stuff
  • ULTIMATE member
  • ******
  • Karma: 130
  • Posts: 2728
    • Personal
Re: Introducing the new Inkpattern Magazine site
« Reply #6 on: September 26, 2009, 03:59:32 PM »

Sven, I'll look into it. Thanks.
Looked, tested. Doesn't work in Safari unfortunately. I'll keep it in mind for when I add a styleswitcher though (down the line).
« Last Edit: September 26, 2009, 06:12:20 PM by Fred K (agentsmith) »
Logged

philmoz

  • High flyer
  • ULTIMATE member
  • ******
  • Karma: 161
  • Posts: 1988
    • fiddle 'n fly
Re: Introducing the new Inkpattern Magazine site
« Reply #7 on: September 26, 2009, 11:01:02 PM »

It seems that some comments have disappeared...
yup, my post has vanished...

On dialup, it is slow to load... very.

I suspect it may be the https addressing. Every https seems to load slow on dialup.

Is that part of your 'restricted for US residents'??
Logged
Of all the things I have lost, it is my mind that I miss the most.

Joost

  • Guest
Re: Introducing the new Inkpattern Magazine site
« Reply #8 on: September 26, 2009, 11:09:42 PM »

It seems that some comments have disappeared...
On dialup, it is slow to load... very.

I suspect it may be the https addressing. Every https seems to load slow on dialup.

Is that part of your 'restricted for US residents'??

At my end it is not that fast either, using adsl.

@Phil, you use a dial-up connection?
Is that still common down there?
Logged

Fred K

  • Still trying to learn stuff
  • ULTIMATE member
  • ******
  • Karma: 130
  • Posts: 2728
    • Personal
Re: Introducing the new Inkpattern Magazine site
« Reply #9 on: September 27, 2009, 06:38:46 AM »

On dialup, it is slow to load... very.

I suspect it may be the https addressing. Every https seems to load slow on dialup.

Is that part of your 'restricted for US residents'??

Well, the host's had some issues with the server off and on the past week, don't know if that might account for the slowness, although I haven't noticed that to be honest -- not just because I'm on broadband but because after changing from www to https addressing it all got much faster in response for me... go figure. I was hoping it was the same for others. (Haven't had time to test  on other computers or lines than my own yet.)

As for the non-US restriction, speed is not part of it (could've been if I'd thought of it ;)). Actually I'd f***ed that part up and didn't notice until earlier today -- the US blocking was looking for a file on my local box... meh- (That's been fixed though.)
Don't know if that has anything to do with the slowness either but I doubt it since I'm not blocking you guys, only visitors from the continent and islands of US... (and that's only temporary).

Biggest reason for the slowness is (probably) the use of somewhat heavy images, at least the cover image, although in all fairness it's not that big going by today's standards. I know there are a bunch of people in the UK that are still on dial-up lines and I guess the same can be true in rural areas in most 'IT-advanced' countries (there are a few people like that in Sweden, 75 or so). However, the assumption is that the average user today is on at least a 1.5 mb line. When I checked the site on my iPod, which doesn't like heavy files, it was slow but not badly slow, so I let it slide. Sorry. 8)
I'll optimize it as I go along but I don't think it'll ever be *fast* on dial-up.
Logged

Joost

  • Guest
Re: Introducing the new Inkpattern Magazine site
« Reply #10 on: September 27, 2009, 07:22:16 AM »


As for the non-US restriction, speed is not part of it (could've been if I'd thought of it ;)). Actually I'd f***ed that part up and didn't notice until earlier today -- the US blocking was looking for a file on my local box... meh- (That's been fixed though.)
Don't know if that has anything to do with the slowness either but I doubt it since I'm not blocking you guys, only visitors from the continent and islands of US... (and that's only temporary).

Any line of code slows down a script or program, although the filter (US blocking) is - surprisingly - faster than expected.

I'll optimize it as I go along but I don't think it'll ever be *fast* on dial-up.

Yep, dial up is the real bottleneck.

I have to correct my previous remark about slowness on adsl: It wasn't the transmission that was slow, the browser had some difficulties rendering the page, freezing it for a while. Of course, that browser is not worthy mentioning (IE6)  ;D
Logged

Sven

  • ULTIMATE member
  • ******
  • Karma: 88
  • Posts: 2029
  • Chasing MY bugs!
    • hiseo.fr - rédacteur Web
Re: Introducing the new Inkpattern Magazine site
« Reply #11 on: September 27, 2009, 07:41:01 AM »

Looked, tested. Doesn't work in Safari unfortunately. I'll keep it in mind for when I add a styleswitcher though (down the line).
Shit!
At my end it is not that fast either, using adsl.
Here too. ;D
650 kb needs to be loaded. :o

Fred K

  • Still trying to learn stuff
  • ULTIMATE member
  • ******
  • Karma: 130
  • Posts: 2728
    • Personal
Re: Introducing the new Inkpattern Magazine site
« Reply #12 on: September 27, 2009, 03:59:24 PM »

650 kb needs to be loaded. :o

what?!
/*Checks sizes*/
Shouldn't be more than around 350 kb on first load (front page). I'll be removing FancyZoom though which will cut weight with about 1/3. If that's any help?
Logged

nukpana

  • Hero Member
  • *****
  • Karma: 71
  • Posts: 663
Re: Introducing the new Inkpattern Magazine site
« Reply #13 on: September 27, 2009, 04:39:21 PM »

<-- in the us and I can view the site fine.

It looks good I like it Fred. I wonder how you will separate the issues in sNews?
Logged

Keyrocks

  • Doug
  • ULTIMATE member
  • ******
  • Karma: 449
  • Posts: 6019
  • Semantically Challenged
    • snews.ca
Re: Introducing the new Inkpattern Magazine site
« Reply #14 on: September 27, 2009, 06:36:30 PM »

650 kb needs to be loaded. :o

what?!
/*Checks sizes*/
Shouldn't be more than around 350 kb on first load (front page). I'll be removing FancyZoom though which will cut weight with about 1/3. If that's any help?

Having started in the printing business cleaning and putting letterpress type slugs back in their trays (as a young teen), I quite like your template Fred, excellent.

I don't think FancyZoom.js is loading on the homepage though, at least it's not visible in the source.
483 KB is attributed to image, CSS and source load.

Image load (14):   437.42 KB
css load (4):   34.31 KB
generated source:   11.4 KB
-----------------------------------------------------
Total load:      483.13 KB
Logged
Do it now... later may not come.
-------------------------------------------------------------------------------------------------
sNews 1.6 MESU | sNews 1.6 MEMU
Pages: [1] 2 3