欢迎来到天天文库
浏览记录
ID:855990
大小:8.62 MB
页数:82页
时间:2017-09-20
《如何在photoshop中创建一个光质感网页设计》由会员上传分享,免费在线阅读,更多相关内容在行业资料-天天文库。
1、如何在Photoshop中创建一个光质感网页设计作为编码者,美工基础是偏弱的。我们可以参考一些成熟的网页PS教程,提高自身的设计能力。套用一句话,“熟读唐诗三百首,不会作诗也会吟”。本系列的教程来源于网上的PS教程,都是国外的,全英文的。本人尝试翻译这些优秀的教程。因为翻译能力有限,翻译的细节上还有待推敲,希望广大网友不吝赐教。约定:1、本文的软件是PhotoshopCS5版本2、原教程的截图是英文的,本人在重新制作的基础上,重新截了中文版的图3、原文中有些操作没有给出参数。本人在反复测试的情况下测定了一些参数,以红色的文字显示。有些错误的参数,直接以红色文字显
2、示正确的参数例如:(90,22,231,77),表示矩形的左上角的坐标是(90,22),宽231,高77例如:(90,22),表示矩形的左上角的坐标是(90,22),矩形的其他两个参数教程里已经指定4、在教程的最后会附上本人的心得。有些是对教程中的一些步骤的优化等。Inthiswebdesigntutorial,we’llbecreatingalighttexturedwebpagelayout.Iwillshowyouhowapplysubtletexturesinweblayouts,howtocreateaseamlessdiagonalmosaicpat
3、ternandhowtocreateatabbedcontentareadesignforthe“Services”section. 在本网页设计教程中,我们将创建一个光质感的网页布局。我会告诉你如何在网页布局中添加微妙的纹理,如何创建一个无缝的对角拼接模式,以及如何创建一个“服务”部分的选项卡的内容区。Inthistutorial,wewillusethe960GridSystemtoorganizeandarrangetheelementsofourweblayout.Beforewebegin,downloadittoyourcomputer.在本教程中,
4、我们将使用960网格系统,来组织和安排我们的网页布局的元素。在开始之前,将其下载到您的计算机。Unzipthearchivedfileyoudownloaded,gotothe“templates”folderandthengotothe“photoshop”folder.Youwillfindthree.PSDfiles.Eachofthesefilescontainsagridwith12,16and24columns.Inthistutorialwewillbeusingthe12columnsgrid.解压下载好的文件,点到templates文件夹下的p
5、hotoshop文件夹。你会发现有3个.PSD文件。它们分别包含了12列、16列、24列网格。在本教程中,我们使用12列网格The.PSDfileshavesomeguidesalreadysetup,whichwillbeveryuseful.Toactivatetheguides,gotoView>Show>Guides,orusetheshortcutCtrl/Cmd+;..PSD文件已经包含了一些设置好的网格,这会是非常有用。为了激活网格点击:视图>显示>网格,或者用快捷键,Ctrl/Cmd+;Duringthistutorialyouwillneedt
6、ocreateshapeswithspecificdimensions.Toseetheexactsizeofashapeorselectionwhileyouarecreatingit,opentheInfoPanelbygoingtoWindow>Info.Thewidthandtheheightofyourshapesandselectionswillbedisplayedinthispanel.在本教程中,您将需要创建具有特定尺寸的形状。当你在创建过程中要查看确切的大小,点击:窗口>信息,打开信息面板。你的形状或选择的宽度和高度的将被显示在此面板中。No
7、wthatwecoveredthebasicsofusingthe960GridSystem,wecanmoveontocreatingtheweblayout.Let’sgetstarted!现在,我们讨论了使用960网格系统的基础知识,我们可以继续创建的网络布局。让我们开始吧!Step1:CreatingtheBackgroundoftheWebLayout步骤1:创建网页布局的背景Openthe"960_grid_12_col.psd"fileinPhotoshop.ThengotoEdit>CanvasSizeandsetthewidthto1200px
8、andtheheight
此文档下载收益归作者所有