2009 17 кастрычніка 2009

З файла Photoshop для HTML / CSS для WordPress серыі

Screen shot 2009-10-17 at 4.59.04 PM Я сумую маючы часу, каб чытаць мае штодзённыя блогі, як я прывыкла, але натыкнуўся на гэтую вялікую серыю з адным з маіх любімых: Крыс Coyier, якога аднаго сайта на CSS хітрасці дапамог мне бязмерна.

У серыяле ён бярэ вас ад праектавання працэсу вырабу макета вэб-старонкі, для нарэзкі і працэс кадавання - там, дзе CSS робіць дызайн ажываюць. Затым ён правядзе вас праз працэс інтэграцыі, што код у CMS (сістэма кіравання кантэнтам), такія як WordPress. Такім чынам, усе (паведамленні, каналы, абнаўлення) з'яўляюцца дынамічнымі і сайт у шырыню. Я спадзяюся, што вы падпісацца на яго RSS-канала, праверыць яго іншых блогаў і атрымліваць асалоду ад гэтай серыі.

Я заўважыў, што я спадзяваўся, што там быў 4-й серыі, каб паказаць нам працэс рыхтуе і кадавання фотагалерэя, кантактная форма, кошык і Твітэры. Мы ўсе павінны праверыць назад, каб паглядзець!

Частка 1 пачынаецца з абсалютнага нуля ў Photoshop, з дапамогай некалькіх далі рэсурсы ад кліента. Мы ствараем хатнюю старонку і скуры для сайта.

Screen shot 2009-10-17 at 4.47.42 PM

Частка 2 паказана, як нарэзаць дызайн з Photoshop ў XHTML / CSS.

Screen shot 2009-10-17 at 4.47.28 PM

Частка 3 паказана, як пераўтварыць яго ў шаблон WordPress.

Screen shot 2009-10-17 at 4.45.57 PM

Доля

2009 8 ліпеня 2009 г.

ОК, вернемся да дызайну і Photoshop парады!

1. Адкрыццё файла без выкарыстання меню

Просты. Двойчы пстрыкніце на шэрую вобласць фону акна Photoshop і адкрыцця файла з'явіцца дыялогавае акно - чараўніцтва!?

10-фотошоп-функцыі-1.jpg

2. Калі шэры сумна, чорны прыгожая і любы колер, тым лепш!

Каб змяніць шэры ўнутры акна малюнка ад шэрага да чорнага (або колер па вашаму выбару), Ctrl + Right Click (Ctrl + Right Click на Mac) на вобласць вакол малюнка і абярыце колер.

10-фотошоп-функцыі-2.jpg

3. Foreground ўзору і колеру фону

Замест таго каб націскаць на пярэдні план або фон ўзору, каб змяніць колер адной пробы з малюнка, націсніце піпеткі і націсніце паспрабаваць колер - утрымліваючы клавішу Alt (Option на Mac), каб паспрабаваць новы колер фону.

10-фотошоп-функцыі-3.jpg

4. Змесціце форму ці выбар

Калі вы малюеце постаць ці адбору і форма гэта добра, але становішча не так, трымаць кнопку мышы і ўтрымлівайце клавішу прабелу пры перамяшчэнні формы і выбар ў патрэбнае становішча. Адпусціце прабел і працягваюць рабіць фігуру.

10-фотошоп-функцыі-4.jpg

5. Атрымаць Выбар таму

Калі вы страцілі свой выбар, націсніце Ctrl + Shift + D (Ctrl + Shift + D на Mac), каб атрымаць яго назад. Ctrl + D (Ctrl + D на Mac) адмяняе выбар.

10-фотошоп-функцыі-5.jpg

6. Схаваць і захаваць

Калі вобласць вылучэння становіцца на вашым шляху, Ctrl + H (Ctrl + H на Mac) будзе хаваць выбар, але ўсё ж пакінуць яго на месцы. Не забудзьцеся ўключыць яго назад, ці вы можаце спытаць, чаму нешта не працуе так, як вы чакаеце, што яны працуюць.

10-фотошоп-функцыі-6.jpg

7. Паглядзіце, што вы працуеце на

Гэта мая ўвесь час найбуйнейшым эканоміць час! Пры перацягванні вялікі пласт з аднаго дакумента ў іншы, вы можаце праглядзець увесь пласт і маркеры па Ctrl + Click (Ctrl + клік на Mac) на абразку пласта, каб вылучыць яго. Затым націсніце Ctrl + T (Ctrl + T на Mac) для прагляду пераўтварэнні ручкі і Ctrl + 0 (нуль) (або Ctrl + 0 на Mac), каб паменшыць малюнак, каб маркеры ўсё відаць.

10-фотошоп-функцыі-7.jpg

8. Стэк або лінію палітраў

Каб стэк палітры бок аб бок у той жа дыялог, перацягнуць палітру над іншымі, пакуль сіняя лінія з'явіцца вакол яго і адпусціў. Каб стэк палітры адзін на іншы экран ўніз, перацягнуць адной палітры на панэлі прама над назвай іншай палітры.

10-фотошоп-функцыі-8a.jpg

10-фотошоп-функцыі-8b.jpg

9. Няма кнопкі Reset дыялог? Так, ёсць!

Вы можаце скінуць большасць Photoshop дыялогі да зыходных налад або, па меншай меры, некаторыя версіі зыходных параметраў, утрымліваючы клавішу Alt (Option на Mac), калі ў акно - калі вы робіце гэта, кнопку Адмена ператвараецца ў кнопку скіду.

10-фотошоп-функцыі-9.jpg

10. Няхай усе вашы эліпсы ператвараюцца ў колы

Каб намаляваць круг з дапамогай Elliptical Marquee або формы круга, утрымліваючы клавішу Shift, як толькі вы пачалі маляванне і эліпс стане круг. Каб намаляваць ад цэнтра, ўтрымлівайце Alt клавішы (Option на Mac), як вы пачаць маляваць эліпс, затым дадаць клавішу Shift, каб зрабіць яго круг - ўтрымлівайце абедзве кнопкі, пакуль вы адпусціце правую кнопку мышы.

10-фотошоп-функцыі-10.jpg

Доля