搜尋
首頁web前端css教學[轉]Accesskey引起的一點思考_經驗交流

Access key 是什麼? ~估計除了做 Web 開發的沒多少人知道,Access key 是網頁提供的快捷鍵。先回到軟體介面,看下我的 Opera 的選單,我的 Opera 是修改過的,中英文混在一起。
[轉]Accesskey引起的一點思考_經驗交流
中文的作法一般都是在文字後面加個括號,裡面的鍵值用底線標出。而英文一般是把開頭當成鍵值,如有重複的就推到第二第三,如果那個單字比較倒霉,所有字母都有跟別的有衝突又排在最後面的話,一般做法也不會像中文一樣加括號標值。而是調整其他的來解決衝突,這年頭,視覺第一!中文什麼好辦法,統一加括號。這是系統提示的熱鍵(比較懶,沒去查它叫什麼名?),按下 alt key 可直呼出,不知道有多少人用滑鼠去點多一些。

回到網頁中,在網頁裡,一樣有著差不多功能的東東。大家叫它Access key,看起來是最近流行滴樣子。
<tag accesskey="x">標籤新增屬性accesskey,屬性值就是對應的鍵</tag> 相關資料:http://www.w3.org/TR/1999/ REC-html401-19991224/interact/forms.html#access-keys

一般按法也是 alt key 來選取。不過各瀏覽器都不大一樣。
IE系列使用alt key,再加Entet回一下下車(如果是連結的話。)
FF2.0以下的是也使用alt key,不過如果是連結的話,直接打開,Netscape也是直接按Alt key
FF2.0的,官方說:網頁提供的快捷鍵(Access key) 現在在Windows 上請以Alt Shift Key 來使用,在Mac OS X 為Ctrl key,Unix 則是Ctrl Shift key。 ,可是我的SUSE上的FF2.0還是用 Alt Shift Key,不知道是算什麼系統。 。 -_-!!
除了alt key外還要多按個鍵的做法是為了避免與瀏覽器的衝突,想法是好滴,可單手按起來並不方便。
Opera的是按下Shift Esc 啟動accesskey面板。再接Key直接選擇,這是我以前做的小站的部分截圖
[轉]Accesskey引起的一點思考_經驗交流

#

跟Opera使用方式差不我的還有Konqueror,Konqueror 是個按下Ctrl 激活accesskey 面板,除去已經分配的accesskey外,會自動把其他的鍵按頁面鏈接的順序按XXX條件分配,字母分完了就分配數字,都分完了後面的就沒有。不過Konqueror 這個瀏覽器,估計沒什麼人會去用,現在 linux 的發行版大多預設是 Firefox 。

Mac OS X 上的我就不知道。沒錢買裝的起這種系統的機子。 x86的裝了n個版本,N台機子,都沒裝上一個圖型介面可用的。如有使用Mac OS的朋友告知一下,也許我哪天會用Mac不用再想這個問題。

知道了accesskey 怎麼操作後,思考一下,它應該用在什麼地方。
一般來說,非打字狀態下,我左手是放鍵盤左邊或拿煙,右手抓住滑鼠,以防給人搶了。
如果有明顯提示的 accesskey 並在 key 是鍵盤左邊,我單手能很方便按到時才可能會使用,我比較懶 ^_#。

為什麼說要有明顯提示的 accesskey 才可能會使用會使用呢?我以前做的小站。是用tip來提示的,我連自己做的東西都忘記了,更別說別人的。而如果按一個鍵要我把整隻左手移到鍵盤的右邊,我寧可使用滑鼠操作。
那什麼是明顯的提示呢。來看看小甘甘滴小站吧,注意最上面的導航選單。英文還是比較好做一點點,可以抽個字母來用,中文的我並沒想到什麼好一點的方法。也許像視窗的選單的一樣是辦法,中文的字並不能全排進鍵盤那些鍵裡,就算可以排進去,又有多少人能記得住。

accesskey 的值可以是字母跟數字。有些瀏覽器並沒有解決網頁裡跟瀏覽器裡的按鍵衝突。所以,並非所有的字母都適合使用。同時,有些瀏覽器的數字並不能使用小鍵盤裡的數字。例如FF,
如果一個人會在網頁裡使用別人提供 accesskey 的話,理論上他也會使用瀏覽器上的來完成一些操作。當然,這只是我個人想法,我不知道別人是否也是。也許別人跟我一樣,IE只是用來調試網頁使用的。

如果在網頁裡使用的 accesskey 與瀏覽器上的選單重疊了,例如 "V" 給網頁用了,我就不能按 Alt V, C 這樣簡單的在IE開啟原始檔來看,哎!做開發的人一天就知道看程式碼。希望有在網頁使用accesskey 的朋友不要選擇與瀏覽器的有衝突的按鍵。

除了菜單。還有什麼地方常會用到呢?一般來說是表單,錄入文字時我會使用雙手。按鍵範圍也就大了。例如像一位台灣的朋友OOO的blog,在留言時可以用 accesskey 來選擇要填的地方。像這樣操作的確方便了點,不過我一般都不用。
一般我看文章時。右手還在滑鼠上,拉到評論時,會順便點在第一個input 裡,之後一般是按Tab 來跳到下一個input 或者別的,要返回上一個時,是按Tab Shift 來跳回,怎麼說Tab 鍵也是比較大一點的,方便按一點。

