• 相關文章
  • 文字效果
  • 調色教學
  • 合成教學
  • 去背教學
  • 照片後製
  • 電腦繪圖
  • 設計教學
  • 動畫教學
  • 簽名製作
  • 其他教學
  • Illustrator
  • CorelDraw教學
  • 攝影教學
  • 3DMAX教學
  • AUTOCAD教學
  • MAYA教學
  • FireWorks教學
  • flash教學
  • 繪畫教學
  • PS作品欣賞
  • 包裝設計範例
  • LOGO設計範例
  • 封面設計範例
  • 名片設計範例
  • CG繪圖設計
  • 海報設計
  • 網頁設計範例
  • PS筆刷下載
  • PS濾鏡下載
  • PS動作下載
  • PS背景下載
  • PS樣式下載




  • 【 網頁設計範例 】創意家技術出色的日本網頁設計欣賞




    創意家技術出色的日本網頁設計欣賞

    這一次的作品是屬於設計欣賞領域中的網頁設計的相關作品。

    文章出處是來自設計達人的設計欣賞類文章,作品的作者是佚名,感謝佚名提供網頁設計的作品範例。

    作品大綱:

    韓文、中文和日文文字外形相似,所以國內的網站除了中國風之外,還能借鑒日韓的風格。韓國網站我想大家也見過不少,他們特別喜歡使用Flash來製作,效果超弦(Why? 因為他們網速比我們快7、8倍…)。而日本網站呢,他們用Flash?響應式?還是扁平化設計呢?


    網頁設計作品欣賞

    韓文、中文和日文文字外形相似,所以國內的網站除了中國風之外,還能借鑒日韓的風格。韓國網站我想大家也見過不少,他們特別喜歡使用Flash來製作,效果超弦(Why? 因為他們網速比我們快7、8倍…)。而日本網站呢,他們用Flash?響應式?還是扁平化設計呢?

    接下來設計達人網小編為大家精選一組優秀的日本酷站,在收集日本網站的同時也讓小編驚嘆了,日本的網站設計以及使用的Web技術相當不錯,本以為日本的工業設計好,想不到網站設計水平也相當高。

    日本網頁設計:很多已經使用新的網頁設計趨勢,如視差滾動、全屏背景、全屏視頻等等,很少使用Flash,特別注重網頁的配色、版式和交互設計,整體網頁布局新穎,不少網站使用了可愛的漫畫式手繪風格。

    Web前端技術方面:已有部分網站開始HTML5、CSS3技術,雖然使用這些新技術,但在IE8兼容方面還是做得很好的,有的不兼容IE8的會做一個瀏覽器兼容提示。 

    下面一起來欣賞這些優秀的日本網頁設計作品,希望對你的新項目帶來靈感吧,Enjoy!

    hanamichiya

    很漂亮的水彩背景,網站的右側菜單效果很贊!看來很多日本設計師的手繪功底都很厲害啊!各位小夥伴,你懂手繪了嗎?

    創意家技術出色的日本網頁設計欣賞

    瀏覽網站

    dascorp

    該網頁使用了響應式設計,基本兼容IE8,當用戶向下滾動網頁設計,內容會漸變顯示出來。

    創意家技術出色的日本網頁設計欣賞

    瀏覽網站

    mitsugashi

    設計簡約的糕點食品網站,但這種簡約在國內很容易飛稿機。

    創意家技術出色的日本網頁設計欣賞

    瀏覽網站

    regettacanoe

    明快的藍色與黃色的時尚配色,很符合網站主題。左上角菜單藍色的曲線好像和鞋跟一樣,這是令人印象深刻的設計。

    創意家技術出色的日本網頁設計欣賞

    瀏覽網站

    ca4la

    很獨特的小型電子商務網站,瀏覽時注意看哪些動畫,好玩之餘更有意義。

    創意家技術出色的日本網頁設計欣賞

    瀏覽網站

    hotakubo-seikei

    一所醫院網站,網站整體頁面設計得很精美,就連圖片質量也很注重,這醫院看起來很高檔次啊。

    醫院類網站在國內肯定不會這麼做了,都會做成門戶式,做內容,搞SEO,什麼內容都有…… 不過大家可以參考他的設計,相當不錯。

    創意家技術出色的日本網頁設計欣賞

    瀏覽網站

    hishiken

    漂亮的圖像+視差特效,很美的網頁啊。

    創意家技術出色的日本網頁設計欣賞

    瀏覽網站

    asitanosikaku

    網站前面哪個有點手繪風格的橢圓是用html5 Canvas做出來的,鼠標經過帶有一些彈性效果,其次這個橢圓還能根據瀏覽器分辨率來自適應大小哦。

    點擊每個連接的內容都是AJAX加載,總體的交互設計體驗真的很不錯。

    創意家技術出色的日本網頁設計欣賞

    瀏覽網站

    kataomoi3

    網站使用文字漂落來做視差效果,很漂亮,做個人博客類的網站推薦。

    創意家技術出色的日本網頁設計欣賞

    瀏覽網站

    kiyomizudera

    用全屏視屏作為背景的網頁,視頻的景色超贊,文字使用垂直排版,垂直字體是日本常用的一種排版方式,其實古時中文也是垂直的,從首頁點擊進去后,默認是全屏幻燈片展示,整體感覺很有Feel,有木有?

    創意家技術出色的日本網頁設計欣賞

    瀏覽網站

    學院女子大學

    首頁Flash banner做得不錯呢。

    創意家技術出色的日本網頁設計欣賞

    瀏覽網站

    q-co

    不得不說,裡面的創意很贊,進入首頁后,用筆畫一個圓圈,然後圓圈裡會有動態圖像顯示。其次網站視差技術做得很好,具體請行瀏覽。

    創意家技術出色的日本網頁設計欣賞

    瀏覽網站

    tokyonohatakekara

    甜品店的網站,手繪元素比較多,也很可愛。

    創意家技術出色的日本網頁設計欣賞

    瀏覽網站

    k-associates

    一家室內設計公司的網站,他們的作品展示方便很特別,使用了垂直色塊,然後從右向左的水平慢移。

    點擊作品的圖像展示以全屏方式展示。

    創意家技術出色的日本網頁設計欣賞

    瀏覽網站

    japan

    只想說,這網站不是FLash做的。

    創意家技術出色的日本網頁設計欣賞

    瀏覽網站

    kamomepark

    首頁使用全屏幻燈展示,菜單和新聞用方塊固定在邊欄,方塊設計簡約,所以不影響整體外觀。

    產品展示頁是使用不間斷水平浮動圖片方式,功能很強大,支持鼠標中鍵來控制滾動,用戶點小圖后全屏顯示大圖,還有一點細節做得不錯,就是你瀏覽大圖時,本來水平滾動的圖片將會停止滾動,這樣用戶關閉大圖后也能看到剛才點擊的位置。

    創意家技術出色的日本網頁設計欣賞

    瀏覽網站

    c-gp

    強烈建議大家點擊一下TEAM鏈接看看。

    創意家技術出色的日本網頁設計欣賞

    瀏覽網站

    gooddesigncompany

    日本一家設計機構網站,首頁直接顯示作品,但展示的方式很有趣,不知道是怎麼實現的。

    該網頁的布局能自適應寬度,普屏和寬屏瀏覽效果很佳。

    創意家技術出色的日本網頁設計欣賞

    瀏覽網站

    kotobanoie

    全屏視屏背景網頁,你要以一邊看視頻一邊瀏覽這個網站上的內容。

    創意家技術出色的日本網頁設計欣賞

    瀏覽網站

    wamokei

    一家模型製作公司的官方網站,單頁面網站設計,首頁的第一屏使用了全屏照片作為背景,另外當用戶點擊其它頁面時,其實也是全屏的哦!

    創意家技術出色的日本網頁設計欣賞

    瀏覽網站

    100tokyo

    這個100tokyo使用了扁平化設計,也支持響應式,整個網站配色以淺棕色為主。使用了簡單的CSS3樣式,比如鼠標經過漸變效果。

    創意家技術出色的日本網頁設計欣賞

    瀏覽網站

    santepc

    全屏Flash網站,看起來有沒有”潮”的感覺?

    創意家技術出色的日本網頁設計欣賞

    瀏覽網站

    最後

    各位小夥伴,看了上面的日本網頁設計,你覺得怎樣呢?你還會為企業做哪些爛掉牙的布局排版嗎?不一定要響應式,不一定要扁平化,創意+技術才是王道,這就是日本網頁設計!

    很多網頁設計師需要自己寫前端代碼,所以建議大家在項目中多運用CSS3,這是未來必須使用的技術。

    — —

    文章永久連結為: 創意家技術出色的日本網頁設計欣賞