Thread Rating:
  • 0 Vote(s) - 0 Average
  • 1
  • 2
  • 3
  • 4
  • 5
szmigielDESIGN - portfolio
#1
http://szmigieldesign.pl/

Originally without any CMS, but I have quickly become tired of manually adding content and soon decided to re-build it using GetSimple CMS. So here it goes - GS 3.0 + I18N + I18N Gallery. Also, I'd like to create a blog section soon, but first I need to find out a smooth blog solution.
Reply
#2
I love it! I wonder, what code did you use so that the breadcrumbs don't display
Home > Home
on the index page? Of course, my site uses mod_rewrite to include the lang as 'en' or 'es' in the url instead of the '?setlang=es'
Todo arde si le aplicas la chispa adecuada.
Reply
#3
I like the design. But sadly it doesn't show well with Javascript switched off.
If I came to this page by browsing I wouldn't stay because of this.
I18N, I18N Search, I18N Gallery, I18N Special Pages - essential plugins for multi-language sites.
Reply
#4
yurifanboy
Here's the code:
Code:
--- index.php ---

    <div id="breadcrumbs">
    <p><a href="<?php get_site_url(); ?>">Home</a><span class="breadcrumbs-switch"> <?php get_i18n_breadcrumbs(return_page_slug(TRUE)); ?>
    </span>
    </p>
    </div>

--- styles.css ---

.index .breadcrumbs-switch {
    display: none;
}

"Home" is hard-coded into template and breadcrumbs are turned off entirely with CSS on home page. Also, I don't feel that ?setlang=lang is a big problem. After all, it's just the "final switch" (and I suck at mod_rewrite wizardry Big Grin).

mvlcek
To be honest - I've never looked at this site with JS switched off and it looks like the nivo-slider is a no-go without JS (and strangely enough it doesn't display anything, even plain images instead). I will investigate the issue - thanks :-)

EDIT:
Fixed by simply duplicating the content with noscript.
Reply
#5
szmigielDESIGN Wrote:To be honest - I've never looked at this site with JS switched off and it looks like the nivo-slider is a no-go without JS (and strangely enough it doesn't display anything, even plain images instead). I will investigate the issue - thanks :-)

EDIT:
Fixed by simply duplicating the content with noscript.

You could also replace it with I18N Gallery's cycle type - then it will also work without JS, when the user clicks the arrows or on the navigation.
I18N, I18N Search, I18N Gallery, I18N Special Pages - essential plugins for multi-language sites.
Reply
#6
Great idea! Works the same way like the nivo-slider but is integrated into I18N and degrades nicely. Neat.
Reply
#7
The custom font is barely readable.
Going further I wouldnt' consider this page as a (web)designer portfolio, because of many flaws in my taste, but rather a photographer's website.
Addons: blue business theme, Online Visitors, Notepad
Reply
#8
Considering that it's a typical showcase page (design or photography - doesn't matter) without much text on it - what's wrong with this font?

What other flaws you had in mind?
Reply
#9
szmigielDESIGN Wrote:Considering that it's a typical showcase page (design or photography - doesn't matter) without much text on it - what's wrong with this font?

What other flaws you had in mind?
Compare 2 sshots where on the right side is your showcase page with disabled jscript.
In my opinion: default font is more readable, than the custom font-face.

And as it goes for a showcase ... whole browser's window area is filled up with img slider.
As a typical internaut I wouldn't guess there's anything else under the slider.

Maybe I'm an usability addict, but there's still DESIGN in your domain name rather than PHOTOGRAPHER ;-)

ps. those are only mine 2 eurocents Wink
Addons: blue business theme, Online Visitors, Notepad
Reply
#10
I understand your concerns. However, I'm not concerned that it is hard to read. You'll hardly find anything better than Helvetica, Arial or similar typefaces in terms of readability and this is pretty obvious. The whole point of @font-face is diversity in design. I would never argue that Capsuula is better in terms of readability than Tahoma (being the fallback font), but it just "looks" better.

As for the slider. If the website's purpose is purely the showcase of my works and the main navigation is always visible - then what's the problem with footer being below the first screen? What's more, being a typical internaut - I would expect to find contact information, together with other less important data on the bottom of almost every page I visit ;-)

Design... such a broad word. My works vary from photography, through photomanipulations, print design and finally (some) web design and I do have a feeling that it can be summed up simply as design. The other thing is - I'm not super-happy with this particular site but that's just the pity of how I'm doing things which are meant for me. I always do a better job for my clients than for me. That's stupid but I'm always struggling with designing my own portfolio, business cards or similar works ;-)

Thanks for your comment.
Reply
#11
I wouldn't bother about people having javascript turned off.
There aren't a large percentage surfing the web with that turned off.
Most of the time the users have no clue how to turn it off - they don't even now what javascript is.
Those that do know it are probably developers or programmers themselves & they now how to turn it on.

Nice design - I like it...

Niklas
Reply
#12
This website isn't JS heavy. The problem was - it looked completely empty without slider on the first page, and that's what happened without JS.

I plan on redesigning the slider in near future because right now it doesn't tell much about me or my works, and as yojoe suggested - it has some sort of usability issue.

Thanks for your support.
Reply
#13
I like the design, but how the hell did you do those shape changes? On services page! I see you combined Masonry with some other js, but how? Can you tell me your secret Wink Thanks in forward! Smile
Reply
#14
This is no secret.

Take a look at main styles.css file starting from the area marked with /* MASONRY */.

I've used object oriented CSS to produce various reusable CSS styles. Starting from .tilesBase class and its :hover pseudo-element through .tiles240 or .tiles360 to produce various sizes and .tilesRed, .tilesGreen etc. to produce different colors very quickly and efficiently.

About shapes - it's simply a matter of CSS3 border-radius parameter. Lower right corner in case of big blocks, and all corners in case of small squares.

Here's some info about border-radius: link
Reply
#15
szmigielDESIGN Wrote:This is no secret.

Take a look at main styles.css file starting from the area marked with /* MASONRY */.

I've used object oriented CSS to produce various reusable CSS styles. Starting from .tilesBase class and its :hover pseudo-element through .tiles240 or .tiles360 to produce various sizes and .tilesRed, .tilesGreen etc. to produce different colors very quickly and efficiently.

About shapes - it's simply a matter of CSS3 border-radius parameter. Lower right corner in case of big blocks, and all corners in case of small squares.

Here's some info about border-radius: link

Wow that looks amaizing! Smile Thanks for the "lession" Wink
Reply
#16
You're welcome. Thanks for commenting.
Reply




Users browsing this thread: 1 Guest(s)