Pagrindinis » Interneto svetainės dizainas » Žiniatinklio kūrėjų ištekliai „Mega-Compilation“

    Žiniatinklio kūrėjų ištekliai „Mega-Compilation“

    Internetas nuolat auga ir yra šimtai tūkstančių kolektyvinių išteklių būsimiems interneto kūrėjams. Iš internetinių straipsnių, vadovėlių, įrankių, vadovų, vaizdo įrašų galite sužinoti ką nors apie internetą. Tai tikrai niekada nebuvo lengviau šokinėti internete!

    Žemiau pateikiu didžiulę labai naudingų žiniatinklio kūrėjų išteklių kolekciją. Tai apima pradedantiesiems skirtą medžiagą HTML5 / CSS3 kartu su sudėtingesnėmis JavaScript ir PHP programavimo teorijomis. Pora entuziastingų kūrėjų gali studijuoti šias kalbas ir kurti labai populiarias žiniatinklio programas, panašias į „Twitter“ ar „Tumblr“. Jei domitės naudingais turtais šiuolaikiniams žiniatinklio kūrėjams, jums patiks šis patikimų išteklių rinkinys.

    Naudingi internetiniai žurnalai

    Dienoraščių pasaulis sprogo su šimtais tūkstančių naujų rašytojų į internetą. Daugelis šių internetinių dienoraščių yra orientuoti į dizaino ir interneto svetainių kūrimą. Jūs galite rasti daug naudingų išteklių, tiesiog prakeikdami šiuos RSS kanalus.

    Priklausomai nuo to, kokio tipo kalbą įvedate, jis nustatys jūsų susidomėjimą bet kuriuo iš šių dienoraščių. Mes galime sutelkti dėmesį į žiniatinklio kūrimą ir daryti prielaidą, kad tai apima visą „front-end“ darbą (HTML5 / CSS3 / JavaScript), taip pat paprastus „back-end“ scenarijus (PHP / RoR / Python / SQL). Aš išleidau laisvę kurti vieną populiariausių „dev“ dienoraščių sąrašą, kuriame daugiausia dėmesio skiriama „front-end“ ir „back-end“ kodams.

    • Riešutai+
    • 24 būdai
    • „Webmonkey“
    • Smashing Coding
    • „Webitect“
    • Tikrinti elementą
    • Katės Kodas
    • Line25 interneto dizaino dienoraštis

    Žinoma, yra daug kitų. Rekomenduoju paspaudus „Google“ ieškant pamokų ir straipsnių apie pageidaujamą dev kalbą. Tada naudodami RSS informacijos kaupiklį, pvz., „Google“ skaitytuvą, galite sudaryti visų naujausių šių žurnalų straipsnių sąrašus. Tai puikus būdas pradėti savo darbo dieną, arba netgi nužudyti šiek tiek laiko chugging per pamokas.

    JQuery Plugins Galore

    JQuery pagrindinė biblioteka ir jQuery Mobile per pastaruosius metus įgijo daug traukos. Šios atvirojo kodo bibliotekos sukuria priekinės patirties, turinčios daug animacijos ir lengvai diegiamų „Ajax“ funkcijų, kūrimą, nors mobilioji biblioteka nesugebėjo pasivyti savo tėvų dėl papildinių ir trečiosios šalies kodo.

    Panašiai dar vienas fantastinis produktas bgStretcher gali būti naudojamas kaip dinamiškas fono scenarijus. Tai užtruks kelis vaizdus, ​​o kai kurių dydžių proporcijos bus proporcingai pritaikytos naudotojo ekrano raiškai. Patikrinkite nuostabų demonstraciją, kad pamatytumėte šį veiksmą. Abu šie įskiepiai gali laisvai parsisiųsti ir elgtis taip paprasti, kaip nuostabus 3-osios šalies kodas, pastatytas „jQuery“. Darbas su šiais ištekliais padės sutaupyti daug laiko projekto darbui, kad nereikėtų iš naujo išradinėti rato.

    Apskritai aš taip pat rekomenduoju naršyti svetaines Ajax Blender ir „Dynamic Drive“, skirtą „JavaScript“ kodo fragmentams / papildiniams. Biblioteka nėra didžiulė, tačiau ji nuolat auga nuo naujo vartotojo pateikto turinio. Svetainėse yra ne tik jQuery įskiepiai, bet ir „MooTools“ bei „Prototype“ bibliotekos.

    Jei baigsite dirbti su jQuery Mobile biblioteka, noriu rekomenduoti kitą įrankį jqmPhp. Tai dinamiška PHP klasė, kurioje galite nurodyti paprastąsias funkcijas į HTML5 kodo išvesties linijas ir linijas, veikiančias jQuery Mobile. Tai sąžiningai paprasčiausias būdas prototipuoti dinamines mobilias programas, sukurtas aplink PHP apvalkalą. Svetainės tinklaraštyje yra daug pavyzdžių, kuriais galima susipažinti.

    Statymas HTML5 ir CSS3

    Kai kalbame apie „front-end“ žiniatinklio kūrimą, paprastai kalbama apie efektyvumą. Jūs neturite tokių pačių problemų kuriant svetainę HTML / CSS, kaip koduotumėte „Back-end Ruby“ programą. HTML nėra jokios realios logikos ar klaidų tvarkymo - dažniausiai tai, kaip greitai galite tinkamai išdėstyti išdėstymą visose naršyklėse.

    Pirmiausia turiu pradėti rekomenduoti „HTML5“ katilinę. Tai atimtos kaulų šablonas, kuriame yra visi “standartas” HTML5 tinklalapio elementai viename pakete. Tai apima numatytąją stilių lentelę, „JavaScript“, „favicon“, „Apple Touch“ piktogramas ir daugybę kitų gėrybių. Tai 100% nemokamas projektas ir netgi galite prisidėti prie savo „Github“ repo. Tai būtina priemonė visiems kūrėjams prieš pradedant bet kokį rimtą interneto projektą.

    Dabar, jei dirbate su šia katiline, turite galimybę pridėti visą savo pasirinktą kodą. Tačiau siūlau imtis kito žingsnio ir pastatyti tokią programą kaip Initializr. Tai sukurs tipišką svetainės išdėstymą ir netgi leis jums pritaikyti, kurie elementai yra įtraukti į jūsų paketo paketą. Galimi „Google Analytics“ kodai, redaguoti jQuery, .htaccess arba web.config failai ir apie dešimtis kitų parinkčių.

    CSS dizaineriai

    Dabar, kai pažvelgėme į HTML5 kodavimą, turėtume apsvarstyti kai kurias populiarias CSS3 sistemas. Tai yra atviresni nei HTML šablonai, nes su CSS galite tai padaryti daug daugiau. Dizaineriai taip pat supras, kad sunku kurti standartus atitinkantį kodą visoms modernioms interneto naršyklėms.

    „Golden Grid“ sistema yra fantastiška, nes ji yra tinkamų interneto dizainų sistema. Šie išdėstymai bus pritaikyti prie mobiliųjų ekranų ir, kai keičiate naršyklės lango dydį, sulenksite į vidų. Jis taip pat padeda planuoti kiekvieno stulpelio pločio plotį ir dydį. „Blueprint“ yra dar viena patogi CSS sistema, kurią turėtumėte patikrinti. Tai puiki vieta kurti tinkintas svetaines ir siūlo fantastišką dokumentaciją.

    Tačiau kalbant apie CSS įrankius, CSS3 PIE turi būti mano trijose populiariausiose. Tai paprasta žiniatinklio programa, kuri pateikia tinkamą kodą, kad „Internet Explorer 6-9“ palaikytų CSS3 efektus. Galite sukurti dinaminius linijinius gradientus, suapvalintus kampus ir langelių šešėlius su tinkamais nustatymais. Svetainėje yra IE pavyzdžių, jei norite juos patikrinti.

    Kūrėjai taip pat sieks sumažinti savo failų dydžius gamybai. Švarus CSS yra vienas iš šaltinių, kuriame galite pasirinkti iš daugelio parinkčių, kaip supaprastinti kodą ir sumažinti failo dydį. Kitas alternatyvus kodas „Beautifier“ nesiūlo tiek daug galimybių, bet gali būti lengviau jį naudoti.

    Temų pritaikymas naudojant „WordPress“

    „WordPress“ leidyba yra lengvai populiariausia CMS šiame amžiuje. Mes matėme galbūt milijonus naujų tinklaraščių ir svetainių, kuriose veikia šis fantastinis turinio valdymo sprendimas. Ir tokiu būdu „WordPress“ kūrėjai turi didelę paklausą, kad sukurtų pasirinktinius valdiklius ir svetainės temas.

    Naujasis „Constellation“ temos išleidimas suteikia „WordPress“ kūrėjams paprastesnį pradinį tašką nei numatytieji šablonai. Nauja dvidešimt vienuolika tema yra labai gudrus ir minimalistinis, tačiau negali konkuruoti su visu teminiu šablonu, pastatytu ant HTML5Boilerplate. „Constellation WP“ temoje netgi yra įvairių žiniasklaidos užklausų, pvz., „IPhone“ ir „iPad“.

    „Wonderflux“ yra dar vienas „WordPress“ temos šablonas, kurio kūrimas nėra visiškai toks pat. Tai buvo neseniai išleista iš beta į v1.0 kartu su kai kuriais internetiniais dokumentais. Ši tema yra šiek tiek sudėtingesnė nei „Constellation“, kuri suteikia jums daugiau galimybių valdyti išdėstymą. Kūrėjai įtraukė pasirinktinius PHP kabliukus, funkcijas ir filtrus, kad jūsų WordPress svetainė taptų dinamiškesnė.

    Sunkūs WP kūrėjai turėtų išsiaiškinti abu sprendimus, kad pamatytumėte, ar kuris nors iš jų padės būsimam projekto darbui.

    Ieškoti „Web Developer Freebies“

    Palyginti su PSD ir grafika, interneto kūrimo bendruomenė atrodo truputį trūksta nemokamų žaidimų galerijų. Github'e visada galite rasti puikių scenarijų, tačiau dažnai turite ieškoti ir išbandyti juos patys.

    Sunku rasti svetainių, kuriose siūlomi nemokami atsisiuntimai ir demonstracijos bei scenarijų pavyzdžiai. Mano mėgstamiausias naujas šaltinis yra „CodeVisually“, kuriame kataloguojami naudotojų pateikiami kūrimo įrankiai, įskiepiai, bibliotekos ir kiti tvarkingi dalykai. Išdėstymas yra sukonfigūruotas kaip galerija, kurioje kiekviename puslapyje yra nuoroda į produktą, demonstracinį ekraną ir kai kurias papildomas detales.

    Galerija apima šimtus HTML / HTML5 šablonų kodų, CSS3 bibliotekų ir tikrai daug jQuery dalykų. Aš taip pat nustatiau, kad tai yra puiki svetainė, kurioje visuomenei galite pateikti savo atviro kodo kodą. Jūsų vardas yra susietas su pateikimu, taip pat galite patalpinti nuorodas į savo svetainę, kurioje vartotojai galėtų pasiekti kodą.

    Žiniatinklio taikomųjų programų API

    Labai populiarus šiuolaikinės žiniatinklio kūrimo tendencijos yra API kūrimas kaip trečiosios šalies programa. Dauguma bendrųjų socialinių tinklų prekių ženklų yra tinkamas API ir dokumentacijos segmentas. Be to, „Github“ yra užrašyta daugybė nemokamų įvyniojimo klasių, parašytų visose pagrindinėse programavimo kalbose.

    Kūrėjai turėtų jaustis patogiai dirbti su šių kodų bibliotekų tipais, nes jie auga. Naudodami „OAuth“ sistemą galite greitai sukurti daugybę šių programų. Toliau pateikiau kelias nuorodas į populiarias internetines API ir jų visą dokumentaciją.

    • „Twitter“ API
    • „CloudApp“ API
    • „Instagr.am“ API
    • „eBay“ API
    • Foursquare API
    • Dribbble API
    • „Github“ API

    Jei įmanoma, pasinaudokite šiais ištekliais naujiems projektams. Internetas tampa vis labiau prijungtas, o naudotojai visuomet plūsta į kitą didelę programą. Galite įdarbinti tūkstančius papildomų narių į savo programą, kai lankytojams nereikia registruoti visiškai naujos sąskaitos ir gali užsiregistruoti tiesiogiai per „Twitter“ arba „Facebook“.

    Q&A ištekliai

    Naudingiausia patirtis tarp kūrėjų yra užduoti klausimus ir mokytis naujų metodų. Kūrėjų bendruomenė visada yra labai naudinga naujokams ir nori pasiūlyti savo žinias daugelyje situacijų. Jei turite kokių nors problemų ar konkrečių klausimų, susijusių su projektu, ieškokite „Google“ susijusiam interneto kūrėjo forumui.

    Asmeniškai turiu rekomenduoti prisijungti prie „Stack Exchange“ bendruomenės, jei dar nesate narys. Tai apima nuostabias svetaines, pvz., „Stack Overflow“ ir „Super User“, kur galite gauti programavimo pagalbą iš esmės nieko. Bendrijos nariai yra gerai susipažinę su visomis pagrindinėmis interneto kalbomis, įskaitant jQuery ir mažesnes PHP klases.

    Patyręs triukas, kurį sužinojau, yra ieškoti per „Google“ ir pamatyti, ar jūsų problema jau išspręsta. Į „Google“ paiešką įveskite keletą raktinių žodžių ir pridėkite priesaga svetainė: stackoverflow.com. Visi grąžinti paieškos rezultatai bus klausimai iš „Stack Overflow“ archyvų - jei jums pasisekė, galite tiksliai rasti dabartinės problemos sprendimą.

    Puslapio greičio testavimas internete

    Ši nauja „Google“ kūrėjų iškelta priemonė iš tikrųjų buvo įspūdinga. Programos „Page Speed ​​Online“ analizuos jūsų svetainės turinį ir sukurs analizės ataskaitą apie jūsų greitį. Tai apima galimus sprendimus, kaip sumažinti apkrovos laiką ir išlaikyti lankytojus svetainėje.

    Jis taip pat gali padėti nustatyti problemas, susijusias su atšokimo rodikliais ir mažesnėmis konversijomis. „Google Analytics“ yra būtina bet kuriai svetainei, bet manau, kad „Page Speed“ pasiekia aukštesnį analizės lygį.

    Ataskaitos išvestis yra vertinama pagal aukšto prioriteto prioritetus ir dažnai apima daug skirtingų elementų. Jei suprantate LAMP nustatymus ir dirbate su „Apache“ serveriais, taip pat galite apsvarstyti mod_pagespeed modulį. Ji automatiškai atlieka daugelį šių optimizacijų jūsų svetainėje, kad sumažintų apkrovos laiką ir svarbiausius žiniatinklio duomenis (vaizdus, ​​piktogramas, scenarijus).

    Geriausia kūrėjo programinė įranga

    Tarp dviejų populiariausių operacinių sistemų galite rasti daugybę programų. Nuo grafikos programinės įrangos iki pradinio kodo redaktorių ir IDE yra daug išteklių, kuriuos gali rinktis interneto kūrėjai. Bet jei ieškote populiarių pasiūlymų, rekomenduoju šiuos pavadinimus.

    „Mac OS X“

    Panika yra programinės įrangos kompanija, kuri sukūrė „Coda“ - geriausia „Mac“ žiniatinklio kūrimo programa. Jūs turite prieigą prie šaltinio kodo redaktoriaus, terminalo ir FTP kliento, kur galite tiesiogiai atlikti pakeitimus serverio rinkmenose. „Coda“ papildomai palaiko ilgą sintaksės išraiškos sąrašą tokiose kalbose kaip HTML, XML, CSS, JavaScript, PHP, SQL ir daug daugiau.

    Jei vis dėlto jums reikia nemokamo sprendimo, patikrinkite Komodo Edit. Programinė įranga sukurta „Windows“ ir „Mac“, atviro kodo ir visiškai nemokama. Ji apima visą tą pačią paramą sintaksės paryškinimui ir daug panašių funkcijų kaip „Coda“ (deja, be FTP). „TextWrangler“ yra dar vienas laisvas sprendimas, kurį galite pabandyti, taip pat tik paprastas teksto redaktorius.

    Nemokamai FTP programai patikrinkite „Cyberduck“ „Mac App Store“. Nors asmeniškai aš norėčiau mokamą alternatyvą, pvz., „Yummy FTP“ arba „Transmit“.

    „Microsoft Windows“

    „Adobe“ programinės įrangos rinkinys visada ateina į galvą, kai galvojate apie interneto dizainą ir kūrimą. „Windows“ naudotojai turi daug alternatyvų „Dreamweaver“, o daugelis jų yra visiškai nemokami.

    „Notepad ++“ yra puikus pavyzdys kai kurioms atvirojo kodo Win32 programoms. Projektas tebevyksta aktyviai ir dažnai atnaujinamas (beveik kas mėnesį). Man patinka jų skirtukų sąsaja ir tiek daug papildomų priedų. Kaip jau minėjau, Komodo Edit taip pat siūloma Windows XP / Vista / 7, todėl jūs galite tai išbandyti kaip alternatyvą.

    „Windows“ žiniatinklio kūrėjai taip pat neturi FTP kliento. Filezilla yra bene populiariausia laisva alternatyva. Alternatyvoms ieškokite nemokamo FTP klientų sąrašo ir panašių įrankių.

    Kiti naudingi ištekliai

    • 100 esminių žiniatinklio kūrimo įrankių
    • Best Of 2011: geriausi naudingi jQuery įskiepiai ir pamokos
    • Ruby on Rails Pamokos Web Development pradedantiesiems
    • 7 įdomios interneto plėtros tendencijos 2011 m

    Išvada

    Iki šiol pirmasis 2012 m. Ketvirtis pradėjo bangą! Mes jau matėme nuostabų turinį iš viso pasaulio. Profesionalai, kuriantys tinklą, turi daug įrankių, palyginti su prieš 1-2 metus.

    Tikiuosi, kad šis didžiulis įrankių ir išteklių rinkinys paskatins jūsų metodiką geresniam vystymuisi. Man patinka dirbti su interneto kūrėjais ir visą laiką mokytis apie naujus projektus. Tačiau yra tik tiek daug vietos naujiems ištekliams, kuriuos galime įtraukti, todėl privalau praleisti keletą brangakmenių. Jei turite idėjų ar pasiūlymų dėl susijusių interneto kūrėjų išteklių, praneškite apie tai pokalbių srityje.