說著說著,好像accesskey 用處並不怎樣的樣子。其實,因為我們通常有滑鼠用,如果沒有滑鼠呢?所以,大家買手機時最少得買有藍牙可以控制電腦滴,如果滑鼠不小心壞了,還可以臨時當下滑鼠用。在現在多數網站光使用Tab都比較難用滴,又有多少使用AJAX技術的網站來提高用戶體驗~結果是讓我在滑鼠出現問題時,連唯一的Tab都沒用了。

除去 accesskey 外,還有一些網站,強制使用鍵盤的某些鍵配合js來完成一些操作。例如按Home鍵就跳到首頁,方向鍵往左是跳到上一篇文章,往右跳到下一篇。有時,用著是挺方便的;有時,也許會很煩,因為原來的功能沒了。

請不用在本小站嘗試 accesskey,因為沒有做之類的功能,只是昨晚有個朋友問到 FF2.0 按了沒反應的問題,便寫下自己的一些想法。也許,下次改版,我會把小站做得更像樣,也許,改版都可以省掉,因為很懶,忙其實只是個華麗的藉口。

陳述
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
CSS Flexbox與網格:全面評論CSS Flexbox與網格:全面評論May 12, 2025 am 12:01 AM

選擇Flexbox還是Grid取決於佈局需求:1)Flexbox適用於一維佈局,如導航欄;2)Grid適合二維佈局,如雜誌式佈局。兩者在項目中可結合使用,提升佈局效果。

Flexbox vs Grid:我應該學習兩者嗎?Flexbox vs Grid:我應該學習兩者嗎?May 10, 2025 am 12:01 AM

是的,youshouldlearnbothflexboxandgrid.1)flexboxisidealforone-demensional,flexiblelayoutslikenavigationmenus.2)gridexcelstcelsintwo-dimensional,confffferDesignssignssuchasmagagazineLayouts.3)blosebothenHancesSunHanceSlineHancesLayOutflexibilitibilitibilitibilitibilityAnderibilitibilityAndresponScormentilial anderingStruction

軌道力學(或我如何優化CSS KeyFrames動畫)軌道力學(或我如何優化CSS KeyFrames動畫)May 09, 2025 am 09:57 AM

重構自己的代碼看起來是什麼樣的?約翰·瑞亞(John Rhea)挑選了他寫的一個舊的CSS動畫,並介紹了優化它的思維過程。

CSS動畫:很難創建它們嗎?CSS動畫:很難創建它們嗎?May 09, 2025 am 12:03 AM

CSSanimationsarenotinherentlyhardbutrequirepracticeandunderstandingofCSSpropertiesandtimingfunctions.1)Startwithsimpleanimationslikescalingabuttononhoverusingkeyframes.2)Useeasingfunctionslikecubic-bezierfornaturaleffects,suchasabounceanimation.3)For

@KeyFrames CSS:最常用的技巧@KeyFrames CSS:最常用的技巧May 08, 2025 am 12:13 AM

@keyframesispopularduetoitsversatoryand and powerincreatingsmoothcsssanimations.keytricksinclude:1)definingsmoothtransitionsbetnestates,2)使用AnimatingMultatingMultationMultationProperPertiessimultane,3)使用使用4)使用BombingeNtibalibility,4)使用CombanningWiThjavoFofofofoftofofo

CSS計數器:自動編號的綜合指南CSS計數器:自動編號的綜合指南May 07, 2025 pm 03:45 PM

CSSCOUNTERSAREDOMANAGEAUTOMANAMBERINGINWEBDESIGNS.1)他們可以使用forterablesofcontents,ListItems,and customnumbering.2)AdvancedsincludenestednumberingSystems.3)挑戰挑戰InclassINCludeBrowsEccerCerceribaliblesibility andperformiballibility andperformissises.4)創造性

使用捲軸驅動動畫的現代滾動陰影使用捲軸驅動動畫的現代滾動陰影May 07, 2025 am 10:34 AM

使用滾動陰影,尤其是對於移動設備,是克里斯以前涵蓋的一個微妙的UX。傑夫(Geoff)涵蓋了一種使用動畫限制屬性的新方法。這是另一種方式。

重新訪問圖像圖重新訪問圖像圖May 07, 2025 am 09:40 AM

讓我們快速進修。圖像地圖一直返回到HTML 3.2,首先是服務器端地圖,然後使用映射和區域元素通過圖像上的單擊區域定義了可單擊區域。

See all articles

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

Video Face Swap

Video Face Swap

使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱門文章

熱工具

SAP NetWeaver Server Adapter for Eclipse

SAP NetWeaver Server Adapter for Eclipse

將Eclipse與SAP NetWeaver應用伺服器整合。

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

EditPlus 中文破解版

EditPlus 中文破解版

體積小,語法高亮,不支援程式碼提示功能

MinGW - Minimalist GNU for Windows

MinGW - Minimalist GNU for Windows

這個專案正在遷移到osdn.net/projects/mingw的過程中,你可以繼續在那裡關注我們。 MinGW:GNU編譯器集合(GCC)的本機Windows移植版本,可自由分發的導入函式庫和用於建置本機Windows應用程式的頭檔;包括對MSVC執行時間的擴展,以支援C99功能。 MinGW的所有軟體都可以在64位元Windows平台上運作。

ZendStudio 13.5.1 Mac

ZendStudio 13.5.1 Mac

強大的PHP整合開發環境