Ilmaista sitä

Minun rajallinen taito-set työkaluilla, kuten Photoshop ja Illustrator, voin rehellisesti tunnustan, että olen parempi kehittäjä kuin olen suunnittelija. Mutta taustalla ydin (palvelimella) kehitystä Java / PHP / COBOL, on ollut hyvin myönteinen vaikutus minun UI kehittämisosaamista. Tällä tarkoitan sitä, että luodaan oma malleja, eli aina kun teen suunnittelu, ajattelen miten suunnittelua voi parhaiten muuntaa HTML-CSS ja kun tekee HTML-CSS, annan ajatellut backend teknologian ja varmista riittävä varmuus että HTML on helppo osaksi XSL silmukoita tai PHP katkelmia yms.

Yli vuoden, olen heittänyt päänsä ja malleja UI suunnittelijoita, jotka todennäköisesti antaja ole aavistustakaan, mitä HTML-tai CSS. Kaikki nämä vuodet olen ajatellut, että olisin pyytänyt liikaa, jos olen vain odottaa suunnittelija, joka yrittää shov hänen "mahdoton koodi" suunnittelu kurkustani alas, ymmärtää vain vähän mitä hänen suunnittelu muuttuisi osaksi. Se auttaa oikeassa?

Sitten törmäsin tähän tehtävään tänään ... web-suunnittelijat, jotka eivät voi koodia ... Kiitos Herra! Olen vain yksi monista, jotka tuntevat samaa ... Edellä artitle on vähän pitkä hengästynyt .. mutta kannattaa lukea, jokaista sanaa.

Kiitos Elliot Jay Varastot ... Tunnen helpottunut!

Tässä joitakin poimintoja Elliots artikkeli .

Vau, mikä päivä! Se alkoi yksi pieni piipittää ja päättyi keskustelu, joka näytti lakaista koko web-suunnittelijoita. Näyttää siltä, ​​että joitakin erittäin vahvoja mielipiteet aiheesta, onko web-suunnittelijoiden pitäisi pystyä koodia.
...
Joten, ennen kuin pääsemme tähän, haluan nopeasti kertaus mitä sanoin tänä aamuna Twitterissä:

Oikeasti, olen järkyttynyt siitä, että vuonna 2010 olen silti tulossa koko "web-suunnittelijat", jotka eivät voi koodata omia malleja. Ei tekosyitä.

... Minun olisi ollut hieman tarkempi minun visertää. Puhuin suunnittelijoita, joilla ei ole edes kaikkein perus HTML ja CSS osaamista muuttaa litteä muotoilu osaksi varsinaista. Ei ihmisiä, jotka tahallaan halua koodia, jotka eivät osaa. Ja olen myös viitannut vain etupään koodi tähän, tietenkin se on naurettavaa ajatella, että suunnittelijoiden pitäisi myös olla hämmästyttävän back-end-ohjelmoijat ...

Saamme "web" malleja lähetetään Illustratorissa, 300dpi, mahdotonta koodia ei eheys / käytettävyys.
~ Amy Mahon

On myöhä, ja minun täytyy kääriä tähän asti jotenkin. Tiedän, siellä on monia jotka ovat eri mieltä kanssani, ja minun ei ole tarkoitus loukata tai järkyttää ketään, joka voi koodia, mutta toivon, että osa siitä, mitä olen sanonut heijastaa joitakin kohtia, jotka aina keksiä, kun sukeltaa tätä keskustelua.

Lopussa päivän, en menetä yöuniaan, joka voi koodata ja kuka ei. Olen vain todella hämmästynyt niin monet suunnittelijat, joilla ei ole etupään taitoja, koska minusta tuntui menneisyyteen.

Lue myös kommentit, oli noin 320 kommenttia, kun kirjoitan ... se kannattaa lukea.
Lue Elliots koko post täällä .. Web-suunnittelijat, jotka eivät voi koodata

