Napszakhoz illő design


Még egy oldalon sem találkoztam egy igazából nem túl nagy munkával megoldható ötlettel: ha már php alapú dinamikus oldalt készítünk, akkor a design is legyen dinamikus.

Mire gondolok? Egy annyira egyszerű dologra, hogy csodálkozom, hogy eszembe jutott: a napszaknak megfelelően változó design.

Például reggel (6-10) valami kis homályos háttér, rá a hasonló szövegek, meg minden.
Utánna a déli időszakban (10-12) egy szép napocskás, világos háttér rá a sötét, de éppen ezért olvasható betűk, képek, stb.
Délután (12-6) egy ha lehet még világosabb site.
Este (6-10) egy sötét, kék színekben pompázó oldal,
és éjszaka (10-6) egy majd’ koromfekete háttér rá a világos betük.

Ezt hogy lehet megoldani? A legegyszerűbb, ha csinálunk egy fejlec.php-t, ami tartalmazza a majd azt, hogy különböző időpontokban milyen css fájlt/ikont/hátterképet/stb.-t használjon oldalunk, és minden kódunkba beletesszük (include).

Persze a szegény arculattervezőknek (ha “hivatalos” oldalt készítő csapatról van szó) ez sokkal több munka, de megéri, mert jó dolgokat lehet vele csinálni.

(A gondolatom onnan jött, hogy láttam egy oldalon egy javascriptet(!), ami a napszaknak megfelően köszönt… (pl.: Jó reggelt!, Jó napot!, Jó estét!,stb.))

————-

TLoF küldött egy egy kiegészítést a cikkhez, mindkettőjüknek nagy thx! – Harder

function disp_header($title)
 {
  $ora = date ("G");
  switch ($ora)
   {
    case 0:
    case 1:
    case 2:
    case 3:
    case 4:
    case 5:
     $cssfile = "ejszaka.css";
     $hatterfile = "sotet.jpg";
    break;
    case 6:
    case 7:
    case 8:
    case 9:
    case 10:
     $cssfile = "reggel.css";
     $hatterfile = "vilagos.jpg";
    break;
    case 11:
    case 12:
     $cssfile = "del.css";
     $hatterfile = "derus.jpg";
    break;
    case 13:
    case 14:
    case 15:
    case 16:
    case 17:
    case 18:
     $cssfile = "delutan.css";
     $hatterfile = "derus.jpg";
    break;
    case 19:
    case 20:
    case 21:
    case 22:
    case 23:
     $cssfile = "ejszaka.css";
     $hatterfile = "sotet.jpg";
    break;
   }
   print "<!doctype html public "-//w3c//dtd html 4.0 transitional//en">
   <html><head>
      <meta http-equiv="Content-Type" content="text/html; charset=windows-1250">
      <meta http-equiv="Expires" content="0"> 
   <title>$title</title>
     <link rel="stylesheet" type="text/css" href="" . $cssfile. "">
   <body background="". $hatterfile."" marginwidth="0" marginheight="0" leftmargin="0" topmargin="0">";
 }

Szerző: BlackY és TLoF

Kapcsolódó bejegyzések:
  • Ezt a kis kódrészletet azért osztom meg, mert sok javascriptes megoldást láttam már a dátum kiíratására. Alapból nekem nem tetszett, ahogy a php kiírja a date fü …

  • Hasznos és érdekes cikk több olyan általánosan elkövetett hibáról, mely a neten lévő lapokat sokszor jellemzi.Szó esik a cikkben az alábbiakról is hozzáj …

  • Honlapkészítés során, ha a hagyományos módon – statikus HTML fájlokat gyártva – állsz neki a munkának, előbb vagy utóbb belefutsz abba a problémába, hogy elég ma …

  • Ismét fontos, hogy egy példa erejéig megnézd miről is lesz szó.Űrlapok. Nap mint nap találkozunk velük és egyre többen töltünk ki mindenféle információgyűjtő …

  • WordPress cheatsheets summarizedSome time ago, when I searched on WordPress’ codex the syntax of some template tag, I realized that for such purposes are the …

A cikket beküldte: BlackY ()

5 hozzászólás

  1. Mancsika says:

    Ez tiszta zsír ötlet *.* Kár hogy még nagyon kezdő vagyok és a HTML világgal is csak most ismerkedek.

  2. Bence says:

    Egyszerű, de nagyszerű. Mikor megláttam a címét, úgy gondoltam, hogy “na jó, biztos bonyolultabb lesz a kelleténél”. De nem lett. :-)

  3. Bolo says:

    Ez nagyon zsír. Vége az uncsi, mindig ugyanolyan honlapoknak. :)
    Köszönöm.

  4. BIKe says:

    Ez nagyon jó!=)
    már félig megvan de elakadtam…valami nem jó mert csak egyszerűen kiírja a php tartalmát az oldalra…Valaki tudna segíteni?
    Előre is köszönöm!

  5. uno20001 says:

    @BIKe:

    .php kiterjesztésben mentetted el?

Szólj hozzá
a Napszakhoz illő design c. bejegyzéshez

- Engedélyezett HTML elemek: <a> <em> <strong> <ul> <ol> <li>
- Forráskód beküldéséhez tedd a kódot ezek közé: <pre lang="php" line="1">Kódrészlet helye itt</pre>