By kbahey on

Hello all Drupallers.

The Baheyeldin Dynasty web site has been online since 1999, going through several iterations over the years. It started with simple plain HTML, then a rudimentary home brewed PHP CMS. It went live on Drupal on January 2, 2004, with a modified style of Bluemarine. When 4.5 came out, it was switched to Pushbutton. With 4.6, it was switched to phptemplate Pushbutton, until today.

I have relaunched my web site using a brand new custom designed theme.

The new graphics design and CSS is by Ivan Raszl of Creative Bits.

The theme was originally all blues, and was called the redsea. It can now be called Sea Mango or something, because of all the oranges.

It has a table layout (I know, I know), the calligraphy reflects where I am originally from (Egypt). The logo is my last name in Arabic stylized calligraphy form.

The web site runs some custom modules that I developed, including feedback, sitemenu, and adsense.

As for the site contents, I don't expect that readers here would be interested in most of them, but it is quite a mix on various topics that interest me at various times. I plan to have a "favorite articles" block soon.

Feedback and comments welcome (on the theme or if you have time to burn, the content too).

Comments

factoryjoe’s picture

factoryjoe commented

Hey Khalid,

Great work. Glad to see you got this up -- it looks great. I think you've far exceeded what you would have had if you stuck with the Spread Firefox theme. Bravo!

Chris

kbahey’s picture

kbahey commented

Yes, Chris.

My months long quest for a distinctive looking yet clean theme is over.

I ported Spreadfirefox, Democratica and Lincoln's Revenge partially to get a good theme. Good that this was not a waste and people are using them.

I know that you are re-writing them now, and looking forward to them.

--
Consulting: 2bits.com
Personal: Baheyeldin.com

--
Drupal performance tuning and optimization, hosting, development, and consulting: 2bits.com, Inc. and Twitter at: @2bits
Personal blog: Ba

sicario’s picture

sicario commented

Cool desing and nice tabs. I like the rounded boxes too :]

Felicitaciones!

Steven’s picture

Steven commented

I love the theme... it has refreshing colors, crisp design. The arabic motifs around the page really make it complete.

Yet another theme that shows that themes designed for a particular site are always better than generic themes ;).

The only thing I spotted was this tiny detail: you use separate images for the hover effect on the tabs at the top... this means it takes a moment for them to load in the first time. Traditionally people use preloading of images to get around this, but there is a modern technique called "CSS sprites" where you put the different images together in one and use background-position to select the right one. Works like a charm.

--
If you have a problem, please search before posting a question.

kbahey’s picture

kbahey commented

Hey Steven,

Thanks for the tip. Will give it a try sometime.

[Start Rant]
What really took time developing this theme, apart from getting the initial "look" and such, was the piece of crap called MS IE.

Things would work great on FireFox and Safari, but then we get peekaboo bugs and all sort of other issues with IE not conforming to CSS. It would take days and nights tracking the bug down (identifying which CSS tag causes IE to misbehave, and working around it). Ivan can tell us more about the specifics if he has the time.

The sad part is that IE7 will still not support CSS2. As always MS is ignoring the standards and getting away with it.

Too bad IE is still used by 74% of my visitors though.
[/End Rant]

--
Consulting: 2bits.com
Personal: Baheyeldin.com

--
Drupal performance tuning and optimization, hosting, development, and consulting: 2bits.com, Inc. and Twitter at: @2bits
Personal blog: Ba

Steven’s picture

Steven commented

I estimate about 40-50% of the time I spent developing the design of Bluebeach (the drupal.org theme) went into figuring out IE bugs. It is not nice.

Luckily the CSS sprites is one of the few techniques which work pretty flawlessly in most places. The only issue I've discovered is that you should make sure there is some extra transparent padding below the last sprite. Sometimes Safari/Konqueror will repeat the image even though it is set to no-repeat. By providing enough padding, the repetition won't be visible.

--
If you have a problem, please search before posting a question.

iraszl’s picture

iraszl commented

I'm so happy you like it. Thanks for the kind words.