• Document Type julistuksessa on oltava läsnä alussa asiakirjan, joka käyttää HTML-syntaksia. Sitä voidaan valinnaisesti käyttää sisällä XHTML syntaksi, mutta se ei ole välttämätöntä. XHTML asiakirjaa ei tarvitse sisällyttää DOCTYPE koska XHTML asiakirjat toimitetaan oikein käyttämällä XML MIME tyyppi ja käsitellään XML-selaimissa on aina suoritettu ei quirks tilassa.

• XHTML-tagi nimet ovat isot ja määritellään yleensä on kirjoitettu pienillä kirjaimilla. HTML kuitenkin tag nimet eivät ole tunteettomia, ja voidaan kirjoittaa isoja tai isoja, mutta yleisin yleissopimus on kiinni pieniä. Jos alku ja loppu tagit ei tarvitse olla sama, mutta johdonmukainen ei tee koodi näyttää puhtaampaa.

Etuja käyttämällä HTML

• Taaksepäin yhteensopiva nykyisten selainten
• Tekijät tuntevat jo syntaksia
• Lieviä ja anteeksiantava syntaksi sitä ei tule käyttäjän vihamielinen " Yellow Screen of Death ", jos virhe vahingossa liukastuu kautta
• Kätevä pika syntaksi, kuten kirjoittajat voivat jättää osan tunnisteet ja määreet

Etuja käyttämällä XHTML

• Tiukka XML syntaksin kannustaa kirjoittamaan hyvin muodostuneita markup, jota jotkut kirjoittajat saattavat löytää helpompi ylläpitää
• Integroituu suoraan muiden XML-sanastojen, kuten SVG-ja MathML
• Mahdollistaa käytön XML Processing, jota jotkut kirjoittajat käyttävät osana muokkaus ja / tai julkaisemalla prosesseja

