category: html

HTML - redirect page from http-equiv

on 2016-01-31

HTML - redirect page from http-equiv

Intro

We can use JavaScript or PHP redirect page, we also can only use HTML redirect page

But not suggest use this way

Note: The value “refresh” should be used carefully, as it takes the control of a page away from the user. Using “refresh” will cause a failure in W3C’s Web Content Accessibility Guidelines.

使用 標籤進行重新導向可能會降低搜尋引擎排名。

Usage

<meta http-equiv="refresh" content="0;url=http://example.com">

<!-- add content -->
If you are not redirected automatically, follow the <a href='http://example.com'>link to example</a>

Best way

Use PHP redirect or JavaScript And http status is 301

Refer - HTML meta http-equiv Attribute

Refer - WEB1041 - 目前使用 <meta http-equiv="refresh"> 元素進行重新導向

Refer - Redirect from an HTML page? - Stack Overflow

Refer - 轉導、轉向(Redirect)網址的方法. - 諸彼特租屋網

Read more

Web Develop - Flexible Footer

on 2014-08-27

Sometimes we think footer must fixed in website bottom or put it in last of content.

I provide a idea may be a good way. Content less browser view height, footer fixed in bottom. When content too much over browser view height, footer be put last of content.

Feature

  • flexible
  • only use CSS

Usage

min-height: calc(100% - <footer height>);

    #hd {
        height: 50px;
        background: #aaa;
        /*display: none;*/
    }
    #bd {
        text-align: center;
        min-height: calc(100% - 50px); /* important */
        background: #ccc;
    }
    #content {
        padding-bottom: 60px;
    }
    #footer {
        position: relative;
        bottom: 50px;
        text-align: center;
        height: 50px;
        background: #999;
    }

50px is footer height

    <header id="hd">
        <h1>Head</h1>
    </header>
    <article id="bd">
        <section id="content">
            <button>build content</button>
            <h1>Content</h1>
            <div id="loop"></div>
        </section>
    </article>
    <footer id="footer">
        <h2>Footer</h2>
    </footer>

demo

Refer - siteInspire - Web Design Inspiration

Read more