As K said I spent much time debugging IE. Looking back the main issue was a very simple bug. The problem was that headers and footers of nodes were disappearing. I was trying to tackle it several different ways, until with a help of a friend, who is a CSS debugging guru we found a simple method. We figured it is caused by a background given to the main div. When I removed the background almost all the problems disappeared. It seems that IE6 renders backgrounds sometimes incorrectly and the background color of #main appeared above everything else. But not always and not fully. It was completely random. It felt like the layers would jump from the bottom to the top. I don't know what this issue is called, but very unusual.

Other issues were all known and were relatively easy to tackle. A very useful extension to FF that helped me to debug is Aardvark besides others. More about these tools here: http://creativebits.org/Firefox_web_developer_tools

I just want to say that the amount of time and effort spent worldwide by web designers to fix the discrepancies of IE is enormous. I think it's an amazing flaw from MS. They should realize that with high market share comes responsibility. I hope they will get it right with IE7.

stevensj2’s picture

stevensj2 commented

Great color choice! I really like it a lot - very refreshing to look at :-)

-----------------
Josh Stevens
Nautilus7 Design | www.nautilus7.com

venkat-rk’s picture

venkat-rk commented

One of the most stunningly beautiful drupal sites I have ever seen. And, coming from India, I can really appreciate the motifs- we have thousands here too.

Great work!

laura s’s picture

laura s commented

I love the header graphics and the subtle texture in the topnav buttons. If I were to change anything, it would be with the pale greenish-blue color of the right sidebar and sticky post. I love the other colors so much, it's almost a disappointment. But that's nitpicking and subjective. Very nice!

===
Laura
pingV

_____ ____ ___ __ _ _
Laura Scott :: design » blog » tweet

sami_k’s picture

sami_k commented

Very nice, glad to see you got a very professional looking theme! The motifs are beautiful as well.

--
Read the handbook, search the forums, then ask!
http://drupal.etopian.net (Consulting, Development, and Hosting)

nsk’s picture

nsk commented

congratulations this theme is awesome!

--
NSK, Admin of Drupal-based site http://www.wikinerds.org

soccer’s picture

soccer commented

This is superb.

Arto’s picture

Arto commented

It indeed is one of the best-looking Drupal sites out there. Great work :-)

Abilnet’s picture

Abilnet commented

Hello Khalid,

I have to say, your theme&site just Rock'n Roll... nice colors and clear navication... in addition of 100% screen, maybe also giving a try to a fixed width makes sense... however, congrats to You, Ivan and Drupal ;)

Before I found Drupal, I've seen & used so many CMS's... Nuke-family, EZ Publish, Typo3, e107, Mambo, to name some... often people judge things based on look&feel... well, in features, flexibility, community, documentation, programming etc Drupal is just superior... - now we can clearly see, Drupal is also going to look good, keep up the Great Work!

PS. a tip... you maybe want to take a look at Google TOS... as far as I can remember, they allow up to three AdSense -spots per page... also, I'm not sure if they like any competing ads at the same page their ads are published ;)

----
Kari from Sunny Spain :)

kbahey’s picture

kbahey commented

Thanks for the praise.

Regarding Google's Terms of service, they allow up to 3 ad units, plus one Ad Link unit, so what I have is within the limits of their program.
https://www.google.com/adsense/policies

Ad Placement

    * Up to three ad units may be displayed on each Web site page.
...
    * A single link unit may be placed on each Web site page, <b>in addition 
      to the ad units</b> and search boxes specified above.

As far as competing ads, that is still OK too.

Competitive Ads and Services

We do not permit Google ads or search boxes accessing Google search 
services to be published on web pages that also contain what could be 
considered competing ads or services. If you have elected to receive 
contextually-targeted Google ads, this would include all other 
contextually-targeted ads or links on the same page as Google ads. 
This would also include ads throughout the site that mimic Google ads or 
otherwise appear to be associated with Google on your site. Although you 
may sell ads directly on your site, it is your responsibility to ensure these 
ads do not mimic Google ads. If you have elected to receive Google 
search services, this would include other search services on the same 
site and non-Google query-targeted ads. We do allow affiliate or 
limited-text links.


--
Consulting: 2bits.com
Personal: Baheyeldin.com

--
Drupal performance tuning and optimization, hosting, development, and consulting: 2bits.com, Inc. and Twitter at: @2bits
Personal blog: Ba

Abilnet’s picture

Abilnet commented

Thanks for pointing me to the right direction... keep up the great work!

----
Kari from Sunny Spain :)