Video screencasts 2025, Veljača

Imamo ovih osam navigacijskih kartica najviše razine, ali Početna jedino djeluje. Samo da bismo imali nekoliko stranica za rad, izdvojili smo neke stranice za "

Koliko se sjećam, koristio sam Google Code Prettify kako bih primijenio isticanje sintakse na blok koda na CSS-trikovima. Znate, gdje u redu poput "

Upravo smo instalirali Prism.js i pokrenuli ga. U ovom screencast-u nalazimo temu koja se zove Sutra tema i ugrađujemo njene boje u sintaksu "

Malo smo poradili na zaglavljima, ali detaljnije ćemo istražiti one u ovom screencastu. Zaglavlja su prokleto važan aspekt svake web stranice. Dobro urađeno,"

Sad kad imamo područje za objavljivanje blogova, stvarno možemo ući u tipografiju blogova. Vjerojatno najvažnija tipografija na web mjestu, kakva je "

Mislim da je vrlo lijepo imati pojedinačnu datoteku (.scss) koja je namijenjena velikoj većini tipografije na web mjestu. Normalize ima prilično malo tipografije "

Typecast (u beta verziji u vrijeme ovog snimanja) zaista je uredna web aplikacija za igranje s web tipografijom. Omogućuje vam izvrsno sučelje za igranje "

Nastavljajući koncept "Ne pretjeruj u razmišljanju o mrežama", oluci se odvijaju u mreži samo pomoću jednostavnih obloga. Zadržavamo broj dodavanja "

Prije nego što obavimo neki tipografski posao, mislio sam da ćemo popraviti dosadnu stvar kad slike propadaju izvan područja članka i rešetke. Korištenje "

Sada kada pokrećemo prilagođenu lokalnu domenu, možemo koristiti PHP. "P" u MAMP-u je za "PHP" =). Korištenje PHP-a znači da možemo koristiti uključuje. Na primjer: Naš "

Mogli bismo napisati vlastiti Sass @mixins za pomoć u CSS3 stvarima (poput gradijenata), ali već postoji Sassov okvir koji se naziva Compass koji "

Dizajn web stranice oblikuje se tako da bude vrlo mrežast. Naši će se moduli vrlo čisto rasporediti u mrežu. Ali nisu li mreže složene i čudne? A možda mi "

U ovom super brzom prikazu zaslona koristimo MAMP za postavljanje URL-a koji možemo koristiti za lokalni razvoj. Ovo je korisno iz više razloga: možemo povezati na "

U CSS uvodimo koncept upita @media. Puno onoga što nam omogućuje Sass na ovom projektu je da ostanemo SUHI (ne ponavljajte se). Jesmo"

Počinjemo s malo dotjerivanja vrste logotipa, ali zatim uskačemo u dodavanje ikona u glavnu navigaciju. Kada smo dizajnirali navigaciju u Photoshopu (Video "

Postavili smo novi komplet u Typekitu za v10. Za brendiranje, za sada ćemo koristiti Proxima Nova Soft i neke druge fontove koji izgledaju blisko HF&J fontovima u našem "

Zasad stvarna web stranica uopće ne izgleda previše poput našeg Photoshop dizajna. U ovom screencast-u istražujemo upravo to, počevši od vrha s "

Koristimo neke trikove za pozicioniranje kako bismo poredali lijevi rub logotipa i glavno područje sadržaja, a da pri tome zaglavlje dodiruje lijevi rub znaka "

Uklanjanje korisničkog agenta (zadani) CSS iz većine elemenata obično je dobra ideja. To već dugo čine "univerzalna" resetiranja ili stvari poput Erica "

Dok promatramo našu Photoshop maketu, pišemo kako započinjemo pisati HTML kako bismo opisali ono što gledamo. Mi naravno koristimo HTML5 kad god to napravi "

Počinjemo ispuštati tekst u glavnu navigaciju, samo da vidimo kako će se uklopiti, raditi na dimenzioniranju, bojama itd. Neki od teksta prilično se uklapaju "

Sigurno nismo zauvijek "gotovi" u Photoshopu za ovaj dizajn, ali imamo dovoljno posla da bismo započeli s izradom ovog dizajna u pregledniku. Nakon"

Počinjemo dizajnirati najvišu (glavnu) navigaciju web stranicom. Počinjemo s ekranom veličine radne površine (na doduše proizvoljnoj širini), ali "

Dodamo nekoliko dodatnih slojeva ispod glavnog zaglavlja / okvira za markiranje kako bismo dobili izgled "hrpe papira". Nema velike metafore ili slično, samo dodaje neki vizualni "

Cijelo web mjesto ide na temelju "modula". Svaka će sitnica biti doslovno u kutiji (na kraju i vizualno i u kodu). Mi"

Ovo je zvučna snimka Skype poziva između Erin Kissane i mene. Erin je napisala knjigu o strategiji sadržaja, tako da sam imao sreće da joj pomognem i "

Dizajniranje u pregledniku je super, ali pokretanje u Photoshopu drži me najkreativnijim kad mi je najpotrebnije: kada se okrenem prema praznom platnu. "

Dobrodošli! Ovo će biti prilično putovanje, i kao i sva putovanja, i ovo započinje jednim korakom. Naš prvi korak je napraviti popis "

Ovaj redizajn nije redizajn samo radi redizajna. Želim poboljšati web mjesto na svaki mogući način na koji možete poboljšati web mjesto. Jedan od"

Već smo razgovarali o ručnoj optimizaciji SVG-a. Ručno odabiranje detalja i vrsta stvari koje se mogu kombinirati ili ukloniti. U ovom "