9 replies [Last post]
Tyssen
Tyssen's picture
Offline
Moderator
Brisbane
Last seen: 1 year 2 weeks ago
Brisbane
Timezone: GMT+10
Joined: 2004-05-01
Posts: 8201
Points: 1386

After a long time of my site being dormant with no new articles posted (more than 20 months now) I felt like I needed something to kickstart the process of blogging again. I've been trying to redesign my site for ages but every time I try, it doesn't come out how I wanted it to, so shelve it again. So instead, I decided to do something completely new: http://www.johnfaulds.com.au/

It's my first site using all the new structural HTML5 elements and a healthy dose of CSS3. For those who check to see whether the CSS & HTML validate, they don't, but I know why they don't (mostly vendor prefixed CSS3 properties) and am happy that the site displays the way it should anyway. I haven't checked the site in IE6 or 7 and don't intend to.

One odd thing that I did come across when testing that I don't know if anyone will have any insight into is that if I linked to jQuery 1.6.1, after the page had loaded, Opera would crop the gradient body background colour to just the area of the centre column with white on either side. You could actually see the full page filled with the gradient before the js kicked in. If I dropped back down to jQuery 1.4.2, the problem went away. Puzzled Anyone else come across something like that before?

How to get help
Post a link. If you can't post a link, jsFiddle it.
My blog | My older articles | CSS Reference

thepineapplehead
thepineapplehead's picture
Offline
Guru
Milton Keynes
Last seen: 3 weeks 4 days ago
Milton Keynes
Timezone: GMT+1
Joined: 2004-06-30
Posts: 9668
Points: 801

Noticed your link on twitter

Noticed your link on twitter this morning!

Opera Mini does funny things with the images, I'm guessing it's one large image with all the social icons and hover states in one? At the bottom there's the image, then the twitter link on a new line, then the image again, then the gday link.

This is with the Opera compression stuff running so I expect sites to do funny things like that though!

I often have to switch between mobile views as sometimes Opera Mini breaks pages too much to use, so I'm grateful when a site has a specifically designed mobile version (be it separate stylesheet or subdomain) as yours does.

Miren browser and my phone's default browser, which I think is based on webkit, display identically. The drop cap S is there, the lovely serif text displays, the only problem I've found is at the end of the article, the sentence is cut off - it says 'subscribe to the feed, follow me on twitt' and I can't scroll horizontally.

The drop cap is there in Opera mini but its only slightly bigger than the text, which also all displays sans-serif.

Verschwindende wrote:
  • CSS doesn't make pies

Tyssen
Tyssen's picture
Offline
Moderator
Brisbane
Last seen: 1 year 2 weeks ago
Brisbane
Timezone: GMT+10
Joined: 2004-05-01
Posts: 8201
Points: 1386

What phone do you have?

I've checked my site out on Opera Mini on my iPod Touch and using Opera's Emulator and don't see what you describe. The icons don't show up because those styles are contained in media queries which don't kick in until larger screens. All the fonts display fine too. Haven't used the emulator much in the past so not sure how accurate it's rendering is.

Also, are you following me on Twitter? What's your username?

How to get help
Post a link. If you can't post a link, jsFiddle it.
My blog | My older articles | CSS Reference

thepineapplehead
thepineapplehead's picture
Offline
Guru
Milton Keynes
Last seen: 3 weeks 4 days ago
Milton Keynes
Timezone: GMT+1
Joined: 2004-06-30
Posts: 9668
Points: 801

LG Optimus, Android 2.2 and

LG Optimus, Android 2.2 and Opera Mini 6.0.25174

I don't know if it's something on my phone's settings, but I'm used to things going out of whack, it's nothing to worry about unless it happens for the majority of your users - and most of your mobile users will see the mobile version anyway!

I don't know if Opera's servers are compressing the mobile or desktop version of your site. I just tried Opera Mini with text wrapping off and mobile view off and I can scroll.

it does look and function nicely in my 'proper' mobile browsers though!

Yes I follow you on twitter, Tony and a couple of others on here as well, but can't say I actually tweet! I'm @thepineapplehea

Verschwindende wrote:
  • CSS doesn't make pies

