diff --git a/web/src/NetworkExitsPage.jsx b/web/src/NetworkExitsPage.jsx
index aecb2b6..729a96b 100644
--- a/web/src/NetworkExitsPage.jsx
+++ b/web/src/NetworkExitsPage.jsx
@@ -244,16 +244,18 @@ function ExitTable({ exits, accountsByExit, bindingsError, busy, onAction }) {
   const columns = [
     {
       header: "出口",
-      width: "20%",
+      width: "22%",
       render: (exit) => (
         <div className="min-w-0">
           <Link
             to={`/network-exits/${encodeURIComponent(exit.id)}`}
             className="anywhere font-semibold text-ink hover:text-primary"
           >
-            {exit.protocol}://{exit.host}:{exit.port}
+            {exit.id}
           </Link>
-          <p className="anywhere text-xs text-muted">{exit.id}</p>
+          <p className="anywhere text-xs text-muted">
+            {exit.protocol}://{exit.host}:{exit.port}
+          </p>
         </div>
       ),
     },
@@ -264,14 +266,14 @@ function ExitTable({ exits, accountsByExit, bindingsError, busy, onAction }) {
     },
     {
       header: "用户名",
-      width: "11%",
+      width: "10%",
       render: (exit) => (
         <span className="anywhere">{exit.username || "无"}</span>
       ),
     },
     {
       header: "密码",
-      width: "11%",
+      width: "10%",
       render: (exit) => (
         <span className="anywhere">{exit.password || "无"}</span>
       ),
@@ -280,7 +282,9 @@ function ExitTable({ exits, accountsByExit, bindingsError, busy, onAction }) {
       header: "出口IP",
       width: "13%",
       render: (exit) => (
-        <span className="anywhere">{exit.observed_public_ip || "尚无观测"}</span>
+        <span className="anywhere">
+          {exit.observed_public_ip || "尚无观测"}
+        </span>
       ),
     },
     {
@@ -309,11 +313,7 @@ function ExitTable({ exits, accountsByExit, bindingsError, busy, onAction }) {
       width: "8%",
       align: "right",
       render: (exit) => (
-        <ExitActions
-          exit={exit}
-          busy={busy === exit.id}
-          onAction={onAction}
-        />
+        <ExitActions exit={exit} busy={busy === exit.id} onAction={onAction} />
       ),
     },
   ];
diff --git a/web/src/NetworkExitsPage.test.jsx b/web/src/NetworkExitsPage.test.jsx
index 919d535..102892c 100644
--- a/web/src/NetworkExitsPage.test.jsx
+++ b/web/src/NetworkExitsPage.test.jsx
@@ -74,10 +74,13 @@ describe("NetworkExitList", () => {
     expect(await screen.findByText(/创建并检测健康后/)).toBeTruthy();
   });
 
-  it("shows stored credentials and runs an explicit health check", async () => {
+  it("shows the exit ID as the primary identifier with stored credentials", async () => {
     const dataProvider = provider([networkExit]);
     renderExits(dataProvider);
 
+    const idLink = await screen.findByRole("link", { name: "exit-a" });
+    expect(idLink.getAttribute("href")).toBe("/network-exits/exit-a");
+    expect(screen.getByText("socks5://proxy.example:1080")).toBeTruthy();
     expect((await screen.findAllByText(/proxy-user/)).length).toBeGreaterThan(
       0,
     );