Highlighted

HELP ....Newbie, 1st Website do i Slice or extract Photoshop cc PSD artboards to Dreamweaver CC

New Here ,
Sep 21, 2019

Copy link to clipboard

Copied

So this is my very first attempt to create a website for my new businesses.  I have multiple complex artboards. 

 

So... 

 

1.  Do I need to Slice in photoshop cc 2019 before using the extract in Dreamweaver CC 2019?

2.  I have two screen sizes desktop 1280 px  and mobile, 412 px

         a. Main page 1280 x 8836  and 10,512

          b. seven other pages with corresponding desktop and web with the same widths but vary in lengths, much shorter than the main page.

3.   I want to it to be responsive, do I use Bootstrap in Dreamweaver cc 2019 new document?

 

Any thoughts, advice and prayer would be greatly appreciated

Adobe Community Professional
Correct answer by Nancy OShea | Adobe Community Professional

"I have a sweeping background instead of solid colour, images that are not square or round as well. I am stepping forward into a new frontier, "

 

That's fine & good but positioning web content over a complex background image seldom works on the web because you can't nail jelly to a ceiling.   To think like a web designer, you almost have to forget everything you learned in print design.  That's why I suggest you focus on coding fundamentals and Bootstrap first.  Later as you gain more experience then revisit the artboards. 

Views

111

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

HELP ....Newbie, 1st Website do i Slice or extract Photoshop cc PSD artboards to Dreamweaver CC

New Here ,
Sep 21, 2019

Copy link to clipboard

Copied

So this is my very first attempt to create a website for my new businesses.  I have multiple complex artboards. 

 

So... 

 

1.  Do I need to Slice in photoshop cc 2019 before using the extract in Dreamweaver CC 2019?

2.  I have two screen sizes desktop 1280 px  and mobile, 412 px

         a. Main page 1280 x 8836  and 10,512

          b. seven other pages with corresponding desktop and web with the same widths but vary in lengths, much shorter than the main page.

3.   I want to it to be responsive, do I use Bootstrap in Dreamweaver cc 2019 new document?

 

Any thoughts, advice and prayer would be greatly appreciated

Adobe Community Professional
Correct answer by Nancy OShea | Adobe Community Professional

"I have a sweeping background instead of solid colour, images that are not square or round as well. I am stepping forward into a new frontier, "

 

That's fine & good but positioning web content over a complex background image seldom works on the web because you can't nail jelly to a ceiling.   To think like a web designer, you almost have to forget everything you learned in print design.  That's why I suggest you focus on coding fundamentals and Bootstrap first.  Later as you gain more experience then revisit the artboards. 

Views

112

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Sep 21, 2019 0
Adobe Community Professional ,
Sep 21, 2019

Copy link to clipboard

Copied

 

 

Prayers and burnt offerings to be sure.   But no amount of magic can replace modern coding skills.   Forget about artboards.  That's another project.  Right now you need to learn how to use Bootstrap responsive framework.  If used correctly, you don't need separate layouts for mobile, tablet and desktop.  One site will fit ALL devices from xs to xlg and everything in between.    See link below.

https://www.w3schools.com/bootstrap4/default.asp

 

STEP 1:  Define your local site folder by going to Site > New Site.  And give your site definition a name like MyTestSite.   Tell DW where your site folder will reside on your hard drive.   See screenshots.

 

Site > Manage Sites -- Local Site FolderSite > Manage Sites -- Local Site Folder

 

STEP 2:  Go to File > New Starter Templates.  See screenshot.

CC-StarterPage.jpg

Choose one of the Bootstrap starter layouts and hit CREATE button.   Once saved,  DW will create assets in your local site folder. 

 

Files PanelFiles Panel

You now have a responsive site to work with.  Add images, text and other elements to make it your own.   Use File > SaveAs to create more pages based on the first one.

 

Good luck with your project!

 

 

 

 

 

 

 

Nancy O'Shea, ACP
Alt-Web Design & Publishing

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Sep 21, 2019 1
New Here ,
Sep 23, 2019

Copy link to clipboard

Copied

Thank you Nancy, My site is very complex, I think ... but LOL....I have a sweeping background instead of solid colour, images that are not square or round as well. I am stepping forward into a new frontier, for me anyways. I will go into Dreamweaver and give it a try...

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Sep 23, 2019 0
Adobe Community Professional ,
Sep 23, 2019

Copy link to clipboard

Copied

"I have a sweeping background instead of solid colour, images that are not square or round as well. I am stepping forward into a new frontier, "

 

That's fine & good but positioning web content over a complex background image seldom works on the web because you can't nail jelly to a ceiling.   To think like a web designer, you almost have to forget everything you learned in print design.  That's why I suggest you focus on coding fundamentals and Bootstrap first.  Later as you gain more experience then revisit the artboards. 

Nancy O'Shea, ACP
Alt-Web Design & Publishing

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Sep 23, 2019 0