Highlighted

hyperlinking .gifs

Explorer ,
Oct 18, 2018

Copy link to clipboard

Copied

Hello, I asked a similar question before which eventually became "answered", but didn't answer the question completely,

so pardon the redundancy.

I have a home page, which is comprised of four .gifs and a background. The home page in the construction of the site

is one .gif in order to use the four .gifs and a background.

I'd like to have a drop down menu, on the home page, using three, short parallel lines (universal for drop down?) as the

button for menu. Menu will have links to four other pages. On each of those pages would be a graphic background (jpeg),

and I'd like to have 12 .gifs, each hyperlinked to their own videos (.mov) which I'd like to play on the same page with

playback/volume control.

To the great minds out there, is it possible? Thanks. Cheers!

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

If you can work with code, everything on your wish list is possible.  But you might want to rethink a few things first.

What you want is called a Hamburger Menu.   

Creating a Hamburger Menu with HTML, CSS and jQuery

Image result for Hamburger menu

4 GIFS is not a web page.  If there's no actual text on your site, you might as well not have a site.  Search engines don't index images.  Nobody will find you in web searches.  Nobody will be able to translate your content.   In other words, without real text, you won't exist.  

My chosen web graphics in order of preference are:

  1. Scalable Vector Graphics (SVG),
  2. web fonts like Glyphicons or Font Awesome,
  3. JPG  (photos),
  4. PNG with alpha-transparency. 

I never use GIFs anymore except when I need an animation which is kind of rare.

MOV files are not natively supported by all browsers and mobile devices.  On the web you should be using MP4 videos.

The <video> tag supports player controls and poster images. 

<video controls poster="Your_Poster_image.jpg" src="Your_Video.mp4" media/type="mp4">

</video>

Views

314

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

hyperlinking .gifs

Explorer ,
Oct 18, 2018

Copy link to clipboard

Copied

Hello, I asked a similar question before which eventually became "answered", but didn't answer the question completely,

so pardon the redundancy.

I have a home page, which is comprised of four .gifs and a background. The home page in the construction of the site

is one .gif in order to use the four .gifs and a background.

I'd like to have a drop down menu, on the home page, using three, short parallel lines (universal for drop down?) as the

button for menu. Menu will have links to four other pages. On each of those pages would be a graphic background (jpeg),

and I'd like to have 12 .gifs, each hyperlinked to their own videos (.mov) which I'd like to play on the same page with

playback/volume control.

To the great minds out there, is it possible? Thanks. Cheers!

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

If you can work with code, everything on your wish list is possible.  But you might want to rethink a few things first.

What you want is called a Hamburger Menu.   

Creating a Hamburger Menu with HTML, CSS and jQuery

Image result for Hamburger menu

4 GIFS is not a web page.  If there's no actual text on your site, you might as well not have a site.  Search engines don't index images.  Nobody will find you in web searches.  Nobody will be able to translate your content.   In other words, without real text, you won't exist.  

My chosen web graphics in order of preference are:

  1. Scalable Vector Graphics (SVG),
  2. web fonts like Glyphicons or Font Awesome,
  3. JPG  (photos),
  4. PNG with alpha-transparency. 

I never use GIFs anymore except when I need an animation which is kind of rare.

MOV files are not natively supported by all browsers and mobile devices.  On the web you should be using MP4 videos.

The <video> tag supports player controls and poster images. 

<video controls poster="Your_Poster_image.jpg" src="Your_Video.mp4" media/type="mp4">

</video>

Views

315

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
Oct 18, 2018 0
Adobe Community Professional ,
Oct 18, 2018

Copy link to clipboard

Copied

If you can work with code, everything on your wish list is possible.  But you might want to rethink a few things first.

What you want is called a Hamburger Menu.   

Creating a Hamburger Menu with HTML, CSS and jQuery

Image result for Hamburger menu

4 GIFS is not a web page.  If there's no actual text on your site, you might as well not have a site.  Search engines don't index images.  Nobody will find you in web searches.  Nobody will be able to translate your content.   In other words, without real text, you won't exist.  

My chosen web graphics in order of preference are:

  1. Scalable Vector Graphics (SVG),
  2. web fonts like Glyphicons or Font Awesome,
  3. JPG  (photos),
  4. PNG with alpha-transparency. 

I never use GIFs anymore except when I need an animation which is kind of rare.

MOV files are not natively supported by all browsers and mobile devices.  On the web you should be using MP4 videos.

The <video> tag supports player controls and poster images. 

<video controls poster="Your_Poster_image.jpg" src="Your_Video.mp4" media/type="mp4">

</video>

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...
Oct 18, 2018 1
Explorer ,
Oct 19, 2018

Copy link to clipboard

Copied

Thank you Nancy. Based on your reply its obvious I didn't properly explain a few details.

My site will have text. The "hamburger" menu will indicate the four types of work I will have

pages associated with/hyperlinked to. However my site will have a minimum of text, as the

focus is on my videos to highlight my work.

The home page incorporates a jpeg background with what are four .gifs, which are 15 second looped videos.

I created this in After Effects, then using Adobe Media Encoder created a single .gif. That's as far

as I've got so far, and it's on the web and working fine with all devices I've tried it on.

I concur with you about using .mp4's. Instead of my videos being viewed on Vimeo or You Tube

I'd rather they play from my sight.

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...
Oct 19, 2018 0
Adobe Community Professional ,
Oct 20, 2018

Copy link to clipboard

Copied

In case you don't know, Adobe Portfolio comes free with your Creative Cloud plan.   No web hosting or coding skills required.   Basically, you choose a layout theme.  Upload some images, video, etc.... add some text describing your work. When  done, hit the Publish button.  That's all there is to it.  And Portfolio ties in seamlessly with Behance -- another venue for creatives.

Adobe Portfolio | Build your own personalized website

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...
Oct 20, 2018 1