How To Create A Simple Splash Screen/Page?
Solution 1
Have the default be that when a user visits a page, it pops up a screen using the Simplemodal jQuery plugin
When it loads it sets a cookie so that any future pageviews can check for that cookie or not. If its there, do not show the popup again.
Solution 2
I advise having a container that holds both the splash screen (probably a div with the size of the site, assuming it has a defined width and height), and the homepage.
The homepage should be hidden (visibility: hidden), because some search engines don't really "like" the display: none.
Then, use a cookie scheme so that when the user already visited the homepage, doesn't have to view the splash screen again.
What I've done in the past is via a PHP, read if there is a cookie or not, and if there is (meaning the splash has been seen already) change the class of the splash screen (hiding it) and change the class of the homepage (showing it).
Of course this can be done via javascript.
Solution 3
Warning: philosophical rather than practical answer ahead :-)
The most satisfactory way to implement a splash screen is to wait a few years until the HTML folk come to their senses and implement a <splash-image> tag that can be put into the <head> section of any page at all. It will be purely static (no links from it), completely optional, dismissed with a click or on expiry of a time limit, will support fade/slide/shatter and similar termination effects, won't take considerable effort to have it not look like a popup window, will not have a separate URL and will not mess with search engine robots. This is the best solution by far. But it's simply not an option available to anyone.... yet.
Despite the comment by Quentin above endorsed by several others, I believe there are useful contexts for splash screens. Some splash screens are NOT just "something pretty" - they can be legitimate content. I found this question while (somewhat fruitlessly) searching for a way to implement a daily splash screen that could be changed to provide context and emphasis for other website content.
When you consider the vast numbers of websites that offer dozens of low-value links that fight for the viewer's attention, 90% of which will never be followed (something even this awesome site is guilty of), it's not hard to imagine that certain pictures could be worth at least a thousand such words. On occasions it will even add considerable value for such a picture to be the first thing shown each time a site is visited.
Of course, if you just want a static splash screen to force some marketing message into your viewers' consciousnesses, then please don't - Quentin is right there :-)
Aaron Brewer
Updated on June 04, 2022Comments
-
Aaron Brewer about 2 years
I want to be able to design/implement a splash screen that originally goes over the home page (index.html). And when the visitor clicks on the enter page, you could say the Splash Screen disappears. I want to know how to do that without creating another page and without having to redirect.
I also want to be able to give the user the option to "Do Not Show This Again"...
For example, http://www.runescape.com/
Thank you very much, Aaron Brewer
-
Andrew Barber over 11 yearsSuch a tag would not be semantic at all. You also refer to a good use of a splash screen as one with "content". That goes against everything you have suggested, and is not an actual splash screen at all - but just an introductory page. If that's what someone wants to do, that's what they should do. -
omatai over 11 yearsI beg to differ. "Semantic" is in the eye of the beholder. Just because current search engine robots are too dumb to separate legitimate uses of keywords from attempts to manipulate search results does not make keywords non-semantic. So too with what I suggest. Also, a splash screen that is the Mona Lisa carries so much cultural significance that in some contexts, it might qualify as "content". Why should (imaginary site) www.art-talk.org not use a splash screen with no distracting links on it each day to introduce itself?
-
Andrew Barber over 11 yearsExactly; it is content. That never belongs in the header - it belongs where content goes; in the body. Semantic, by definition.