Eilen, kun asia kohtasin kanssa CSS Nollaa Google Chrome ... ajattelin kaivaa hieman syvemmälle alueelle User Agent Style Sheets ...
Löytyi tämä taulukko oletusarvoja CSS2.1 User Agent Style Sheets ... (niille tiedä mitä "User Agent Style Sheets" on seurata Mikä User Agent Style Sheets (Specification) .

Täydellinen luettelo CSS 2.1 User Agent Style Sheets oletusarvot napsauttamalla tätä

Eilen, kuten kaikki muutkin "Ground Hog Day", olin työskennellyt joitakin CSS / tableless kaavoista. Kaikki oli menossa hyvin IE 7, FF 3 ja Chrome, untill yhtäkkiä, olen nähnyt joitakin YK-ignorable marginaalit nähnyt vain Google Chrome. Vaikka hyvin outoa ja worring, oli joitakin uusia bug / issue että olin törmännyt, oli lopulta noin mauste minun arkipäiväisiin työhön. Sad (mutta kiva) se sai vakiintui muutaman minuutin anturi ...

Periaatteessa se näytti Google Chrome ohitetaan CSS Nollaa (margin: 0px). Se itse asiassa johtui käyttäjä agentti tyylisivu (-webkit-pehmuste-alku: 40px). Eli ratkaisu oli palauttaa tähän tyyliin asettamalla padding: 0 huonosti elementtejä.
Hyvä tapa estää tämän ongelman tapahtuu mitä tahansa elementtiä on käytettävä globaali CSS Rest seuraavasti

* {Margin: 0; padding: 0;}

Mitä User Agent Style Sheets (Specification)?
Seuraava ote on otettu http://meiert.com/en/blog/20070922/user-agent-style-sheets/ , seuraa linkkiä lukea lisää User Agent Style Sheets

CSS 1 lisätään ajatuksen toteamalla, että jokainen User Agent (UA, usein "selaimella" tai "web client) on oletuksena tyylisivu esittää asiakirjat kohtuullisessa - mutta luultavasti arkipäiväisiin - tavalla. CSS 2 sanoo, että mukaiset selaimet on haettava default style sheet (tai käyttäytyvät ikään kuin he) ja user agent oletuksena tyylitiedosto pitäisi esittää elementtejä asiakirjan kieltä tavalla, joka tyydyttää yleistä esittämistapaa odotuksia asiakirjan kieli, CSS 3 on todennäköisesti sama mielessä.

Koska CSS vaatimukset jättävät toteutuksia, käytetäänkö "oikea" tyylisivu oletustilaan tai ei, se ei ole hämmästyttävää, että et löydä default style sheet jokaisen selaimen asennus kansioon. Toisin kuin Microsoftin Internet Explorer ja Opera, esimerkiksi (ja sikäli kuin tiedän), Gecko selaimissa, kuten Firefox ja Netscape Navigator (etsi "html.css") mutta myös Konqueror tekevät melko helppo ymmärtää niiden default tyyli.

Toinen vanha koulu muisti täydentävät ...

Miksi jotta windos.status?
JavaScript voisi olla painajainen, kun on jotain debug. Firefoxissa ei ole muutama kätevä lisät, kuten Firebug thats tekee elämästämme helppoa ja myös äänestää suosituin debug tekniikka Javascriptin pitää mennä "Hälytys ()". Anywaz! On muutamia tapauksia, kun lisäät ALERT ei debug teidän väärinkäytöksiltä käyttäytyy Javascript ei vain ole mikään hyvä idea. Esimerkiksi! Sinulla on dragble kohta, jonka asema on varoittanut .... EI EI! Älä tee sitä! ... Voit vain saada ääretön hälytyksiä tai sinulla tapana voi todella drap sinun dragable. No! On enemmän hyviä tilanteita, joissa voit kirjoittaa ulos debug tekstit tilarivillä paljon usful ... Uskokaa minua! Sen kokemus!

IE oletuksena vasemmalle kirjoitat selaimen tilarivillä käyttämällä syntaksia "window.status = 'jotakin debug", mutta Firefox ei. Joten jotta ikkunoiden tila muuttuu, voit tehdä jommankumman seuraavista.

Avoinna about: config selaimella (kirjoita "about: config" Tämä tulee osoiteriville) ja hae
dom. disable_window_status_change. Muuta se väärä ... klikkaa merkintä vaihtaa tilaansa.

Tai vaihtoehtoisesti

"Työkalut → Asetukset → Sisältö → Enable JavaScript / Advanced → Change status bar text"

Ja myös huomata, että ... kirjoittaa tilarivillä JavaScript, IE on aivan ok, jos käytät lyhyttä syntaksia eli status = 'jotkut debug text ", mutta Firefoxissa, sinun on käytettävä täysimääräisesti syntaksia eli window.status =' jotain debug "

Google aloittaa liike kannustaa ihmisiä upottaa IE6 ... By nakkaa IE6 käyttäjät POPUP sivulla kuorma ... ei välttämättä ole kovin hyvä idea ... mutta on UI kehittäjä, minun täytyy liittyä tämän bändin vaunun ... yksi vähemmän selainta minun huolehtia ... Anteeksi itsekäs se on! mutta olen myös tätä javascriptiä ... (TRY Tämän sivun IE6) ...
Hei! ja kirkkaampi huomautuksen ... Katso se näyttö POWER JavaScript .... se voi jopa kaataa jättiläinen (tai kun se oli)

SO ... Auta poistamaan maailmasta IE6 yhden rivin JavaScript!

http://code.google.com/p/sevenup/

Olen niin innoissani yhä enemmän sivun näkemyksiä blogiini, että voin tarkistaa Google Analytics melkein joka päivä. Huomasin, että blogini on tarkoitettu pitämien monilla muilla kielillä, ja ihmiset ympäri maailmaa. Niin mukavaa!!
Voit tehdä elämästä hieman helpompaa minun EI-ENGLANTI viewer laiva, olen lisännyt Google Widget / plugin nimeltään "Global Translator".

Global Kääntäjä sanoo, että se "automaattisesti kääntää blogin 41 eri kielellä kietomalla neljän eri verkossa translation moottoreita (Google Translation Engine, Babel Fish Translation Engine, FreeTranslations.com PROMT)" ... Jos haluat lisätä sen omia wordpress asennus ... check it out here http://www.nothing2hide.net/wp-plugins/wordpress-global-translator-plugin/

Etkö ole varma, kuinka hyvä käännös on, mutta toivon että se auttaa muutama kaveri kehittäjät siellä, kuka lopulta päästä blogiin, vain pettynyt, että se on Englanti ....

Kääntäjän linkit ovat alareunassa Side Bar ....

Tässäpä toinen vähän peice Javascript kikkailu, että minun piti kaivaa noin, koska tilanne commaned sitä. Yhdessä minun sivustoja, minulla oli tämä tilanne, jossa minun piti toteuttaa "windows.onload" kahdesti. Ensimmäinen asia, joka tuli kokemattomalle mieleen kuin minun (Täytyy rehellisesti sanoa, että koska olen käyttänyt javascript puitteisiin ja kirjastot, olen forgotton tehdä yksinkertaisia ​​asioita itse ... surullista mutta totta), on seuraavan menetelmän ...

 window.onload = onloadfn1;
 window.onload = onloadfn2;
 window.onload = onloadfn3;
 jne. ..

Ikävä sanoa, mutta tämä tapa toimia ... dont halua keskustella toteuttamiseen tiede Javascript paljon ... mutta oman viimeaikaisten kokemusten, vain viimeinen toiminto (onloadfn3) on sairas todella saada teloitettiin.

Normaaleissa tilanteissa, toisin kuin minun (jonka minä puhua hieman myöhemmin) ... voisit jollakin seuraavista suorittaa mutliple onload toiminnot ....

Tai jotain tällaista

 funktio doOnLoad () {
         onloadfn1 ();
         onloadfn2 ();
         onloadfn3 ();
 }
 window.onload = doOnLoad;

Minun nykyinen tilanne, en voi käyttää kumpaakaan edellä ...
Miksi minun pitää soittaa windows.onload kahdesti, vaan että soittaa kaksi tehtävää yhden onload funktio? Tässä vilkaista minun ongelmani ilmoitus ...

"Oman sivuston sivut on rakennettu kuten WordPress teema .... eli ei yhteistä Header.php ja footer.php, joka sisällytetään kaikkiin sivuille. On onload funktio implementaion vuonna footer.php tehdä joitakin yhteisiä onload toimintoja. Ja on muutamia sivuja, jotka tarvitsevat jotain omaa lataustapahtuman, lukuun ottamatta tehnyt yhteisiä onload toimintoa. Jos liittää takaisinkutsufunktio suoraan window.onload ohjaaja, se ohittaa aiemmin määritetty kutsuja on footer.php "

.... Onko minun ongelmani ymmärtää ?

No! on olemassa muutamia ratkaisuja, en löydä. Ne kaikki ovat hyvin samanlaisia ​​ja pääasiassa implementions ja liuoksen annetaan Simon Willison ( http://simonwillison.net/2004/May/26/addLoadEvent/ ) ...

Ratkaisu:

Lisää vain tämä javascript-koodin sivusto ...

 toiminto addLoadEvent (FUNC) {
     var oldonload = window.onload;
     if (typeof window.onload! = 'toiminto') {
        window.onload = FUNC
     } Else {
        window.onload = function () {
            Jos (oldonload) {
                   oldonload ()
           }
           FUNC ()
        }
    }
 }

Ja kutsuvat sitä sen sijaan, että "windows.onload"

 addLoadEvent (FunctionToRunOnPageLoad);
 addLoadEvent (function () {
 / * Lisää koodin suorittamisen sivunlatauksella *
 }); 

Edut Tämän koodinpätkän ...
1. Ensisijaisesti se voit olla useita windows.onload tapahtumia, soitti erillistä osiin koodia ilman overridding edellinen määritelmä
2. Se on todella huomaamaton. Se voidaan sijoittaa tiedoston sinun on skriptejä tai erilliseen tiedostoon.
3. Se toimii vaikka window.onload on jo asetettu.

Ajattelin tämä on doodle löytää google, niin monta meitä UI ja käsikirjoittajat pitäisi tehdä tämän päivittäin, että on myös hieman peice PHP-koodinpätkän (. Php) tulee Smarty Template (. TPL). Tajusin, että helpompi / suosittu hakua, vielä vaikeampi löytää tarkkaa vastausta ... miljoona hakutulokset mutta useimmat reffered "File" sisältää Smarty ... jossa on seuraava syntaksi

{Include tiedosto = "include / header.php"}

Tämä todella tullakseen otetuksi tiedosto hieno, mutta tekstinä, mitä halusin johtui sisällytetty tiedosto. (Huomaa yllä on käytetty mm malli sisällä mallitiedosto). Lopuksi hieman persiverance .... Olen törmäsi slighty muutettu syntaksia, joka oli vastaus minun vaatimuksesta ... joten tässä se on ... jos havn't löytänyt kuin jo

{Include_php tiedosto = "include / header.php"}

Tämä kysymys mieleeni muutaman kerran ennen, kun työskentelin sivustoissa aikaisemmin liikaa, joka käyttää WordPress näyttämään blogeja tai uudenlaista sisältöä osaan sivustoa / portal.Being noviisi PHP ja noin WordPress pidin procastinating sitä ajatellen "tämä ei ole minun peice kakkua". Vihdoinkin! Tämä vaatimus tuli upto nenääni, kun alkoi Diggin ympärille hieman liuosta.
Olin hämmästynyt, että se todellakin oli helpompaa kuin olin itse ajatellut oli, näyttää luettelon otsikoita tai viimeisin viesti jollakin muulla sivulla ulkopuolella WordPress-käyttöinen osassa, vain käyttää hieman PHP ja WordPress API .

Tässä on mitä tehdä: -
Syistä selitystä, oletetaan, että sivustosi on http://www.inchembur.com/ ja sinulla uutisosiossa Tämän sivuston http://news.inchembur.com/ (joka pyörii WordPress). Nyt vaatimus on osoittaa viimeisin viesti siitä http://news.inchembur.com/ on kotisivulle pääsivuston eli http://www.inchembur.com/index.php

Vaihe 1: Teidän index.php lisätään seuraava peice koodia, Sisällytä WordPress API tiedoston. Voit lisätä tämän sivun haluat postitse näkyvän.

<? Php
'WP_USE_THEMES' , false ) ; // Disbable use of WordPress Theme define ('WP_USE_THEMES ", false); / / Disbable käyttö WordPress Theme
vaativat ("/ var / news.inchembur.com / wp-blog-header.php '), / / Sisällytä WordPress API
; // Get Latest Post query_posts (showposts = 1 '), / / Get Uusin viesti
?>

Edellä peice, kuuluvat, saamme vain yhden Viimeisin viesti. Jos haluat kokeilla enemmän vaihtelua vapaasti kaivaa, query_posts() asiakirjat .

Vaihe 2: Nyt osassa Index / Etusivu jossa haluat näyttää uusin WordPress viesti siitä http://news.inchembur.com , käytä seuraavaa koodia. Tarpeetonta sanoa, vapaasti mainoksen teidän tyyli rajapintoja, jännevälit ja luokat kohti suunnittelua tarpeisiin.

Vaihe 3: Ei ole Vaihe 3 ... Että se ... olet valmis!

Miten osoittaa erityinen virka / sivu toisin kuin viimeisin viesti: -
Tämän voi helposti achived muuttamalla argumentit query_posts() mukaan sivun tunnus tai sivu etana

) ; query_posts ("page_id = 7 ');
) ; query_posts (sivunimen = n. ');

tai voit hallita virkojen:
) ; query_posts (showposts = 3);