Tyssen
Tyssen's picture
Offline
Moderator
Brisbane
Last seen: 1 year 2 weeks ago
Brisbane
Timezone: GMT+10
Joined: 2004-05-01
Posts: 8201
Points: 1386

Mobile version?

Quote:

and most of your mobile users will see the mobile version anyway

So do you see the desktop version on your phone? I downloaded the Android emulator the other day but haven't tried it out yet. But if I use the Opera Mobile Emulator and choose the LG Optimus One with a resolution of 800x1280 so that the media query that displays the icons kicks in, it still looks fine at my end. And if I choose a resolution smaller than 768, the icons disappear and the nav appears above the main heading like it should. :? It could be because the mobile emulator is actually using Opera Mobile rather than Mini. I've tried using the Mini simulator - http://www.opera.com/mobile/demo/ - but seems to have issues and doesn't load up properly.

How to get help
Post a link. If you can't post a link, jsFiddle it.
My blog | My older articles | CSS Reference

thepineapplehead
thepineapplehead's picture
Offline
Guru
Milton Keynes
Last seen: 3 weeks 4 days ago
Milton Keynes
Timezone: GMT+1
Joined: 2004-06-30
Posts: 9668
Points: 801

I have no idea what opera

I have no idea what opera mini does with pages, sorry, I don't know if it's rendering the desktop site and smooshing it to fit or if it's just breaking the mobile site. My point was, on all my other phone browsers it looks and works fine, and on Mini it's useable.

Sorry I can't be more help, but I do like the site!

Verschwindende wrote:
  • CSS doesn't make pies

Tony
Tony's picture
Offline
Moderator
Brisbane
Last seen: 17 hours 3 min ago
Brisbane
Timezone: GMT+10
Joined: 2003-03-12
Posts: 5108
Points: 2704

I just tried Firefox and

I just tried Firefox and Opera mini for Android and didn't notice any problems.

ThePineapplehead I am now following you on twitter so you have to tweet once in a while.
I notice our mate Hugo is tweeting more often these days.

Tyssen
Tyssen's picture
Offline
Moderator
Brisbane
Last seen: 1 year 2 weeks ago
Brisbane
Timezone: GMT+10
Joined: 2004-05-01
Posts: 8201
Points: 1386

Android

Still haven't gotten around to looking in Android myself yet. Will bust out the emulator now (and must remember to borrow my wife's phone too).

How to get help
Post a link. If you can't post a link, jsFiddle it.
My blog | My older articles | CSS Reference

thepineapplehead
thepineapplehead's picture
Offline
Guru
Milton Keynes
Last seen: 3 weeks 4 days ago
Milton Keynes
Timezone: GMT+1
Joined: 2004-06-30
Posts: 9668
Points: 801

It's a lovely system, when it

It's a lovely system, when it works properly.

With a stable internet connection (be it decent 3G/HDSPA phone signal or wifi) it's brilliant, there are so many free apps available you'll wonder how you lived without it.

One major thing missing is lack of proxy support for wifi connections.

Firefox isn't released for my phone (it has an ARMv7 processor and iirc Firefox needs ARM11?) so I'm stuck with Opera.

What's Hugo's twitter account? I'll try and tweet more but I don't understand the point, is it sort of like the status updates on Facebook?

Verschwindende wrote:
  • CSS doesn't make pies

Tyssen
Tyssen's picture
Offline
Moderator
Brisbane
Last seen: 1 year 2 weeks ago
Brisbane
Timezone: GMT+10
Joined: 2004-05-01
Posts: 8201
Points: 1386

thepineapplehead

thepineapplehead wrote:

What's Hugo's twitter account? I'll try and tweet more but I don't understand the point, is it sort of like the status updates on Facebook?

For me Facebook is for personal interactions - friends and family - whereas as Twitter is more a professional tool. I follow people in the web industry and also follow the hash tag for the CMS that I use which means I get kept up to date with what people are reading or releasing as well as being able to help others out with questions and also get your own questions answered in pretty timely fashion. If you have a simple problem that doesn't need much explaining, can often get quicker responses on Twitter than on forums. Or you can post on a forum and tweet the link to get people to look at it. In terms of getting links to new content, it's very much like RSS except it's often faster and you also don't have to subscribe to as many feeds.

How to get help
Post a link. If you can't post a link, jsFiddle it.
My blog | My older articles | CSS Reference